From 57496c9b46954b4bd2f5ed6cbb6ae59e63113390 Mon Sep 17 00:00:00 2001
From: Steven <stevenlgtm@gmail.com>
Date: Wed, 19 Jul 2023 21:47:44 +0800
Subject: [PATCH] chore: add loading view to analytics

---
 web/src/components/AnalyticsDialog.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/web/src/components/AnalyticsDialog.tsx b/web/src/components/AnalyticsDialog.tsx
index 1e4c598..c0fca2b 100644
--- a/web/src/components/AnalyticsDialog.tsx
+++ b/web/src/components/AnalyticsDialog.tsx
@@ -11,7 +11,7 @@ interface Props {
 const AnalyticsDialog: React.FC<Props> = (props: Props) => {
   const { shortcutId, onClose } = props;
   const [analytics, setAnalytics] = useState<AnalysisData | null>(null);
-  const [selectedDeviceTab, setSelectedDeviceTab] = useState<"os" | "browser">("os");
+  const [selectedDeviceTab, setSelectedDeviceTab] = useState<"os" | "browser">("browser");
 
   useEffect(() => {
     api.getShortcutAnalytics(shortcutId).then(({ data }) => {
@@ -118,7 +118,12 @@ const AnalyticsDialog: React.FC<Props> = (props: Props) => {
                 )}
               </div>
             </>
-          ) : null}
+          ) : (
+            <div className="py-12 w-full flex flex-row justify-center items-center opacity-80">
+              <Icon.Loader className="mr-2 w-5 h-auto animate-spin" />
+              loading
+            </div>
+          )}
         </div>
       </ModalDialog>
     </Modal>