All files / src/componentsV2/Table CustomTooltip.tsx

100% Statements 2/2
60% Branches 3/5
100% Functions 1/1
100% Lines 2/2

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69                                                        109x                         6026x                                                      
import { SxProps } from "@mui/material";
import GiveText from "@shared/Text/GiveText";
import GiveTooltip from "@shared/Tooltip/GiveTooltip";
import { MouseEventHandler } from "react";
 
type Props = {
  showToolTip: boolean;
  children: any;
  message?: string;
  fullWidth?: boolean;
  customStyle?: any;
  extraMessage?: string;
  maxWidth?: string;
  placement?:
    | "bottom"
    | "left"
    | "top"
    | "right"
    | "bottom-end"
    | "bottom-start"
    | "top-start"
    | "top-end";
  alignment?: "start" | "center" | "end";
  customTooltipStyles?: SxProps;
  onClick?: MouseEventHandler<HTMLDivElement>;
  fluidWidth?: boolean;
};
 
export const CustomToolTip = ({
  children,
  showToolTip,
  message = "The edit is blocked by a confirmed match on PEP",
  customStyle,
  extraMessage,
  placement,
  alignment,
  fullWidth,
  customTooltipStyles,
  onClick,
  fluidWidth,
}: Props) => (
  <GiveTooltip
    disableFocusListener={!showToolTip}
    disableHoverListener={!showToolTip}
    disableTouchListener={!showToolTip}
    color="default"
    placement={placement}
    alignment={alignment}
    width={fullWidth ? "Max width" : "compact"}
    customTooltipStyles={customTooltipStyles}
    onClick={onClick}
    fluidWidth={fluidWidth}
    title={
      <GiveText
        variant="bodyXS"
        textAlign={customStyle?.textAlign || "left"}
        color="default"
        data-testid="custom-tooltip-text"
      >
        {message}
        {extraMessage}
      </GiveText>
    }
    data-testid="custom-tooltip"
  >
    {children}
  </GiveTooltip>
);