@oharness/server 0.7.0 → 0.8.0

package/dist/server.js

@@ -17,6 +17,9 @@ import { visibleText } from "@oharness/engine/core/types.ts";
 import { errorMessage } from "@oharness/engine/core/errors.ts";
 import { officialBaseUrl, officialTeam } from "@oharness/engine/auth/providers/official.ts";
 import { loadUserConfig, updateUserConfig } from "@oharness/engine/config.ts";
+import { EXTENSION_ID, EXTENSION_INSTALL_URL } from "@oharness/engine/browser/host-manifest.ts";
+import { announcePresence } from "@oharness/engine/browser/presence.ts";
+import { extensionHostReachable } from "@oharness/engine/browser/socket.ts";
 import { RoutineRunner } from "@oharness/engine/schedule/runner.ts";
 import { accountsConfigured, browserKeyUrl, browserSignInUrl, exchangeHandoff, siteUrl, } from "@oharness/engine/auth/providers/account.ts";
 import { ChangeLedger } from "./changes.js";
@@ -28,6 +31,7 @@ import { listDirectories, pickDirectory, pickFiles, revealDirectory } from "./pi
 import { browseFiles, searchFiles, within } from "./files.js";
 import { analyticsState } from "./analytics.js";
 import { PAGE } from "./page.js";
+import { browserState, parseInputEvent, streamFrames } from "./browser-pane.js";
 import { artifactDocument, sendArtifact } from "./artifacts.js";
 import { sendProjectExport } from "./project-export.js";
 import { ArtifactStore, getArtifactStore, isCanvas, isValidArtifactId, restoreArtifacts, } from "@oharness/engine/artifacts/store.ts";
@@ -204,12 +208,23 @@ export async function startWebServer(opts) {
     const makeRunner = (session, harness) => {
         const ledger = new ChangeLedger(session.cwd);
         ledger.attach(harness.hooks);
-        return { session, agent: harness.agent(session), harness, ledger };
+        return {
+            session,
+            agent: harness.agent(session),
+            harness,
+            browser: harness.browserFor(session.id),
+            ledger,
+            queue: [],
+        };
     };
     /** The runner a request names, or the most recently focused one. */
     let focused = opts.session.id;
     const runnerFor = (id) => runners.get(typeof id === "string" && id ? id : focused);
-    runners.set(opts.session.id, makeRunner(opts.session, opts.harness));
+    const initial = makeRunner(opts.session, opts.harness);
+    // Preserve caller-supplied agent overrides for the initial session. Its
+    // browser is still the same one bound by Harness.agent(session).
+    initial.agent = opts.agent;
+    runners.set(opts.session.id, initial);
     let current = { session: opts.session, agent: opts.agent, harness: opts.harness };
     /**
      * Sign-ins waiting for their emailed code.
@@ -430,7 +445,12 @@ export async function startWebServer(opts) {
         if (url.pathname === "/" && req.method === "GET") {
             if (!authorized(url, req))
                 return send(res, 401, { error: "missing or bad token" });
-            res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+            res.writeHead(200, {
+                "content-type": "text/html; charset=utf-8",
+                // Framed by itself and by the OHarness extension's side panel, and by
+                // nothing else: a page that drives a shell is not one to embed.
+                "content-security-policy": `frame-ancestors 'self' chrome-extension://${EXTENSION_ID}`,
+            });
             res.end(PAGE);
             return;
         }
@@ -458,6 +478,201 @@ export async function startWebServer(opts) {
                 const runner = runnerFor(url.searchParams.get("session"));
                 return send(res, 200, { pages: runner?.harness.extensions.listPages() ?? [] });
             }
+            /*
+             * The browser pane: what state it is in, its picture, and the input of
+             * somebody who has taken it over.
+             *
+             * State is polled by every open page, so it is answered from what the
+             * session already knows and never starts a browser to find out — a person
+             * who opened the pane has not asked for Chrome.
+             */
+            case "GET /browser/state": {
+                res.setHeader("cache-control", "no-store");
+                const runner = runnerFor(url.searchParams.get("session"));
+                return send(res, 200, await browserState(runner?.browser));
+            }
+            case "GET /browser/stream": {
+                const runner = runnerFor(url.searchParams.get("session"));
+                const quality = Number(url.searchParams.get("quality") ?? "85");
+                return streamFrames(runner?.browser, res, Number.isFinite(quality) ? Math.min(90, Math.max(20, quality)) : 85);
+            }
+            case "POST /browser/input": {
+                res.setHeader("cache-control", "no-store");
+                const body = await readJson(req);
+                const runner = runnerFor(typeof body.session === "string" ? body.session : undefined);
+                const session = runner?.browser;
+                if (!session || !session.state().running)
+                    return send(res, 409, { error: "no browser is running" });
+                const event = parseInputEvent(body.event);
+                if (!event)
+                    return send(res, 400, { error: "unrecognised input event" });
+                await session.forward(event);
+                return send(res, 200, { ok: true });
+            }
+            case "POST /browser/navigate": {
+                res.setHeader("cache-control", "no-store");
+                const body = await readJson(req);
+                const runner = runnerFor(typeof body.session === "string" ? body.session : undefined);
+                const session = runner?.browser;
+                if (!session)
+                    return send(res, 409, { error: "browser is disabled" });
+                if (body.action === "reload") {
+                    if (!session.running)
+                        return send(res, 409, { error: "no browser is running" });
+                    try {
+                        return send(res, 200, await session.reload());
+                    }
+                    catch (error) {
+                        return send(res, 400, { error: errorMessage(error) });
+                    }
+                }
+                const raw = typeof body.url === "string" ? body.url.trim() : "";
+                if (!raw)
+                    return send(res, 400, { error: "url is required" });
+                const local = /^(?:localhost|127(?:\.\d{1,3}){3}|\[::1\])(?::|\/|$)/i.test(raw);
+                const value = /^[a-z][a-z0-9+.-]*:/i.test(raw) ? raw : `${local ? "http" : "https"}://${raw}`;
+                let parsed;
+                try {
+                    parsed = new URL(value);
+                }
+                catch {
+                    return send(res, 400, { error: "invalid url" });
+                }
+                if (parsed.protocol !== "http:" && parsed.protocol !== "https:") {
+                    return send(res, 400, { error: "only http and https URLs are supported" });
+                }
+                try {
+                    return send(res, 200, await session.navigate(parsed.href));
+                }
+                catch (error) {
+                    return send(res, 400, { error: errorMessage(error) });
+                }
+            }
+            case "POST /browser/tab": {
+                res.setHeader("cache-control", "no-store");
+                const body = await readJson(req);
+                const runner = runnerFor(typeof body.session === "string" ? body.session : undefined);
+                const session = runner?.browser;
+                if (!session || !session.running)
+                    return send(res, 409, { error: "no browser is running" });
+                if (typeof body.id !== "string" || !body.id)
+                    return send(res, 400, { error: "tab id is required" });
+                if (body.action === "close") {
+                    if (runner?.running)
+                        return send(res, 409, { error: "stop the running turn before closing its browser tab" });
+                    if (!session.closePaneTab)
+                        return send(res, 501, { error: "this browser provider cannot close tabs" });
+                    try {
+                        return send(res, 200, await session.closePaneTab(body.id));
+                    }
+                    catch (error) {
+                        return send(res, 400, { error: errorMessage(error) });
+                    }
+                }
+                if (!session.selectPaneTab)
+                    return send(res, 501, { error: "this browser provider cannot switch tabs" });
+                try {
+                    return send(res, 200, await session.selectPaneTab(body.id));
+                }
+                catch (error) {
+                    return send(res, 400, { error: errorMessage(error) });
+                }
+            }
+            case "POST /browser/close": {
+                res.setHeader("cache-control", "no-store");
+                const body = await readJson(req);
+                const runner = runnerFor(typeof body.session === "string" ? body.session : undefined);
+                const session = runner?.browser;
+                if (!runner || !session)
+                    return send(res, 404, { error: "no such browser session" });
+                if (runner.running)
+                    return send(res, 409, { error: "stop the running turn before stopping its browser" });
+                if (!session.running)
+                    return send(res, 200, { closed: false, running: false });
+                await session.close();
+                return send(res, 200, { closed: true, running: false });
+            }
+            /*
+             * Importing a site's sign-in from the person's own browser.
+             *
+             * GET lists what could be imported and names the browser; it lists tabs
+             * and attaches to none. POST is the dialog's confirmation — the only way
+             * anything is read out of that browser — or its "don't ask again".
+             */
+            /**
+             * Hand the person's current tab to a conversation. Asked for by the
+             * extension's side panel, from the page the person is looking at — a
+             * click of theirs, never something the agent can call.
+             */
+            case "POST /browser/adopt": {
+                res.setHeader("cache-control", "no-store");
+                const body = await readJson(req);
+                const session = runnerFor(typeof body.session === "string" ? body.session : null)?.browser;
+                if (!session)
+                    return send(res, 404, { error: "browser is disabled" });
+                if (!session.adoptYourTab)
+                    return send(res, 501, { error: "this browser cannot take one of your tabs" });
+                const tabId = typeof body.tabId === "number" || typeof body.tabId === "string" ? String(body.tabId) : "";
+                if (!tabId)
+                    return send(res, 400, { error: "tabId is required" });
+                try {
+                    return send(res, 200, await session.adoptYourTab(tabId));
+                }
+                catch (error) {
+                    return send(res, 409, { error: errorMessage(error) });
+                }
+            }
+            /** Whether the extension is connected, and how to get it; see extensionInfo. */
+            case "GET /browser/extension":
+                res.setHeader("cache-control", "no-store");
+                return send(res, 200, await extensionInfo());
+            /** Open the extension's folder, for loading it into Chrome by hand. */
+            case "POST /browser/extension/reveal": {
+                if (!opts.extensionDir || !(await isDirectory(opts.extensionDir)))
+                    return send(res, 404, { error: "no extension folder here" });
+                const result = await revealDirectory(opts.extensionDir);
+                return send(res, "error" in result ? 500 : 200, result);
+            }
+            case "GET /browser/import": {
+                res.setHeader("cache-control", "no-store");
+                const session = runnerFor(url.searchParams.get("session"))?.browser;
+                if (!session)
+                    return send(res, 404, { error: "browser is disabled" });
+                if (!session.loginImportSources)
+                    return send(res, 501, { error: "this browser provider cannot import sign-ins" });
+                try {
+                    return send(res, 200, await session.loginImportSources());
+                }
+                catch (error) {
+                    return send(res, 409, { error: errorMessage(error) });
+                }
+            }
+            case "POST /browser/import": {
+                res.setHeader("cache-control", "no-store");
+                const body = await readJson(req);
+                const runner = runnerFor(typeof body.session === "string" ? body.session : undefined);
+                const session = runner?.browser;
+                if (!runner || !session)
+                    return send(res, 404, { error: "no such browser session" });
+                if (body.action === "dismiss") {
+                    if (typeof body.site !== "string")
+                        return send(res, 400, { error: "site is required" });
+                    await session.dismissLoginImport?.(body.site);
+                    return send(res, 200, { ok: true });
+                }
+                // The import navigates the page the agent is using.
+                if (runner.running)
+                    return send(res, 409, { error: "wait for the running turn to finish before importing a sign-in" });
+                if (!session.importLogin)
+                    return send(res, 501, { error: "this browser provider cannot import sign-ins" });
+                const sites = Array.isArray(body.sites) ? body.sites.filter((site) => typeof site === "string").slice(0, 20) : [];
+                try {
+                    return send(res, 200, await session.importLogin(sites));
+                }
+                catch (error) {
+                    return send(res, 400, { error: errorMessage(error) });
+                }
+            }
             case "GET /plugin-page": {
                 res.setHeader("cache-control", "no-store");
                 const runner = runnerFor(url.searchParams.get("session"));
@@ -1370,6 +1585,10 @@ export async function startWebServer(opts) {
                     // The whole status, not just the path: the page needs to know
                     // whether the switch it draws is the user's to flip.
                     audit: await current.harness.auditStatus(),
+                    browserMode: current.harness.browserMode(),
+                    // For the browser row: whether the person's browser can be reached
+                    // now, and where to get the extension when it cannot.
+                    browserExtension: await extensionInfo(),
                     settingsPaths: {
                         user: current.harness.settings.pathFor("user"),
                         project: current.harness.settings.pathFor("project"),
@@ -1392,6 +1611,23 @@ export async function startWebServer(opts) {
                 const saved = await current.harness.setWritableRoots(body.roots);
                 return send(res, 200, { roots: saved });
             }
+            /**
+             * The built-in browser or the person's own, through the extension.
+             *
+             * A machine preference, so every project's harness moves with it — a
+             * switch that changed only the project on screen would look ignored the
+             * moment someone opened another one.
+             */
+            case "POST /settings/browser-mode": {
+                const body = await readJson(req);
+                if (body.mode !== "auto" && body.mode !== "builtin" && body.mode !== "extension") {
+                    return send(res, 400, { error: "mode must be auto, builtin or extension" });
+                }
+                for (const harness of new Set([current.harness, ...harnesses.values()])) {
+                    await harness.setBrowserMode(body.mode);
+                }
+                return send(res, 200, { mode: body.mode });
+            }
             /**
              * Who is signed in, if anyone.
              *
@@ -2253,6 +2489,7 @@ export async function startWebServer(opts) {
                     const runner = runners.get(id);
                     runner?.running?.abort();
                     runners.delete(id);
+                    await runner?.harness.closeBrowserFor(id);
                     // Its artifacts move from memory to the log half of the catalogue,
                     // and a fold taken before this session existed does not have them.
                     cachedLogs = undefined;
@@ -2282,7 +2519,9 @@ export async function startWebServer(opts) {
                     // knowing about it at all, not the absence of a transcript.
                     if (!deleted && !runners.has(id))
                         return send(res, 404, { error: "no such session" });
+                    const removed = runners.get(id);
                     runners.delete(id);
+                    await removed?.harness.closeBrowserFor(id);
                     // Its artifact log went with it, and a fold taken a moment ago
                     // still names it.
                     cachedLogs = undefined;
@@ -2344,6 +2583,7 @@ export async function startWebServer(opts) {
                 const runner = runnerFor(id);
                 if (runner)
                     runner.session.title = title;
+                broadcast({ type: "title", session: id, title });
                 return send(res, 200, { ok: true, id, title });
             }
             case "POST /upload": {
@@ -2403,9 +2643,6 @@ export async function startWebServer(opts) {
                 if (!prompt && !ids.length && !references.length) {
                     return send(res, 400, { error: "prompt is required" });
                 }
-                // Per runner, not global: a turn in one tab must not block another.
-                if (runner.running)
-                    return send(res, 409, { error: "a turn is already running" });
                 const staged = ids
                     .map((id) => (typeof id === "string" ? attachments.get(id) : undefined))
                     .filter((entry) => Boolean(entry));
@@ -2416,6 +2653,19 @@ export async function startWebServer(opts) {
                 // a composer is known to have moved on, so it is a good moment to ask
                 // what else has been abandoned.
                 sweepAttachments();
+                // Per runner, not global: a turn in one tab must not block another.
+                // A second prompt into a busy runner waits, and is shown waiting. It
+                // is not handed to the running turn on its own: putting words in front
+                // of a model mid-thought is a thing to choose, not a thing that
+                // happens because you typed fast. /sendnow is that choice.
+                //
+                // This used to 409, and the page discarded the reply, so an impatient
+                // Enter cleared the composer and lost what had been typed.
+                if (runner.running) {
+                    runner.queue.push({ id: randomUUID(), prompt, staged, references });
+                    broadcastQueue(runner);
+                    return send(res, 202, { ok: true, queued: true });
+                }
                 void runTurn(runner, prompt, staged, references);
                 return send(res, 202, { ok: true, attached: staged.length, referenced: references.length });
             }
@@ -2451,6 +2701,84 @@ export async function startWebServer(opts) {
                     runnerFor(body.session)?.running?.abort();
                 }
                 return send(res, 200, { ok: true });
+            case "POST /unqueue": {
+                const body = await readJson(req);
+                const runner = runnerFor(body.session);
+                if (!runner)
+                    return send(res, 404, { error: "no such session" });
+                // Either kind: one handed to the running turn but not yet read, or
+                // one still waiting for the turn to end.
+                if (typeof body.id === "string" && runner.agent.retract(body.id)) {
+                    broadcastQueue(runner);
+                    return send(res, 200, { ok: true });
+                }
+                const at = runner.queue.findIndex((entry) => entry.id === body.id);
+                if (at >= 0) {
+                    // The bytes came out of the staging map when this was queued, so
+                    // they are held by the entry alone and go when it does.
+                    runner.queue.splice(at, 1);
+                    broadcastQueue(runner);
+                }
+                return send(res, 200, { ok: true });
+            }
+            /**
+             * One waiting message, now, without waiting for its place in the queue.
+             *
+             * While a turn runs that means handing it to the turn — the same path a
+             * prompt typed mid-turn takes — so it is read at the next gap rather
+             * than after the whole thing. Nothing is interrupted: "now" here is as
+             * soon as the conversation has a place to put it.
+             *
+             * A message carrying files cannot ride the inbox, so it moves to the
+             * head of the queue instead and the reply says so.
+             */
+            case "POST /sendnow": {
+                const body = await readJson(req);
+                const runner = runnerFor(body.session);
+                if (!runner)
+                    return send(res, 404, { error: "no such session" });
+                const at = runner.queue.findIndex((entry) => entry.id === body.id);
+                if (at < 0)
+                    return send(res, 404, { error: "no such queued message" });
+                const entry = runner.queue[at];
+                if (!runner.running) {
+                    runner.queue.splice(at, 1);
+                    broadcastQueue(runner);
+                    void runTurn(runner, entry.prompt, entry.staged, entry.references);
+                    return send(res, 202, { ok: true, sent: true });
+                }
+                const plain = entry.prompt && !entry.staged.length && !entry.references.length;
+                if (plain && runner.agent.interject(entry.prompt)) {
+                    runner.queue.splice(at, 1);
+                    broadcastQueue(runner);
+                    return send(res, 202, { ok: true, interjected: true });
+                }
+                // Cannot be handed over, so the most that can be done is to put it
+                // first in line for when the turn ends.
+                runner.queue.splice(at, 1);
+                runner.queue.unshift(entry);
+                broadcastQueue(runner);
+                return send(res, 200, { ok: true, moved: true });
+            }
+            /**
+             * Send what is waiting, now.
+             *
+             * The queue drains itself after a turn that ends on its own, but not
+             * after an interrupt or an error — stopping means stop, and a message
+             * typed before the failure should not fire into whatever caused it.
+             * This is how the page restarts a queue left standing that way.
+             */
+            case "POST /flush": {
+                const body = await readJson(req);
+                const runner = runnerFor(body.session);
+                if (!runner)
+                    return send(res, 404, { error: "no such session" });
+                if (runner.running)
+                    return send(res, 409, { error: "a turn is already running" });
+                if (!drainQueue(runner))
+                    return send(res, 200, { ok: true, sent: false });
+                return send(res, 202, { ok: true, sent: true });
+            }
             default:
                 return send(res, 404, { error: "not found" });
         }
@@ -2469,14 +2797,14 @@ export async function startWebServer(opts) {
         // attempt could be replayed by anything that saw it in the address bar.
         pendingBrowserSignIns.delete(state);
         if (!pending) {
-            return closeTab(res, 400, "That sign-in has expired. Start it again from the app.");
+            return closeTab(res, 400, "That sign-in has expired.", "These links are only good for a few minutes. Start the sign-in again from OHarness.");
         }
         const failure = url.searchParams.get("error");
         if (failure)
-            return closeTab(res, 400, failure);
+            return closeTab(res, 400, "That sign-in did not go through.", failure);
         const code = url.searchParams.get("code") ?? "";
         if (!code)
-            return closeTab(res, 400, "The site sent no sign-in back.");
+            return closeTab(res, 400, "That sign-in did not go through.", "The site sent no sign-in back. Start it again from OHarness.");
         const result = await exchangeHandoff(code, state);
         if (result.type !== "success") {
             const message = result.error ?? "that sign-in was not accepted";
@@ -2484,19 +2812,19 @@ export async function startWebServer(opts) {
                 type: "notice",
                 message: `${pending.intent === "key" ? "getting a key" : "sign-in"} failed: ${message}`,
             });
-            return closeTab(res, 400, message);
+            return closeTab(res, 400, "That sign-in was not accepted.", message);
         }
         try {
             await current.harness.auth.complete(pending.provider, result);
         }
         catch (err) {
-            return closeTab(res, 500, errorMessage(err));
+            return closeTab(res, 500, "That sign-in could not be saved.", errorMessage(err));
         }
         // What happened, in the words of the errand that was run. "Signed in" on
         // a tab where somebody just created an API key is a small lie that makes
         // them wonder which of the two actually took.
         closeTab(res, 200, pending.intent === "key"
-            ? `That key is now in use for ${pending.provider}. You can close this tab.`
+            ? `That key is now in use for ${pending.provider}.`
             : `Signed in to ${pending.provider}.`);
         // Same as a saved key: the credential is stored, now go ask the gateway
         // what the account can actually call.
@@ -2669,6 +2997,9 @@ export async function startWebServer(opts) {
             contextWindow: model.contextWindow,
             contextUsed: model.contextWindow ? Math.min(1, used / model.contextWindow) : undefined,
             busy: Boolean(runner.running),
+            // So a reload, or a second tab, sees what is still waiting. The queue
+            // lives on the runner rather than in the page for exactly this reason.
+            queued: queueView(runner),
         };
     }
     /**
@@ -2760,6 +3091,8 @@ export async function startWebServer(opts) {
                 cwd: project.path,
                 permissionPrompt: (request, signal) => permissionPrompt(request, signal),
                 questionPrompt: (request, signal) => questionPrompt(request, signal),
+                ...(opts.browserTarget ? { browserTarget: opts.browserTarget } : {}),
+                ...(opts.browserUsePlugin ? { browserUsePlugin: opts.browserUsePlugin } : {}),
             }));
         harnesses.set(project.path, harness);
         watchConnections(harness);
@@ -2780,6 +3113,8 @@ export async function startWebServer(opts) {
                 cwd,
                 permissionPrompt: async () => false,
                 questionPrompt: async () => ({ outcome: "unavailable" }),
+                ...(opts.browserTarget ? { browserTarget: opts.browserTarget } : {}),
+                ...(opts.browserUsePlugin ? { browserUsePlugin: opts.browserUsePlugin } : {}),
             }),
         onStart: (routine, meta) => {
             if (meta.catchUp)
@@ -2885,6 +3220,46 @@ export async function startWebServer(opts) {
         });
         return snapshot;
     }
+    /**
+     * What the page needs to draw the waiting chips, without the bytes.
+     *
+     * Interjections first, and marked as such: they reach the model during the
+     * running turn, while the queue waits for it to finish. Drawn as one list
+     * because that is the order the conversation will read them in.
+     */
+    const queueView = (runner) => [
+        ...runner.agent.pendingInterjections.map((entry) => ({
+            id: entry.id,
+            text: entry.text,
+            attachments: [],
+            references: [],
+            soon: true,
+        })),
+        ...runner.queue.map((entry) => ({
+            id: entry.id,
+            text: entry.prompt,
+            attachments: entry.staged.map((file) => file.name),
+            references: entry.references,
+            soon: false,
+        })),
+    ];
+    const broadcastQueue = (runner) => {
+        broadcast({ type: "queue", session: runner.session.id, queued: queueView(runner) });
+    };
+    /**
+     * Start the next waiting prompt, if there is one.
+     *
+     * Returns whether a turn was started, so a caller can tell an empty queue
+     * from one that is now running.
+     */
+    function drainQueue(runner) {
+        const next = runner.queue.shift();
+        if (!next)
+            return false;
+        broadcastQueue(runner);
+        void runTurn(runner, next.prompt, next.staged, next.references);
+        return true;
+    }
     async function runTurn(runner, prompt, staged = [], references = []) {
         const controller = new AbortController();
         runner.running = controller;
@@ -2907,18 +3282,42 @@ export async function startWebServer(opts) {
         const note = referenceNote(references);
         const text = note ? `${note}\n\n${prompt}` : prompt;
         const input = staged.length ? buildMessage(text, staged) : text;
+        let failed = false;
+        // The session names itself from its first prompt once the agent takes it
+        // in. Said the moment that happens: waiting for the idle state left a new
+        // tab reading "Untitled" for the whole of its first turn.
+        let untitled = !runner.session.title;
         try {
             for await (const event of runner.agent.run(input, { signal: controller.signal })) {
+                if (untitled && runner.session.title) {
+                    untitled = false;
+                    broadcast({ type: "title", session: id, title: runner.session.title });
+                }
                 // 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;
+                // The agent reports a provider failure as an event and breaks its own
+                // loop rather than throwing, so the catch below never sees it — and a
+                // queue that drained into a dead provider would replay the failure
+                // once per waiting message.
+                if (event.type === "error" && event.fatal)
+                    failed = true;
+                // Read into the conversation: the chip goes, and the words appear in
+                // the transcript where the model saw them rather than where they were
+                // typed. `prompt` is what the page draws a user message from.
+                if (event.type === "interjected") {
+                    broadcastQueue(runner);
+                    broadcast({ type: "prompt", session: id, text: event.text, interjected: true });
+                    continue;
+                }
                 broadcast({ ...event, session: id });
             }
         }
         catch (err) {
+            failed = true;
             broadcast({
                 type: "error",
                 session: id,
@@ -2937,17 +3336,35 @@ export async function startWebServer(opts) {
                 ...(typeof err?.provider === "string"
                     ? { provider: err.provider }
                     : {}),
+                // And the code, for the failure that carries no status: nothing was
+                // sent, so there is no HTTP answer to read — but "not signed in" is
+                // just as much a dialog to open as a refused key is.
+                ...(typeof err?.code === "string"
+                    ? { code: err.code }
+                    : {}),
                 fatal: true,
             });
         }
         finally {
             runner.running = undefined;
+            // The window between the loop's last read of the inbox and the run
+            // admitting it is over. Whatever landed in it is put at the head of the
+            // queue rather than left unread inside a finished agent.
+            const unread = runner.agent.takeUnread();
+            for (let i = unread.length - 1; i >= 0; i--) {
+                runner.queue.unshift({ id: unread[i].id, prompt: unread[i].text, staged: [], references: [] });
+            }
             broadcast({
                 type: "idle",
                 session: id,
                 state: state(runner),
                 changes: runner.ledger.list(),
             });
+            // Only after a turn that ended on its own. An interrupt means stop, and
+            // an error would usually meet the next prompt with the same error, so
+            // both leave the queue standing for the person to send or drop.
+            if (!controller.signal.aborted && !failed)
+                drainQueue(runner);
         }
     }
     function stream(res) {
@@ -3116,6 +3533,18 @@ export async function startWebServer(opts) {
             return send(res, 404, { error: "no such artifact" });
         sendArtifact(res, found.artifact, found.revision);
     }
+    /**
+     * What the page needs to help someone get the browser extension: whether it
+     * is connected now, where to get it, and — where this app ships its files —
+     * that there is a folder to load it from.
+     */
+    async function extensionInfo() {
+        return {
+            connected: await extensionHostReachable(),
+            installUrl: EXTENSION_INSTALL_URL,
+            folder: Boolean(opts.extensionDir) && (await isDirectory(opts.extensionDir)),
+        };
+    }
     function constantTimeEqual(supplied, expected) {
         if (!supplied)
             return false;
@@ -3158,6 +3587,9 @@ export async function startWebServer(opts) {
     }
     const address = server.address();
     const port = typeof address === "object" && address ? address.port : opts.port;
+    const presence = opts.presence === false
+        ? undefined
+        : announcePresence({ url: `http://${host}:${port}`, token, kind: opts.presence?.kind ?? "web" });
     return {
         url: `http://${host}:${port}/?token=${token}`,
         token,
@@ -3165,6 +3597,7 @@ export async function startWebServer(opts) {
         questionPrompt,
         async close() {
             clearInterval(staleTimer);
+            presence?.close();
             await routines.close();
             for (const unsubscribe of connectionSubscriptions)
                 unsubscribe();
@@ -3376,35 +3809,88 @@ function isLoopbackHost(host) {
     }
     return hostname === "127.0.0.1" || hostname === "[::1]" || hostname === "localhost";
 }
-function closeTab(res, status, message) {
-    const escaped = message.replace(/[&<>]/g, (char) => char === "&" ? "&amp;" : char === "<" ? "&lt;" : "&gt;");
+/**
+ * The last thing a sign-in shows anybody.
+ *
+ * A tab the app opened, on a loopback port, that exists to say one sentence
+ * and be closed. It is still the product's own page, though — for a lot of
+ * people it is the first screen after "Continue with Google" — so it gets the
+ * mark, a state that is legible at a glance, and a line saying what to do
+ * next. `message` is the sentence; `hint` is what follows it, and defaults to
+ * the only useful instruction a successful sign-in has.
+ *
+ * Failure is carried by the badge and by one tinted rule, not by a heading set
+ * in red: a red sentence reads as the page shouting, and the sentence is
+ * usually the calmest thing on it ("that sign-in has expired").
+ */
+function closeTab(res, status, message, hint) {
     const ok = status < 400;
+    const escape = (text) => text.replace(/[&<>]/g, (char) => (char === "&" ? "&amp;" : char === "<" ? "&lt;" : "&gt;"));
+    const heading = escape(message);
+    const body = escape(hint ?? (ok ? "You can close this tab and go back to OHarness." : "Start it again from OHarness."));
     const page = `<!doctype html><meta charset="utf-8"><title>OHarness</title>` +
         `<meta name="viewport" content="width=device-width,initial-scale=1">` +
         `<style>` +
         `:root{color-scheme:light dark;` +
-        `--bg:#fff;--card:#fff;--fg:#1a1a1a;--dim:#6b7280;--line:#00000012;--mark:#111827;--bad:#b91c1c}` +
+        `--bg:#fafafa;--card:#fff;--fg:#141618;--dim:#6b7280;--line:#0000001a;--mark:#111827;` +
+        `--good:#047857;--good-bg:#0478571f;--bad:#b91c1c;--bad-bg:#b91c1c1a;--glow:#f9731640}` +
         `@media(prefers-color-scheme:dark){:root{` +
-        `--bg:#0e1013;--card:#15171c;--fg:#e6e6e6;--dim:#8b93a1;--line:#ffffff14;--mark:#e5e7eb;--bad:#f87171}}` +
+        `--bg:#0a0b0d;--card:#141619;--fg:#e8e8e8;--dim:#8b93a1;--line:#ffffff14;--mark:#e5e7eb;` +
+        `--good:#6ee7b7;--good-bg:#6ee7b71f;--bad:#f87171;--bad-bg:#f871711f;--glow:#f9731636}}` +
         `*{box-sizing:border-box}` +
-        `body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px;` +
+        // The two washes are the site's own lighting, reduced to what a page this
+        // small can carry: a warm pool above the card and a cooler one below it.
+        // Fixed, so a short page does not scroll them into view as a seam.
+        `body{margin:0;min-height:100svh;display:grid;place-items:center;padding:24px;` +
         `background:var(--bg);color:var(--fg);` +
+        `background-image:radial-gradient(60% 46% at 50% 4%,var(--glow) 0%,transparent 68%),` +
+        `radial-gradient(48% 38% at 50% 100%,#6366f11f 0%,transparent 70%);` +
+        `background-attachment:fixed;` +
         `font:15px/1.6 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Inter,sans-serif;` +
         `-webkit-font-smoothing:antialiased}` +
-        `main{width:100%;max-width:26rem;padding:28px;border-radius:16px;background:var(--card);` +
-        `border:1px solid var(--line);box-shadow:0 1px 2px #0000000f,0 20px 60px #00000014;text-align:center}` +
-        `svg{width:34px;height:34px;color:var(--mark)}` +
-        `h1{margin:14px 0 0;font-size:16px;font-weight:600;letter-spacing:-.01em}` +
-        `h1.bad{color:var(--bad)}` +
-        `p{margin:8px 0 0;font-size:13px;color:var(--dim)}` +
+        `main{width:100%;max-width:25rem;padding:32px 28px 26px;border-radius:18px;background:var(--card);` +
+        `border:1px solid var(--line);box-shadow:0 1px 2px #0000000f,0 24px 60px #00000026;text-align:center;` +
+        `animation:rise .34s cubic-bezier(.2,.8,.3,1) both}` +
+        `@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}` +
+        `@media(prefers-reduced-motion:reduce){main{animation:none}}` +
+        // The mark alone, in the state's colour. A disc behind it made a third
+        // bordered shape on a card that only has one thing to say, and a filled
+        // circle reads as a notification — nothing here needs acknowledging.
+        `.badge{display:grid;place-items:center;color:var(--tone)}` +
+        `.badge svg{width:30px;height:30px}` +
+        `.ok{--tone:var(--good);--tone-bg:var(--good-bg)}` +
+        `.bad{--tone:var(--bad);--tone-bg:var(--bad-bg)}` +
+        `h1{margin:18px 0 0;font-size:17px;font-weight:600;letter-spacing:-.012em;line-height:1.4}` +
+        `p{margin:9px 0 0;font-size:13.5px;color:var(--dim)}` +
+        // The mark, at a size that says whose page this is without competing with
+        // the one sentence it exists to show. No rule above it: the gap already
+        // separates it, and a divider on a card this short is a second border
+        // around almost nothing.
+        `footer{display:flex;align-items:center;justify-content:center;gap:7px;` +
+        `margin-top:26px;opacity:.75;` +
+        `font-size:12px;font-weight:550;letter-spacing:.01em;color:var(--dim)}` +
+        `footer svg{width:15px;height:15px;color:var(--mark)}` +
         `</style>` +
         `<body><main>` +
+        `<div class="badge ${ok ? "ok" : "bad"}">` +
+        `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" ` +
+        `stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">` +
+        (ok
+            ? `<path d="M4 12.5 9.5 18 20 6.5"/>`
+            : // The ring belongs to the glyph, not behind it: a bare exclamation
+                // stroke, with nothing around it, reads as a piece of punctuation
+                // that lost its sentence.
+                `<circle cx="12" cy="12" r="9.2" stroke-width="1.9"/><path d="M12 7.4v5.4"/>` +
+                    `<circle cx="12" cy="16.4" r="1.15" fill="currentColor" stroke="none"/>`) +
+        `</svg></div>` +
+        `<h1>${heading}</h1>` +
+        `<p>${body}</p>` +
+        `<footer>` +
         `<svg viewBox="0 0 32 32" fill="none" stroke="currentColor" stroke-width="2.2" ` +
         `stroke-linecap="round" aria-hidden="true">` +
         `<path d="M20 6h-8a6 6 0 0 0-6 6v8"/><path d="M12 26h8a6 6 0 0 0 6-6v-8"/>` +
         `<circle cx="16" cy="16" r="3.5" fill="currentColor" stroke="none"/></svg>` +
-        `<h1${ok ? "" : ' class="bad"'}>${escaped}</h1>` +
-        (ok ? `<p>You can close this tab and go back to OHarness.</p>` : "") +
+        `OHarness</footer>` +
         `</main>`;
     res.writeHead(status, {
         "content-type": "text/html; charset=utf-8",