gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/entity-table/components/table-view-option.tsx · v0.6.1
Source
1 b15ff05 Mrdn 2y ago import { DropdownMenuTrigger } from "@radix-ui/react-dropdown-menu"
2 b15ff05 Mrdn 2y ago import { MixerHorizontalIcon } from "@radix-ui/react-icons"
3 b15ff05 Mrdn 2y ago import { Table } from "@tanstack/react-table"
4 b15ff05 Mrdn 2y ago
5 b15ff05 Mrdn 2y ago import {
6 b15ff05 Mrdn 2y ago Button,
7 b15ff05 Mrdn 2y ago DropdownMenu,
8 b15ff05 Mrdn 2y ago DropdownMenuCheckboxItem,
9 b15ff05 Mrdn 2y ago DropdownMenuContent,
10 b15ff05 Mrdn 2y ago DropdownMenuLabel,
11 b15ff05 Mrdn 2y ago DropdownMenuSeparator,
12 b15ff05 Mrdn 2y ago } from "@marzneshin/components"
13 b15ff05 Mrdn 2y ago import { useTranslation } from "react-i18next"
14 b15ff05 Mrdn 2y ago
15 b15ff05 Mrdn 2y ago interface DataTableViewOptionsProps<TData> {
16 b15ff05 Mrdn 2y ago table: Table<TData>
17 b15ff05 Mrdn 2y ago }
18 b15ff05 Mrdn 2y ago
19 b15ff05 Mrdn 2y ago export function DataTableViewOptions<TData>({
20 b15ff05 Mrdn 2y ago table,
21 b15ff05 Mrdn 2y ago }: DataTableViewOptionsProps<TData>) {
22 b15ff05 Mrdn 2y ago const { t } = useTranslation();
23 b15ff05 Mrdn 2y ago return (
24 b15ff05 Mrdn 2y ago <DropdownMenu>
25 b15ff05 Mrdn 2y ago <DropdownMenuTrigger asChild>
26 b15ff05 Mrdn 2y ago <Button
27 b15ff05 Mrdn 2y ago variant="outline"
28 b15ff05 Mrdn 2y ago className="ml-auto mr-2 lg:flex"
29 b15ff05 Mrdn 2y ago >
30 b15ff05 Mrdn 2y ago <MixerHorizontalIcon className="mr-2 w-4 h-4" />
31 9f2486e Mardin 2y ago {t('view')}
32 b15ff05 Mrdn 2y ago </Button>
33 b15ff05 Mrdn 2y ago </DropdownMenuTrigger>
34 b15ff05 Mrdn 2y ago <DropdownMenuContent align="end" className="w-[150px]">
35 b15ff05 Mrdn 2y ago <DropdownMenuLabel>{t('table.toggle-column')}</DropdownMenuLabel>
36 b15ff05 Mrdn 2y ago <DropdownMenuSeparator />
37 b15ff05 Mrdn 2y ago {table
38 b15ff05 Mrdn 2y ago .getAllColumns()
39 b15ff05 Mrdn 2y ago .filter(
40 b15ff05 Mrdn 2y ago (column) =>
41 b15ff05 Mrdn 2y ago typeof column.accessorFn !== "undefined" && column.getCanHide()
42 b15ff05 Mrdn 2y ago )
43 b15ff05 Mrdn 2y ago .map((column) => {
44 b15ff05 Mrdn 2y ago return (
45 b15ff05 Mrdn 2y ago <DropdownMenuCheckboxItem
46 b15ff05 Mrdn 2y ago key={column.id}
47 b15ff05 Mrdn 2y ago className="capitalize"
48 b15ff05 Mrdn 2y ago checked={column.getIsVisible()}
49 b15ff05 Mrdn 2y ago onCheckedChange={(value) => column.toggleVisibility(!!value)}
50 b15ff05 Mrdn 2y ago >
51 b15ff05 Mrdn 2y ago {column.id.replace('_', ' ')}
52 b15ff05 Mrdn 2y ago </DropdownMenuCheckboxItem>
53 b15ff05 Mrdn 2y ago )
54 b15ff05 Mrdn 2y ago })}
55 b15ff05 Mrdn 2y ago </DropdownMenuContent>
56 b15ff05 Mrdn 2y ago </DropdownMenu>
57 b15ff05 Mrdn 2y ago )
58 b15ff05 Mrdn 2y ago }