TableColumns HeaderWithTooltipSortable.tsx

100% Statements 2/2

100% Branches 3/3

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  
 
 
 
 
 
 
 
 
 
 
33x
 
 
 
 
 
610x
 
 
 
 
 
 
 
 
  import { ToolTipCover } from "@/ahuora-design-system/ui/tooltip";
import SortWrap from "./SortWrap";
 
interface HeaderWithTooltipProps {
  headerName: React.ReactNode; // Use React.ReactNode to allow for both strings and JSX elements
  tooltipContent: string;
  column: any;
  units?: React.ReactNode;
}
 
// Reusable component for table header with tooltip
export const HeaderWithTooltipSortable: React.FC<HeaderWithTooltipProps> = ({
  headerName,
  tooltipContent,
  column,
  units = null,
}) => {
  return (
    <div className="flex items-center gap-1">
      <SortWrap column={column}>
        <ToolTipCover content={tooltipContent}>{headerName}</ToolTipCover>
      </SortWrap>
      {units && <small>({units})</small>}
    </div>
  );
};