From 261d259717e608974c04ba442d324c8919eece58 Mon Sep 17 00:00:00 2001
From: frectonz <fraol0912@gmail.com>
Date: Wed, 3 Jul 2024 15:36:17 +0300
Subject: [PATCH] feat: no tables found component

---
 ui/src/routes/tables.lazy.tsx | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/ui/src/routes/tables.lazy.tsx b/ui/src/routes/tables.lazy.tsx
index 974479b..0dc02a5 100644
--- a/ui/src/routes/tables.lazy.tsx
+++ b/ui/src/routes/tables.lazy.tsx
@@ -13,7 +13,12 @@ import { useInfiniteQuery, useQuery } from "@tanstack/react-query";
 import { CodeBlock, irBlack as CodeDarkTheme } from "react-code-blocks";
 
 import { cn } from "@/lib/utils";
-import { Card } from "@/components/ui/card";
+import {
+  Card,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
 import { Skeleton } from "@/components/ui/skeleton";
 import { useTheme } from "@/provider/theme.provider";
 import { fetchTable, fetchTableData, fetchTables } from "@/api";
@@ -31,6 +36,17 @@ function Tables() {
   const data = Route.useLoaderData();
   const { table } = Route.useSearch();
 
+  if (data.tables.length === 0)
+    return (
+      <Card>
+        <CardHeader className="flex items-center">
+          <TableIcon className="mb-4 h-12 w-12 text-muted-foreground" />
+          <CardTitle>No Tables Found</CardTitle>
+          <CardDescription>The database has no tables.</CardDescription>
+        </CardHeader>
+      </Card>
+    );
+
   const tab = table
     ? data.tables.findIndex(({ name }) => name === table).toString()
     : "0";