From 7c9b47d9da06c566161d2d0c19def3b540ef9ae0 Mon Sep 17 00:00:00 2001
From: Mikiyas Tibebu <mikitebe123@gmail.com>
Date: Fri, 14 Jun 2024 14:38:57 +0300
Subject: [PATCH] fix row not showing up and minor ui issue

---
 ui/src/components/ui/data-table.tsx | 44 +++++++++++++++--------------
 ui/src/routes/tables.lazy.tsx       |  2 +-
 2 files changed, 24 insertions(+), 22 deletions(-)

diff --git a/ui/src/components/ui/data-table.tsx b/ui/src/components/ui/data-table.tsx
index b6f5998..ad9fe6f 100644
--- a/ui/src/components/ui/data-table.tsx
+++ b/ui/src/components/ui/data-table.tsx
@@ -115,27 +115,29 @@ export function DataTable<TData, TValue>({
             Next
           </Button>
         </div>
-        <Select
-          onValueChange={(pageSize) => table.setPageSize(Number(pageSize))}
-          defaultValue="10"
-        >
-          <SelectTrigger className="text-sm">
-            <SelectValue>
-              Rows per page: {table.getState().pagination.pageSize}
-            </SelectValue>
-          </SelectTrigger>
-          <SelectContent>
-            {[10, 20, 30, 40, 50, 100].map((pageSize) => (
-              <SelectItem
-                key={pageSize}
-                onClick={() => table.setPageSize(pageSize)}
-                value={String(pageSize)}
-              >
-                {pageSize}
-              </SelectItem>
-            ))}
-          </SelectContent>
-        </Select>
+        <div>
+          <Select
+            onValueChange={(pageSize) => table.setPageSize(Number(pageSize))}
+            defaultValue="10"
+          >
+            <SelectTrigger className="text-sm">
+              <SelectValue>
+                Rows per page: {table.getState().pagination.pageSize}
+              </SelectValue>
+            </SelectTrigger>
+            <SelectContent>
+              {[10, 20, 30, 40, 50, 100].map((pageSize) => (
+                <SelectItem
+                  key={pageSize}
+                  onClick={() => table.setPageSize(pageSize)}
+                  value={String(pageSize)}
+                >
+                  {pageSize}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        </div>
       </div>
     </div>
   );
diff --git a/ui/src/routes/tables.lazy.tsx b/ui/src/routes/tables.lazy.tsx
index 6281c1c..d78a8fe 100644
--- a/ui/src/routes/tables.lazy.tsx
+++ b/ui/src/routes/tables.lazy.tsx
@@ -55,7 +55,7 @@ function Table({ name }: Props) {
     [key: string]: string;
   };
   const columns: ColumnDef<Column>[] = data.columns.map((col) => ({
-    accessorKey: col.toLowerCase(),
+    accessorKey: col,
     header: col,
   }));
   const rows = data.rows.map((row) =>