Ver código fonte

fix: enhanced loading splash with progress indicator + status text

KirinCode 1 mês atrás
pai
commit
2d6f0de34e
1 arquivos alterados com 16 adições e 1 exclusões
  1. 16 1
      packages/desktop/src/renderer/index.tsx

+ 16 - 1
packages/desktop/src/renderer/index.tsx

@@ -317,9 +317,24 @@ window.api.onMenuCommand((id) => {
 listenForDeepLinks()
 
 function LoadingSplash() {
+  const [dots, setDots] = createSignal("")
+  onMount(() => {
+    const i = setInterval(() => {
+      setDots(d => d.length >= 3 ? "" : d + ".")
+    }, 500)
+    return () => clearInterval(i)
+  })
   return (
-    <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base">
+    <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base gap-4">
       <Splash class="w-16 h-20 opacity-50 animate-pulse" />
+      <div class="flex flex-col items-center gap-2">
+        <span class="text-14-medium text-text-muted">
+          正在启动 KirinCode<span class="inline-block w-8 text-left">{dots()}</span>
+        </span>
+        <div class="w-32 h-1 bg-background-element rounded-full overflow-hidden">
+          <div class="h-full bg-primary rounded-full animate-pulse" style="width:60%" />
+        </div>
+      </div>
     </div>
   )
 }