@lifeaitools/clauth 2.1.1 → 2.10.0

package/cli/dashboard/dashboard.js

@@ -0,0 +1,592 @@
+const BASE = location.origin;
+(function reportOrigin() {
+  const isLocal = /^(127\.0\.0\.1|localhost|\[::1\])$/.test(location.hostname);
+  const el = document.getElementById("originFooter");
+  if (el) el.textContent = (isLocal ? "LOCAL" : "REMOTE") + " · " + BASE + " · 10-strike lockout";
+})();
+
+// SERVICE_HINTS moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// KEY_URLS moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// Extra links shown below the primary KEY_URLS link
+// EXTRA_LINKS moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── OAuth import config ─────────────────────
+// Services where Google downloads a JSON file. jsonFields = keys to extract
+// from the downloaded JSON (top-level or under an "installed"/"web" wrapper).
+// extra = additional fields the user must provide separately.
+// OAUTH_IMPORT moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// serviceDomId moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+function htmlEscape(value) {
+  return String(value ?? "")
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;")
+    .replace(/'/g, "&#39;");
+}
+
+// Produces a JS string literal safe to embed inside a DOUBLE-QUOTED HTML
+// attribute, e.g. onclick="fn(<jsArg(x)>)".
+//
+// JSON.stringify wraps its result in double quotes. Interpolated into
+// onclick="..." that quote CLOSES the attribute at the first character of the
+// argument, so the browser parsed
+//   onclick="selectSupervisorSurface("rdc-skills:local","…")"
+// as onclick="selectSupervisorSurface(" followed by garbage. Every surface
+// card's click handler and every command button was dead HTML — the source
+// read correctly and nothing on the page responded, which is precisely how it
+// was reported. The ampersand escape below then made it worse by rewriting any
+// pre-existing entity that might otherwise have saved it.
+//
+// Escaping the quote as &quot; is what makes it attribute-safe: the HTML parser
+// decodes the entity back to a plain double quote before the JS is compiled, so
+// the handler sees a normal string literal. Order matters: the ampersand must be
+// escaped before the quote, or the entity's own ampersand is double-escaped.
+function jsArg(value) {
+  return JSON.stringify(String(value ?? ""))
+    .replace(/&/g, "\u0026")
+    .replace(/</g, "\u003c")
+    .replace(/>/g, "\u003e")
+    .replace(/'/g, "\u0027")
+    .replace(/"/g, "&quot;");
+}
+
+// renderSetPanel moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Boot: check lock state ──────────────────
+// Injected by the daemon when it serves the page on an unlocked vault, so a
+// fresh load (incl. when auto-unlocked via --pw/boot.key) is write-ready.
+let writeToken = window.__CLAUTH_INIT_WRITE_TOKEN__;
+
+function writeHeaders(extra) {
+  if (!writeToken) throw new Error("Writes are locked — click 🔓 Unlock Writes to enable saving.");
+  return { ...(extra || {}), "X-Clauth-Write-Token": writeToken };
+}
+
+// ── Write-access choke point ────────────────
+// ONE mechanism sits in front of every write action.
+//
+// A button on this dashboard IS the human being present — they are past the
+// lock screen already. So a click must never demand a second password. Before
+// each action the page silently acquires a current write token from
+// POST /write-token, which succeeds whenever the vault is unlocked. The
+// password modal is the LOCKED-VAULT fallback only, and the common case never
+// reaches it.
+//
+// Acquiring per action (rather than trusting the token injected at page load)
+// is what makes staleness structurally impossible: the server session has a
+// 10-minute TTL while a dashboard tab can stay open for hours. That gap is the
+// actual defect behind "adding a service says I need write unlock" — the page
+// kept sending a token the daemon had already expired, and writeGuard answered
+// 403 "write token required". One loopback round-trip per click closes it.
+//
+// If the vault really is locked, the action is parked, the modal opens, and a
+// successful unlock re-fires it exactly once. Cancelling clears the park, so no
+// delayed write can fire later.
+//
+// writeHeaders() above still throws, but only as a backstop for a write path
+// that never went through here — WRITE_ACTIONS is asserted complete against
+// every writeHeaders() call site by cli/supervisor-ui.test.js.
+let pendingWriteAction = null;
+
+// Returns true when writeToken now holds a token the daemon will accept.
+// False means the vault is genuinely locked (or the daemon is unreachable),
+// which is the only case that deserves a password prompt.
+async function ensureWriteAccess() {
+  try {
+    const r = await fetch(BASE + "/write-token", { method: "POST" }).then(res => res.json());
+    if (r && r.write_token) {
+      writeToken = r.write_token;
+      refreshWriteLockUi();
+      return true;
+    }
+  } catch {}
+  return false;
+}
+
+// Every dashboard function whose body calls writeHeaders(). Adding a write
+// action without adding it here fails the registry-completeness test.
+const WRITE_ACTIONS = [
+  "rescanSupervisorPlugins",
+  "restartDaemon",
+  "runSupervisorSurface",
+  "rotateKey",
+  "setExpiry",
+  "saveCardEdit",
+  "deleteService",
+  "saveKey",
+  "toggleService",
+  "changePassword",
+  "addService",
+  "enrollMachine",
+  "submitMount",
+  "deleteMount",
+  "wizSubmitCfToken",
+];
+
+function withWriteAccess(name, fn) {
+  // async, so every path returns a thenable — a caller doing action(x).catch(…)
+  // must not TypeError on the no-write-access path only.
+  const guarded = async function (...args) {
+    if (!(await ensureWriteAccess())) {
+      // Vault is locked. Park the WHOLE call — nothing has run yet, so a
+      // confirm() inside the action is asked once, on the retry, rather than
+      // before a no-op.
+      pendingWriteAction = { name, fn, self: this, args };
+      openWriteUnlockModal();
+      return undefined;
+    }
+    return fn.apply(this, args);
+  };
+  guarded.__writeGuarded = true;
+  guarded.__unguarded = fn;
+  return guarded;
+}
+
+function clearPendingWriteAction() { pendingWriteAction = null; }
+
+// Read-only seams so tests (and the console) can observe park state without
+// reaching into a module-scoped binding.
+function hasPendingWriteAction() { return pendingWriteAction !== null; }
+function pendingWriteActionName() { return pendingWriteAction ? pendingWriteAction.name : null; }
+
+function takePendingWriteAction() {
+  const pending = pendingWriteAction;
+  pendingWriteAction = null;
+  return pending;
+}
+
+function installWriteAccessGuards(scope) {
+  for (const name of WRITE_ACTIONS) {
+    const fn = scope[name];
+    if (typeof fn === "function" && fn.__writeGuarded) continue;
+    if (typeof fn !== "function") {
+      // Fail loud, not silent. A registered name that is not a global function
+      // is almost always a write action refactored from a function declaration
+      // to a const/arrow binding: const/let create no global property, so
+      // scope[name] is undefined, the guard would no-op, and the inline
+      // onclick="" would resolve through the lexical binding straight to the
+      // UNGUARDED function — silently restoring the write-lock defect for that
+      // action. Skipping it here is how that regression would ship green.
+      throw new Error(
+        "clauth write-guard install failed: '" + name + "' is registered in WRITE_ACTIONS but is not a " +
+        "global function. Declare it as 'function " + name + "(...)' — a const/let/arrow binding cannot be guarded."
+      );
+    }
+    scope[name] = withWriteAccess(name, fn);
+  }
+}
+
+// Safe to run here: every dashboard function is a top-level function
+// declaration, so all of them are hoisted and initialised before this
+// statement executes. Inline onclick="" handlers resolve through the same
+// global properties, so they get the guarded versions.
+installWriteAccessGuards(typeof window !== "undefined" ? window : globalThis);
+
+async function boot() {
+  try {
+    const ping = await fetch(BASE + "/ping").then(r => r.json());
+    if (ping.locked) {
+      showLockScreen(ping.hard_locked);
+    } else {
+      showMain(ping);
+    }
+  } catch {
+    showLockScreen(false);
+  }
+}
+
+function showLockScreen(hardLocked) {
+  document.getElementById("lock-screen").style.display = "flex";
+  document.getElementById("main-view").style.display = "none";
+  const input = document.getElementById("lock-input");
+  const btn   = document.getElementById("unlock-btn");
+  const sub   = document.getElementById("lock-sub");
+  const err   = document.getElementById("lock-err");
+  if (hardLocked) {
+    input.disabled = true;
+    btn.disabled = true;
+    sub.textContent = "Too many failed attempts";
+    err.textContent = "✗ Vault locked — restart daemon to try again";
+  } else {
+    input.disabled = false;
+    btn.disabled = false;
+    sub.textContent = "Paste your password to unlock";
+    err.textContent = "";
+    setTimeout(() => input.focus(), 50);
+  }
+}
+
+// ── Upgrade detection ────────────────────────────────────────────
+function checkUpgrade(ping) {
+  const currentVersion = ping.app_version || ping.version;
+  if (!currentVersion) return;
+
+  const lastVersion = localStorage.getItem('clauth_last_version');
+
+  if (lastVersion && lastVersion !== currentVersion) {
+    // Version changed — show upgrade banner
+    document.getElementById('upgrade-to-version').textContent = currentVersion;
+
+    // Build details from migration result if available
+    let details = '';
+    if (ping.last_migrations?.applied?.length > 0) {
+      details = '· Migrations: ' + ping.last_migrations.applied.map(m => m.description).join(' · ');
+    }
+    // Show breaking migration warning if any pending
+    if (ping.pending_breaking?.length > 0) {
+      details += ' ⚠ Breaking migrations require confirmation — see below.';
+    }
+    document.getElementById('upgrade-details').textContent = details;
+    document.getElementById('upgrade-banner').style.display = 'block';
+  }
+
+  // Always update stored version
+  localStorage.setItem('clauth_last_version', currentVersion);
+}
+
+function dismissUpgrade() {
+  document.getElementById('upgrade-banner').style.display = 'none';
+}
+
+function showMain(ping) {
+  checkUpgrade(ping);
+  document.getElementById("lock-screen").style.display = "none";
+  document.getElementById("main-view").style.display = "block";
+  // Reset lock screen state for next lock
+  document.getElementById("lock-input").disabled = false;
+  document.getElementById("unlock-btn").disabled = false;
+  document.getElementById("lock-sub").textContent = "Paste your password to unlock";
+  document.getElementById("lock-err").textContent = "";
+  if (ping) {
+    document.getElementById("s-pid").textContent = ping.pid || "—";
+    document.getElementById("s-fails").textContent =
+      ping.failures + "/" + (ping.failures + ping.failures_remaining);
+  }
+  window.ClauthPanelRegistry.mountAll();
+  refreshWriteLockUi();
+}
+
+// Surfaces/Supervisor panel moved to ./panels/surfaces-panel.js (panel-componentization, sixth slice).
+
+// ── Unlock ──────────────────────────────────
+async function unlock() {
+  const input = document.getElementById("lock-input");
+  const btn   = document.getElementById("unlock-btn");
+  const err   = document.getElementById("lock-err");
+  const sub   = document.getElementById("lock-sub");
+  const pw    = input.value;
+
+  if (input.disabled) return;
+  if (!pw) { err.textContent = "Password is required."; return; }
+
+  btn.disabled = true; btn.textContent = "Verifying…"; err.textContent = "";
+
+  try {
+    const r = await fetch(BASE + "/auth", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ password: pw })
+    }).then(r => r.json());
+
+    if (r.hard_locked) {
+      input.value = "";
+      input.disabled = true;
+      btn.disabled = true;
+      btn.textContent = "Unlock";
+      if (r.terminal) {
+        // Server rendered a terminal verdict (invalid_token / machine_locked).
+        // Show the reason — this is the one-line signal that diagnoses the lockout.
+        sub.textContent = r.reason ? ("Vault rejected: " + r.reason) : "Vault rejected credentials";
+        err.textContent = "✗ Recovery required — unlock machine + re-seal boot.key (see runbook)";
+      } else {
+        sub.textContent = "Too many failed attempts";
+        err.textContent = r.reason
+          ? ("✗ Vault locked (" + r.reason + ") — restart daemon to try again")
+          : "✗ Vault locked — restart daemon to try again";
+      }
+      return;
+    }
+
+    if (r.transport_error || r.backend_error) {
+      // Backend/database outage — NOT a wrong password. Show the specific reason
+      // the daemon classified (timeout / db_error / rate_limited / network) so the
+      // user knows it's the backend, not their credentials. No attempt was spent.
+      err.textContent = "⚠ " + (r.error || "Vault backend unreachable — try again in a moment");
+      err.style.color = "#facc15";
+      btn.disabled = false; btn.textContent = "Unlock";
+      return;
+    }
+
+    if (r.error) {
+      const rem = r.failures_remaining !== undefined
+        ? ` (${r.failures_remaining} attempt${r.failures_remaining !== 1 ? "s" : ""} remaining)`
+        : "";
+      throw new Error(r.error + rem);
+    }
+
+    writeToken = r.write_token || null;
+    // Full-vault unlock is a fresh page state, not a retry of a parked write.
+    // Kept symmetric with unlockWrites() so no path can carry a stale park.
+    clearPendingWriteAction();
+    input.value = "";
+    const ping = await fetch(BASE + "/ping").then(r => r.json());
+    showMain(ping);
+    document.querySelector("clauth-services-panel")?.loadServices();
+  } catch (e) {
+    input.value = "";
+    input.className = "lock-input error";
+    err.textContent = "✗ " + (e.message || "Invalid password");
+    setTimeout(() => input.className = "lock-input", 600);
+  } finally {
+    if (!input.disabled) { btn.disabled = false; btn.textContent = "Unlock"; }
+  }
+}
+
+// ── Lock ────────────────────────────────────
+// lockVault moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+// ── Unlock writes (re-establish write scope without locking) ──
+// Needed when the daemon auto-unlocks via --pw/boot.key: the page never sees the
+// unlock screen, so it holds no write token. POST /auth mints one (10-min TTL).
+// unlockWrites moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+function openWriteUnlockModal() {
+  const overlay = document.getElementById("write-unlock-overlay");
+  const input = document.getElementById("write-unlock-input");
+  const err = document.getElementById("write-unlock-err");
+  if (err) err.textContent = "";
+  if (input) { input.value = ""; input.className = "lock-input"; }
+  if (overlay) overlay.style.display = "flex";
+  if (input) setTimeout(() => input.focus(), 50);
+}
+
+function closeWriteUnlockModal() {
+  // Dismissing the modal must disarm the parked write. submitWriteUnlock()
+  // takes the park before it calls this, so a successful unlock still retries.
+  clearPendingWriteAction();
+  const overlay = document.getElementById("write-unlock-overlay");
+  if (overlay) overlay.style.display = "none";
+}
+
+async function submitWriteUnlock() {
+  const input = document.getElementById("write-unlock-input");
+  const btn = document.getElementById("write-unlock-btn");
+  const err = document.getElementById("write-unlock-err");
+  const pw = input ? input.value : "";
+  if (!pw) { if (err) err.textContent = "Password is required."; return; }
+  if (btn) { btn.disabled = true; btn.textContent = "Verifying..."; }
+  try {
+    const r = await fetch(BASE + "/auth", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ password: pw }),
+    }).then(r => r.json());
+    if (r.error) {
+      if (input) { input.className = "lock-input error"; setTimeout(() => input.className = "lock-input", 600); }
+      if (err) err.textContent = "Invalid: " + (r.error || "Invalid password");
+      return;
+    }
+    writeToken = r.write_token || null;
+    // Take the park BEFORE closing — closeWriteUnlockModal() clears it.
+    const pending = takePendingWriteAction();
+    refreshWriteLockUi();
+    closeWriteUnlockModal();
+    if (pending && writeToken) {
+      // Re-fire the ORIGINAL unguarded action, exactly once. Using the
+      // unguarded reference means it can never re-park itself into a loop.
+      try {
+        await pending.fn.apply(pending.self, pending.args);
+      } catch (retryErr) {
+        console.error("[clauth] write action '" + pending.name + "' failed after unlock:", retryErr);
+      }
+    }
+  } catch (e) {
+    if (err) err.textContent = "Unlock error: " + (e.message || e);
+  } finally {
+    if (btn) { btn.disabled = false; btn.textContent = "Unlock Writes"; }
+  }
+}
+
+// Reflect write-lock state on the button so it is obvious when a save will fail.
+// #unlock-writes-btn now lives inside <clauth-toolbar-panel>'s own shadow
+// root -- document.getElementById can never cross a shadow boundary, so this
+// delegates to the panel's own public method instead of reaching into raw
+// DOM, same fix as tunnel-panel.js's updateHealthCheckResult().
+function refreshWriteLockUi() {
+  const panel = document.querySelector("clauth-toolbar-panel");
+  panel?.refreshWriteLockButton(!!writeToken);
+}
+
+// ── Make Live (blue-green: promote staged instance to live port) ──
+async function makeLive() {
+  if (!confirm("Promote this staged instance to live?\n\nThe current live daemon (port 52437) will be stopped and this instance will restart on port 52437.")) return;
+  const banner = document.getElementById("staged-banner");
+  if (banner) banner.innerHTML = '<div style="color:#fef3c7"><strong>⏳ Promoting to live...</strong></div>';
+  try {
+    const resp = await fetch(BASE + "/make-live", { method: "POST" });
+    const data = await resp.json();
+    if (data.ok) {
+      document.getElementById("main-view").innerHTML = '<div style="text-align:center;padding:80px 20px"><div style="font-size:3rem;margin-bottom:16px">✅</div><div style="font-size:1.1rem;color:#4ade80">Promoted to live!</div><div style="font-size:.85rem;color:#94a3b8;margin-top:8px">Restarting on port 52437... page will reload in 5 seconds.</div></div>';
+      setTimeout(() => { window.location.href = "http://127.0.0.1:" + 52437; }, 5000);
+    } else {
+      if (banner) banner.innerHTML = '<div style="color:#fca5a5"><strong>❌ Promotion failed:</strong> ' + (data.error || 'unknown') + '</div>';
+    }
+  } catch (err) {
+    if (banner) banner.innerHTML = '<div style="color:#fca5a5"><strong>❌ Promotion failed:</strong> ' + err.message + '</div>';
+  }
+}
+
+// ── Restart daemon (keeps boot.key — vault stays unlocked) ──
+// restartDaemon moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+// ── Stop daemon (user-initiated — clears boot.key, requires password on restart) ──
+// stopDaemon moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+// ── Load services ───────────────────────────
+// allServices moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+// activeProjectTab moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+// serviceSearchQuery moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// serviceSort moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// matchesServiceSearch moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// setServiceSearch moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// renderProjectTabs moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// switchProjectTab moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// MCP_SURFACE_DUPLICATE_SERVICES moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// renderServiceGrid moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// loadServices moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Expiry & Rotation ───────────────────────
+// ROTATION_CAPABLE moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// loadExpiry moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// rotateKey moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// setExpiry moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Reveal ──────────────────────────────────
+// reveal moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// copyKey moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Project edit ────────────────────────────
+// toggleProjectEdit moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// saveProject moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// clearProject moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Rename service ───────────────────────────
+// toggleLabelEdit moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// saveLabel moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// Legacy rename (slug) — kept for API compatibility but hidden from UI
+// toggleRename moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+// saveRename moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Delete service ───────────────────────────
+// deleteService moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Set key ─────────────────────────────────
+// toggleSet moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// getServiceKeyType moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// generateSecretKey moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// saveKey moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Enable / Disable service ────────────────
+// toggleService moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// ── Check all credentials ───────────────────
+// checkAll moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+// ── Change password ─────────────────────────
+// toggleChangePw moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+// changePassword moved to ./panels/toolbar-panel.js (panel-componentization, follow-up correction -- paired with its toggle function, already there).
+
+// ── Add Service ──────────────────────────────
+// TYPE_LABELS moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// toggleAddService moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+// addService moved to ./panels/services-panel.js (panel-componentization, fourth slice).
+
+// Enter key on lock screen and add-service panel
+document.addEventListener("DOMContentLoaded", () => {
+  document.getElementById("lock-input").addEventListener("keydown", e => {
+    if (e.key === "Enter") unlock();
+  });
+  ["add-name", "add-label", "add-description", "add-project"].forEach(id => {
+    const el = document.getElementById(id);
+    if (el) el.addEventListener("keydown", e => { if (e.key === "Enter") addService(); });
+  });
+});
+
+// ── Shared fetch helper ─────────────────────
+async function apiFetch(path, opts) {
+  try {
+    return await fetch(BASE + path, opts).then(r => r.json());
+  } catch { return null; }
+}
+
+// ── Enroll Machine ──────────────────────────
+
+// toggleEnrollPanel moved to ./panels/toolbar-panel.js (panel-componentization, second slice).
+
+// enrollMachine moved to ./panels/toolbar-panel.js (panel-componentization, follow-up correction -- paired with its toggle function, already there).
+
+// WebDAV mount management (loadWebdavMounts, esc, addMountPrompt,
+// hideAddForm, submitMount, deleteMount) moved to ./panels/webdav-panel.js
+// (panel-componentization, third slice) -- found still duplicated here
+// verbatim during a later audit (2026-08-23): the original extraction never
+// removed these from dashboard.js, so both files declared the same
+// functions as classic-script globals. Since dashboard.js loads LAST in
+// script order, its copies silently won every identifier-based lookup
+// (onclick="..." strings, and webdav-panel.js's own internal calls to
+// loadWebdavMounts() by name) even though webdav-panel.js's copies were the
+// ones actually intended to be canonical -- only the panel registry's
+// `mount: loadWebdavMounts` escaped this, because it captured the function
+// VALUE at registration time (before dashboard.js's redeclaration), not a
+// live binding. Functionally harmless only because both copies were
+// byte-identical; a real drift hazard regardless. Removed here to match
+// the tunnel-panel/build-status-panel pattern already below.
+
+// Tunnel panel moved to ./panels/tunnel-panel.js (panel-componentization, first slice).
+
+// ── Build Status ──────────────────────────────────
+// updateBuildStatus moved to ./panels/build-status-panel.js (panel-componentization, fifth slice).
+
+// Detect daemon restart (PID change) and reload so boot() runs fresh.
+// Without this, an old tab stays in main-view after restart, sees tunnel
+// as not_started (vault locked), and gets stuck showing "checking tunnel".
+let _watchedPid = null;
+setInterval(async () => {
+  try {
+    const p = await fetch(BASE + "/ping").then(r => r.json());
+    if (_watchedPid && p.pid !== _watchedPid) { window.location.reload(); return; }
+    _watchedPid = p.pid;
+    // Also recover if vault became locked on us (e.g. user locked from another tab)
+    if (p.locked && document.getElementById("main-view").style.display !== "none") {
+      window.location.reload();
+    }
+  } catch {}
+}, 5000);
+
+boot();

package/cli/dashboard/global.css

@@ -0,0 +1,65 @@
+/* cli/dashboard/global.css
+   Color tokens + truly shared chrome: reset, body, lock screen, the
+   write-unlock modal, the main-view wrapper, header, status bar, the
+   generic .dash-panel/.btn base classes, error bar, loading state,
+   upgrade banner, and the footer. Every panel-specific stylesheet
+   (tunnel-panel.css, toolbar-panel.css, webdav-panel.css,
+   services-panel.css, build-status-panel.css, surfaces-panel.css) is
+   loaded AFTER this file and depends on these tokens -- never hardcode a
+   hex color in a panel stylesheet; add or reuse a token here instead. */
+:root{
+  --blue:#3b82f6;--blue-light:#60a5fa;--blue-dark:#2563eb;--blue-hover-bg:#1e4a7f;--blue-hover-text:#93c5fd;--cyan:#38bdf8;--cyan-light:#e0f2fe;
+  --green:#4ade80;--green-bright:#22c55e;--green-dark:#166534;--green-light:#86efac;--green-bg:#1a3d22;--green-hover-bg:#1a3d22;--emerald:#34d399;--mint:#6ee7b7;
+  --red:#f87171;--red-bright:#ef4444;--red-dark:#991b1b;--red-darker:#7f1d1d;--red-hover-bg:#2d1f1f;--pink:#fecaca;--pink-light:#fca5a5;
+  --amber:#d9a86c;--orange:#f59e0b;--orange-bright:#fb923c;--gold:#facc15;--gold-light:#fde68a;--copper:#d97706;--teal-light:#cffafe;
+  --purple:#a78bfa;
+  --grey:#94a3b8;--grey-dim:#64748b;--grey-darker:#475569;--grey-light:#cbd5e1;
+  --text-bright:#e2e8f0;--text-white:#f8fafc;--white:#fff;
+  --border:#334155;--border-dark:#1e3a5f;--panel-border:#233249;
+  --bg-card:#1e293b;--bg-dark:#0f172a;--bg-darker:#0a0f1a;--bg-modal:#1a1f2e;--bg-black:#030712;
+  --bg-tunnel:#0f1d2d;--bg-build:#0f1a2d;--bg-wizard:#0a1628;
+  --bg-check:#0f2d2d;--border-check:#064e3b;--bg-check-hover:#134e4a;
+  --bg-rotate:#0e7490;--border-rotate:#06b6d4;
+  --bg-copy:#1a3328;--bg-copy-hover:#1a4338;
+  --bg-set:#2d1f4a;--bg-set-hover:#3d2f5a;
+  --bg-generate:#3b2f0d;--bg-generate-hover:#56420d;
+  --bg-disable-hover:#3d2525;
+}
+*{margin:0;padding:0;box-sizing:border-box}
+body{background:var(--bg-darker);color:var(--text-bright);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;min-height:100vh}
+/* ── Lock screen ── */
+#lock-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem}
+.lock-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:2.5rem 2rem;width:100%;max-width:380px;text-align:center}
+.lock-icon{font-size:2.5rem;margin-bottom:1rem}
+.lock-title{font-size:1.25rem;font-weight:600;color:var(--text-white);margin-bottom:.4rem}
+.lock-sub{font-size:.85rem;color:var(--grey-dim);margin-bottom:1.75rem}
+.lock-input{width:100%;background:var(--bg-dark);border:1px solid var(--border);border-radius:8px;color:var(--text-bright);font-family:'Courier New',monospace;font-size:1rem;padding:10px 14px;outline:none;text-align:center;letter-spacing:.1em;transition:border-color .2s;margin-bottom:1rem}
+.lock-input:focus{border-color:var(--blue)}
+.lock-input.error{border-color:var(--red-bright);animation:shake .3s}
+@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
+.btn-unlock{width:100%;background:var(--blue);color:var(--white);border:none;border-radius:8px;padding:10px;font-size:.95rem;font-weight:600;cursor:pointer;transition:background .15s}
+.btn-unlock:hover{background:var(--blue-dark)}
+.btn-unlock:disabled{background:var(--border-dark);color:#4a6fa5;cursor:not-allowed}
+.lock-err{color:var(--red);font-size:.82rem;margin-top:.75rem;min-height:1.2em}
+#write-unlock-overlay{display:none;position:fixed;inset:0;background:rgba(2,6,23,.72);z-index:9999;align-items:center;justify-content:center;padding:2rem}
+.write-unlock-cancel{width:100%;background:transparent;color:var(--grey);border:1px solid var(--border);border-radius:8px;padding:8px;font-size:.85rem;cursor:pointer;margin-top:.6rem;transition:border-color .15s}
+.write-unlock-cancel:hover{border-color:var(--grey-dim);color:var(--grey-light)}
+/* ── Main view ── */
+#main-view{display:none;padding:2rem}
+.header{display:flex;align-items:center;gap:10px;margin-bottom:1.5rem;flex-wrap:wrap}
+.header h1{font-size:1.4rem;font-weight:600;flex:1}
+.dot{width:10px;height:10px;border-radius:50%;background:var(--green-bright);animation:pulse 2s infinite;flex-shrink:0}
+@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
+.status-bar{display:flex;gap:1.5rem;margin-bottom:1.5rem;font-size:.82rem;color:var(--grey);flex-wrap:wrap}
+.status-bar span{color:var(--text-bright);font-weight:500}
+.dash-panel{margin-bottom:1.25rem;border:1px solid var(--panel-border);background:linear-gradient(135deg,rgba(15,23,42,.96),rgba(10,15,26,.98));border-radius:12px;padding:14px}
+.error-bar{background:var(--red-darker);color:#fca5a5;border:1px solid var(--red-dark);padding:10px 14px;border-radius:8px;margin-bottom:1rem;display:none;font-size:.85rem}
+.loading{color:var(--grey-dim);font-style:italic}
+.btn{padding:6px 13px;border-radius:6px;border:none;cursor:pointer;font-size:.8rem;font-weight:500;transition:all .15s}
+.btn-save{background:var(--border-dark);color:var(--blue-light);padding:6px 16px}.btn-save:hover{background:var(--blue-hover-bg)}
+.btn-cancel{background:transparent;color:var(--grey-dim);padding:6px 10px}.btn-cancel:hover{color:var(--grey)}
+.upgrade-banner{background:linear-gradient(135deg,rgba(0,200,100,.12),rgba(0,150,80,.08));border:1px solid rgba(0,200,100,.3);border-radius:6px;padding:10px 16px;margin-bottom:12px;font-size:13px}
+.upgrade-banner .upgrade-content{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
+.upgrade-banner button{margin-left:auto;background:none;border:1px solid rgba(0,200,100,.4);color:#0c6;border-radius:4px;padding:2px 8px;cursor:pointer;font-size:12px}
+.upgrade-details-list{color:rgba(255,255,255,.6);font-size:12px}
+.footer{margin-top:2rem;font-size:.75rem;color:var(--amber);text-align:center}