import React from 'react';
import { Tooltip } from '@theorchard/suite-components';
import cx from 'classnames';

export type Placement = 'top' | 'bottom' | 'right' | 'left';

export interface TooltipWrapperProps {
    value?: string;
    className: string;
    classNameDisablePointer: string;
    placement?: Placement;
    disableTooltipPointerEvents?: boolean;
    children: React.ReactNode;
}

const TooltipWrapper = ({
    placement,
    className,
    classNameDisablePointer,
    disableTooltipPointerEvents,
    value,
    children,
}: TooltipWrapperProps) => (
    <Tooltip
        testId="tooltip"
        message={value ?? ''}
        placement={placement}
        id={className}
        className={cx({
            [classNameDisablePointer]: disableTooltipPointerEvents,
        })}
    >
        {children}
    </Tooltip>
);

export default TooltipWrapper;