update

apps/admin.saladeaula.digital/app/components/data-table/view-options.tsx

@@ -0,0 +1,59 @@
+'use client'
+
+import { useContext } from 'react'
+
+import { type Table } from '@tanstack/react-table'
+import { Columns2Icon } from 'lucide-react'
+
+import { Button } from '@repo/ui/components/ui/button'
+import {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuTrigger
+} from '@repo/ui/components/ui/dropdown-menu'
+import { cn } from '@repo/ui/lib/utils'
+import { TableContext } from './data-table'
+
+export function DataTableViewOptions<TData>({
+  className
+}: {
+  className: string
+}) {
+  const ctx = useContext(TableContext) as { table: Table<TData> } | null
+
+  if (!ctx) {
+    throw new Error('TableContext is null')
+  }
+
+  const { table } = ctx
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="outline" className={cn('cursor-pointer', className)}>
+          <Columns2Icon /> Colunas
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end" className="w-44  *:cursor-pointer">
+        {table
+          .getAllColumns()
+          .filter(
+            (column) =>
+              typeof column.accessorFn !== 'undefined' && column.getCanHide()
+          )
+          .map((column) => {
+            return (
+              <DropdownMenuCheckboxItem
+                key={column.id}
+                checked={column.getIsVisible()}
+                onCheckedChange={(value) => column.toggleVisibility(!!value)}
+              >
+                {column.columnDef?.meta?.title ?? column.id}
+              </DropdownMenuCheckboxItem>
+            )
+          })}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  )
+}