https://dev.kronoz.win/r/marzneshin.git
1import {
2 ColumnDef,
3 flexRender,
4} from "@tanstack/react-table"
5
6import {
7 Table,
8 TableBody,
9 TableCell,
10 TableHead,
11 TableHeader,
12 TableRow,
13} from "@marzneshin/components"
14
15import { useTranslation } from "react-i18next"
16import { useEntityTableContext } from "./entity-table-provider"
17
18interface DataTableProps<TData, TValue> {
19 columns: ColumnDef<TData, TValue>[]
20 onRowClick?: (object: TData) => void
21}
22
23export function EntityDataTable<TData, TValue>({
24 columns,
25 onRowClick,
26}: DataTableProps<TData, TValue>) {
27 const { t } = useTranslation();
28 const { table } = useEntityTableContext()
29 return (
30 <Table>
31 <TableHeader>
32 {table.getHeaderGroups().map((headerGroup) => (
33 <TableRow key={headerGroup.id}>
34 {headerGroup.headers.map((header) => {
35 return (
36 <TableHead key={header.id}>
37 {header.isPlaceholder
38 ? null
39 : flexRender(
40 header.column.columnDef.header,
41 header.getContext()
42 )}
43 </TableHead>
44 )
45 })}
46 </TableRow>
47 ))}
48 </TableHeader>
49 <TableBody>
50 {table.getRowModel().rows?.length ? (
51 table.getRowModel().rows.map((row) => (
52 <TableRow
53 key={row.id}
54 data-state={row.getIsSelected() && "selected"}
55 data-testid={"entity-table-row"}
56 onClick={() => onRowClick && onRowClick(row.original)}
57 >
58 {row.getVisibleCells().map((cell) => (
59 <TableCell key={cell.id}>
60 {flexRender(cell.column.columnDef.cell, cell.getContext())}
61 </TableCell>
62 ))}
63 </TableRow>
64 ))
65 ) : (
66 <TableRow>
67 <TableCell colSpan={columns.length} className="h-24 text-center">
68 {t('table.no-result')}
69 </TableCell>
70 </TableRow>
71 )}
72 </TableBody>
73 </Table>
74 )
75}