Files
road-monitoring-ui/src/components/data-table/TableHeader.tsx

32 lines
988 B
TypeScript

'use client';
import { flexRender } from '@tanstack/react-table';
import { TableHead, TableHeader as ShadTableHeader, TableRow } from '@/components/ui/table';
import { Table } from '@tanstack/react-table';
const TableHeader = <TData, _>({ table }: { table: Table<TData> }) => {
return (
<ShadTableHeader>
{table.getHeaderGroups().map((headerGroup) => (
<TableRow key={headerGroup.id}>
{headerGroup.headers.map((header) => {
return (
<TableHead
key={header.id}
className="h-10 px-2 text-foreground"
>
{header.isPlaceholder ? null : (
<div className="flex items-center gap-2">
{flexRender(header.column.columnDef.header, header.getContext())}
</div>
)}
</TableHead>
);
})}
</TableRow>
))}
</ShadTableHeader>
);
};
export default TableHeader;