refactor(desktop): rework default server initialization and connection handling (#16965)

packages/desktop-electron/src/renderer/index.tsx

@@ -9,9 +9,8 @@ import {
   ServerConnection,
   useCommand,
 } from "@opencode-ai/app"
-import { Splash } from "@opencode-ai/ui/logo"
 import type { AsyncStorage } from "@solid-primitives/storage"
-import { type Accessor, createResource, type JSX, onCleanup, onMount, Show } from "solid-js"
+import { createResource, onCleanup, onMount, Show } from "solid-js"
 import { render } from "solid-js/web"
 import { MemoryRouter } from "@solidjs/router"
 import pkg from "../../package.json"
@@ -19,7 +18,6 @@ import { initI18n, t } from "./i18n"
 import { UPDATER_ENABLED } from "./updater"
 import { webviewZoom } from "./webview-zoom"
 import "./styles.css"
-import type { ServerReadyData } from "../preload/types"
 
 const root = document.getElementById("root")
 if (import.meta.env.DEV && !(root instanceof HTMLElement)) {
@@ -198,11 +196,13 @@ const createPlatform = (): Platform => {
       await window.api.setWslConfig({ enabled })
     },
 
-    getDefaultServerUrl: async () => {
-      return window.api.getDefaultServerUrl().catch(() => null)
+    getDefaultServer: async () => {
+      const url = await window.api.getDefaultServerUrl().catch(() => null)
+      if (!url) return null
+      return ServerConnection.Key.make(url)
     },
 
-    setDefaultServerUrl: async (url: string | null) => {
+    setDefaultServer: async (url: string | null) => {
       await window.api.setDefaultServerUrl(url)
     },
 
@@ -240,6 +240,31 @@ listenForDeepLinks()
 render(() => {
   const platform = createPlatform()
 
+  // Fetch sidecar credentials (available immediately, before health check)
+  const [sidecar] = createResource(() => window.api.awaitInitialization(() => undefined))
+
+  const [defaultServer] = createResource(() =>
+    platform.getDefaultServer?.().then((url) => {
+      if (url) return ServerConnection.key({ type: "http", http: { url } })
+    }),
+  )
+
+  const servers = () => {
+    const data = sidecar()
+    if (!data) return []
+    const server: ServerConnection.Sidecar = {
+      displayName: "Local Server",
+      type: "sidecar",
+      variant: "base",
+      http: {
+        url: data.url,
+        username: data.username ?? undefined,
+        password: data.password ?? undefined,
+      },
+    }
+    return [server] as ServerConnection.Any[]
+  }
+
   function handleClick(e: MouseEvent) {
     const link = (e.target as HTMLElement).closest("a.external-link") as HTMLAnchorElement | null
     if (link?.href) {
@@ -248,6 +273,12 @@ render(() => {
     }
   }
 
+  function Inner() {
+    const cmd = useCommand()
+    menuTrigger = (id) => cmd.trigger(id)
+    return null
+  }
+
   onMount(() => {
     document.addEventListener("click", handleClick)
     onCleanup(() => {
@@ -258,55 +289,20 @@ render(() => {
   return (
     <PlatformProvider value={platform}>
       <AppBaseProviders>
-        <ServerGate>
-          {(data) => {
-            const server: ServerConnection.Sidecar = {
-              displayName: "Local Server",
-              type: "sidecar",
-              variant: "base",
-              http: {
-                url: data().url,
-                username: "opencode",
-                password: data().password ?? undefined,
-              },
-            }
-
-            function Inner() {
-              const cmd = useCommand()
-
-              menuTrigger = (id) => cmd.trigger(id)
-
-              return null
-            }
-
+        <Show when={!defaultServer.loading && !sidecar.loading}>
+          {(_) => {
             return (
-              <AppInterface defaultServer={ServerConnection.key(server)} servers={[server]} router={MemoryRouter}>
+              <AppInterface
+                defaultServer={defaultServer.latest ?? ServerConnection.Key.make("sidecar")}
+                servers={servers()}
+                router={MemoryRouter}
+              >
                 <Inner />
               </AppInterface>
             )
           }}
-        </ServerGate>
+        </Show>
       </AppBaseProviders>
     </PlatformProvider>
   )
 }, root!)
-
-// Gate component that waits for the server to be ready
-function ServerGate(props: { children: (data: Accessor<ServerReadyData>) => JSX.Element }) {
-  const [serverData] = createResource(() => window.api.awaitInitialization(() => undefined))
-  console.log({ serverData })
-  if (serverData.state === "errored") throw serverData.error
-
-  return (
-    <Show
-      when={serverData.state !== "pending" && serverData()}
-      fallback={
-        <div class="h-screen w-screen flex flex-col items-center justify-center bg-background-base">
-          <Splash class="w-16 h-20 opacity-50 animate-pulse" />
-        </div>
-      }
-    >
-      {(data) => props.children(data)}
-    </Show>
-  )
-}

packages/desktop-electron/src/renderer/loading.tsx

@@ -1,5 +1,5 @@
-import { render } from "solid-js/web"
 import { MetaProvider } from "@solidjs/meta"
+import { render } from "solid-js/web"
 import "@opencode-ai/app/index.css"
 import { Font } from "@opencode-ai/ui/font"
 import { Splash } from "@opencode-ai/ui/logo"
@@ -34,7 +34,10 @@ render(() => {
 
     const listener = window.api.onSqliteMigrationProgress((progress: SqliteMigrationProgress) => {
       if (progress.type === "InProgress") setPercent(Math.max(0, Math.min(100, progress.value)))
-      if (progress.type === "Done") setPercent(100)
+      if (progress.type === "Done") {
+        setPercent(100)
+        setStep({ phase: "done" })
+      }
     })
 
     onCleanup(() => {