♻️ refactor(core): Restructure project for better module separation

2024-12-26 02:53:28 +07:00
parent 17ce96a423
commit 9d0cb8b869
368 changed files with 152606 additions and 47239 deletions
@@ -0,0 +1,47 @@
+'use client';
+
+import { Table } from '@tanstack/react-table';
+import { Button } from '@workspace/ui/components/button';
+import {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuTrigger,
+} from '@workspace/ui/components/dropdown-menu';
+import { ListTodoIcon } from 'lucide-react';
+import { ReactNode } from 'react';
+
+interface ColumnToggleProps<TData> {
+  table: Table<TData>;
+}
+
+export function ColumnToggle<TData>({ table }: ColumnToggleProps<TData>) {
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant='outline' size='icon'>
+          <ListTodoIcon />
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align='end' className='w-[150px]'>
+        {table
+          .getAllColumns()
+          .filter((column) => typeof column.accessorFn !== 'undefined' && column.getCanHide())
+          .map((column) => {
+            const columns = table.getAllColumns().filter((item) => item.getIsVisible());
+            return (
+              <DropdownMenuCheckboxItem
+                key={column.id}
+                className='capitalize'
+                checked={column.getIsVisible()}
+                onCheckedChange={(value) => column.toggleVisibility(!!value)}
+                disabled={columns.length === 1 && columns?.[0]?.id === column.id}
+              >
+                {column.columnDef.header as ReactNode}
+              </DropdownMenuCheckboxItem>
+            );
+          })}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}