From 8070ce17c6d666436df38c684f5868ee7f689422 Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Thu, 3 Aug 2023 22:58:47 -0700
Subject: feat: :lipstick: nicer "continue server loading" UI

---
 extension/react-app/src/pages/gui.tsx | 31 ++++++++++++++++++++++++++-----
 1 file changed, 26 insertions(+), 5 deletions(-)

(limited to 'extension/react-app/src/pages/gui.tsx')

diff --git a/extension/react-app/src/pages/gui.tsx b/extension/react-app/src/pages/gui.tsx
index 54897944..ed73ce85 100644
--- a/extension/react-app/src/pages/gui.tsx
+++ b/extension/react-app/src/pages/gui.tsx
@@ -32,6 +32,7 @@ import {
   setBottomMessage,
   setBottomMessageCloseTimeout,
 } from "../redux/slices/uiStateSlice";
+import RingLoader from "../components/RingLoader";
 
 const TopGUIDiv = styled.div`
   overflow: hidden;
@@ -402,11 +403,31 @@ function GUI(props: GUIProps) {
       >
         {typeof client === "undefined" && (
           <>
-            <Loader />
-            <p style={{ textAlign: "center" }}>Loading Continue server...</p>
-            {/* <p style={{ textAlign: "center" }}>
-              Make sure you have a folder opened in VS Code
-            </p> */}
+            <RingLoader />
+            <p
+              style={{
+                textAlign: "center",
+                margin: "0px",
+                fontSize: "14px",
+              }}
+            >
+              Continue Server Starting
+            </p>
+            <p
+              style={{
+                margin: "auto",
+                textAlign: "center",
+                marginTop: "4px",
+                fontSize: "12px",
+                cursor: "pointer",
+                opacity: 0.7,
+              }}
+              onClick={() => {
+                postVscMessage("toggleDevTools", {});
+              }}
+            >
+              <u>Click to view logs</u>
+            </p>
           </>
         )}
         {history?.timeline.map((node: HistoryNode, index: number) => {
-- 
cgit v1.2.3-70-g09d2

