feat: SSE update progress + reliable restart on Windows

- apply-update returns SSE stream with step-by-step progress
(pull → install → build → restart)
- Frontend parses SSE, shows progress steps with checkmarks in modal
- Restart helper writes temp .restart-helper.cjs file instead of -e
inline script (fixes Windows command escaping issues)
- RESTART_TIMEOUT increased from 30s to 120s
- Frontend falls back to restart polling if connection drops mid-stream

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

shared/hooks/use-update-status.ts

@@ -46,7 +46,13 @@ export interface CheckResult {
 }
 
 const RESTART_POLL_INTERVAL = 2000;
-const RESTART_TIMEOUT = 30000;
+const RESTART_TIMEOUT = 120000;
+
+export interface UpdateStep {
+  step: string;
+  status: "running" | "done" | "error";
+  detail?: string;
+}
 
 export function useUpdateStatus() {
   const [status, setStatus] = useState<UpdateStatus | null>(null);
@@ -56,6 +62,7 @@ export function useUpdateStatus() {
   const [applying, setApplying] = useState(false);
   const [restarting, setRestarting] = useState(false);
   const [restartFailed, setRestartFailed] = useState(false);
+  const [updateSteps, setUpdateSteps] = useState<UpdateStep[]>([]);
   const pollTimerRef = useRef<ReturnType<typeof setInterval> | null>(null);
   const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
@@ -138,26 +145,83 @@ export function useUpdateStatus() {
   const applyUpdate = useCallback(async () => {
     setApplying(true);
     setError(null);
+    setUpdateSteps([]);
     try {
       const resp = await fetch("/admin/apply-update", { method: "POST" });
-      const data = await resp.json() as { started: boolean; restarting?: boolean; error?: string };
-      if (!resp.ok || !data.started) {
-        setError(data.error ?? "Apply failed");
+      if (!resp.ok) {
+        const text = await resp.text();
+        try {
+          const data = JSON.parse(text) as { error?: string };
+          setError(data.error ?? "Apply failed");
+        } catch {
+          setError(text || "Apply failed");
+        }
         setApplying(false);
-      } else if (data.restarting) {
-        // Server will restart — start polling for it to come back
+        return;
+      }
+
+      // Parse SSE stream
+      const reader = resp.body?.getReader();
+      if (!reader) {
+        setError("No response body");
         setApplying(false);
+        return;
+      }
+
+      const decoder = new TextDecoder();
+      let buffer = "";
+      let shouldRestart = false;
+
+      for (;;) {
+        const { done, value } = await reader.read();
+        if (done) break;
+        buffer += decoder.decode(value, { stream: true });
+
+        // Parse SSE lines
+        const lines = buffer.split("\n");
+        buffer = lines.pop() ?? "";
+        for (const line of lines) {
+          if (!line.startsWith("data: ")) continue;
+          try {
+            const data = JSON.parse(line.slice(6)) as Record<string, unknown>;
+            if (data.step && data.status) {
+              setUpdateSteps((prev) => {
+                const existing = prev.findIndex((s) => s.step === data.step);
+                const entry: UpdateStep = {
+                  step: data.step as string,
+                  status: data.status as UpdateStep["status"],
+                  detail: data.detail as string | undefined,
+                };
+                if (existing >= 0) {
+                  const next = [...prev];
+                  next[existing] = entry;
+                  return next;
+                }
+                return [...prev, entry];
+              });
+            }
+            if (data.done) {
+              shouldRestart = !!(data.restarting);
+              if (!data.started) {
+                setError((data.error as string) ?? "Apply failed");
+              }
+            }
+          } catch { /* skip malformed SSE */ }
+        }
+      }
+
+      setApplying(false);
+      if (shouldRestart) {
         startRestartPolling();
-      } else {
-        // Update succeeded but no auto-restart
-        setApplying(false);
+      } else if (!error) {
         await load();
       }
     } catch (err) {
-      setError(err instanceof Error ? err.message : "Network error");
+      // Connection lost during update — server may be restarting
       setApplying(false);
+      startRestartPolling();
     }
-  }, [load, startRestartPolling]);
+  }, [load, startRestartPolling, error]);
 
-  return { status, checking, result, error, checkForUpdate, applyUpdate, applying, restarting, restartFailed };
+  return { status, checking, result, error, checkForUpdate, applyUpdate, applying, restarting, restartFailed, updateSteps };
 }

shared/i18n/translations.ts

@@ -152,6 +152,9 @@ export const translations = {
     downloadUpdate: "Download",
     updateTitle: "Update Available",
     updateRestarting: "Restarting server...",
+    updatePulling: "Pulling code...",
+    updateInstalling: "Installing dependencies...",
+    updateBuilding: "Building...",
     restartFailed: "Server not responding. Please restart manually.",
     close: "Close",
     settings: "Settings",
@@ -326,6 +329,9 @@ export const translations = {
     downloadUpdate: "\u4e0b\u8f7d",
     updateTitle: "\u6709\u53ef\u7528\u66f4\u65b0",
     updateRestarting: "\u6b63\u5728\u91cd\u542f\u670d\u52a1...",
+    updatePulling: "\u62c9\u53d6\u4ee3\u7801...",
+    updateInstalling: "\u5b89\u88c5\u4f9d\u8d56...",
+    updateBuilding: "\u7f16\u8bd1\u4e2d...",
     restartFailed: "\u670d\u52a1\u5668\u672a\u54cd\u5e94\uff0c\u8bf7\u624b\u52a8\u91cd\u542f\u3002",
     close: "\u5173\u95ed",
     settings: "\u8bbe\u7f6e",

src/self-update.ts

@@ -6,7 +6,7 @@
  */
 
 import { execFile, execFileSync, spawn } from "child_process";
-import { existsSync, readFileSync } from "fs";
+import { existsSync, readFileSync, writeFileSync } from "fs";
 import { resolve } from "path";
 import { promisify } from "util";
 import { getRootDir, isEmbedded } from "./paths.js";
@@ -27,35 +27,43 @@ export function setCloseHandler(handler: () => Promise<void>): void {
 function hardRestart(cwd: string): void {
   const nodeExe = process.argv[0];
   const serverArgs = process.argv.slice(1);
-
-  // Inline script: wait for the port to be free, then start the real server
-  const helperScript = `
-    const net = require("net");
-    const { spawn } = require("child_process");
-    const args = ${JSON.stringify(serverArgs)};
-    const cwd = ${JSON.stringify(cwd)};
-    let attempts = 0;
-    function tryStart() {
-      attempts++;
-      const s = net.createServer();
-      s.once("error", () => {
-        if (attempts >= 20) process.exit(1);
-        setTimeout(tryStart, 500);
-      });
-      s.once("listening", () => {
-        s.close(() => {
-          spawn(${JSON.stringify(nodeExe)}, args, { detached: true, stdio: "ignore", cwd }).unref();
-          process.exit(0);
-        });
-      });
-      s.listen(${getPort()});
-    }
-    tryStart();
-  `;
+  const port = getPort();
+
+  // Write a temporary CJS helper script that waits for the port to be free, then starts the server
+  const helperPath = resolve(cwd, ".restart-helper.cjs");
+  const helperContent = [
+    `const net = require("net");`,
+    `const { spawn, execSync } = require("child_process");`,
+    `const fs = require("fs");`,
+    `const nodeExe = ${JSON.stringify(nodeExe)};`,
+    `const args = ${JSON.stringify(serverArgs)};`,
+    `const cwd = ${JSON.stringify(cwd)};`,
+    `const port = ${port};`,
+    `let attempts = 0;`,
+    `function tryStart() {`,
+    `  attempts++;`,
+    `  const s = net.createServer();`,
+    `  s.once("error", () => {`,
+    `    if (attempts >= 20) { cleanup(); process.exit(1); }`,
+    `    setTimeout(tryStart, 500);`,
+    `  });`,
+    `  s.once("listening", () => {`,
+    `    s.close(() => {`,
+    `      spawn(nodeExe, args, { detached: true, stdio: "ignore", cwd }).unref();`,
+    `      cleanup();`,
+    `      process.exit(0);`,
+    `    });`,
+    `  });`,
+    `  s.listen(port);`,
+    `}`,
+    `function cleanup() { try { fs.unlinkSync(${JSON.stringify(helperPath)}); } catch {} }`,
+    `tryStart();`,
+  ].join("\n");
 
   const doRestart = () => {
-    console.log("[SelfUpdate] Spawning restart helper and exiting...");
-    spawn(nodeExe, ["-e", helperScript], {
+    console.log("[SelfUpdate] Writing restart helper and exiting...");
+    writeFileSync(helperPath, helperContent, "utf-8");
+    spawn(nodeExe, [helperPath], {
       detached: true,
       stdio: "ignore",
       cwd,

web/src/App.tsx

@@ -160,6 +160,7 @@ function Dashboard() {
           applying={update.applying}
           restarting={update.restarting}
           restartFailed={update.restartFailed}
+          updateSteps={update.updateSteps}
         />
       )}
     </>

web/src/components/UpdateModal.tsx

@@ -1,5 +1,14 @@
 import { useEffect, useRef } from "preact/hooks";
 import { useI18n } from "../../../shared/i18n/context";
+import type { UpdateStep } from "../../../shared/hooks/use-update-status";
+import type { TranslationKey } from "../../../shared/i18n/translations";
+
+const STEP_LABELS: Record<string, TranslationKey> = {
+  pull: "updatePulling",
+  install: "updateInstalling",
+  build: "updateBuilding",
+  restart: "updateRestarting",
+};
 
 interface UpdateModalProps {
   open: boolean;
@@ -11,6 +20,7 @@ interface UpdateModalProps {
   applying: boolean;
   restarting: boolean;
   restartFailed: boolean;
+  updateSteps?: UpdateStep[];
 }
 
 export function UpdateModal({
@@ -23,6 +33,7 @@ export function UpdateModal({
   applying,
   restarting,
   restartFailed,
+  updateSteps = [],
 }: UpdateModalProps) {
   const { t } = useI18n();
   const dialogRef = useRef<HTMLDialogElement>(null);
@@ -80,7 +91,31 @@ export function UpdateModal({
 
         {/* Body */}
         <div class="px-5 py-4">
-          {restarting ? (
+          {(applying || restarting) && updateSteps.length > 0 ? (
+            <div class="space-y-2 py-2">
+              {updateSteps.map((s) => (
+                <div key={s.step} class="flex items-center gap-3 text-sm">
+                  {s.status === "done" ? (
+                    <svg class="size-5 text-primary shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
+                      <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
+                    </svg>
+                  ) : s.status === "error" ? (
+                    <svg class="size-5 text-red-500 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                      <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+                    </svg>
+                  ) : (
+                    <svg class="size-5 animate-spin text-primary shrink-0" viewBox="0 0 24 24" fill="none">
+                      <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
+                      <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" />
+                    </svg>
+                  )}
+                  <span class={s.status === "done" ? "text-slate-500 dark:text-text-dim" : "text-slate-700 dark:text-text-main font-medium"}>
+                    {t(STEP_LABELS[s.step] ?? ("updateBuilding" as TranslationKey))}
+                  </span>
+                </div>
+              ))}
+            </div>
+          ) : restarting ? (
             <div class="flex flex-col items-center gap-3 py-6">
               <svg class="size-8 animate-spin text-primary" viewBox="0 0 24 24" fill="none">
                 <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />