privateboard 0.1.23 → 0.1.25

package/public/agent-profile.js

@@ -2413,61 +2413,29 @@
    *    route   · short label rendered as the right-edge pill.            */
   function pickerEntries() {
     const cache = modelsSnapshot();
-    const out = [];
+    // Multi-SIM credential model · the user has exactly one active
+    // LLM provider at a time, so each reachable model maps to one
+    // pickable row (no carrier fork). `cache.reachable` is filtered
+    // server-side based on `prefs.active_llm_credential_id`, so the
+    // picker naturally collapses to the active provider's family.
     if (cache && Array.isArray(cache.reachable) && cache.reachable.length > 0) {
-      for (const m of cache.reachable) {
-        const directOk = !!(m.routes && m.routes.direct);
-        const orOk = !!(m.routes && m.routes.openrouter);
-        const baiOk = !!(m.routes && m.routes.bai);
-        const provider = providerLabel(m.provider);
-        // For each carrier that can serve this model, emit a separate
-        // pickable row · users can pin EITHER carrier explicitly. Order
-        // mirrors the adapter's default precedence so the natural top
-        // pick when the user just clicks "the model" is the same one
-        // the orchestrator would resolve unpinned. When only ONE
-        // carrier serves the model, we collapse to a single row with
-        // `carrier: null` so the agent uses default routing (and
-        // automatically follows the carrier if the user later
-        // reconfigures keys).
-        const reachableCarriers = [];
-        if (directOk) reachableCarriers.push({ carrier: m.provider, route: "via " + provider + " direct" });
-        if (baiOk) reachableCarriers.push({ carrier: "bai", route: "via B.AI" });
-        if (orOk) reachableCarriers.push({ carrier: "openrouter", route: "via OpenRouter" });
-        if (reachableCarriers.length === 0) continue;
-        if (reachableCarriers.length === 1) {
-          // Only one carrier serves this model · use the bare modelV
-          // id and `carrier: null` so the saved agent record uses
-          // default routing rather than a sticky pin to a carrier the
-          // user might later swap.
-          const only = reachableCarriers[0];
-          out.push({
-            id: m.modelV,
-            v: m.modelV,
-            carrier: null,
-            name: m.displayName,
-            provider,
-            deck: m.deck || "",
-            route: only.carrier === m.provider ? "direct" : only.route,
-          });
-          continue;
-        }
-        // Multi-carrier · one row per carrier · composite id
-        // `${modelV}@${carrier}` distinguishes them in the picker.
-        for (const { carrier, route } of reachableCarriers) {
-          out.push({
-            id: m.modelV + "@" + carrier,
-            v: m.modelV,
-            carrier,
-            name: m.displayName,
-            provider,
-            deck: m.deck || "",
-            route,
-          });
-        }
-      }
-      if (out.length > 0) return out;
+      return cache.reachable.map((m) => ({
+        id: m.modelV,
+        v: m.modelV,
+        carrier: null,
+        name: m.displayName,
+        provider: providerLabel(m.provider),
+        deck: m.deck || "",
+        route: "",
+      }));
     }
-    return PROFILE_MODELS.map((m) => ({ ...m, id: m.v, carrier: null, route: "" }));
+    // Cache not yet loaded · return an empty list. The renderer will
+    // show whatever stale info the agent's saved modelV resolves to
+    // and re-fetch the cache. We deliberately AVOID falling back to
+    // the hardcoded PROFILE_MODELS catalog here — that would surface
+    // models the user's credential can't reach (e.g. showing Claude
+    // when the active credential is OpenAI direct).
+    return [];
   }
 
   /** Look up a single entry by composite id (`${v}@${carrier}` or
@@ -3092,7 +3060,14 @@
    *  to the provider's billing/pricing page so the user is one click
    *  from resolving it. */
   function openVoicePaidOverlay(opts) {
-    closeVoicePaidOverlay();
+    // Idempotent · if an overlay is already showing, leave it alone.
+    // Repeated billing-error events (each director's failed TTS in a
+    // single round; replay + live-room hitting the same backend tag)
+    // would otherwise tear down + rebuild the DOM on every call,
+    // producing a visible "flash" as the panel reappears. The user
+    // only needs to see the upgrade prompt ONCE — every subsequent
+    // identical error is the same actionable item.
+    if (document.getElementById("ap-voice-paid-overlay")) return;
     const provider = (opts && opts.provider) || "";
     const upgradeUrl = (opts && opts.upgradeUrl) || "";
     const message = (opts && opts.message) || "";
@@ -4759,6 +4734,11 @@
    *  events from whichever copy is live. */
   window.AgentProfileVoice = {
     renderVoiceBlock,
+    // Public hook so the room SSE handler + voice-replay can open
+    // the same upgrade overlay when a TTS billing error fires
+    // mid-room (insufficient balance / paid plan required) instead
+    // of only when the user is on the agent-profile voice picker.
+    openPaidOverlay: openVoicePaidOverlay,
   };
 
   document.addEventListener("boardroom:locale", () => {

package/public/app-updater.css

@@ -0,0 +1,318 @@
+/* ─────────────── App auto-update overlay ───────────────
+   Consent-driven update flow for the Electron build. Three
+   states: prompt (new version available) → downloading
+   (progress bar) → ready (restart). Wired from
+   public/app-updater.js against window.privateboard.updater.
+
+   Chrome (classification strip · lime corner brackets ·
+   topbar · dashed-rule foot) mirrors voice-onboarding.css
+   so the overlay reads as native to the rest of the app's
+   modal vocabulary. */
+
+.upd-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.78);
+  -webkit-backdrop-filter: blur(4px);
+  backdrop-filter: blur(4px);
+  z-index: 9500;
+  display: none;
+  align-items: center;
+  justify-content: center;
+  padding: 24px;
+  overflow: hidden;
+  font-family: var(--mono, "Inter", system-ui, sans-serif);
+}
+.upd-overlay.open {
+  display: flex;
+  animation: upd-fade 0.14s ease-out;
+}
+@keyframes upd-fade { from { opacity: 0; } to { opacity: 1; } }
+
+.upd-backdrop {
+  position: absolute;
+  inset: 0;
+}
+
+.upd-modal {
+  position: relative;
+  width: 100%;
+  max-width: 480px;
+  background: var(--panel);
+  border: 0.5px solid var(--line-strong);
+  color: var(--text);
+  animation: upd-rise 0.18s ease-out;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+}
+@keyframes upd-rise {
+  from { transform: translateY(10px); opacity: 0; }
+  to   { transform: translateY(0);    opacity: 1; }
+}
+/* Lime corner brackets · same vocabulary as the vonb overlay. */
+.upd-modal::before, .upd-modal::after {
+  content: "";
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border: 1.5px solid var(--lime);
+  pointer-events: none;
+}
+.upd-modal::before { top: -1px;    left: -1px;  border-right: none; border-bottom: none; }
+.upd-modal::after  { bottom: -1px; right: -1px; border-left: none;  border-top: none; }
+
+/* ─── Classification strip ─── */
+.upd-classification {
+  background: var(--panel-2);
+  border-bottom: 0.5px solid var(--line-bright);
+  padding: 5px 14px;
+  font-size: 8px;
+  letter-spacing: 0.22em;
+  text-transform: uppercase;
+  color: var(--lime);
+  font-weight: 700;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.upd-classification .dot { display: inline-block; margin-right: 4px; }
+.upd-classification .right {
+  color: var(--text-faint);
+  letter-spacing: 0.12em;
+}
+
+/* ─── Topbar · meta + title + close ─── */
+.upd-head {
+  display: grid;
+  grid-template-columns: 1fr auto;
+  gap: 12px;
+  align-items: start;
+  padding: 14px 16px 12px;
+  border-bottom: 0.5px dashed var(--line-bright);
+}
+.upd-head-text { min-width: 0; }
+.upd-head .meta {
+  font-family: var(--mono);
+  font-size: 9px;
+  color: var(--text-dim);
+  text-transform: uppercase;
+  letter-spacing: 0.18em;
+  margin-bottom: 4px;
+  font-weight: 700;
+  display: flex;
+  gap: 6px;
+  align-items: center;
+}
+.upd-head .meta .live {
+  color: var(--lime);
+  font-weight: 700;
+}
+.upd-head .meta .live::before {
+  content: "● ";
+  animation: upd-pulse 1.6s ease-in-out infinite;
+}
+@keyframes upd-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }
+.upd-head .title {
+  font-size: 16px;
+  font-weight: 700;
+  color: var(--text);
+  letter-spacing: -0.01em;
+  line-height: 1.3;
+  font-family: var(--font-human, system-ui, sans-serif);
+}
+.upd-head .title::before {
+  content: "▸ ";
+  color: var(--lime);
+  font-family: var(--mono);
+}
+.upd-head .close-btn {
+  width: 24px; height: 24px;
+  background: transparent;
+  border: 0.5px solid var(--line-bright);
+  color: var(--text-dim);
+  font-size: 12px;
+  cursor: pointer;
+  font-family: var(--mono);
+  border-radius: 3px;
+  transition: color 0.12s, border-color 0.12s;
+}
+.upd-head .close-btn:hover {
+  border-color: var(--lime);
+  color: var(--lime);
+}
+
+/* ─── Body ─── */
+.upd-body {
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+
+/* Version block · "v0.1.22 → v0.1.23" treatment. */
+.upd-version {
+  display: flex;
+  align-items: baseline;
+  gap: 10px;
+  font-family: var(--mono);
+  font-size: 12px;
+  color: var(--text-dim);
+}
+.upd-version .from { color: var(--text-faint); text-decoration: line-through; }
+.upd-version .arrow { color: var(--lime); }
+.upd-version .to {
+  color: var(--lime);
+  font-weight: 700;
+  letter-spacing: 0.02em;
+  font-size: 16px;
+}
+
+.upd-deck {
+  font-family: var(--font-human, system-ui, sans-serif);
+  font-size: 13px;
+  line-height: 1.55;
+  color: var(--text-soft);
+  margin: 0;
+}
+
+/* ─── Progress block (downloading state) ─── */
+.upd-progress-card {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 14px;
+  border: 0.5px solid var(--line);
+  background: var(--panel-2);
+}
+.upd-progress-head {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
+  font-family: var(--mono);
+}
+.upd-progress-pct {
+  font-size: 22px;
+  font-weight: 700;
+  color: var(--lime);
+  letter-spacing: -0.01em;
+}
+.upd-progress-rate {
+  font-size: 10px;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+  color: var(--text-faint);
+}
+.upd-progress-bar {
+  height: 4px;
+  background: var(--bg);
+  border: 0.5px solid var(--line);
+  overflow: hidden;
+}
+.upd-progress-bar > span {
+  display: block;
+  height: 100%;
+  background: var(--lime);
+  transition: width 0.3s ease-out;
+  width: 0%;
+}
+/* Indeterminate sweep · before the first download-progress event
+   lands (the .pkg is being negotiated). */
+.upd-progress-bar.indeterminate > span {
+  width: 30%;
+  animation: upd-sweep 1.2s ease-in-out infinite;
+}
+@keyframes upd-sweep {
+  0%   { transform: translateX(-100%); }
+  100% { transform: translateX(333%); }
+}
+.upd-progress-bytes {
+  font-family: var(--mono);
+  font-size: 10px;
+  color: var(--text-dim);
+  letter-spacing: 0.08em;
+}
+
+/* ─── Error block ─── */
+.upd-error {
+  font-family: var(--mono);
+  font-size: 11px;
+  line-height: 1.5;
+  color: var(--red, #B5706A);
+  padding: 12px;
+  border: 0.5px solid var(--red, #B5706A);
+  background: rgba(181, 112, 106, 0.06);
+}
+
+/* ─── Foot · CTAs ─── */
+.upd-foot {
+  padding: 12px 16px 16px;
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  gap: 10px;
+  border-top: 0.5px dashed var(--line-bright);
+}
+.upd-btn {
+  padding: 8px 18px;
+  background: transparent;
+  border: 0.5px solid var(--line-bright);
+  color: var(--text-soft);
+  font-family: var(--mono);
+  font-size: 11px;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+  cursor: pointer;
+  transition: color 0.12s, border-color 0.12s, background 0.12s, filter 0.12s;
+}
+.upd-btn:hover {
+  border-color: var(--lime);
+  color: var(--lime);
+}
+.upd-btn.primary {
+  background: var(--lime);
+  border-color: var(--lime);
+  color: var(--bg);
+  font-weight: 700;
+}
+.upd-btn.primary:hover {
+  filter: brightness(1.06);
+  color: var(--bg);
+}
+.upd-btn[disabled] {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+.upd-btn[disabled]:hover {
+  border-color: var(--line-bright);
+  color: var(--text-soft);
+  filter: none;
+}
+
+/* State-driven visibility. The overlay carries one of
+   `state-available` / `state-downloading` / `state-ready` /
+   `state-error` and the modal swaps which subtree is shown. */
+.upd-modal .upd-state { display: none; }
+.upd-overlay.state-available   .upd-modal .upd-state-available   { display: flex; flex-direction: column; gap: 14px; }
+.upd-overlay.state-downloading .upd-modal .upd-state-downloading { display: flex; flex-direction: column; gap: 14px; }
+.upd-overlay.state-ready       .upd-modal .upd-state-ready       { display: flex; flex-direction: column; gap: 14px; }
+.upd-overlay.state-error       .upd-modal .upd-state-error       { display: flex; flex-direction: column; gap: 14px; }
+
+/* Buttons swap per state too. */
+.upd-modal .upd-foot-state { display: none; }
+.upd-overlay.state-available   .upd-foot-state-available   { display: contents; }
+.upd-overlay.state-downloading .upd-foot-state-downloading { display: contents; }
+.upd-overlay.state-ready       .upd-foot-state-ready       { display: contents; }
+.upd-overlay.state-error       .upd-foot-state-error       { display: contents; }
+
+/* Body scroll lock while overlay open. */
+body.upd-locked {
+  overflow: hidden;
+}
+
+@media (max-width: 560px) {
+  .upd-overlay { padding: 14px; }
+  .upd-head    { padding: 12px 14px; }
+  .upd-body    { padding: 14px; }
+}

package/public/app-updater.js

@@ -0,0 +1,247 @@
+/* ─────────────── App auto-update controller ───────────────
+   Renderer side of the Electron auto-updater flow. The
+   main process (electron/main.ts) pushes every state
+   transition over the `updater:state` IPC channel; the
+   preload bridge surfaces it as
+   `window.privateboard.updater.{onState,getState,…}`.
+
+   Lifecycle:
+     1. On script load (browser fallback or pre-Electron build),
+        the IPC bridge is absent · we no-op.
+     2. In Electron, we `getState()` to rehydrate (covers refresh
+        / devtools reload that lands after `update-available`
+        already fired) and subscribe via `onState`.
+     3. On every non-idle state, the overlay opens (or stays
+        open) and paints the matching subtree. The user's
+        "Later"/"Hide" button only closes the modal — it does
+        NOT cancel the download; clicking the dock icon or
+        waiting for the next 4-hour re-check re-opens it.
+*/
+
+(function () {
+  "use strict";
+
+  const bridge = (typeof window !== "undefined" && window.privateboard && window.privateboard.updater) || null;
+  if (!bridge) return; // Browser preview / non-Electron build · do nothing.
+
+  let overlayEl = null;
+  let lastState = null;
+  let userDismissed = false; // Cleared whenever a NEW state arrives.
+  let appVersion = ""; // Resolved once via window.privateboard.getAppVersion().
+
+  function $(sel, root) { return (root || document).querySelector(sel); }
+
+  function applyI18n() {
+    if (!overlayEl) return;
+    const I18n = window.I18n;
+    overlayEl.querySelectorAll("[data-i18n]").forEach((el) => {
+      const key = el.getAttribute("data-i18n");
+      if (!key) return;
+      let val = null;
+      if (I18n && typeof I18n.t === "function") {
+        val = I18n.t(key);
+        if (val === key) val = null;
+      }
+      if (val) el.textContent = val;
+    });
+  }
+
+  function fmtBytes(n) {
+    if (!Number.isFinite(n) || n <= 0) return "0 MB";
+    const mb = n / (1024 * 1024);
+    if (mb < 10) return mb.toFixed(1) + " MB";
+    return Math.round(mb) + " MB";
+  }
+  function fmtRate(bps) {
+    if (!Number.isFinite(bps) || bps <= 0) return "—";
+    const mb = bps / (1024 * 1024);
+    if (mb >= 1) return mb.toFixed(1) + " MB/s";
+    const kb = bps / 1024;
+    return Math.max(1, Math.round(kb)) + " KB/s";
+  }
+
+  function currentVersion() {
+    // Resolved lazily at init via `window.privateboard.getAppVersion()`.
+    // If the IPC roundtrip hasn't landed yet (race against the first
+    // `update-available` event), the version delta degrades to just
+    // "→ v0.1.23" until the next state event re-paints.
+    return appVersion;
+  }
+
+  function setStateClass(kind) {
+    if (!overlayEl) return;
+    overlayEl.classList.remove(
+      "state-available",
+      "state-downloading",
+      "state-ready",
+      "state-error",
+    );
+    if (kind === "available" || kind === "downloading" || kind === "ready" || kind === "error") {
+      overlayEl.classList.add("state-" + kind);
+    }
+  }
+
+  function openModal() {
+    if (!overlayEl) return;
+    if (overlayEl.classList.contains("open")) return;
+    overlayEl.classList.add("open");
+    overlayEl.setAttribute("aria-hidden", "false");
+    document.body.classList.add("upd-locked");
+  }
+  function closeModal() {
+    if (!overlayEl) return;
+    overlayEl.classList.remove("open");
+    overlayEl.setAttribute("aria-hidden", "true");
+    document.body.classList.remove("upd-locked");
+  }
+
+  function paint(state) {
+    if (!overlayEl || !state) return;
+    const from = currentVersion();
+    const to = state.version ? ("v" + state.version) : "";
+    overlayEl.querySelectorAll("[data-upd-from-version], [data-upd-from-version-d], [data-upd-from-version-r]").forEach((el) => {
+      el.textContent = from ? ("v" + from.replace(/^v/, "")) : "";
+      el.style.display = from ? "" : "none";
+    });
+    overlayEl.querySelectorAll("[data-upd-to-version], [data-upd-to-version-d], [data-upd-to-version-r]").forEach((el) => {
+      el.textContent = to;
+    });
+
+    if (state.kind === "downloading") {
+      const pct = Math.max(0, Math.min(100, Math.round(state.percent || 0)));
+      const pctEl = $("[data-upd-pct]", overlayEl);
+      if (pctEl) pctEl.textContent = pct + "%";
+      const bar = $("[data-upd-bar]", overlayEl);
+      if (bar) {
+        bar.classList.remove("indeterminate");
+        const span = bar.querySelector("span");
+        if (span) span.style.width = pct + "%";
+      }
+      const bytes = $("[data-upd-bytes]", overlayEl);
+      if (bytes) {
+        bytes.textContent = fmtBytes(state.transferred) + " / " + fmtBytes(state.total);
+      }
+      const rate = $("[data-upd-rate]", overlayEl);
+      if (rate) rate.textContent = fmtRate(state.bytesPerSecond);
+    }
+
+    if (state.kind === "error") {
+      const errEl = $("[data-upd-error-message]", overlayEl);
+      if (errEl) errEl.textContent = state.message || "—";
+    }
+
+    setStateClass(state.kind);
+  }
+
+  function shouldAutoOpenFor(state) {
+    if (!state) return false;
+    if (state.kind === "available") return true;   // First prompt on launch.
+    if (state.kind === "ready") return true;       // Always surface the restart prompt.
+    if (state.kind === "downloading") return false; // User asked to hide · don't pop it back.
+    if (state.kind === "error") return false;       // Errors don't steal focus.
+    return false;
+  }
+
+  function applyState(state) {
+    if (!state || state.kind === "idle") {
+      // Idle (no update / cleared) · keep modal closed.
+      lastState = state || { kind: "idle" };
+      return;
+    }
+    const isNewKind = !lastState || lastState.kind !== state.kind;
+    if (isNewKind) userDismissed = false; // A new transition re-prompts.
+    lastState = state;
+    paint(state);
+    if (overlayEl.classList.contains("open")) {
+      // Already open — repaint in place; downloading→ready transitions
+      // flow without the modal flickering.
+      return;
+    }
+    if (!userDismissed && shouldAutoOpenFor(state)) openModal();
+  }
+
+  function wireEvents() {
+    overlayEl.addEventListener("click", (e) => {
+      const close = e.target.closest("[data-upd-close], [data-upd-dismiss]");
+      if (close) {
+        e.preventDefault();
+        userDismissed = true;
+        closeModal();
+        bridge.dismiss();
+        return;
+      }
+      const dl = e.target.closest("[data-upd-download]");
+      if (dl) {
+        e.preventDefault();
+        // Optimistic switch to the downloading state so the user sees
+        // the progress card immediately; the first real
+        // `download-progress` event will replace the indeterminate
+        // sweep with a percentage.
+        const v = (lastState && lastState.kind === "available") ? lastState.version : "";
+        applyState({ kind: "downloading", version: v, percent: 0, transferred: 0, total: 0, bytesPerSecond: 0 });
+        const bar = $("[data-upd-bar]", overlayEl);
+        if (bar) bar.classList.add("indeterminate");
+        bridge.startDownload();
+        return;
+      }
+      const inst = e.target.closest("[data-upd-install]");
+      if (inst) {
+        e.preventDefault();
+        // Disable the button to prevent a double-click between the
+        // IPC roundtrip and the actual app quit.
+        inst.setAttribute("disabled", "true");
+        bridge.installNow();
+        return;
+      }
+    });
+    document.addEventListener("keydown", (e) => {
+      if (!overlayEl.classList.contains("open")) return;
+      if (e.key !== "Escape") return;
+      // Escape never installs · only dismisses. During a download or
+      // ready state, this is the same as the "Hide"/"Later" button.
+      e.preventDefault();
+      userDismissed = true;
+      closeModal();
+      bridge.dismiss();
+    });
+    document.addEventListener("boardroom:locale", applyI18n);
+  }
+
+  function init() {
+    overlayEl = document.getElementById("upd-overlay");
+    if (!overlayEl) return;
+    applyI18n();
+    wireEvents();
+    // Dev preview · expose state injection so the modal can be auditioned
+    // without a packaged build + real GitHub release. From devtools:
+    //   __updaterDev.show({ kind: "available", version: "0.1.99" })
+    //   __updaterDev.show({ kind: "downloading", version: "0.1.99",
+    //                       percent: 42, transferred: 5_300_000,
+    //                       total: 12_500_000, bytesPerSecond: 850_000 })
+    //   __updaterDev.show({ kind: "ready", version: "0.1.99" })
+    //   __updaterDev.show({ kind: "error", message: "Could not connect" })
+    //   __updaterDev.close()
+    window.__updaterDev = {
+      show: (s) => { userDismissed = false; applyState(s); openModal(); },
+      close: () => { userDismissed = false; closeModal(); },
+    };
+    // Resolve the app version once · used for the "v_old → v_new"
+    // version delta in the modal header.
+    if (typeof window.privateboard.getAppVersion === "function") {
+      window.privateboard.getAppVersion().then((v) => {
+        appVersion = v || "";
+        if (lastState && lastState.kind !== "idle") paint(lastState);
+      }).catch(() => {});
+    }
+    bridge.onState((s) => applyState(s));
+    // Re-hydrate · covers the case where update-available already
+    // fired before this script's defer-run completed.
+    bridge.getState().then((s) => { if (s) applyState(s); }).catch(() => {});
+  }
+
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", init);
+  } else {
+    init();
+  }
+})();