add discount

packages/ui/src/components/data-table/view-options.tsx

@@ -7,16 +7,14 @@ import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
   DropdownMenuContent,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
   DropdownMenuTrigger
 } from '@repo/ui/components/ui/dropdown-menu'
 import { cn } from '@repo/ui/lib/utils'
 import { useDataTable } from './data-table'
 
-export function DataTableViewOptions<TData>({
-  className
-}: {
-  className?: string
-}) {
+export function DataTableViewOptions({ className }: { className?: string }) {
   const { table } = useDataTable()
 
   return (
@@ -26,7 +24,12 @@ export function DataTableViewOptions<TData>({
           <Columns2Icon /> Colunas
         </Button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" className="w-44  *:cursor-pointer">
+      <DropdownMenuContent align="end" className="w-44">
+        <DropdownMenuLabel className="text-muted-foreground text-sm">
+          Exibir colunas
+        </DropdownMenuLabel>
+        <DropdownMenuSeparator />
+
         {table
           .getAllColumns()
           .filter(
@@ -43,6 +46,7 @@ export function DataTableViewOptions<TData>({
                 checked={column.getIsVisible()}
                 onSelect={(e) => e.preventDefault()}
                 onCheckedChange={(value) => column.toggleVisibility(!!value)}
+                className="cursor-pointer"
               >
                 {title}
               </DropdownMenuCheckboxItem>