From b915f3b1a936b76b684ddf5ff5340b1b9539f1b3 Mon Sep 17 00:00:00 2001
From: GyDi <segydi@foxmail.com>
Date: Fri, 2 Sep 2022 01:09:38 +0800
Subject: [PATCH] feat: add empty ui

---
 src/pages/connections.tsx | 13 +++++++++----
 src/pages/logs.tsx        | 17 +++++++++++------
 2 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/src/pages/connections.tsx b/src/pages/connections.tsx
index ce59c2a..3ddb727 100644
--- a/src/pages/connections.tsx
+++ b/src/pages/connections.tsx
@@ -6,6 +6,7 @@ import { useTranslation } from "react-i18next";
 import { closeAllConnections, getInformation } from "@/services/api";
 import BasePage from "@/components/base/base-page";
 import ConnectionItem from "@/components/connection/connection-item";
+import BaseEmpty from "@/components/base/base-empty";
 
 const initConn = { uploadTotal: 0, downloadTotal: 0, connections: [] };
 
@@ -122,10 +123,14 @@ const ConnectionsPage = () => {
         </Box>
 
         <Box height="calc(100% - 50px)">
-          <Virtuoso
-            data={filterConn}
-            itemContent={(index, item) => <ConnectionItem value={item} />}
-          />
+          {filterConn.length > 0 ? (
+            <Virtuoso
+              data={filterConn}
+              itemContent={(index, item) => <ConnectionItem value={item} />}
+            />
+          ) : (
+            <BaseEmpty text="No Connections" />
+          )}
         </Box>
       </Paper>
     </BasePage>
diff --git a/src/pages/logs.tsx b/src/pages/logs.tsx
index f4566bd..b749291 100644
--- a/src/pages/logs.tsx
+++ b/src/pages/logs.tsx
@@ -6,6 +6,7 @@ import { useTranslation } from "react-i18next";
 import { atomLogData } from "@/services/states";
 import BasePage from "@/components/base/base-page";
 import LogItem from "@/components/log/log-item";
+import BaseEmpty from "@/components/base/base-empty";
 
 const LogPage = () => {
   const { t } = useTranslation();
@@ -75,12 +76,16 @@ const LogPage = () => {
         </Box>
 
         <Box height="calc(100% - 50px)">
-          <Virtuoso
-            initialTopMostItemIndex={999}
-            data={filterLogs}
-            itemContent={(index, item) => <LogItem value={item} />}
-            followOutput={"smooth"}
-          />
+          {filterLogs.length > 0 ? (
+            <Virtuoso
+              initialTopMostItemIndex={999}
+              data={filterLogs}
+              itemContent={(index, item) => <LogItem value={item} />}
+              followOutput={"smooth"}
+            />
+          ) : (
+            <BaseEmpty text="No Logs" />
+          )}
         </Box>
       </Paper>
     </BasePage>