feat(desktop): make updates persistent and responsive (#31191)

packages/app/src/pages/error.tsx

@@ -225,8 +225,6 @@ export const ErrorPage: Component<ErrorPageProps> = (props) => {
   const formattedError = () => formatError(props.error, language.t)
   let recordedFatalError: Promise<void> | undefined
   const [store, setStore] = createStore({
-    checking: false,
-    version: undefined as string | undefined,
     actionError: undefined as string | undefined,
   })
 
@@ -247,32 +245,25 @@ export const ErrorPage: Component<ErrorPageProps> = (props) => {
   })
 
   async function checkForUpdates() {
-    if (!platform.checkUpdate) return
-    setStore("checking", true)
-    await platform
-      .checkUpdate()
-      .then((result) => {
-        setStore("actionError", undefined)
-        if (result.updateAvailable && result.version) setStore("version", result.version)
-      })
-      .catch((err) => {
-        setStore("actionError", formatError(err, language.t))
-      })
-      .finally(() => {
-        setStore("checking", false)
-      })
+    const state = await platform.updater?.check()
+    setStore("actionError", state?.status === "error" ? state.message : undefined)
   }
 
   async function installUpdate() {
-    if (!platform.updateAndRestart) return
     await platform
-      .updateAndRestart()
+      .updater?.install()
       .then(() => setStore("actionError", undefined))
       .catch((err) => {
         setStore("actionError", formatError(err, language.t))
       })
   }
 
+  const updateVersion = () => {
+    const state = platform.updater?.state()
+    if (state?.status !== "ready") return
+    return state.version
+  }
+
   async function exportDebugLogs() {
     const exportLogs = platform.exportDebugLogs
     if (!exportLogs) return
@@ -327,20 +318,27 @@ export const ErrorPage: Component<ErrorPageProps> = (props) => {
               )
             }}
           </Show>
-          <Show when={platform.checkUpdate}>
+          <Show when={platform.updater}>
             <Show
-              when={store.version}
+              when={updateVersion()}
               fallback={
-                <Button size="large" variant="ghost" onClick={checkForUpdates} disabled={store.checking}>
-                  {store.checking
+                <Button
+                  size="large"
+                  variant="ghost"
+                  onClick={checkForUpdates}
+                  disabled={["checking", "downloading", "installing"].includes(platform.updater?.state().status ?? "")}
+                >
+                  {platform.updater?.state().status === "checking"
                     ? language.t("error.page.action.checking")
                     : language.t("error.page.action.checkUpdates")}
                 </Button>
               }
             >
-              <Button size="large" onClick={installUpdate}>
-                {language.t("error.page.action.updateTo", { version: store.version ?? "" })}
-              </Button>
+              {(version) => (
+                <Button size="large" onClick={installUpdate}>
+                  {language.t("error.page.action.updateTo", { version: version() })}
+                </Button>
+              )}
             </Show>
           </Show>
         </div>

packages/app/src/pages/layout.tsx

@@ -14,7 +14,6 @@ import {
 } from "solid-js"
 import { makeEventListener } from "@solid-primitives/event-listener"
 import { useLocation, useNavigate, useParams } from "@solidjs/router"
-import { useQuery } from "@tanstack/solid-query"
 import { useLayout, LocalProject } from "@/context/layout"
 import { useServerSync } from "@/context/server-sync"
 import { Persist, persisted } from "@/utils/persist"
@@ -90,7 +89,6 @@ import {
 } from "./layout/sidebar-workspace"
 import { ProjectDragOverlay, SortableProject, type ProjectSidebarContext } from "./layout/sidebar-project"
 import { SidebarContent } from "./layout/sidebar-shell"
-import { runUpdateAndRestart } from "./layout/update"
 
 export default function Layout(props: ParentProps) {
   const serverSDK = useServerSDK()
@@ -168,28 +166,15 @@ export default function Layout(props: ParentProps) {
     peeked: false,
   })
 
-  const [update, setUpdate] = createStore({
-    installing: false,
-  })
-  const updateQuery = useQuery(() => ({
-    queryKey: ["desktop", "update"] as const,
-    enabled: () =>
-      !!platform.checkUpdate && !!platform.updateAndRestart && settings.ready() && settings.updates.startup(),
-    queryFn: () => platform.checkUpdate?.() ?? Promise.resolve({ updateAvailable: false, version: undefined }),
-    refetchInterval: (query) => (query.state.data?.updateAvailable ? false : 10 * 60 * 1000),
-  }))
   const updateVersion = () => {
-    if (!settings.ready()) return
-    if (!settings.updates.startup()) return
-    if (!updateQuery.data?.updateAvailable) return
-    return updateQuery.data.version ?? ""
-  }
-  const installUpdate = () => {
-    runUpdateAndRestart(platform.updateAndRestart, (installing) => setUpdate("installing", installing))
+    const state = platform.updater?.state()
+    if (state?.status !== "ready") return
+    return state.version
   }
+  const installUpdate = () => void platform.updater?.install()
   const titlebarUpdate: TitlebarUpdate = {
     version: updateVersion,
-    installing: () => update.installing,
+    installing: () => platform.updater?.state().status === "installing",
     install: installUpdate,
   }
 

packages/app/src/pages/layout/update.test.ts

@@ -1,19 +0,0 @@
-import { describe, expect, test } from "bun:test"
-import { runUpdateAndRestart } from "./update"
-
-describe("runUpdateAndRestart", () => {
-  test("clears the installing state when restart resolves without exiting", async () => {
-    const states: boolean[] = []
-    await new Promise<void>((resolve) => {
-      runUpdateAndRestart(
-        async () => {},
-        (installing) => {
-          states.push(installing)
-          if (states.length === 2) resolve()
-        },
-      )
-    })
-
-    expect(states).toEqual([true, false])
-  })
-})

packages/app/src/pages/layout/update.ts

@@ -1,10 +0,0 @@
-export function runUpdateAndRestart(
-  updateAndRestart: (() => Promise<void>) | undefined,
-  setInstalling: (installing: boolean) => void,
-) {
-  if (!updateAndRestart) return
-  setInstalling(true)
-  void updateAndRestart()
-    .catch(() => undefined)
-    .finally(() => setInstalling(false))
-}