From cf77fa8cd120ed0e04ff68d38d4889bb3c0b6700 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Sat, 2 Mar 2024 10:16:32 +0000
Subject: [PATCH] ui: Minor UI tweaks in admin page and sidebar

---
 packages/web/app/dashboard/admin/page.tsx     | 65 ++++++++++---------
 .../web/app/dashboard/components/AllLists.tsx |  3 +-
 2 files changed, 36 insertions(+), 32 deletions(-)

diff --git a/packages/web/app/dashboard/admin/page.tsx b/packages/web/app/dashboard/admin/page.tsx
index 26b6447b..b2f8e9ac 100644
--- a/packages/web/app/dashboard/admin/page.tsx
+++ b/packages/web/app/dashboard/admin/page.tsx
@@ -69,42 +69,46 @@ export default function AdminPage() {
       <p className="text-2xl">Admin</p>
       <hr />
       {data ? (
-        <Table>
-          <TableHeader>
-            <TableRow>
-              <TableHead>Stats</TableHead>
-              <TableHead>Value</TableHead>
-            </TableRow>
-          </TableHeader>
-          <TableBody>
-            <TableRow>
-              <TableCell>Num Users</TableCell>
-              <TableCell>{data.numUsers}</TableCell>
-            </TableRow>
-            <TableRow>
-              <TableCell>Num Bookmarks</TableCell>
-              <TableCell>{data.numBookmarks}</TableCell>
-            </TableRow>
-            <TableRow>
-              <TableCell>Pending Crawling Jobs</TableCell>
-              <TableCell>{data.pendingCrawls}</TableCell>
-            </TableRow>
-            <TableRow>
-              <TableCell>Pending Indexing Jobs</TableCell>
-              <TableCell>{data.pendingIndexing}</TableCell>
-            </TableRow>
-            <TableRow>
-              <TableCell>Pending OpenAI Jobs</TableCell>
-              <TableCell>{data.pendingOpenai}</TableCell>
-            </TableRow>
-          </TableBody>
-        </Table>
+        <>
+          <p className="text-xl">Server Stats</p>
+          <Table className="w-1/2">
+            <TableBody>
+              <TableRow>
+                <TableCell className="w-2/3">Num Users</TableCell>
+                <TableCell>{data.numUsers}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableCell>Num Bookmarks</TableCell>
+                <TableCell>{data.numBookmarks}</TableCell>
+              </TableRow>
+            </TableBody>
+          </Table>
+          <hr />
+          <p className="text-xl">Background Jobs</p>
+          <Table className="w-1/2">
+            <TableBody>
+              <TableRow>
+                <TableCell className="w-2/3">Pending Crawling Jobs</TableCell>
+                <TableCell>{data.pendingCrawls}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableCell>Pending Indexing Jobs</TableCell>
+                <TableCell>{data.pendingIndexing}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableCell>Pending OpenAI Jobs</TableCell>
+                <TableCell>{data.pendingOpenai}</TableCell>
+              </TableRow>
+            </TableBody>
+          </Table>
+        </>
       ) : (
         <LoadingSpinner />
       )}
       <hr />
       <p className="text-xl">Actions</p>
       <ActionButton
+        className="w-1/2"
         variant="destructive"
         loading={isRecrawlPending}
         onClick={() => recrawlLinks()}
@@ -112,6 +116,7 @@ export default function AdminPage() {
         Recrawl All Links
       </ActionButton>
       <ActionButton
+        className="w-1/2"
         variant="destructive"
         loading={isReindexPending}
         onClick={() => reindexBookmarks()}
diff --git a/packages/web/app/dashboard/components/AllLists.tsx b/packages/web/app/dashboard/components/AllLists.tsx
index 6b5ca3b5..937ba90d 100644
--- a/packages/web/app/dashboard/components/AllLists.tsx
+++ b/packages/web/app/dashboard/components/AllLists.tsx
@@ -1,7 +1,6 @@
 "use client";
 
 import { api } from "@/lib/trpc";
-import { ScrollArea } from "@/components/ui/scroll-area";
 import SidebarItem from "./SidebarItem";
 import LoadingSpinner from "@/components/ui/spinner";
 import NewListModal, { useNewListModal } from "./NewListModal";
@@ -16,7 +15,7 @@ export default function AllLists() {
   return (
     <ul className="max-h-full gap-2 overflow-scroll text-sm font-medium">
       <NewListModal />
-      <li className="flex justify-between py-2 font-bold">
+      <li className="flex justify-between pb-2 font-bold">
         <p>Lists</p>
         <Link href="#" onClick={() => setOpen(true)}>
           <Plus />