@songsid/agend 2.2.0-beta.2 → 2.2.0-beta.20

package/dist/ui/panel-settings.js

@@ -24,7 +24,7 @@ import "./settings-strings.js";
 import { api, attach, confirmedWrite, newKey } from "./settings-confirm.js";
 import { dismissOperation, operationActive, restartFleet, startOperation, takeLeftover } from "./settings-apply.js";
 import {
-  ACCESS_MODES, AGENT_MODES, DEFAULT_SCHEMA, LOG_LEVELS, TOOL_PROGRESS, TOOL_SETS, VISIBILITY_MODES, batchImpact,
+  ACCESS_MODES, AGENT_MODES, DEFAULT_SCHEMA, HANG_TIMEOUT_DEFAULT_MINUTES, LOG_LEVELS, TOOL_PROGRESS, TOOL_SETS, VISIBILITY_MODES, batchImpact,
   changedFields, channelId, channelsOf, chLabel, connectionState, effectiveSummary, fleetModel, fromYaml, fullModelRequests, groupAgents,
   hasOwn, impactOf, localeOptions, defaultsImpact, requestImpact, nonNegative, positive, replyGuardSupported, shortName, STATUS_ORDER, toYaml,
   visibilityDefault, worstImpact,
@@ -258,9 +258,10 @@ export function SettingsPanel({ route, navKey }) {
 }
 
 /**
- * #1604: what this browser chooses for itself — moved here from the sidebar footer, each with the storage it always had:
- * theme (theme.js), language (app-i18n.js), HTML previews on this device (preview.js, through the app's confirm), and
- * the chat tour (replayed on the chat it points at).
+ * #1604, #1665: Preferences. Synced across the person's devices (kept on the host, app-prefs.js): theme (theme.js),
+ * language (app-i18n.js) and HTML previews (preview.js, through the app's confirm). On the public link they are
+ * read-only: a change there stays in that browser, and it says so. This device only: the chat tour (replayed on the
+ * chat it points at), and the layout choices named there (their controls are where they always were).
  */
 export function DeviceSection() {
   const P = () => globalThis.AgendPreview;
@@ -269,7 +270,11 @@ export function DeviceSection() {
   const replay = () => {
     let last = null;
     try { last = localStorage.getItem("agend_last_instance"); } catch { /* none */ }
-    navigate(last ? chatPath(last) : "/ui");
+    // #1854: the tour is about an agent's chat — with no agent to open (none remembered, or it is gone), say so instead
+    // of opening an empty chat that waits ~3 s and shows nothing.
+    const { instances } = appStore.get();
+    if (!last || !(instances || []).some((i) => i && i.name === last)) { toast(t("chat.tourNoAgent"), false); return; }
+    navigate(chatPath(last));
     // This replay belongs to the navigation it just made — that one, by its sequence number, not by URL (A → B → A, or
     // the same path again, is a new navigation). It did not happen (a leave guard said no) or it is not the chat:
     // nothing. Left meanwhile (another page, another navigation): nothing (#1609 review).
@@ -284,22 +289,73 @@ export function DeviceSection() {
     let tries = 0;
     const go = () => {
       if (!current()) return;
-      if (!document.getElementById("sendBtn")) { if (++tries <= 30) setTimeout(go, 100); return; }
+      if (!document.getElementById("sendBtn")) { if (++tries <= 30) setTimeout(go, 100); else toast(t("chat.tourNoAgent"), false); return; }
       const here = document.getElementById("msgIn") || document.getElementById("main");
       if (here && typeof here.focus === "function") here.focus();
       if (current()) startTour();
     };
     setTimeout(go, 0);
   };
-  return html`<section class="card s-device"><h3>${tn("sec_device")}</h3>
-    <p class="sub">${tn("deviceLead")}</p>
+  const publicLink = typeof document !== "undefined" && document.body && document.body.dataset.publicLink === "1";
+  return html`<${ProfileCard} />
+  <section class="card s-device s-synced"><h3>${tn("syncedTitle")}</h3>
+    <p class="sub">${publicLink ? tn("syncedPublicLink") : tn("syncedLead")}</p>
     <${DevicePrefs} labels=${true} />
     ${P() ? html`<label class="check"><input type="checkbox" checked=${on} onChange=${(e) => { const want = e.target.checked; setPreviewOptIn(want).then(setOn); }} />
       <span>${t("chat.previews")}</span></label>` : null}
+  </section>
+  <section class="card s-device s-local"><h3>${tn("deviceTitle")}</h3>
+    <p class="sub">${tn("deviceLead")}</p>
     <div class="s-device-row"><button type="button" id="tourBtn" class="btn" title=${t("chat.tourBtnTitle")} onClick=${replay}><${Icon} name="info" size=${16} />${t("chat.tour")}</button></div>
   </section>`;
 }
 
+/**
+ * #1827: who agents see when this person writes from the web. Signed in with a code sent to their Discord or Telegram
+ * account, they are that account — its user id, and its name unless they choose another (it follows them to every
+ * device, the public link included). Otherwise "web-user", as before. The host checks a name in full and says why it
+ * refuses one; this only shows what it says.
+ */
+const view = (b) => ({ phase: "ready", name: b.name || "", shown: b.shown || "", id: b.id || "", bound: b.bound === true, platform: b.platform_name || "", error: "" });
+export function ProfileCard() {
+  const [state, setState] = useState({ phase: "loading", name: "", shown: "", id: "", bound: false, platform: "", error: "" });
+  const [draft, setDraft] = useState("");
+  const lease = useLease();
+  useEffect(() => {
+    let live = true;
+    api("/ui/profile").then((r) => {
+      if (!live) return;
+      if (!r.ok || !r.body) { setState((s) => ({ ...s, phase: "unavailable" })); return; }
+      setState(view(r.body));
+      setDraft(r.body.name || "");
+    }).catch(() => { if (live) setState((s) => ({ ...s, phase: "unavailable" })); });
+    return () => { live = false; };
+  }, []);
+  if (state.phase === "unavailable") return null;
+  const save = (clear) => {
+    setState((s) => ({ ...s, phase: "saving", error: "" }));
+    api("/ui/profile", { method: "POST", body: JSON.stringify({ name: clear ? null : draft }) }).then((r) => {
+      if (lease && !lease.current()) return;
+      if (!r.ok) { setState((s) => ({ ...s, phase: "ready", error: (r.body && r.body.error) || tn("profileFailed") })); return; }
+      setState(view(r.body));
+      setDraft(r.body.name || "");
+      toast(tn("profileSaved", r.body.shown || "web-user"));
+    }).catch(() => setState((s) => ({ ...s, phase: "ready", error: tn("profileFailed") })));
+  };
+  const busy = state.phase !== "ready";
+  const changed = draft.trim() !== state.name;
+  return html`<section class="card s-device s-profile"><h3>${tn("profileTitle")}</h3>
+    <p class="sub">${state.bound ? tn("profileLeadBound") : tn("profileLeadUnbound")}</p>
+    <div class="field"><label for="profile-name">${tn("profileName")}</label>
+      <input id="profile-name" type="text" maxlength="200" autocomplete="nickname" value=${draft} disabled=${busy}
+        placeholder=${state.platform || "web-user"} aria-invalid=${state.error ? "true" : "false"} aria-describedby="profile-help"
+        onInput=${(e) => setDraft(e.target.value)} onKeyDown=${(e) => { if (e.key === "Enter" && changed && draft.trim()) save(false); }} />
+      <p class="sub" id="profile-help">${state.error ? html`<span class="err" role="alert">${state.error}</span>` : tn("profileHelp", state.shown || "web-user", state.id)}</p></div>
+    <div class="s-device-row"><button type="button" class="btn primary" disabled=${busy || !changed || !draft.trim()} onClick=${() => save(false)}>${tn("profileSave")}</button>
+      ${state.name ? html`<button type="button" class="btn" disabled=${busy} onClick=${() => save(true)}>${state.bound ? tn("profileUseAccount", state.platform || "web-user") : tn("profileClear")}</button>` : null}</div>
+  </section>`;
+}
+
 /** The operation in hand still owns Apply: its writes and job, or a restart of AgEnD from the press to its end. */
 const opBusy = (op) => !!op && (["writing", "posting", "watching"].includes(op.phase) || op.restart === "busy");
 function dropSecrets(staged) { for (const c of staged.values()) if (c.connectionSecret) c.connectionSecret.secret = ""; }
@@ -367,11 +423,13 @@ function makeCtx(data, setData, stage, unstage, reload, reloadLive, alive) {
     async pauseWake(name, action) {
       const res = await api(`/api/settings/instances/${encodeURIComponent(name)}/${action}`, { method: "POST" }).catch(() => ({ ok: false, body: {} }));
       if (!res.ok) toast((res.body && res.body.error) || tn("actionFailed", action), false);
+      else if (res.body && res.body.held) toast(res.body.message);
       await reloadLive();
     },
     async startStop(name, running) {
       const res = await api(running ? `/stop/${encodeURIComponent(name)}` : `/api/instance/${encodeURIComponent(name)}/start`, { method: "POST" }).catch(() => ({ ok: false, body: {} }));
       if (!res.ok) toast(`${tn("actionFailed", running ? tn("stop") : tn("start"))}: ${(res.body && res.body.error) || res.status || ""}`, false);
+      else if (res.body && res.body.held) toast(res.body.message);
       await new Promise((r) => setTimeout(r, 800));
       await reloadLive();
     },
@@ -581,7 +639,7 @@ function General({ ctx }) {
     backend: d.backend || "claude-code", model: d.model || "", locale: d.locale || "", auto: String(d.auto_pause_after ?? 0),
     agent_mode: d.agent_mode || "mcp", tool_set: d.tool_set || "full", tool_progress: d.tool_progress ?? "off",
     visibility: visibilityDefault(d), reply: d.reply_completion_guard ?? true, log_level: d.log_level || "info",
-    hangOn: hang.enabled !== false, hang: String(hang.timeout_minutes ?? 15),
+    hangOn: hang.enabled !== false, hang: String(hang.timeout_minutes ?? HANG_TIMEOUT_DEFAULT_MINUTES),
     concurrency: String(startup.concurrency ?? 10), stagger: String(startup.stagger_delay_ms ?? 500),
     classicBackend: c.backend || d.backend || "claude-code",
     classicToolProgress: c.tool_progress ?? d.tool_progress ?? "off", classicToolProgressInherit: !hasOwn(c, "tool_progress"),
@@ -610,7 +668,7 @@ function General({ ctx }) {
       backend: d.backend || "claude-code", model: d.model || undefined, locale: d.locale || null, auto_pause_after: d.auto_pause_after ?? 0,
       agent_mode: d.agent_mode || "mcp", tool_set: d.tool_set || "full", tool_progress: d.tool_progress ?? "off",
       cross_instance_visibility: visibilityDefault(d), reply_completion_guard: d.reply_completion_guard ?? true, log_level: d.log_level || "info",
-      hang_detector: { enabled: hang.enabled !== false, timeout_minutes: hang.timeout_minutes ?? 15 },
+      hang_detector: { enabled: hang.enabled !== false, timeout_minutes: hang.timeout_minutes ?? HANG_TIMEOUT_DEFAULT_MINUTES },
       startup: { concurrency: startup.concurrency ?? 10, stagger_delay_ms: startup.stagger_delay_ms ?? 500 },
     });
     const oc = original.c;
@@ -702,8 +760,8 @@ function General({ ctx }) {
  * the temporary public link none of it can be changed — the form says so and stays disabled (the server refuses too).
  */
 export const WEB_READ_ONLY = [
-  "web.allowed_hosts", "web.view_access", "web.notify_login", "web.preview", "web.preview_port", "web.preview_origin",
-  "web.usage_panel", "web.provider_secrets", "web_terminal.bind", "web_terminal.tunnel",
+  "web.allowed_hosts", "web.view_access", "web.notify_login", "web.preview", "web.preview_port", "web.preview_origin", "web.preview_on_public_link",
+  "web.usage_panel", "web.provider_secrets", "web.upload_max_file_mb", "web.upload_max_total_mb", "web_terminal.bind", "web_terminal.tunnel",
 ];
 function WebSection({ ctx, staged }) {
   const { schema } = ctx;
@@ -711,13 +769,14 @@ function WebSection({ ctx, staged }) {
   const overPublicLink = globalThis.document?.body?.dataset?.publicLink === "1";
   const original = useMemo(() => ({
     echo: web.echo_to_channel ?? true,
+    log: web.log_tab === true,                                                  // #1218: off by default
     pub: { allow_public: (web.public_link && web.public_link.allow_public) ?? true, ttl_minutes: (web.public_link && web.public_link.ttl_minutes) ?? 120, protocol: (web.public_link && web.public_link.protocol) ?? "http2" },
     session: { absolute_hours: local.absolute_hours ?? null, idle_hours: local.idle_hours ?? null },
     terminal: { enabled: term.enabled ?? null, ttl_minutes: term.ttl_minutes ?? null },
   }), []);
   const text = (v) => (v === null || v === undefined ? "" : String(v));
   const [f, setF] = useState(() => ({
-    echo: original.echo, pub: original.pub.allow_public, ttl: String(original.pub.ttl_minutes), protocol: original.pub.protocol,
+    echo: original.echo, log: original.log, pub: original.pub.allow_public, ttl: String(original.pub.ttl_minutes), protocol: original.pub.protocol,
     abs: text(original.session.absolute_hours), idle: text(original.session.idle_hours),
     termOn: original.terminal.enabled !== false, termTtl: text(original.terminal.ttl_minutes),
   }));
@@ -726,7 +785,9 @@ function WebSection({ ctx, staged }) {
   // Empty = the default (null in the write: the key is removed from fleet.yaml).
   const value = (v) => (v.trim() === "" ? null : Number(v));
   const hours = (v) => { const n = value(v); return n !== null && (!Number.isFinite(n) || n < 1 || n > 720) ? "sessionRange" : ""; };
-  const abs = value(f.abs) ?? 12, idle = value(f.idle) ?? 2;
+  // The defaults (#1670: 48 h / 48 h, DEFAULT_SESSION_POLICY); an idle time left blank follows a shorter session, as
+  // the store and the validator apply it — so only an idle time that is typed can exceed the session length.
+  const abs = value(f.abs) ?? 48, idle = value(f.idle) ?? Math.min(48, abs);
   const errors = {
     ttl: !Number.isInteger(Number(f.ttl)) || Number(f.ttl) < 1 || Number(f.ttl) > 480 ? "publicTtl" : "",
     abs: hours(f.abs),
@@ -743,12 +804,14 @@ function WebSection({ ctx, staged }) {
       ttl_minutes: value(f.termTtl) }, original.terminal);
     const body = {
       ...(f.echo !== original.echo ? { echo_to_channel: f.echo } : {}),
+      ...(f.log !== original.log ? { log_tab: f.log } : {}),
       ...(Object.keys(publicPatch).length ? { public_link: publicPatch } : {}),
       ...(Object.keys(sessionPatch).length ? { session: { local: sessionPatch } } : {}),
       ...(Object.keys(terminalPatch).length ? { web_terminal: terminalPatch } : {}),
     };
     const fields = [
       ...(body.echo_to_channel !== undefined ? ["web.echo_to_channel"] : []),
+      ...(body.log_tab !== undefined ? ["web.log_tab"] : []),
       ...Object.keys(publicPatch).map((k) => `web.public_link.${k}`),
       ...Object.keys(sessionPatch).map((k) => `web.session.local.${k}`),
       ...Object.keys(terminalPatch).map((k) => `web_terminal.${k}`),
@@ -771,9 +834,9 @@ function WebSection({ ctx, staged }) {
     <section class="card"><h3>${tn("webSessionTitle")}</h3>
       <p class="note">${tn("webSessionHint")}</p>
       <div class="grid2">
-        <div class="field"><label for="webSessionAbsolute">${tn("sessionAbsolute")}</label><input id="webSessionAbsolute" type="number" min="1" max="720" step="any" placeholder=${tn("defaultHours", 12)}
+        <div class="field"><label for="webSessionAbsolute">${tn("sessionAbsolute")}</label><input id="webSessionAbsolute" type="number" min="1" max="720" step="any" placeholder=${tn("defaultHours", 48)}
           class=${errors.abs ? "invalid" : ""} value=${f.abs} onInput=${(e) => set("abs")(e.target.value)} /><${Feedback} error=${errors.abs} /></div>
-        <div class="field"><label for="webSessionIdle">${tn("sessionIdle")}</label><input id="webSessionIdle" type="number" min="1" max="720" step="any" placeholder=${tn("defaultHours", 2)}
+        <div class="field"><label for="webSessionIdle">${tn("sessionIdle")}</label><input id="webSessionIdle" type="number" min="1" max="720" step="any" placeholder=${tn("defaultHours", 48)}
           class=${errors.idle ? "invalid" : ""} value=${f.idle} onInput=${(e) => set("idle")(e.target.value)} /><${Feedback} error=${errors.idle} /></div>
       </div>
     </section>
@@ -788,6 +851,8 @@ function WebSection({ ctx, staged }) {
     <section class="card"><h3>${tn("webChat")}</h3>
       <label class="check"><input id="webEchoToChannel" type="checkbox" checked=${f.echo} onChange=${(e) => set("echo")(e.target.checked)} /><span>${tn("webEcho")}</span><${Impact} schema=${schema} field="web.echo_to_channel" /></label>
       <p class="note">${tn("webEchoHint")}</p>
+      <label class="check"><input id="webLogTab" type="checkbox" checked=${f.log} onChange=${(e) => set("log")(e.target.checked)} /><span>${tn("webLogTab")}</span><${Impact} schema=${schema} field="web.log_tab" /></label>
+      <p class="note">${tn("webLogTabHint")}</p>
       <label class="check"><input id="publicWebLink" type="checkbox" checked=${f.pub} onChange=${(e) => set("pub")(e.target.checked)} /><span>${tn("publicLink")}</span><${Impact} schema=${schema} field="web.public_link.allow_public" /></label>
       <p class="note">${tn("publicLinkHint")}</p>
       <div class="grid2">
@@ -840,7 +905,7 @@ function Developer({ ctx }) {
       <button type="button" class="btn btn-sm" title=${tn("copy")} onClick=${copy}><${Icon} name="copy" size=${14} /><span class="lbl">${tn("copy")}</span></button>
       <button type="button" class="btn btn-sm" title=${tn("devDownload")} onClick=${download}><${Icon} name="download" size=${14} /><span class="lbl">${tn("devDownload")}</span></button>
     </div>
-    ${editing ? html`<textarea class="s-yaml" aria-label=${tn("devEditor")} spellcheck="false" wrap="off" value=${draft} onInput=${(e) => setDraft(e.target.value)}></textarea>
+    ${editing ? html`<textarea class="s-yaml" aria-label=${tn("devEditor")} spellcheck=${false} wrap="off" value=${draft} onInput=${(e) => setDraft(e.target.value)}></textarea>
         <div class="save-row"><button type="button" class="btn btn-primary" onClick=${save}>${tn("devApply")}</button><span class="note">${tn("devApplyHint")}</span></div>`
       : html`<pre class="s-yaml">${text}</pre>`}
     ${msg ? html`<p class=${`feedback${msg.error ? " error" : ""}`} role="status">${msg.error || msg.text}</p>` : null}

package/dist/ui/preview-panel.js

@@ -1,11 +1,14 @@
 // #1481: an agent's HTML preview (#1306) in a panel beside the conversation — a split with a draggable divider on a
 // wide screen, a full-screen sheet on a narrow one. Nothing about the preview itself changes here: the frame is the one
 // preview.js makes (mountPreview: the preview origin, sandbox allow-scripts only), started by AgendPreview.start like a
-// card's, only told to fill the panel. It runs on a click, as a card's does:
-// - "Open in panel" on an idle card opens the panel with its Preview button — the panel runs nothing by itself;
+// card's, only told to fill the panel. It runs on a person's click, as a card's does — and "Open in panel" is that click:
+// - on an idle card it opens the panel and starts the preview there, as if Preview were clicked in the panel (#1704);
+//   a device that has not allowed previews gets the "Allow previews" offer instead, and allowing it starts the run;
+//   where previews cannot run (web.preview: false, a public link), the panel opens with nothing running;
 // - on a card whose preview is running, the same button moves that run to the panel (stopped in the card, started in
 //   the panel: a moved frame reloads anyway);
-// - a newer version of the block in a later reply is offered, never swapped in, and offered with Preview to click.
+// - nothing runs by itself: not when the page loads, not when the panel is shown again, and a newer version of the
+//   block in a later reply is offered, never swapped in, and shown with Preview to click.
 // Closing the panel or leaving the chat stops its frame; one preview per page still holds (start() stops any other).
 import { html, useEffect, useRef, useState } from "/assets/app-html.js";
 import { t } from "/assets/app-i18n.js";
@@ -13,24 +16,36 @@ import { Icon } from "/assets/ui-icons.js";
 import "./chat-render.js";
 import "./preview.js";
 import { loadHtmlAttachment } from "./html-attachment.js";
+import { chatTime, onDayChange } from "./chat-time.js";
 
 const R = () => globalThis.AgendChatRender;
 const P = () => globalThis.AgendPreview;
 
 // ── The panel's state, one per page (the chat shows one instance at a time) ──
 
-/** open: { key, instance, msgKey, n | att, code, sender, ts } | null (`att`: an attached .html file, #1306 Q4); run: start it on mount (a moved run). */
+/**
+ * open: { key, instance, msgKey, n | att, code, sender, ts } | null (`att`: an attached .html file, #1306 Q4);
+ * run: start it on mount — the card's click, as a token no later open ever reuses (0: nothing to run).
+ */
 let state = { open: null, run: 0 };
+let runs = 0, version = 0, claims = 0;
 const subs = new Set();
-function set(next) { state = next; for (const fn of [...subs]) { try { fn(state); } catch { /* one listener's error stops no other */ } } }
+function set(next) { state = next; version++; for (const fn of [...subs]) { try { fn(state); } catch { /* one listener's error stops no other */ } } }
 export const panelStore = { get: () => state, subscribe(fn) { subs.add(fn); return () => { subs.delete(fn); }; } };
+/** Moves on every open and close, and on every claim: what a card's click compares when its HTML arrives late. */
+export const panelVersion = () => version;
+/** A click that will show something in the panel (an attachment's HTML still to read): from now on it is the newest —
+ *  any earlier click still reading is dropped when its answer comes. Returns the version the click owns. */
+export function claimPanel() { claims++; return ++version; }
+/** How many clicks have claimed: an inline Preview still reading asks only whether a newer click came (not a close). */
+export const panelClaims = () => claims;
 
 /** The frame's key in preview.js: its own, so the card that opened it keeps its own state. */
 export const frameKey = (key) => `panel:${key}`;
-/** Show `spec` in the panel; `run`: start it there (a click that moves a running preview). The block shown before stops. */
+/** Show `spec` in the panel; `run`: start it there (the card's "Open in panel" click). The block shown before stops. */
 export function openPanel(spec, { run = false } = {}) {
   if (state.open && P()) P().stop(frameKey(state.open.key), "stopped", "");
-  set({ open: { ...spec }, run: run ? state.run + 1 : 0 });
+  set({ open: { ...spec }, run: run ? ++runs : 0 });
 }
 /** Close the panel: its frame stops first. */
 export function closePanel() {
@@ -98,14 +113,15 @@ export function clampWidth(w, total) {
   return Math.round(Math.min(max, Math.max(MIN_PANEL, w)));
 }
 
-const timeOf = (ts) => (ts ? new Date(ts).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) : "");
+/** #1770: as the thread shows it — the fleet's zone, with the day when it is not today. */
+const timeOf = (ts) => (ts ? chatTime(ts, { yesterday: (hm) => t("chat.yesterdayAt", hm) }) : "");
 
 /**
  * The panel, inside the chat's split (`split`: that element — the divider sets its width there, through CSSOM).
  * props: name (the instance), msgs() → its messages, subscribe(fn) → unsubscribe (the chat store's), keyOf(x),
  * reveal(msgKey) (the thread shows that message), download(code).
  */
-/** allow(): this device's opt-in through the chat's one path (setPreviewOptIn: the confirm, then setOptIn) → the choice. */
+/** allow(commit): this device's opt-in through the chat's one path (setPreviewOptIn: the confirm, then commit(setOptIn)) → the choice. */
 export function PreviewPanel({ name, split, msgs, subscribe, keyOf, reveal, download, allow }) {
   const [st, setSt] = useState(state);
   const [view, setView] = useState("preview");
@@ -113,15 +129,23 @@ export function PreviewPanel({ name, split, msgs, subscribe, keyOf, reveal, down
   const [newer, setNewer] = useState(null);
   const [newerNote, setNewerNote] = useState("");
   const reading = useRef(null);   // the newer version whose file is being read (one at a time)
+  const pending = useRef(0);      // #1704: the card's click, waiting for this device's Allow (the st.run it came with)
+  const ownAllow = useRef(0);     // while this panel's own Allow commits its choice: the click it answers (not cancelled by it)
   const holder = useRef(null), divider = useRef(null), panel = useRef(null);
   const open = st.open && st.open.instance === name ? st.open : null;
 
   useEffect(() => panelStore.subscribe(setSt), []);
   // This device's choice (here or in another tab) decides whether Preview is offered: re-read it when it changes.
+  // A click waiting for Allow is cancelled by any other change of that choice (Never, a card's menu, another tab):
+  // after it, running needs a new click — only this panel's own Allow runs the click it was offered for.
   const [, choice] = useState(0);
-  useEffect(() => (P() ? P().onChange(() => choice(n => n + 1)) : undefined), []);
+  useEffect(() => (P() ? P().onChange(() => { if (pending.current && ownAllow.current !== pending.current) pending.current = 0; choice(n => n + 1); }) : undefined), []);
   // Leaving the chat (another instance, another panel) closes the panel: its frame stops with the thread's.
   useEffect(() => () => closePanel(), []);
+  // #1770: the source and newer-version labels say the day as the thread does — drawn again when the fleet's day
+  // changes, while a block is open. A render: the frame and the run are left as they are.
+  const [, dayTick] = useState(0);
+  useEffect(() => (open ? onDayChange(() => dayTick(n => n + 1)) : undefined), [!!open]);
 
   const ui = { state: (s, reason) => setRun({ state: s === "starting" || s === "running" ? s : "idle", reason: reason || "" }) };
   const start = () => {
@@ -130,11 +154,17 @@ export function PreviewPanel({ name, split, msgs, subscribe, keyOf, reveal, down
     P().start(frameKey(open.key), holder.current, open.code, ui, { fill: true });
   };
   const stop = () => { if (open) P().stop(frameKey(open.key), "stopped", ""); };
-  // A new block in the panel: what ran before is gone (openPanel stopped it); a moved run starts here.
+  // A new block in the panel: what ran before is gone (openPanel stopped it); the card's click starts it here — or,
+  // where it cannot run, waits as `pending`: only the Allow below can use it (offered to a device that has not opted
+  // in), only while the panel shows what that click opened (st.run is a token no later open reuses), and any other
+  // change of this device's choice cancels it.
   useEffect(() => {
     setRun({ state: "idle", reason: "" });
     setView("preview");
-    if (open && st.run) start();
+    if (open && st.run) {
+      if (P().availability().ok) start();
+      else pending.current = st.run;
+    }
     // Focus goes to the panel's close control that is on screen (Back on a phone, × beside the thread).
     if (panel.current) { const f = [...panel.current.querySelectorAll(".pv-panel-close")].find(b => b.offsetParent !== null); if (f) f.focus(); }
   }, [open && open.key, st.run]);
@@ -204,11 +234,21 @@ export function PreviewPanel({ name, split, msgs, subscribe, keyOf, reveal, down
   if (!open) return null;
   const going = run.state === "starting" || run.state === "running";
   const a = P().availability();
-  // #1554: a device that has not allowed previews is offered the same "Allow previews" here (the same confirm); Preview
-  // is then enabled — still a click. Why a run stopped (e.g. switched off in another tab) is still said first.
+  // #1554: a device that has not allowed previews is offered the same "Allow previews" here (the same confirm). Allowing
+  // runs the block the card's click opened (#1704); otherwise Preview is then enabled — still a click. Why a run stopped
+  // (e.g. switched off in another tab) is still said first.
   const askOptIn = !going && !a.ok && a.why === "optin" && typeof allow === "function";
   const note = run.reason || (going ? (run.state === "starting" ? t("chat.pvStarting") : "") : a.ok ? t("chat.pvPanelIdle") : askOptIn ? t("chat.pvWhyOptinPanel") : a.reason);
-  const allowHere = async () => { if (await allow()) setRun({ state: "idle", reason: "" }); };
+  // Allowed here: the click that opened the panel runs now — if it is still waiting (no other change of the choice
+  // cancelled it, even while the confirm was open: only the change this Allow commits is its own) and the panel still
+  // shows what it opened (the confirm is a wait: the panel may have moved on meanwhile).
+  const allowHere = async () => {
+    const want = pending.current;
+    const yes = await allow((apply) => { ownAllow.current = want; try { apply(); } finally { ownAllow.current = 0; } });
+    if (!yes) return;
+    setRun({ state: "idle", reason: "" });
+    if (want && pending.current === want && panelStore.get().run === want) start();
+  };
   const source = t("chat.pvSource", open.sender || name, timeOf(open.ts));
   return html`<div class="pv-divider" ref=${divider} role="separator" aria-orientation="vertical" tabindex="0" aria-label=${t("chat.pvResize")}
       aria-valuemin=${String(MIN_PANEL)} onKeyDown=${onKey} onPointerDown=${onDown}></div>

package/dist/ui/preview-status.js

@@ -0,0 +1,28 @@
+// #1723: the public link's preview tunnel starts beside the link and is never waited for, so a page may load while it
+// is still starting. This asks the page's own server (/ui/preview-status) until it is up or failed, and hands each answer
+// to preview.js — which takes only what it may use, and itself reaches no network (#1306).
+
+/** Every 2 s, for at most 5 minutes. */
+export const POLL_MS = 2000;
+export const POLL_MAX = 150;
+
+/**
+ * Ask while `P.waitingForPublicPreview()`; stop once `P.applyPublicPreviewStatus(answer)` says there is nothing more to
+ * wait for, or after POLL_MAX asks. Returns a stop function.
+ */
+export function pollPublicPreview(P, deps = {}) {
+  const get = deps.fetch ?? ((...a) => fetch(...a));
+  const later = deps.setTimeout ?? ((fn, ms) => setTimeout(fn, ms));
+  if (!P || typeof P.waitingForPublicPreview !== "function" || !P.waitingForPublicPreview()) return () => {};
+  let attempts = 0, stopped = false;
+  const again = () => { if (!stopped && attempts < POLL_MAX) later(tick, POLL_MS); };
+  const tick = () => {
+    if (stopped || !P.waitingForPublicPreview()) return;
+    attempts++;
+    get("/ui/preview-status", { credentials: "same-origin", cache: "no-store" })
+      .then((r) => (r.ok ? r.json() : null))
+      .then((j) => { if (!stopped && !P.applyPublicPreviewStatus(j)) again(); }, again);
+  };
+  later(tick, POLL_MS);
+  return () => { stopped = true; };
+}

package/dist/ui/preview.js

@@ -28,7 +28,14 @@
   var BANNER_ACK_KEY = "agend_html_preview_banner_ack";
   var BANNER = "Previews run the agent's HTML in an isolated frame. It cannot use your login, but it may be able to send data out. Only preview content you trust. A preview can slow or freeze this tab.";
 
-  var cfg = { dashboardOrigin: "", previewOrigin: "", boot: "", reason: "", reasonCode: "" };
+  var cfg = { dashboardOrigin: "", previewOrigin: "", boot: "", reason: "", reasonCode: "", detail: "" };
+  // Why it failed, in English when the app's dictionary has no word for it (chat-strings.js pvFail_*).
+  var FAIL_EN = { exited: "its address closed unexpectedly", "spawn-failed": "cloudflared could not start for it", "no-address": "no address was given for it",
+    unreachable: "its address could not be reached", "lease-held": "an earlier preview tunnel is still being cleaned up", "gateway-failed": "its local listener could not start",
+    // #1767: what cloudflared's exit before an address really was.
+    "rate-limited": "Cloudflare is limiting new temporary links from this machine — try again in a while",
+    "provisioning-failed": "Cloudflare refused to create its address right now", "process-exited": "cloudflared stopped before it gave an address",
+    "bad-address": "Cloudflare gave an address that could not be used" };
   // #1554: the page's words. `say(key, english, …values)` asks the app's dictionary (init's opts.text) and keeps the
   // English here when it has none — so this file still works, and reads the same, without the app.
   var text = null;
@@ -66,6 +73,7 @@
       boot: String((data && data.previewBoot) || ""),
       reason: String((data && data.previewReason) || ""),
       reasonCode: String((data && data.previewReasonCode) || ""),
+      detail: String((data && data.previewDetail) || ""),
     };
     if (opts && typeof opts.text === "function") text = opts.text;
     if (!listening && typeof root.addEventListener === "function") {
@@ -76,6 +84,29 @@
       listening = true;
     }
   }
+  /**
+   * #1723: the public link's own preview tunnel was still starting when this page loaded; preview-status.js asks the
+   * page's server and hands each answer here (this file reaches no network). Ready → previews run at the origin it
+   * names — only an https quick-tunnel origin other than this page's is ever taken: the page's frame-src allows no
+   * other; failed or off → the page says why. Returns true once there is nothing more to wait for.
+   */
+  function waitingForPublicPreview() { return cfg.reasonCode === "publicLinkStarting"; }
+  function applyPublicPreviewStatus(j) {
+    if (cfg.reasonCode !== "publicLinkStarting") return true;
+    var at = root.location && root.location.origin;
+    if (j && typeof j.previewOrigin === "string" && /^https:\/\/[a-z0-9-]+\.trycloudflare\.com$/.test(j.previewOrigin) && j.previewOrigin !== at
+      && typeof j.boot === "string" && /^[0-9a-f]{32}$/.test(j.boot)) {
+      cfg.previewOrigin = j.previewOrigin; cfg.boot = j.boot; cfg.reasonCode = ""; cfg.reason = "";
+      notify();
+      return true;
+    }
+    if (j && (j.code === "publicLinkPreviewFailed" || j.code === "publicLink" || j.code === "fleetOff")) {
+      cfg.reasonCode = j.code; cfg.reason = ""; cfg.detail = typeof j.detail === "string" ? j.detail : "";
+      notify();
+      return true;
+    }
+    return false;
+  }
   function onStorage(event) {
     // #1568: the banner acknowledged in another tab of this sign-in: hide it here too (nothing starts or stops).
     if (event && event.key === BANNER_ACK_KEY) { notify(); return; }
@@ -159,7 +190,11 @@
   function availability() {
     if (!cfg.previewOrigin || !cfg.boot) {
       // The server's reason, in the page's language when the server named it (a code), else as the server wrote it.
-      var server = cfg.reasonCode ? say("pvServer_" + cfg.reasonCode, cfg.reason || "Previews are not available here.", cfg.dashboardOrigin) : "";
+      // #1723: a failed public-link preview names why ({0} is the reason, in the page's words).
+      var arg = cfg.reasonCode === "publicLinkPreviewFailed" ? say("pvFail_" + (cfg.detail || "unknown"), Object.prototype.hasOwnProperty.call(FAIL_EN, cfg.detail) ? FAIL_EN[cfg.detail] : "an unexpected error") : cfg.dashboardOrigin;
+      var english = cfg.reasonCode === "publicLinkPreviewFailed" ? "Previews are unavailable on this public link: {0}. The link itself keeps working."
+        : cfg.reason || "Previews are not available here.";
+      var server = cfg.reasonCode ? say("pvServer_" + cfg.reasonCode, english, arg) : "";
       return { ok: false, why: "server", reason: server || cfg.reason || say("pvWhyServer", "Previews are not available here.") };
     }
     var at = root.location && root.location.origin;
@@ -197,11 +232,15 @@
    * opts.fill (#1481, the side panel): the frame fills its holder — the same frame from mountPreview, only sized by the
    * panel instead of by the frame's height messages, which it then ignores.
    */
+  /** How many previews this page has started: a click whose HTML arrives late asks whether another started meanwhile. */
+  var starts = 0;
+  function startCount() { return starts; }
   function start(key, holder, html, ui, opts) {
     var a = availability();
     if (!a.ok) { ui.state("unavailable", a.reason); return false; }
     if (typeof html !== "string" || utf8Bytes(html) > LIMITS.maxBytes) { ui.state("unavailable", say("pvHtmlOver", "This HTML is over 1 MiB; it is not previewed.")); return false; }
     stopAll("another");
+    starts++;
     var doc = holder.ownerDocument;
     var iframe = mountPreview(doc);
     var card = {
@@ -330,7 +369,7 @@
 
   return {
     init: init, availability: availability, optedIn: optedIn, setOptIn: setOptIn, never: never, setNever: setNever, onChange: onChange, listeners: listeners, onStorage: onStorage,
-    start: start, stop: stop, stopAll: stopAll, stopIn: stopIn, running: running, liveCount: liveCount, liveFrame: liveFrame,
+    start: start, startCount: startCount, stop: stop, stopAll: stopAll, stopIn: stopIn, running: running, liveCount: liveCount, liveFrame: liveFrame,
     mountPreview: mountPreview, onMessage: onMessage, BANNER: BANNER, LIMITS: LIMITS,
     /** The banner every running preview carries, in the page's language (#1554); BANNER is its English. */
     banner: function () { return say("pvBanner", BANNER); },
@@ -338,5 +377,7 @@
     bannerAckLabel: function () { return say("pvBannerAck", "I understand"); },
     bannerAckTitle: function () { return say("pvBannerAckTitle", "Hide this notice until you sign in again"); },
     bannerAcked: bannerAcked, ackBanner: ackBanner, setBannerScope: setBannerScope,
+    /** #1723: the public link's preview, while it starts (preview-status.js asks; this only takes the answer). */
+    waitingForPublicPreview: waitingForPublicPreview, applyPublicPreviewStatus: applyPublicPreviewStatus,
   };
 });

package/dist/ui/settings-dialogs.js

@@ -10,11 +10,11 @@ import { Icon } from "/assets/ui-icons.js";
 import { toast } from "/assets/ui-toast.js";
 import { confirmDialog } from "/assets/ui-confirm.js";
 import { api, confirmedWrite, newKey } from "./settings-confirm.js";
-import { botHandle, TokenEnvNote, TokenField, verifyBotToken } from "./settings-token.js";
+import { adminUserIdError, adminUserIdPattern, botHandle, TokenEnvNote, TokenField, verifyBotToken } from "./settings-token.js";
 import { DiscordServerPicker } from "./settings-discord.js";
 import { startOperation } from "./settings-apply.js";
 import {
-  ACCESS_MODES, AGENT_FIELDS, AGENT_MODES, BOT_FIELDS, CH_TYPES, CLASSIC_FIELDS, LOG_LEVELS, TOOL_PROGRESS, TOOL_SETS,
+  ACCESS_MODES, AGENT_FIELDS, AGENT_MODES, BOT_FIELDS, CH_TYPES, CLASSIC_FIELDS, HANG_TIMEOUT_DEFAULT_MINUTES, LOG_LEVELS, TOOL_PROGRESS, TOOL_SETS,
   VISIBILITY_MODES, accessConfirmations, agentForm, agentPatch, backendOptions, changedFields, channelId, channelsOf,
   chLabel, hasOwn, impactOf, nonNegative, nonNegativeInteger, positive, replyGuardSupported, sameValue, visibilityDefault,
   webEchoIsGroup, worstImpact,
@@ -242,7 +242,7 @@ export function AgentDialog({ name, inst, ctx, onClose }) {
         <div class="field">${L(`${tn("hangTimeout")} (${tn("minutes")})`, "instance.hang_detector", "ag-hang")}
           <${Override} inherit=${f.inherit.hang} onInherit=${setInherit("hang")}>
             <input id="ag-hang" type="number" min="0.1" step="0.5" class=${errors.hang ? "invalid" : ""} disabled=${f.inherit.hang}
-              value=${shown("hang", f.hang, String((defaults.hang_detector && defaults.hang_detector.timeout_minutes) ?? 15))} onInput=${(e) => set("hang")(e.target.value)} /></${Override}>
+              value=${shown("hang", f.hang, String((defaults.hang_detector && defaults.hang_detector.timeout_minutes) ?? HANG_TIMEOUT_DEFAULT_MINUTES))} onInput=${(e) => set("hang")(e.target.value)} /></${Override}>
           <${Feedback} error=${errors.hang} /></div>
         ${[["agent_mode", "agentMode", AGENT_MODES, defaults.agent_mode || "mcp"], ["tool_set", "toolSet", TOOL_SETS, defaults.tool_set || "full"],
           ["tool_progress", "toolProgress", TOOL_PROGRESS, defaults.tool_progress ?? "off"],
@@ -466,17 +466,18 @@ export function BotDialog({ id, ctx, onClose }) {
  */
 export function NewBotDialog({ ctx, onClose }) {
   const lease = useLease("new-bot");
-  const [f, setF] = useState({ type: "discord", id: "", token: "", identity: null, guilds: [], group: "", general: "" });
+  const [f, setF] = useState({ type: "discord", id: "", token: "", identity: null, guilds: [], group: "", general: "", admin: "" });
   const [plan, setPlan] = useState(null);
   const [busy, setBusy] = useState(false);
   const [err, setErr] = useState("");
   // The form's revision (#1529 review): any change to the token, platform, id or group moves it; a Verify or a plan
   // that began before is dropped when it lands — never restoring an old token, naming it, or planning for it.
   const rev = useRef(0);
-  const body = (x) => ({ platform: x.type, connection_only: true, ...(x.id.trim() ? { channel_id: x.id.trim() } : {}),
+  const body = (x) => ({ platform: x.type, connection_only: true, admin_user_id: x.admin.trim(), ...(x.id.trim() ? { channel_id: x.id.trim() } : {}),
     ...(x.group.trim() ? (x.type === "discord" ? { guild_id: x.group.trim() } : { group_id: x.group.trim() }) : {}),
     ...(x.type === "discord" && x.general.trim() ? { general_channel_id: x.general.trim() } : {}) });
   const planFor = async (x) => {
+    if (adminUserIdError(x.type, x.admin.trim())) { setPlan(null); return null; }
     const at = rev.current;
     const res = await api("/api/settings/quickstart/plan", { method: "POST", body: JSON.stringify(body(x)) }).catch(() => ({ ok: false, body: {} }));
     if (!lease.current() || rev.current !== at) return null;
@@ -501,6 +502,8 @@ export function NewBotDialog({ ctx, onClose }) {
   };
   const save = async () => {
     if (!f.identity || !f.identity.valid) { setErr(tn("wizardNeedVerify")); return; }
+    const adminError = adminUserIdError(f.type, f.admin.trim());
+    if (adminError) { setErr(adminError); return; }
     const x = f;
     setBusy(true);
     const p = await planFor(x);
@@ -514,7 +517,7 @@ export function NewBotDialog({ ctx, onClose }) {
   };
   // A change of platform or id is another connection: what was verified and planned no longer applies. The server or
   // group does not change the id or the token's name, so the plan (and its name under Advanced) stays.
-  const set = (k) => (v) => { rev.current++; setF((x) => ({ ...x, [k]: v, ...(k === "type" ? { identity: null, guilds: [], group: "", general: "" } : {}) })); if (k !== "group" && k !== "general") setPlan(null); };
+  const set = (k) => (v) => { rev.current++; setF((x) => ({ ...x, [k]: v, ...(k === "type" ? { identity: null, guilds: [], group: "", general: "", admin: "" } : {}) })); if (k !== "group" && k !== "general") setPlan(null); };
   return html`<${Dialog} title=${tn("newBot")} onClose=${onClose} busy=${busy}
     actions=${html`<button type="button" class="btn" disabled=${busy} onClick=${onClose}>${tn("cancel")}</button>
       <button type="button" class="btn btn-primary" disabled=${busy || !f.identity || !f.identity.valid} onClick=${save}>${tn("save")}</button>`}>
@@ -528,6 +531,8 @@ export function NewBotDialog({ ctx, onClose }) {
             guild=${f.group} onGuild=${set("group")} channel=${f.general} onChannel=${set("general")} />`
         : html`<div class="field"><label for="nb-group">${tn("groupIdField")}</label>
             <input id="nb-group" type="text" value=${f.group} onInput=${(e) => set("group")(e.target.value.trim())} /></div>`}
+      <div class="field"><label for="nb-user">${tn("wizardAdminUser")}</label>
+        <input id="nb-user" type="text" required=${true} inputmode="numeric" pattern=${adminUserIdPattern(f.type)} value=${f.admin} onInput=${(e) => set("admin")(e.target.value.trim())} /></div>
       <${Drawer} title=${tn("advancedSection")}>
         <div class="field"><label for="nb-id">${tn("connectionIdOptional")}</label><input id="nb-id" type="text" placeholder=${plan ? plan.channel_id : f.type}
           value=${f.id} onInput=${(e) => set("id")(e.target.value)} onBlur=${() => { if (f.identity && f.identity.valid) planFor(f); }} /></div>

package/dist/ui/settings-model.js

@@ -2,6 +2,8 @@
 // Ported from settings.html with their reasons: every rule here was a fix (the review or issue named beside it).
 // No DOM, no fetch; the panel (panel-settings.js) and the tests call these directly.
 
+/** #1854: the stuck timeout when none is set — the daemon's DEFAULT_STUCK_TIMEOUT_MS (src/daemon.ts), in minutes. */
+export const HANG_TIMEOUT_DEFAULT_MINUTES = 10;
 export const BACKENDS = ["claude-code", "kiro-cli", "codex", "opencode", "antigravity", "grok", "muse"];
 export const CH_TYPES = ["discord", "telegram"];
 export const LOCALES = [["en", "English"], ["zh-TW", "繁體中文 (zh-TW)"]];
@@ -166,7 +168,7 @@ export function agentForm(inst, defaults) {
     description: inst.description || "", systemPrompt: inst.systemPrompt || "", tags: [...(inst.tags || [])],
     general_topic: !!inst.general_topic,
     auto_pause_after: String(inst.auto_pause_after ?? defaults.auto_pause_after ?? 0),
-    hang: String(hang.timeout_minutes ?? (defaults.hang_detector && defaults.hang_detector.timeout_minutes) ?? 15),
+    hang: String(hang.timeout_minutes ?? (defaults.hang_detector && defaults.hang_detector.timeout_minutes) ?? HANG_TIMEOUT_DEFAULT_MINUTES),
     agent_mode: inst.agent_mode || defaults.agent_mode || "mcp",
     tool_set: inst.tool_set || defaults.tool_set || "full",
     tool_progress: inst.tool_progress ?? defaults.tool_progress ?? "off",