fix: use cn helper && add classname prop to table

devflowinc · Sep 17, 2024 · 8d78f6b · 8d78f6b
1 parent dad2340
commit 8d78f6b
Showing 1 changed file with 11 additions and 4 deletions.
diff --git a/frontends/shared/ui/TanStackTable.tsx b/frontends/shared/ui/TanStackTable.tsx
@@ -24,23 +24,30 @@ type TableProps = {
   };
   total?: number;
   perPage?: number;
+  classNames?: string;
   onRowClick?: (row: any) => void;
 };
 
 export const TanStackTable = (props: TableProps) => {
   return (
     <>
-      <table class="min-w-full border-separate border-spacing-0">
+      <table
+        class={cn(
+          "min-w-full border-separate border-spacing-0",
+          props.classNames ?? ""
+        )}
+      >
         <thead>
           <For each={props.table.getHeaderGroups()}>
             {(headerGroup) => (
               <tr>
                 <For each={headerGroup.headers}>
                   {(header) => (
                     <th
-                      class={`sticky top-0 z-10 border-b border-neutral-300 bg-white bg-opacity-75 text-left text-sm font-semibold text-neutral-900 backdrop-blur backdrop-filter sm:pl-6 lg:pl-8 ${
-                        props.small ? "py-2 pl-3 pr-2" : "py-3.5 pl-4 pr-3"
-                      }`}
+                      class={cn(
+                        props.small ? "py-2 pl-3 pr-2" : "py-3.5 pl-4 pr-3",
+                        "sticky top-0 z-10 border-b border-neutral-300 bg-white bg-opacity-75 text-left text-sm font-semibold text-neutral-900 backdrop-blur backdrop-filter sm:pl-6 lg:pl-8"
+                      )}
                     >
                       {(header.column.columnDef as SortableColumnDef<any>)
                         .sortable ? (