gitscope
/
← marzneshin / dashboard/src/components/entity-table/table.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/components/entity-table/table.tsx · v0.3.0-alpha11
Source
1 578311c Mrdn 2y ago import {
2 578311c Mrdn 2y ago ColumnDef,
3 578311c Mrdn 2y ago flexRender,
4 578311c Mrdn 2y ago } from "@tanstack/react-table"
5 578311c Mrdn 2y ago import {
6 578311c Mrdn 2y ago Table,
7 578311c Mrdn 2y ago TableBody,
8 578311c Mrdn 2y ago TableCell,
9 578311c Mrdn 2y ago TableHead,
10 578311c Mrdn 2y ago TableHeader,
11 578311c Mrdn 2y ago TableRow,
12 578311c Mrdn 2y ago } from "@marzneshin/components"
13 578311c Mrdn 2y ago
14 578311c Mrdn 2y ago import { useTranslation } from "react-i18next"
15 578311c Mrdn 2y ago import { useEntityTableContext } from "./entity-table-provider"
16 6b38fe9 Mrdn 2y ago import { LoaderCircle } from "lucide-react"
17 578311c Mrdn 2y ago
18 578311c Mrdn 2y ago interface DataTableProps<TData, TValue> {
19 578311c Mrdn 2y ago columns: ColumnDef<TData, TValue>[]
20 578311c Mrdn 2y ago onRowClick?: (object: TData) => void
21 578311c Mrdn 2y ago }
22 578311c Mrdn 2y ago
23 578311c Mrdn 2y ago export function EntityDataTable<TData, TValue>({
24 578311c Mrdn 2y ago columns,
25 578311c Mrdn 2y ago onRowClick,
26 578311c Mrdn 2y ago }: DataTableProps<TData, TValue>) {
27 578311c Mrdn 2y ago const { t } = useTranslation();
28 6b38fe9 Mrdn 2y ago const { table, isLoading } = useEntityTableContext()
29 578311c Mrdn 2y ago return (
30 292108b Mrdn 2y ago <Table className="w-full">
31 578311c Mrdn 2y ago <TableHeader>
32 578311c Mrdn 2y ago {table.getHeaderGroups().map((headerGroup) => (
33 578311c Mrdn 2y ago <TableRow key={headerGroup.id}>
34 578311c Mrdn 2y ago {headerGroup.headers.map((header) => {
35 578311c Mrdn 2y ago return (
36 578311c Mrdn 2y ago <TableHead key={header.id}>
37 578311c Mrdn 2y ago {header.isPlaceholder
38 578311c Mrdn 2y ago ? null
39 578311c Mrdn 2y ago : flexRender(
40 578311c Mrdn 2y ago header.column.columnDef.header,
41 578311c Mrdn 2y ago header.getContext()
42 578311c Mrdn 2y ago )}
43 578311c Mrdn 2y ago </TableHead>
44 578311c Mrdn 2y ago )
45 578311c Mrdn 2y ago })}
46 578311c Mrdn 2y ago </TableRow>
47 578311c Mrdn 2y ago ))}
48 578311c Mrdn 2y ago </TableHeader>
49 578311c Mrdn 2y ago <TableBody>
50 6b38fe9 Mrdn 2y ago {isLoading ? (
51 6b38fe9 Mrdn 2y ago <TableRow className="w-full">
52 578311c Mrdn 2y ago <TableCell colSpan={columns.length} className="h-24 text-center">
53 6b38fe9 Mrdn 2y ago <LoaderCircle className="w-5 h-5 animate-spin text-primary" />
54 578311c Mrdn 2y ago </TableCell>
55 578311c Mrdn 2y ago </TableRow>
56 6b38fe9 Mrdn 2y ago ) : (
57 6b38fe9 Mrdn 2y ago table.getRowModel().rows?.length ? (
58 6b38fe9 Mrdn 2y ago table.getRowModel().rows.map((row) => (
59 6b38fe9 Mrdn 2y ago <TableRow
60 6b38fe9 Mrdn 2y ago key={row.id}
61 6b38fe9 Mrdn 2y ago data-state={row.getIsSelected() && "selected"}
62 6b38fe9 Mrdn 2y ago data-testid={"entity-table-row"}
63 6b38fe9 Mrdn 2y ago onClick={() => onRowClick && onRowClick(row.original)}
64 6b38fe9 Mrdn 2y ago >
65 6b38fe9 Mrdn 2y ago {row.getVisibleCells().map((cell) => (
66 6b38fe9 Mrdn 2y ago <TableCell key={cell.id}>
67 6b38fe9 Mrdn 2y ago {flexRender(cell.column.columnDef.cell, cell.getContext())}
68 6b38fe9 Mrdn 2y ago </TableCell>
69 6b38fe9 Mrdn 2y ago ))}
70 6b38fe9 Mrdn 2y ago </TableRow>
71 6b38fe9 Mrdn 2y ago ))
72 6b38fe9 Mrdn 2y ago ) : (
73 6b38fe9 Mrdn 2y ago <TableRow>
74 6b38fe9 Mrdn 2y ago <TableCell colSpan={columns.length} className="h-24 text-center">
75 6b38fe9 Mrdn 2y ago {t('table.no-result')}
76 6b38fe9 Mrdn 2y ago </TableCell>
77 6b38fe9 Mrdn 2y ago </TableRow>
78 6b38fe9 Mrdn 2y ago )
79 578311c Mrdn 2y ago )}
80 578311c Mrdn 2y ago </TableBody>
81 578311c Mrdn 2y ago </Table>
82 578311c Mrdn 2y ago )
83 578311c Mrdn 2y ago }