gitscope
/
← marzneshin / dashboard/src/features/entity-table/sidebar-entity-table.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/entity-table/sidebar-entity-table.tsx · v0.5.2
Source
1 4cebd65 Mardin 2y ago import { Button, DataTableViewOptions, ResizableHandle, ResizablePanel, ResizablePanelGroup, HStack } from "@marzneshin/components";
2 4cebd65 Mardin 2y ago import { Server } from "lucide-react";
3 4cebd65 Mardin 2y ago import { EntityTableContext, SidebarEntityTableContext } from "./contexts";
4 4cebd65 Mardin 2y ago import {
5 4cebd65 Mardin 2y ago SidebarEntityCardSectionsProps,
6 4cebd65 Mardin 2y ago TableFiltering,
7 4cebd65 Mardin 2y ago DataTablePagination,
8 4cebd65 Mardin 2y ago EntityDataTable,
9 4cebd65 Mardin 2y ago SidebarEntityTablePopover,
10 4cebd65 Mardin 2y ago SidebarEntitySelection
11 4cebd65 Mardin 2y ago } from "./components";
12 4cebd65 Mardin 2y ago import {
13 4cebd65 Mardin 2y ago useSidebarEntityTable,
14 4cebd65 Mardin 2y ago EntitySidebarQueryKeyType,
15 4cebd65 Mardin 2y ago FetchEntityReturn,
16 4cebd65 Mardin 2y ago UseRowSelectionReturn,
17 4cebd65 Mardin 2y ago } from "./hooks";
18 4cebd65 Mardin 2y ago import { useTranslation } from "react-i18next";
19 4cebd65 Mardin 2y ago
20 4cebd65 Mardin 2y ago
21 4cebd65 Mardin 2y ago interface SidebarEntityTableProps<T, S> {
22 4cebd65 Mardin 2y ago fetchEntity: ({ queryKey }: EntitySidebarQueryKeyType) => FetchEntityReturn<T>;
23 4cebd65 Mardin 2y ago sidebarEntities: S[];
24 4cebd65 Mardin 2y ago setSidebarEntityId: (entity: string | undefined) => void;
25 4cebd65 Mardin 2y ago sidebarEntityId?: string;
26 4cebd65 Mardin 2y ago sidebarCardProps: SidebarEntityCardSectionsProps<S>;
27 4cebd65 Mardin 2y ago secondaryEntityKey: string;
28 4cebd65 Mardin 2y ago columnsFn: any;
29 4cebd65 Mardin 2y ago filteredColumn: string;
30 4cebd65 Mardin 2y ago entityKey: string;
31 4cebd65 Mardin 2y ago rowSelection?: UseRowSelectionReturn;
32 4cebd65 Mardin 2y ago manualSorting?: boolean;
33 4cebd65 Mardin 2y ago onCreate: () => void;
34 4cebd65 Mardin 2y ago onEdit: (entity: T) => void;
35 4cebd65 Mardin 2y ago onOpen: (entity: T) => void;
36 4cebd65 Mardin 2y ago onDelete: (entity: T) => void;
37 4cebd65 Mardin 2y ago }
38 4cebd65 Mardin 2y ago
39 4cebd65 Mardin 2y ago export function SidebarEntityTable<T, S>(props: SidebarEntityTableProps<T, S>) {
40 4cebd65 Mardin 2y ago const { t } = useTranslation();
41 4cebd65 Mardin 2y ago const {
42 4cebd65 Mardin 2y ago desktop,
43 4cebd65 Mardin 2y ago table,
44 4cebd65 Mardin 2y ago entityTableContextValue,
45 4cebd65 Mardin 2y ago sidebarEntityTableContextValue,
46 4cebd65 Mardin 2y ago columns,
47 4cebd65 Mardin 2y ago onCreate
48 4cebd65 Mardin 2y ago } = useSidebarEntityTable(props);
49 4cebd65 Mardin 2y ago
50 4cebd65 Mardin 2y ago return (
51 4cebd65 Mardin 2y ago <EntityTableContext.Provider value={entityTableContextValue}>
52 4cebd65 Mardin 2y ago <SidebarEntityTableContext.Provider value={sidebarEntityTableContextValue}>
53 4cebd65 Mardin 2y ago <div className="flex flex-col">
54 03d508e Mardin 2y ago <div className="flex flex-col md:flex-row-reverse items-center py-4 gap-2 w-full">
55 03d508e Mardin 2y ago <div className="flex flex-row justify-center items-center w-full">
56 4cebd65 Mardin 2y ago {!desktop && (
57 4cebd65 Mardin 2y ago <SidebarEntityTablePopover
58 4cebd65 Mardin 2y ago buttonChild={
59 4cebd65 Mardin 2y ago <HStack className="items-center p-1">
60 4cebd65 Mardin 2y ago <Server className="size-4" /> {t("inbounds")}
61 4cebd65 Mardin 2y ago </HStack>
62 4cebd65 Mardin 2y ago }
63 4cebd65 Mardin 2y ago />
64 4cebd65 Mardin 2y ago )}
65 4cebd65 Mardin 2y ago <DataTableViewOptions table={table} />
66 4cebd65 Mardin 2y ago {onCreate && (
67 4cebd65 Mardin 2y ago <Button aria-label={`create-${props.entityKey}`} onClick={onCreate}>
68 4cebd65 Mardin 2y ago {t("create")}
69 4cebd65 Mardin 2y ago </Button>
70 4cebd65 Mardin 2y ago )}
71 03d508e Mardin 2y ago </div>
72 03d508e Mardin 2y ago <TableFiltering />
73 4cebd65 Mardin 2y ago </div>
74 4cebd65 Mardin 2y ago <div className="w-full rounded-md border">
75 4cebd65 Mardin 2y ago <ResizablePanelGroup direction="horizontal">
76 4cebd65 Mardin 2y ago <ResizablePanel minSize={20} maxSize={desktop ? 40 : 0}>
77 4cebd65 Mardin 2y ago <SidebarEntitySelection />
78 4cebd65 Mardin 2y ago </ResizablePanel>
79 4cebd65 Mardin 2y ago <ResizableHandle withHandle={desktop} />
80 4cebd65 Mardin 2y ago <ResizablePanel >
81 4cebd65 Mardin 2y ago <div className="flex flex-col justify-between size-full">
82 4cebd65 Mardin 2y ago <EntityDataTable columns={columns} onRowClick={props.onOpen} />
83 4cebd65 Mardin 2y ago <DataTablePagination />
84 4cebd65 Mardin 2y ago </div>
85 4cebd65 Mardin 2y ago </ResizablePanel>
86 4cebd65 Mardin 2y ago </ResizablePanelGroup>
87 4cebd65 Mardin 2y ago </div>
88 4cebd65 Mardin 2y ago </div>
89 4cebd65 Mardin 2y ago </SidebarEntityTableContext.Provider>
90 4cebd65 Mardin 2y ago </EntityTableContext.Provider>
91 4cebd65 Mardin 2y ago );
92 4cebd65 Mardin 2y ago }