menubar: interactive update-check dialogs + tray download progress

Sparkle's convention, adopted: a user-initiated "Check for updates"
always answers with visible UI — "You're up to date", a Restart Now /
Later prompt once the download lands, or the error — while scheduled
background checks stay silent (menu rows only). Download progress goes
in the tray TITLE (" 42%" beside the icon): macOS doesn't repaint an
open NSMenu, so the menu row alone can't show live progress, and the
tray title is the one surface visible without opening anything.
LSUIElement app → app.focus({steal:true}) before each dialog so it
doesn't open behind the frontmost app.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Author: yyq1025

packages/menubar/electron/main.ts

@@ -194,7 +194,10 @@ function buildMenu(): Electron.Menu {
         { label: `Version ${app.getVersion()}`, enabled: false },
         {
           label: "Check for updates",
-          click: () => checkForUpdates(),
+          // interactive: a user-initiated check always answers with a
+          // dialog (up to date / restart prompt / error) — Sparkle
+          // convention; scheduled checks stay silent.
+          click: () => checkForUpdates({ interactive: true }),
         },
         {
           label: "View on GitHub",
@@ -217,6 +220,12 @@ function buildMenu(): Electron.Menu {
 
 function refreshMenu() {
   tray?.setContextMenu(buildMenu());
+  // Download progress lives in the tray TITLE (text beside the icon) — the
+  // one surface a menu bar app can update that's visible without opening
+  // anything. macOS doesn't repaint an already-open NSMenu, so the menu row
+  // alone would only show progress on the next open.
+  const s = getUpdateState();
+  tray?.setTitle(s.status === "downloading" ? ` ${s.percent}%` : "");
 }
 
 // --- Pair window ---

packages/menubar/electron/updater.ts

@@ -1,4 +1,4 @@
-import { app } from "electron";
+import { app, dialog } from "electron";
 // electron-updater is CJS; default-import + destructure is the safe ESM interop.
 import electronUpdater from "electron-updater";
 
@@ -22,6 +22,13 @@ let state: UpdateState = { status: "idle" };
 let pendingVersion = "";
 let onChange: (() => void) | null = null;
 
+// Sparkle's convention, adopted here: a USER-initiated check must always
+// answer with visible UI (dialog), while scheduled background checks stay
+// silent (menu rows + tray title only). This flag marks the in-flight check
+// as user-initiated; each terminal outcome (up to date / downloaded / error)
+// consumes it.
+let interactiveCheck = false;
+
 // 6h: frequent enough to keep the protocol-mismatch window to hours, rare
 // enough to be invisible in network logs.
 const RECHECK_INTERVAL_MS = 6 * 60 * 60 * 1000;
@@ -44,22 +51,62 @@ export function initUpdater(opts: { onStateChange: () => void }): void {
   autoUpdater.on("checking-for-update", () => set({ status: "checking" }));
   autoUpdater.on("update-available", (info) => {
     pendingVersion = info.version;
+    // No dialog here even for interactive checks: the tray title starts
+    // showing live "⬇ N%" immediately (right where the user just clicked),
+    // and the flag survives until update-downloaded prompts the restart.
     set({ status: "downloading", version: info.version, percent: 0 });
   });
-  autoUpdater.on("update-not-available", () => set({ status: "idle" }));
+  autoUpdater.on("update-not-available", () => {
+    set({ status: "idle" });
+    if (consumeInteractive()) {
+      showDialog({
+        message: "You're up to date",
+        detail: `Sidecode ${app.getVersion()} is the latest version.`,
+      });
+    }
+  });
   autoUpdater.on("download-progress", (p) =>
     set({
       status: "downloading",
       version: pendingVersion,
       percent: Math.round(p.percent),
     }),
   );
-  autoUpdater.on("update-downloaded", (info) =>
-    set({ status: "downloaded", version: info.version }),
-  );
-  autoUpdater.on("error", (err) =>
-    set({ status: "error", message: err?.message ?? String(err) }),
-  );
+  autoUpdater.on("update-downloaded", (info) => {
+    set({ status: "downloaded", version: info.version });
+    // A user who manually checked almost certainly wants to install right
+    // away — offer the restart instead of making them reopen the menu.
+    // (electron-updater re-fires this immediately for an already-cached
+    // download, so a manual re-check while in "downloaded" lands here too.)
+    if (consumeInteractive()) {
+      app.focus({ steal: true }); // see showDialog
+      void dialog
+        .showMessageBox({
+          type: "info",
+          message: `Sidecode ${info.version} is ready`,
+          detail: "Restart now to finish updating?",
+          buttons: ["Restart Now", "Later"],
+          defaultId: 0,
+          cancelId: 1,
+        })
+        .then(({ response }) => {
+          if (response === 0) quitAndInstall();
+        });
+    }
+  });
+  autoUpdater.on("error", (err) => {
+    const message = err?.message ?? String(err);
+    set({ status: "error", message });
+    // Background-check failures (laptop offline, feed hiccup) stay silent —
+    // the 6h cadence retries on its own.
+    if (consumeInteractive()) {
+      showDialog({
+        type: "warning",
+        message: "Couldn't check for updates",
+        detail: message,
+      });
+    }
+  });
 
   checkForUpdates();
   // Menu bar apps run for weeks; a startup-only check would let the Mac
@@ -69,7 +116,8 @@ export function initUpdater(opts: { onStateChange: () => void }): void {
   setInterval(checkForUpdates, RECHECK_INTERVAL_MS).unref();
 }
 
-export function checkForUpdates(): void {
+export function checkForUpdates(opts: { interactive?: boolean } = {}): void {
+  if (opts.interactive) interactiveCheck = true;
   // Failures also fire the "error" event; this catch just prevents an unhandled
   // rejection when no feed is reachable (e.g. dev without a real dev-app-update.yml).
   autoUpdater.checkForUpdates().catch((err) => {
@@ -83,6 +131,28 @@ export function quitAndInstall(): void {
   autoUpdater.quitAndInstall();
 }
 
+function consumeInteractive(): boolean {
+  const was = interactiveCheck;
+  interactiveCheck = false;
+  return was;
+}
+
+function showDialog(opts: {
+  type?: "info" | "warning";
+  message: string;
+  detail: string;
+}): void {
+  // LSUIElement app (no Dock presence): without an explicit focus steal the
+  // dialog can open behind whatever app is frontmost.
+  app.focus({ steal: true });
+  void dialog.showMessageBox({
+    type: opts.type ?? "info",
+    message: opts.message,
+    detail: opts.detail,
+    buttons: ["OK"],
+  });
+}
+
 function set(next: UpdateState): void {
   state = next;
   onChange?.();