@oharness/server 0.4.0 → 0.5.1

package/dist/server.js

@@ -8,11 +8,14 @@ import { updateUserMcpConfig } from "@oharness/engine/config-files.ts";
 import { connectorConfig, officialConnectors } from "@oharness/engine/mcp/registry.ts";
 import { missingSecrets } from "@oharness/engine/mcp/secrets.ts";
 import { connectorIcon, providerSites, siteIcon } from "./icons.js";
+import { checkAnswer } from "@oharness/engine/tools/questions.ts";
 import { PERMISSION_MODES } from "@oharness/engine/agent/permissions.ts";
+import { canDisableThinking, effectiveEffort, isEffortChoice, thinkingFor, } from "@oharness/engine/providers/types.ts";
 import { isReadable } from "@oharness/engine/agent/workspace.ts";
-import { messageText } from "@oharness/engine/core/types.ts";
+import { visibleText } from "@oharness/engine/core/types.ts";
 import { errorMessage } from "@oharness/engine/core/errors.ts";
-import { officialBaseUrl } from "@oharness/engine/auth/providers/official.ts";
+import { officialBaseUrl, officialTeam } from "@oharness/engine/auth/providers/official.ts";
+import { updateUserConfig } from "@oharness/engine/config.ts";
 import { accountsConfigured, browserKeyUrl, browserSignInUrl, exchangeHandoff, siteUrl, } from "@oharness/engine/auth/providers/account.ts";
 import { ChangeLedger } from "./changes.js";
 import { addProject, ensureProject, listProjects, removeProject } from "./projects.js";
@@ -33,6 +36,13 @@ import { accountTeams, publishArtifact, unpublishArtifact } from "@oharness/engi
  * stops short says so rather than reading as the whole history.
  */
 const USAGE_SESSION_SCAN = 200;
+/**
+ * How many trail entries one read of every session may return.
+ *
+ * Generous, because the page filters and pages through what it is given and a
+ * cap that bites in the middle of a normal week would make the filter lie.
+ */
+const AUDIT_ENTRY_CAP = 5000;
 const DAY_MS = 24 * 60 * 60 * 1000;
 /**
  * The windows the usage page offers.
@@ -47,6 +57,55 @@ const USAGE_RANGES = {
     "90d": { id: "90d", days: 90 },
     all: { id: "all", days: 0 },
 };
+/**
+ * The longest window that may be asked for by hand.
+ *
+ * The same year the site's picker allows, so a range chosen there and typed
+ * here mean the same thing. Past it the daily buckets are hairs and the walk
+ * is every session on disk for a curve that says nothing the presets do not.
+ */
+const MAX_CUSTOM_DAYS = 366;
+const DAY_KEY = /^\d{4}-\d{2}-\d{2}$/;
+/**
+ * The window the usage page is asking about: a preset, or two days picked on
+ * a calendar.
+ *
+ * UTC days, because that is what the picker hands over and what the buckets
+ * below are floored to — a window whose edges were local midnight and whose
+ * columns were UTC would put a day's spend in the column beside its own.
+ *
+ * `until` is exclusive and never in the future; a range picked backwards is
+ * read forwards, and one longer than the cap keeps its last day. Nothing here
+ * refuses: a page that answers "bad range" for two days somebody just clicked
+ * is a page arguing with its own calendar.
+ */
+function usageWindow(range, from, to) {
+    const now = Date.now();
+    const midnight = Math.floor(now / DAY_MS) * DAY_MS;
+    if (range === "custom" && from && to && DAY_KEY.test(from) && DAY_KEY.test(to)) {
+        let first = Date.parse(`${from}T00:00:00Z`);
+        let last = Date.parse(`${to}T00:00:00Z`);
+        if (Number.isFinite(first) && Number.isFinite(last)) {
+            if (first > last)
+                [first, last] = [last, first];
+            last = Math.min(last, midnight);
+            first = Math.min(first, last);
+            first = Math.max(first, last - (MAX_CUSTOM_DAYS - 1) * DAY_MS);
+            const key = (ms) => new Date(ms).toISOString().slice(0, 10);
+            return {
+                id: "custom",
+                since: first,
+                // Inclusive of the last day, so a range ending today still counts what
+                // was spent in the hour this page was opened.
+                until: Math.min(last + DAY_MS, now),
+                from: key(first),
+                to: key(last),
+            };
+        }
+    }
+    const preset = USAGE_RANGES[range ?? ""] ?? USAGE_RANGES["30d"];
+    return { id: preset.id, since: preset.days ? now - preset.days * DAY_MS : 0, until: now };
+}
 /**
  * What was spent over time, per model.
  *
@@ -62,15 +121,16 @@ const USAGE_RANGES = {
  * alternative is reading every transcript to place each turn, which is a lot
  * of disk for a curve nobody reads to four decimal places.
  */
-function usageSeries(rows, since) {
-    const now = Date.now();
-    const span = Math.max(now - since, DAY_MS);
+function usageSeries(rows, since, until = Date.now()) {
+    const span = Math.max(until - since, DAY_MS);
     const step = span > 60 * DAY_MS ? "week" : "day";
     const width = step === "week" ? 7 * DAY_MS : DAY_MS;
     // Anchored to the end rather than to midnight of the first day: the last
-    // bucket should be the one happening now, so the newest column is never a
-    // sliver that reads as a collapse in spending.
-    const end = Math.floor(now / width) * width + width;
+    // bucket should be the one the window ends in, so the newest column is never
+    // a sliver that reads as a collapse in spending. A window that ends on a
+    // bucket boundary keeps that bucket rather than opening an empty one after
+    // it, which is what a picked range ending yesterday would otherwise draw.
+    const end = Math.floor((until - 1) / width) * width + width;
     const count = Math.min(Math.ceil((end - since) / width), 400);
     const from = end - count * width;
     const buckets = Array.from({ length: count }, (_, i) => ({
@@ -167,7 +227,7 @@ export async function startWebServer(opts) {
      * choice changes, so re-reading it per session would only add a disk hit to
      * answer a question this already knows.
      */
-    let preferredModel = (await readPrefs()).model;
+    let { model: preferredModel, effort: preferredEffort } = await readPrefs();
     /**
      * A new session on a harness, honouring that preference.
      *
@@ -177,7 +237,10 @@ export async function startWebServer(opts) {
      */
     const freshSession = (harness) => {
         const known = preferredModel && harness.listModels().some((model) => model.id === preferredModel);
-        return harness.createSession(known ? { model: preferredModel } : {});
+        return harness.createSession({
+            ...(known ? { model: preferredModel } : {}),
+            ...(preferredEffort ? { effort: preferredEffort } : {}),
+        });
     };
     /**
      * Files staged for the next prompt.
@@ -266,13 +329,74 @@ export async function startWebServer(opts) {
         }));
     }
     watchConnections(opts.harness);
-    const permissionPrompt = (request) => new Promise((resolve) => {
-        const id = randomUUID();
-        pending.set(id, { id, request, resolve });
-        broadcast({ type: "permission_request", id, request });
-        // No timeout here on purpose. A prompt that auto-denies after a while
-        // would silently fail long-running work while the user is away; a prompt
-        // that auto-allows would be worse. It waits.
+    /**
+     * Take a waiting interaction off every screen.
+     *
+     * Broadcast on answer as well as on interrupt: a second window showing the
+     * same card must not stay answerable after the first one answered it.
+     */
+    const retire = (entry) => {
+        if (pending.get(entry.id) !== entry)
+            return false;
+        pending.delete(entry.id);
+        broadcast({ type: "interaction_closed", id: entry.id, ...(entry.session ? { session: entry.session } : {}) });
+        return true;
+    };
+    /** The event a waiting interaction is drawn from, for a live broadcast and a replay alike. */
+    const announce = (entry) => entry.kind === "permission"
+        ? { type: "permission_request", id: entry.id, request: entry.request, ...(entry.session ? { session: entry.session } : {}) }
+        : { type: "question_request", id: entry.id, request: entry.request, session: entry.session };
+    const notify = (entry) => {
+        try {
+            opts.onInteraction?.({
+                kind: entry.kind,
+                ...(entry.session ? { session: entry.session } : {}),
+                title: entry.kind === "permission" ? entry.request.title : (entry.request.questions[0]?.question ?? ""),
+            });
+        }
+        catch {
+            // A notifier that throws must not take the prompt down with it.
+        }
+    };
+    // No timeout on either of these, on purpose. A prompt that auto-denies after
+    // a while would silently fail long-running work while the user is away; a
+    // prompt that auto-allows would be worse. It waits — until it is answered,
+    // or the turn waiting on it is interrupted.
+    const permissionPrompt = (request, signal) => new Promise((resolve) => {
+        const entry = {
+            kind: "permission",
+            id: randomUUID(),
+            ...(request.sessionId ? { session: request.sessionId } : {}),
+            request,
+            settle: (reply) => {
+                if (retire(entry))
+                    resolve(reply);
+            },
+        };
+        if (signal?.aborted)
+            return resolve({ allow: false });
+        pending.set(entry.id, entry);
+        signal?.addEventListener("abort", () => entry.settle({ allow: false }), { once: true });
+        broadcast(announce(entry));
+        notify(entry);
+    });
+    const questionPrompt = (request, signal) => new Promise((resolve) => {
+        const entry = {
+            kind: "question",
+            id: randomUUID(),
+            session: request.sessionId,
+            request,
+            settle: (result) => {
+                if (retire(entry))
+                    resolve(result);
+            },
+        };
+        if (signal.aborted)
+            return resolve({ outcome: "aborted" });
+        pending.set(entry.id, entry);
+        signal.addEventListener("abort", () => entry.settle({ outcome: "aborted" }), { once: true });
+        broadcast(announce(entry));
+        notify(entry);
     });
     const server = createServer((req, res) => {
         void handle(req, res).catch((err) => {
@@ -319,12 +443,12 @@ export async function startWebServer(opts) {
                 const runner = runnerFor(url.searchParams.get("session"));
                 const page = runner?.harness.extensions.page(url.searchParams.get("id") ?? "");
                 if (!page)
-                    return send(res, 404, { error: "插件页面未启用。" });
+                    return send(res, 404, { error: "This plugin page is not enabled." });
                 try {
                     return send(res, 200, await page.read());
                 }
                 catch {
-                    return send(res, 400, { error: "无法读取插件页面，请检查本地文件。" });
+                    return send(res, 400, { error: "The plugin page could not be read. Check its local files." });
                 }
             }
             case "POST /plugin-page": {
@@ -333,12 +457,18 @@ export async function startWebServer(opts) {
                 const runner = runnerFor(body.session);
                 const page = runner?.harness.extensions.page(typeof body.page === "string" ? body.page : "");
                 if (!page || !body.input || typeof body.input !== "object" || Array.isArray(body.input))
-                    return send(res, 400, { error: "无效插件页面操作。" });
+                    return send(res, 400, { error: "Invalid plugin page action." });
                 try {
                     return send(res, 200, await page.act(body.input));
                 }
                 catch (error) {
-                    return send(res, 400, { error: errorMessage(error) });
+                    // A code and its values travel with the message, so the page can say it in its own language.
+                    const detail = (error && typeof error === "object" ? error : {});
+                    return send(res, 400, {
+                        error: errorMessage(error),
+                        ...(typeof detail.code === "string" ? { code: detail.code } : {}),
+                        ...(detail.params && typeof detail.params === "object" ? { params: detail.params } : {}),
+                    });
                 }
             }
             case "POST /cloud-connection": {
@@ -1121,17 +1251,52 @@ export async function startWebServer(opts) {
                     // The site as well as the account: the row's menu leads to the
                     // dashboard, and where that lives is this process's setting rather
                     // than something a page should carry a copy of.
+                    //
+                    // And the teams, with which one this machine bills to. The menu
+                    // offers the switch; a team named in the config that the account
+                    // is no longer on is still reported as chosen, because the gateway
+                    // will refuse it and the menu is where that gets undone.
+                    const teams = await accountTeams({ accountToken: await current.harness.accountToken() });
+                    const team = officialTeam();
                     return send(res, 200, {
                         signedIn: true,
                         provider: "official",
                         site: siteUrl(),
                         ...accountIdentity(credential.access),
+                        teams,
+                        ...(team ? { team } : {}),
                     });
                 }
                 // Named even when signed out, so the button knows which sign-in to
                 // start without the page hard-coding a provider id of its own.
                 return send(res, 200, { signedIn: false, provider: "official" });
             }
+            /**
+             * Whose credits this machine spends: a team's, or the account's own.
+             *
+             * Written to the user's config, the same file `OHARNESS_TEAM` stands in
+             * for, and read back per request by the official provider — so the
+             * next call is on the new balance without a restart. `null` is "my own
+             * plan". Not checked against the account's teams here: the gateway
+             * checks on every call and refuses a team the account is not on, and a
+             * second copy of that rule would be a second place for it to drift.
+             */
+            case "POST /team": {
+                const body = await readJson(req);
+                const asked = body.team;
+                const team = typeof asked === "string" && /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(asked.trim())
+                    ? asked.trim()
+                    : asked === null || asked === undefined || asked === ""
+                        ? undefined
+                        : false;
+                if (team === false)
+                    return send(res, 400, { error: "team must be a team id, or null" });
+                await updateUserConfig((config) => {
+                    const { team: _was, ...rest } = config;
+                    return team ? { ...rest, team } : rest;
+                });
+                return send(res, 200, { team: team ?? null });
+            }
             /**
              * What the account has left, and what it could buy.
              *
@@ -1149,9 +1314,17 @@ export async function startWebServer(opts) {
                 const token = await current.harness.accountToken();
                 if (!token)
                     return send(res, 200, { signedIn: false, provider: "official" });
-                const [state, catalogue] = await Promise.all([
+                // The team's balance beside the account's, when a team is chosen.
+                // Asked separately rather than instead: the account menu still says
+                // what the person has, and the paywall needs both to say which one
+                // just ran out.
+                const team = officialTeam();
+                const [state, catalogue, pooled] = await Promise.all([
                     gatewayJson("/api/v1/billing/balance", { token }),
                     gatewayJson("/api/v1/billing/plans"),
+                    team
+                        ? gatewayJson(`/api/v1/billing/balance?team=${encodeURIComponent(team)}`, { token })
+                        : Promise.resolve(undefined),
                 ]);
                 if (!state.ok) {
                     // 501 is a deployment that sells nothing — self-hosted, or a gateway
@@ -1169,6 +1342,26 @@ export async function startWebServer(opts) {
                     balanceMicro: state.value["balanceMicro"] ?? 0,
                     credits: state.value["credits"] ?? 0,
                     ...(state.value["subscription"] ? { subscription: state.value["subscription"] } : {}),
+                    // The chosen team and what it has. A refusal — not on the team any
+                    // more, or a gateway that predates teams — is carried as the id
+                    // alone with `refused`, so the menu can offer the way back to the
+                    // account's own plan rather than a balance it cannot read.
+                    ...(team
+                        ? {
+                            team: pooled?.ok
+                                ? {
+                                    id: team,
+                                    role: pooled.value["role"] ?? "member",
+                                    // Who may pay for the team, which decides what the
+                                    // paywall offers: the team page, or asking someone.
+                                    billing: pooled.value["billing"] === true,
+                                    balanceMicro: pooled.value["balanceMicro"] ?? 0,
+                                    ...(pooled.value["members"] !== undefined ? { members: pooled.value["members"] } : {}),
+                                    ...(pooled.value["subscription"] ? { subscription: pooled.value["subscription"] } : {}),
+                                }
+                                : { id: team, refused: pooled?.error ?? "unreachable" },
+                        }
+                        : {}),
                     // An empty list is the honest answer when the price list cannot be
                     // read; the paywall falls back to sending people to the site, which
                     // is where buying works without this app at all.
@@ -1318,18 +1511,50 @@ export async function startWebServer(opts) {
                 return void res.end(body);
             }
             /**
-             * One session's permission trail.
+             * The permission trail — one session's, or every session's.
+             *
+             * A session by default, because that is where it is written and how the
+             * Settings row reads it: beside the conversation it describes, with no
+             * id to know before opening.
+             *
+             * `session=all` is what the page asks for. The question an audit trail
+             * is opened for — when was this ever allowed, and who said yes — is
+             * rarely one a single session answers, and leaving it to be answered by
+             * downloading the export and reading JSON lines by hand is not an answer
+             * a page can hand somebody.
              *
-             * Scoped to a session because that is where it is written and how it is
-             * meant to be read — beside the conversation it describes. Defaults to
-             * the focused one so the panel does not have to know an id to open.
+             * Newest session first and capped, because the walk is a file read per
+             * session. `/audit/export` already pays that cost, but it pays it for a
+             * download somebody asked for by name; a panel that repaints has to stop
+             * somewhere, and `more` says out loud that it did.
              */
             case "GET /audit": {
-                const id = url.searchParams.get("session") ?? current.session.id;
-                return send(res, 200, {
-                    session: id,
-                    entries: await current.harness.decisions(id),
-                });
+                const asked = url.searchParams.get("session") ?? current.session.id;
+                if (asked !== "all") {
+                    return send(res, 200, {
+                        session: asked,
+                        entries: await current.harness.decisions(asked),
+                    });
+                }
+                const metas = (await current.harness.listSessions(Number.MAX_SAFE_INTEGER))
+                    .sort((a, b) => b.updatedAt - a.updatedAt);
+                const entries = [];
+                let scanned = 0;
+                let more = false;
+                for (const meta of metas) {
+                    if (entries.length >= AUDIT_ENTRY_CAP) {
+                        more = true;
+                        break;
+                    }
+                    scanned += 1;
+                    // The session id on every line, the same way the export writes it:
+                    // once the scope is more than one session, a row that cannot say
+                    // which one it came from is a row nobody can follow up on.
+                    for (const entry of await current.harness.decisions(meta.id)) {
+                        entries.push({ ...entry, session: meta.id });
+                    }
+                }
+                return send(res, 200, { session: "all", entries, sessions: scanned, more });
             }
             // The key lives behind this rather than in the HTML: a build that has one
             // still hands it to nobody until they have opted in.
@@ -1390,8 +1615,8 @@ export async function startWebServer(opts) {
                 // totals, the models, the sessions and the curve — is that window and
                 // nothing else, because a figure that answers a different question
                 // from the chart under it is worse than no figure.
-                const range = USAGE_RANGES[url.searchParams.get("range") ?? ""] ?? USAGE_RANGES["30d"];
-                const since = range.days ? Date.now() - range.days * DAY_MS : 0;
+                const window = usageWindow(url.searchParams.get("range"), url.searchParams.get("from"), url.searchParams.get("to"));
+                const { since, until } = window;
                 const stored = await current.harness.listSessions(USAGE_SESSION_SCAN);
                 const rows = new Map();
                 for (const meta of stored) {
@@ -1425,7 +1650,7 @@ export async function startWebServer(opts) {
                 // They are still counted in `scanned`, which is what says how far back
                 // the numbers above them reach.
                 const list = [...rows.values()]
-                    .filter((row) => row.updatedAt >= since)
+                    .filter((row) => row.updatedAt >= since && row.updatedAt < until)
                     .filter((row) => row.costUsd > 0 || row.input || row.output || row.cacheRead || row.cacheWrite)
                     .sort((a, b) => b.updatedAt - a.updatedAt);
                 const zero = { costUsd: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0 };
@@ -1450,8 +1675,14 @@ export async function startWebServer(opts) {
                     byModel.set(row.model, add(bucket, row));
                 }
                 return send(res, 200, {
-                    range: range.id,
-                    series: usageSeries(list, since || (list.length ? list[list.length - 1].updatedAt : Date.now())),
+                    range: window.id,
+                    // Echoed back so the picker opens on the window being shown rather
+                    // than on what was typed: the two differ whenever a range was
+                    // clamped, and a calendar that disagrees with the figures beside it
+                    // is the one thing it must not do.
+                    from: window.from,
+                    to: window.to,
+                    series: usageSeries(list, since || (list.length ? list[list.length - 1].updatedAt : Date.now()), until),
                     totals: { ...totals, sessions: list.length },
                     // Sorted by what was spent, not by name: the row worth seeing first
                     // is the expensive one.
@@ -1816,6 +2047,23 @@ export async function startWebServer(opts) {
                     return send(res, 400, { error: errorMessage(err) });
                 }
             }
+            case "POST /effort": {
+                const body = await readJson(req);
+                const runner = runnerFor(body.session);
+                if (!runner)
+                    return send(res, 404, { error: "no such session" });
+                if (!isEffortChoice(body.effort)) {
+                    return send(res, 400, { error: `unknown effort: ${String(body.effort)}` });
+                }
+                // Not refused while a turn runs, unlike a model switch: the request in
+                // flight already carries its effort, and the next one reads this.
+                runner.session.effort = body.effort;
+                preferredEffort = body.effort;
+                void writePrefs({ effort: preferredEffort });
+                void runner.session.persist().catch(() => { });
+                broadcast({ type: "state", session: runner.session.id, state: state(runner) });
+                return send(res, 200, state(runner));
+            }
             case "POST /mode": {
                 const body = await readJson(req);
                 const runner = runnerFor(body.session);
@@ -2007,10 +2255,9 @@ export async function startWebServer(opts) {
             case "POST /permission": {
                 const body = await readJson(req);
                 const entry = typeof body.id === "string" ? pending.get(body.id) : undefined;
-                if (!entry)
+                if (!entry || entry.kind !== "permission")
                     return send(res, 404, { error: "no such pending request" });
-                pending.delete(entry.id);
-                entry.resolve({
+                entry.settle({
                     allow: body.allow === true,
                     ...(typeof body.remember === "string"
                         ? { remember: body.remember }
@@ -2018,6 +2265,19 @@ export async function startWebServer(opts) {
                 });
                 return send(res, 200, { ok: true });
             }
+            case "POST /question": {
+                const body = await readJson(req);
+                const entry = typeof body.id === "string" ? pending.get(body.id) : undefined;
+                if (!entry || entry.kind !== "question")
+                    return send(res, 404, { error: "no such pending question" });
+                // Checked here rather than trusted: the page is one client of this
+                // route, and a label the model never offered must not reach it as one.
+                const checked = checkAnswer(entry.request.questions, body.answer);
+                if (!checked.ok)
+                    return send(res, 400, { error: checked.error });
+                entry.settle(checked.result);
+                return send(res, 200, { ok: true });
+            }
             case "POST /interrupt":
                 {
                     const body = await readJson(req);
@@ -2127,6 +2387,9 @@ export async function startWebServer(opts) {
         }));
         const runtime = (harness.runtimePluginStatus?.() ?? []).map((plugin) => ({
             name: plugin.id,
+            // The name stays the id: it is what @ chips and references resolve by.
+            // The title is only ever painted.
+            ...(plugin.title ? { title: plugin.title } : {}),
             // The state only. Where it came from is the row's tag now, and saying it
             // twice in two places is how they drift.
             description: `${plugin.description ?? "Runtime plugin"} [${plugin.state}]${plugin.error ? ` — ${plugin.error}` : ""}`,
@@ -2149,7 +2412,20 @@ export async function startWebServer(opts) {
             // harness; the rest name where on disk they were found.
             builtin: skill.source === "builtin",
         }));
-        return { connectors, plugins: [...plugins, ...runtime], skills };
+        /**
+         * What shipped here first, then what this machine added.
+         *
+         * Every list that reads this — the panel, the + menu, the @ mention —
+         * paints the rows in the order given, and a reader scanning for memory
+         * or the media tools expects them at the top, not under eighty installed
+         * skills. Stable within each half, so the order the harness reported
+         * survives the split.
+         */
+        const builtinFirst = (list) => [
+            ...list.filter((one) => one.source === "builtin"),
+            ...list.filter((one) => one.source !== "builtin"),
+        ];
+        return { connectors, plugins: builtinFirst([...plugins, ...runtime]), skills: builtinFirst(skills) };
     }
     /**
      * What the composer attached to one message, as a block above the prompt.
@@ -2209,6 +2485,13 @@ export async function startWebServer(opts) {
             model: model.id,
             provider: model.provider,
             mode: sess.permissions.getMode(),
+            // What the next request will carry, not what was picked: a pick the
+            // model lacks shows as the tier it is clamped to, and a model that
+            // cannot stop thinking never shows "off". Absent when the model has no
+            // tiers at all, which is the page's cue to hide the control.
+            effort: effectiveEffort(model, thinkingFor(runner.harness.config.thinking, sess.effort)),
+            effortLevels: model.effortLevels,
+            effortOff: model.effortLevels.length > 0 && canDisableThinking(model),
             costUsd: sess.costUsd,
             // Beside the cost, because the line under the composer says three things
             // about one turn: what it cost, how many tokens that took, and how much
@@ -2235,7 +2518,7 @@ export async function startWebServer(opts) {
             index++;
             const tools = message.content.filter((block) => block.type === "tool_call");
             const results = message.content.filter((block) => block.type === "tool_result");
-            const text = messageText(message).trim();
+            const text = visibleText(message).trim();
             // The bytes stay where they are; what travels is where to find them.
             // Without this a reloaded conversation showed "[image: shot.png]" where
             // the screenshot had been — the model still saw it, the person did not.
@@ -2308,7 +2591,8 @@ export async function startWebServer(opts) {
             ? opts.openProject(project.path)
             : Harness.create({
                 cwd: project.path,
-                permissionPrompt: (request) => permissionPrompt(request),
+                permissionPrompt: (request, signal) => permissionPrompt(request, signal),
+                questionPrompt: (request, signal) => questionPrompt(request, signal),
             }));
         harnesses.set(project.path, harness);
         watchConnections(harness);
@@ -2420,6 +2704,12 @@ export async function startWebServer(opts) {
         const input = staged.length ? buildMessage(text, staged) : text;
         try {
             for await (const event of runner.agent.run(input, { signal: controller.signal })) {
+                // The agent's own question_request is not forwarded: the page draws
+                // the card from questionPrompt's announce, which carries the id the
+                // answer is posted back to. Forwarding both drew the card twice, and
+                // the copy without that id could only ever 404.
+                if (event.type === "question_request")
+                    continue;
                 broadcast({ ...event, session: id });
             }
         }
@@ -2471,6 +2761,14 @@ export async function startWebServer(opts) {
                 res.write(`data: ${JSON.stringify({ type: "connection_card", session: card.session, card })}\n\n`);
             }
         }
+        // Whatever is still waiting on a person, again. A page that reloads while
+        // a turn waits on it would otherwise never see the card, and the turn
+        // would wait on nobody for as long as the process lives.
+        for (const entry of pending.values())
+            res.write(`data: ${JSON.stringify(announce(entry))}\n\n`);
+        // And the full list, so a page that missed an interaction_closed while
+        // disconnected can drop the cards that are no longer waiting.
+        res.write(`data: ${JSON.stringify({ type: "pending_interactions", ids: [...pending.keys()] })}\n\n`);
         // A heartbeat keeps intermediaries from closing an idle stream while the
         // model is thinking.
         const beat = setInterval(() => res.write(": ping\n\n"), 15_000);
@@ -2638,6 +2936,7 @@ export async function startWebServer(opts) {
         url: `http://${host}:${port}/?token=${token}`,
         token,
         permissionPrompt,
+        questionPrompt,
         async close() {
             for (const unsubscribe of connectionSubscriptions)
                 unsubscribe();
@@ -2648,9 +2947,12 @@ export async function startWebServer(opts) {
             clients.clear();
             // Any prompt still waiting has to be answered, or the agent's turn hangs
             // forever holding the process open. Shutting down denies.
-            for (const entry of pending.values())
-                entry.resolve({ allow: false });
-            pending.clear();
+            for (const entry of [...pending.values()]) {
+                if (entry.kind === "permission")
+                    entry.settle({ allow: false });
+                else
+                    entry.settle({ outcome: "unavailable" });
+            }
             for (const runner of runners.values())
                 runner.running?.abort();
             await new Promise((resolve) => server.close(() => resolve()));