@xingjisoft/neutrino 0.5.2 → 0.6.2

package/dist/web/terminalBridge.js

@@ -1,6 +1,6 @@
 import { randomBytes, timingSafeEqual } from "node:crypto";
 import http from "node:http";
-import { resolveModelSelection } from "../config.js";
+import { resolveModelSelection, isAgentMode } from "../config.js";
 import { hub } from "./hub.js";
 function sendJson(res, status, data) {
     res.writeHead(status, { "Content-Type": "application/json", "Cache-Control": "no-store" });
@@ -82,6 +82,15 @@ export async function startTerminalBridge() {
                     return;
                 }
             }
+            else if (action === "agent-mode") {
+                if (!isAgentMode(body.mode))
+                    throw new Error("invalid agent mode");
+                const result = hub.setAgentMode(key, body.mode);
+                if (!result.ok) {
+                    sendJson(res, 409, { error: result.error });
+                    return;
+                }
+            }
             else if (action === "model") {
                 const result = hub.configure(key, resolveModelSelection(body));
                 if (!result.ok) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xingjisoft/neutrino",
-  "version": "0.5.2",
+  "version": "0.6.2",
   "description": "XINGJI Neutrino - a CLI coding agent in the terminal.",
   "type": "module",
   "license": "Apache-2.0",
@@ -14,11 +14,11 @@
     "web"
   ],
   "engines": {
-    "node": ">=18.0.0"
+    "node": ">=18.17.0"
   },
   "scripts": {
     "build": "tsc -p tsconfig.json",
-    "test": "npm run build && node scripts/test-paste.mjs && node scripts/test-mouse.mjs && node scripts/test-cursor.mjs && node scripts/test-selection.mjs && node scripts/test-drag-scroll.mjs && node scripts/test-selection-performance.mjs && node scripts/test-copy.mjs && node scripts/test-scrollbar.mjs && node scripts/test-render.mjs && node scripts/test-drift.mjs && node scripts/test-sanitize.mjs && node scripts/test-markdown.mjs && node scripts/test-wrap.mjs && node scripts/test-fetch.mjs && node scripts/test-compact.mjs && node scripts/test-history-fold.mjs && node scripts/test-web-history.mjs && node scripts/test-web-mobile-history.mjs && node scripts/test-session-migration.mjs && node scripts/test-web-session-migration.mjs && node scripts/test-web-default.mjs && node scripts/test-turn-fold.mjs && node scripts/test-long-turn.mjs && node scripts/test-plan.mjs && node scripts/test-subagent.mjs && node scripts/test-web-settings.mjs && node scripts/test-update.mjs && node scripts/test-update-ui.mjs && node scripts/test-update-web.mjs && node scripts/test-settings-update.mjs && node scripts/test-update-check.mjs && node scripts/test-update-watch.mjs && node scripts/test-model-intensity.mjs && node scripts/test-background.mjs && node scripts/test-background-lifetime.mjs && node scripts/test-web-markdown.mjs && node scripts/test-web-i18n.mjs && node scripts/test-web-workspaces.mjs && node scripts/test-tools.mjs && node scripts/test-approval.mjs && node scripts/test-approval-review.mjs && node scripts/test-approval-ui.mjs && node scripts/test-web-approval-details.mjs && node scripts/test-web-sidebar-status.mjs && node scripts/test-web-seen.mjs && node scripts/test-approval-mode.mjs && node scripts/test-approval-context.mjs && node scripts/test-settings-render.mjs && node scripts/test-approval-flow.mjs && node scripts/test-web.mjs && node scripts/test-web-settings-http.mjs && node scripts/test-web-lan.mjs && node scripts/test-web-auth.mjs && node scripts/test-web-auth-ui.mjs && node scripts/test-web-pro.mjs && node scripts/test-pro-preflight.mjs && node scripts/test-pro-runtime.mjs && node scripts/test-pro-team.mjs && node scripts/test-pro-ui.mjs && node scripts/test-interrupt.mjs && node scripts/test-terminal-lifecycle.mjs && node scripts/test-persistence.mjs && node scripts/test-resilience.mjs && node scripts/test-approval-timeout.mjs && node scripts/test-approval-hardening.mjs && node scripts/test-approval-extreme.mjs && node scripts/test-approval-reason.mjs",
+    "test": "npm run build && node scripts/test-paste.mjs && node scripts/test-mouse.mjs && node scripts/test-cursor.mjs && node scripts/test-selection.mjs && node scripts/test-drag-scroll.mjs && node scripts/test-selection-performance.mjs && node scripts/test-copy.mjs && node scripts/test-scrollbar.mjs && node scripts/test-render.mjs && node scripts/test-drift.mjs && node scripts/test-sanitize.mjs && node scripts/test-markdown.mjs && node scripts/test-wrap.mjs && node scripts/test-fetch.mjs && node scripts/test-web-search.mjs && node scripts/test-search-network.mjs && node scripts/test-compact.mjs && node scripts/test-history-fold.mjs && node scripts/test-web-history.mjs && node scripts/test-web-mobile-history.mjs && node scripts/test-session-migration.mjs && node scripts/test-web-session-migration.mjs && node scripts/test-web-default.mjs && node scripts/test-turn-fold.mjs && node scripts/test-long-turn.mjs && node scripts/test-plan.mjs && node scripts/test-agent-modes.mjs && node scripts/test-subagent.mjs && node scripts/test-task-runtime.mjs && node scripts/test-task-budget.mjs && node scripts/test-web-settings.mjs && node scripts/test-update.mjs && node scripts/test-update-ui.mjs && node scripts/test-update-web.mjs && node scripts/test-settings-update.mjs && node scripts/test-update-check.mjs && node scripts/test-update-watch.mjs && node scripts/test-model-intensity.mjs && node scripts/test-background.mjs && node scripts/test-background-lifetime.mjs && node scripts/test-web-markdown.mjs && node scripts/test-web-i18n.mjs && node scripts/test-web-workspaces.mjs && node scripts/test-tools.mjs && node scripts/test-approval.mjs && node scripts/test-approval-review.mjs && node scripts/test-approval-ui.mjs && node scripts/test-web-approval-details.mjs && node scripts/test-web-sidebar-status.mjs && node scripts/test-web-seen.mjs && node scripts/test-approval-mode.mjs && node scripts/test-approval-context.mjs && node scripts/test-settings-render.mjs && node scripts/test-approval-flow.mjs && node scripts/test-web.mjs && node scripts/test-web-settings-http.mjs && node scripts/test-web-lan.mjs && node scripts/test-web-auth.mjs && node scripts/test-web-auth-ui.mjs && node scripts/test-web-pro.mjs && node scripts/test-pro-preflight.mjs && node scripts/test-pro-runtime.mjs && node scripts/test-pro-team.mjs && node scripts/test-pro-ui.mjs && node scripts/test-interrupt.mjs && node scripts/test-terminal-lifecycle.mjs && node scripts/test-persistence.mjs && node scripts/test-resilience.mjs && node scripts/test-approval-timeout.mjs && node scripts/test-approval-hardening.mjs && node scripts/test-approval-extreme.mjs && node scripts/test-approval-reason.mjs",
     "prepare": "npm run build",
     "web": "node dist/bin.js web"
   },
@@ -31,7 +31,12 @@
     "coding"
   ],
   "devDependencies": {
-    "@types/node": "^22.0.0",
-    "typescript": "^5.5.0"
+    "@types/node": "^22.0.0"
+  },
+  "dependencies": {
+    "@cloudflare/codemode": "0.5.6",
+    "quickjs-emscripten": "0.32.0",
+    "typescript": "^5.5.0",
+    "undici": "^6.29.1"
   }
 }

package/web/README.md

@@ -6,8 +6,9 @@ A small, dependency-free single page app that is served by the Neutrino CLI at
 - browse every saved conversation grouped by working directory (like Codex),
   with only the five latest transcripts per path shown and the rest collapsed;
 - watch a running terminal conversation stream in real time: the work behind every
-  finished turn folds into one line that opens on a click, while the reply itself
-  stays on screen (the turn being answered is open, and a pause is not a fold);
+  finished turn folds into one line that opens on a click, while the full user
+  input and final reply stay on screen; earlier history also folds only AI output
+  (the turn being answered is open, and a pause is not a fold);
 - read replies as rendered markdown: headings, nested/task lists, tables, block
   quotes, code fences, emphasis, safe links and images; raw HTML is escaped;
 - start a new conversation in a working directory you choose, including a folder

package/web/app.js

@@ -1,7 +1,7 @@
 import { createSettingsUI } from "./settings.js";
 import { createProUI } from "./pro.js";
 import { renderMarkdown as renderMarkdownHtml } from "./markdown.js";
-import { turnAnswerIndex, turnFolds, turnPreview, turnRanges } from "./turns.js";
+import { turnAnswerIndex, turnFolds, turnRanges } from "./turns.js";
 import { applyTranslations, getLanguage as currentLanguage, locale as currentLocale, setLanguage as setI18nLanguage, t as translate } from "./i18n.js";
 
 // Neutrino web UI — a dependency-free single page app.
@@ -445,6 +445,9 @@ const el = {
   messages: document.getElementById("messages"),
   composer: document.getElementById("composer"),
   input: document.getElementById("input"),
+  modePicker: document.getElementById("agent-mode-picker"),
+  modeLabel: document.getElementById("agent-mode-label"),
+  modeFeedback: document.getElementById("agent-mode-feedback"),
   send: document.getElementById("send"),
   approval: document.getElementById("approval"),
   emptyNewChat: document.getElementById("empty-new-chat"),
@@ -593,6 +596,148 @@ function storedWorkspace() {
   return { key: pathKey(path), path };
 }
 
+const AGENT_MODE_LABELS = { standard: "Standard mode", ptc: "PTC mode", fast: "Fast mode", pro: "Professional mode" };
+let newAgentMode = readStorage("neutrino.agent-mode");
+if (!["standard", "ptc", "fast"].includes(newAgentMode)) newAgentMode = "standard";
+let agentModePending = Promise.resolve();
+let agentModeChanging = false;
+let workspaceNavigation = false;
+let agentModeError = "";
+
+function clearAgentModeFeedback() {
+  agentModeError = "";
+  agentModePending = Promise.resolve();
+}
+
+function currentAgentMode() {
+  if (PRO_MODE) return "pro";
+  if (state.selection?.kind === "live") return state.snapshot?.agentMode || "standard";
+  if (state.selection?.kind === "file") return state.fileData?.agent_mode || "standard";
+  return newAgentMode;
+}
+
+function renderAgentMode() {
+  if (!el.modePicker || !el.modeLabel) return;
+  const mode = currentAgentMode();
+  el.modeLabel.removeAttribute?.("data-i18n");
+  el.modeLabel.textContent = tr(AGENT_MODE_LABELS[mode] || AGENT_MODE_LABELS.standard);
+  const nextTurn = state.snapshot?.busy && state.snapshot.activeAgentMode !== state.snapshot.agentMode;
+  el.modePicker.classList.toggle("is-pending", Boolean(agentModeChanging || nextTurn));
+  for (const button of el.modePicker.querySelectorAll?.("[data-agent-mode]") || []) {
+    button.setAttribute("aria-checked", String(button.dataset.agentMode === mode));
+    button.disabled = agentModeChanging || workspaceNavigation;
+  }
+  if (el.modeFeedback) {
+    el.modeFeedback.textContent = agentModeError || (agentModeChanging ? tr("Changing mode…") : nextTurn ? tr("Applies to the next turn") : "");
+    el.modeFeedback.classList.toggle("error", Boolean(agentModeError));
+  }
+}
+
+async function chooseAgentMode(mode) {
+  if (!Object.hasOwn(AGENT_MODE_LABELS, mode) || agentModeChanging || workspaceNavigation || mode === currentAgentMode()) return;
+  const selected = state.selection;
+  agentModeChanging = true;
+  agentModeError = "";
+  if (el.modePicker) renderAgentMode();
+  el.modePicker.open = false;
+  try {
+    if (mode === "pro" || PRO_MODE) {
+      await switchWorkspaceMode(mode);
+    } else if (selected?.kind === "live") {
+      const response = await apiFetch(`/api/live/${encodeURIComponent(selected.key)}/agent-mode`, {
+        method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ mode }),
+      });
+      const body = await response.json();
+      if (!response.ok) throw new Error(apiError(body, `HTTP ${response.status}`));
+      if (state.selection === selected) { state.snapshot = body.snapshot; renderLive(); }
+    } else if (selected?.kind === "file") {
+      await continueSession(selected.id, preferences.selectionForFile(selected.id), mode);
+    } else {
+      newAgentMode = mode;
+    }
+    if (mode !== "pro") { newAgentMode = mode; writeStorage("neutrino.agent-mode", mode); }
+  } catch (error) {
+    if (state.selection !== selected) return;
+    agentModeError = tr("Could not change mode: {error}", { error: error.message });
+    throw error;
+  } finally { agentModeChanging = false; renderAgentMode(); }
+}
+
+async function switchWorkspaceMode(mode) {
+  const cwd = selectionCwd() || state.workspace?.path;
+  if (!cwd) throw new Error(tr("Select a working directory first."));
+  const targetPro = mode === "pro";
+  const response = await fetch(targetPro ? "/pro/api/conversations" : "/api/conversations", {
+    method: "POST", credentials: "same-origin", headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ cwd, ...(targetPro ? {} : { agent_mode: mode }) }),
+  });
+  const body = await response.json();
+  if (response.status === 401) showGate();
+  if (!response.ok) throw new Error(apiError(body, `HTTP ${response.status}`));
+  workspaceNavigation = true;
+  if (el.modePicker) renderAgentMode();
+  try { sessionStorage.setItem(`neutrino.workspace-draft.${body.key}`, el.input.value); } catch { /* Navigation still works without storage. */ }
+  const target = `${targetPro ? "/pro" : "/"}?live=${encodeURIComponent(body.key)}`;
+  if (targetPro) startProTransition(target);
+  else { try { location.assign(target); } catch { location.href = target; } }
+}
+
+/** A transferred chat remains reloadable until the user chooses another view. */
+function clearLinkedConversation(keepKey) {
+  const params = new URLSearchParams(location.search);
+  if (!params.has("live") || params.get("live") === keepKey) return;
+  params.delete("live");
+  const query = params.toString();
+  try { history.replaceState(history.state, "", location.pathname + (query ? `?${query}` : "") + location.hash); } catch { /* History is optional. */ }
+}
+
+async function openLinkedConversation() {
+  const key = new URLSearchParams(location.search).get("live");
+  if (!key || state.selection) return false;
+  try {
+    const response = await apiFetch(`/api/live/${encodeURIComponent(key)}`, { cache: "no-store" });
+    const body = await response.json();
+    if (!response.ok) throw new Error(apiError(body, `HTTP ${response.status}`));
+    if (state.selection) return false;
+    setWorkspace({ path: body.cwd });
+    await selectLive(key);
+    state.snapshot = body;
+    renderLive();
+    setConversationView(true);
+    try {
+      const storageKey = `neutrino.workspace-draft.${key}`;
+      el.input.value = sessionStorage.getItem(storageKey) || "";
+      sessionStorage.removeItem(storageKey);
+    } catch { /* Storage is optional. */ }
+    autosize(); el.input.focus();
+    return true;
+  } catch (error) { el.sub.textContent = error.message; return false; }
+}
+
+function initializeAgentMode() {
+  if (!el.modePicker?.querySelectorAll) return;
+  for (const button of el.modePicker.querySelectorAll("[data-agent-mode]")) {
+    button.addEventListener("click", () => {
+      agentModePending = chooseAgentMode(button.dataset.agentMode);
+      // Keep the rejection available to sendMessage while avoiding an unhandled promise.
+      void agentModePending.catch(() => {});
+    });
+  }
+  el.modePicker.addEventListener("keydown", event => {
+    if (event.key === "Escape") { el.modePicker.open = false; el.modePicker.querySelector("summary")?.focus(); event.stopPropagation(); }
+    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) return;
+    event.preventDefault(); el.modePicker.open = true;
+    const buttons = [...el.modePicker.querySelectorAll("[data-agent-mode]")];
+    let index = buttons.indexOf(document.activeElement);
+    index = event.key === "Home" ? 0 : event.key === "End" ? buttons.length - 1 : (index + (event.key === "ArrowDown" ? 1 : -1) + buttons.length) % buttons.length;
+    buttons[index]?.focus();
+  });
+  document.addEventListener("pointerdown", event => {
+    if (el.modePicker.open && !el.modePicker.contains(event.target)) el.modePicker.open = false;
+  });
+  if (el.modePicker) renderAgentMode();
+}
+
 let proUI = null;
 const preferences = createSettingsUI({
   apiFetch,
@@ -909,20 +1054,42 @@ function renderGroup(group, options = {}) {
   wrap.className = "group";
 
   const collapsed = !options.forceOpen && state.collapsed.has(group.key);
+  // The row answers "start something here", not "how much is already here": a
+  // plus beside the folder opens a fresh conversation in it, the way Codex puts
+  // a project's own new-chat control next to the project. Two actions cannot
+  // share one button, so the row holds the folder and the plus side by side.
+  const head = document.createElement("div");
+  head.className = "group-head";
+
   const header = document.createElement("button");
   header.className = "group-header";
+  header.type = "button";
+  header.setAttribute("aria-expanded", String(!collapsed));
   header.innerHTML =
     `<span class="chevron${collapsed ? " collapsed" : ""}">` +
     '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>' +
     "</span>" +
-    `<span class="path" title="${escapeHtml(group.cwd)}">${escapeHtml(shortenPath(group.cwd))}</span>` +
-    `<span class="count">${group.sessions.length}</span>`;
+    `<span class="path" title="${escapeHtml(group.cwd)}">${escapeHtml(shortenPath(group.cwd))}</span>`;
   header.addEventListener("click", () => {
     if (state.collapsed.has(group.key)) state.collapsed.delete(group.key);
     else state.collapsed.add(group.key);
     renderSidebar();
   });
-  wrap.appendChild(header);
+  head.appendChild(header);
+
+  if (group.cwd) {
+    const start = document.createElement("button");
+    start.className = "icon-btn group-new";
+    start.type = "button";
+    start.title = tr("New conversation in this folder");
+    start.setAttribute("aria-label", tr("New conversation in this folder"));
+    start.innerHTML =
+      '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>';
+    start.addEventListener("click", () => startConversationIn(group.cwd));
+    head.appendChild(start);
+  }
+
+  wrap.appendChild(head);
 
   if (collapsed) return wrap;
 
@@ -956,6 +1123,19 @@ function renderGroup(group, options = {}) {
   return wrap;
 }
 
+/**
+ * The plus on a folder header. It opens that folder's landing view, where the
+ * next message becomes a new conversation in that directory, so starting one
+ * costs a click instead of a dialog.
+ */
+function startConversationIn(cwd) {
+  const path = String(cwd ?? "").trim();
+  if (!path) return;
+  renderWorkspaceLanding(path);
+  setConversationView(true);
+  el.input?.focus?.();
+}
+
 function isSelected(session) {
   const selection = state.selection;
   if (!selection) return false;
@@ -1243,6 +1423,7 @@ function resetMessagePane(text) {
 }
 
 async function selectLive(key) {
+  if (el.modePicker) { clearAgentModeFeedback(); clearLinkedConversation(key); }
   preferences.clear();
   closeStream();
   state.selection = { kind: "live", key };
@@ -1319,6 +1500,7 @@ function closeStream() {
 }
 
 async function selectFile(id) {
+  if (el.modePicker) { clearAgentModeFeedback(); clearLinkedConversation(); }
   preferences.clear();
   closeStream();
   state.selection = { kind: "file", id };
@@ -1364,6 +1546,7 @@ function renderFile(data) {
   renderFileControls(data);
   maybeOpenPlan(data.plan);
   renderPlanCard(data);
+  if (el.modePicker) renderAgentMode();
 }
 
 /**
@@ -1410,8 +1593,10 @@ function renderFileControls(data) {
 }
 
 /** Attach to a resumed conversation, creating it server-side when needed. */
-async function continueSession(id, selection = preferences.selectionForFile(id)) {
-  const payload = PRO_MODE ? { pro_preset: currentProPreset() } : selection ? { selection } : undefined;
+async function continueSession(id, selection = preferences.selectionForFile(id), agentMode) {
+  const payload = PRO_MODE ? { pro_preset: currentProPreset() } : {
+    ...(selection ? { selection } : {}), ...(agentMode ? { agent_mode: agentMode } : {}),
+  };
   const response = await apiFetch(`/api/session/${encodeURIComponent(id)}/continue`, {
     method: "POST",
     headers: payload ? { "Content-Type": "application/json" } : undefined,
@@ -1425,6 +1610,7 @@ async function continueSession(id, selection = preferences.selectionForFile(id))
 
 function setComposerMode(mode) {
   state.composerMode = mode;
+  if (el.modePicker) renderAgentMode();
   el.agentActions.classList.add("hidden");
   el.composer.classList.remove("hidden");
   el.input.placeholder = mode === "resume"
@@ -1626,6 +1812,7 @@ function renderLive() {
   });
   maybeOpenPlan(snapshot.plan);
   renderPlanCard(snapshot);
+  if (el.modePicker) renderAgentMode();
 }
 
 async function changeApprovalMode(key, mode) {
@@ -1687,7 +1874,7 @@ function renderControls(snapshot) {
   // review callback is still winding down.
   const reviewing = snapshot.approval ? null : snapshot.reviewing;
   const subagent = snapshot.subagent;
-  badge.textContent = snapshot.paused
+  badge.textContent = snapshot.task?.state === "cancelling" ? tr("Stopping tasks…") : snapshot.paused
     ? tr("paused")
     : snapshot.busy
       ? snapshot.compressing
@@ -1702,10 +1889,10 @@ function renderControls(snapshot) {
       : tr("idle");
   el.controls.appendChild(badge);
 
-  if (snapshot.saveError) {
+  if (snapshot.saveError || snapshot.task?.persistenceError) {
     const warning = document.createElement("span");
     warning.className = "badge paused";
-    warning.textContent = tr("History save failed: {error}", { error: snapshot.saveError });
+    warning.textContent = tr("History save failed: {error}", { error: snapshot.saveError || snapshot.task?.persistenceError });
     el.controls.appendChild(warning);
   }
 
@@ -1766,30 +1953,48 @@ function renderMessageList(messages, streaming, options) {
     context.end <= original.length && typeof context.summary === "string" && context.summary.trim()
     ? context.end : 0;
   if (end) {
-    const details = document.createElement("details");
-    details.className = "conversation-history";
-    const summary = document.createElement("summary");
-    summary.textContent = typeof tr === "function"
-      ? tr("Earlier conversation · {n} messages", { n: end })
-      : `Earlier conversation · ${end} messages`;
-    details.appendChild(summary);
-    const body = document.createElement("div");
-    body.className = "history-messages";
-    details.appendChild(body);
-    const populate = () => {
-      if (body.childNodes.length) return;
-      original.slice(0, end).forEach((message, index) => body.appendChild(renderMessage(message, index)));
-    };
-    details.open = state.openContext === end;
-    if (details.open) populate();
-    details.addEventListener("toggle", () => {
-      // Detached disclosures can emit a delayed toggle during a stream repaint.
-      if (!details.isConnected) return;
-      state.openContext = details.open ? end : null;
-      if (details.open) populate();
-      else body.replaceChildren();
-    });
-    el.messages.appendChild(details);
+    // Keep user input in place and fold only the AI output between prompts.
+    // The disclosures share one expansion state for this compressed prefix.
+    const sections = [];
+    for (let index = 0; index < end;) {
+      if (original[index].role === "user") {
+        el.messages.appendChild(renderMessage(original[index], index));
+        index++;
+        continue;
+      }
+      const start = index;
+      while (index < end && original[index].role !== "user") index++;
+      const archived = original.slice(start, index);
+      const details = document.createElement("details");
+      details.className = "conversation-history";
+      const summary = document.createElement("summary");
+      summary.textContent = typeof tr === "function"
+        ? tr("Earlier conversation · {n} messages", { n: archived.length })
+        : `Earlier conversation · ${archived.length} messages`;
+      details.appendChild(summary);
+      const body = document.createElement("div");
+      body.className = "history-messages";
+      details.appendChild(body);
+      const populate = () => {
+        if (body.childNodes.length) return;
+        archived.forEach((message, offset) => body.appendChild(renderMessage(message, start + offset)));
+      };
+      const sync = (open) => {
+        if (details.open !== open) details.open = open;
+        if (open) populate();
+        else body.replaceChildren();
+      };
+      sections.push(sync);
+      sync(state.openContext === end);
+      details.addEventListener("toggle", () => {
+        // Detached disclosures can emit a delayed toggle during a stream repaint.
+        if (!details.isConnected) return;
+        const open = details.open;
+        state.openContext = open ? end : null;
+        for (const sync of sections) sync(open);
+      });
+      el.messages.appendChild(details);
+    }
   }
   // Render the tail one turn at a time: a finished turn folds its work behind a
   // summary line and keeps its reply; a running one stays fully open. The turn in
@@ -1842,6 +2047,12 @@ function renderMessage(message, index) {
       `<span class="tool-args">${escapeHtml(truncate(safeJson(message.arguments), 120))}</span>`;
     details.appendChild(summary);
 
+    if (message.name === "execute_ts" && typeof message.arguments?.code === "string") {
+      const program = document.createElement("pre");
+      program.className = "tool-result program-source";
+      program.textContent = message.arguments.code;
+      details.appendChild(program);
+    }
     const result = document.createElement("pre");
     result.className = "tool-result";
     result.textContent = message.result || "(no output)";
@@ -1865,8 +2076,8 @@ function renderMessage(message, index) {
 }
 
 /**
- * A finished turn: its work folded behind one control line, its reply always on
- * screen below it. The folded messages are rendered on first open and dropped
+ * A finished turn: its complete user input above the fold, its reply below it.
+ * The folded AI messages are rendered on first open and dropped
  * again on close, so a long transcript costs nothing until the reader asks for
  * it. Nothing is lost either way: this is presentation only, and the saved
  * transcript always holds every message.
@@ -1878,25 +2089,27 @@ function renderTurnFold(start, messages) {
     ? tr(text, values)
     : String(text).replace(/\{(\w+)\}/g, (match, name) =>
       values && Object.prototype.hasOwnProperty.call(values, name) ? String(values[name]) : match));
-  // The reply is never folded away, so a turn renders as a group: the fold (the
-  // prompt line plus the work it hides) and, right below it, the answer itself.
+  // User input and the reply stay outside the disclosure, in transcript order.
   const reply = turnAnswerIndex(messages);
   const group = document.createElement("div");
   group.className = "turn-group";
+  messages.forEach((message, offset) => {
+    if (message.role === "user") group.appendChild(renderMessage(message, start + offset));
+  });
 
   const details = document.createElement("details");
   details.className = "turn";
   details.open = state.openTurns.has(start);
 
-  const hidden = reply < 0 ? messages.length : messages.length - 1;
+  const hidden = messages.filter((message, offset) => message.role !== "user" && offset !== reply).length;
   const summary = document.createElement("summary");
   const chevron = document.createElement("span");
   chevron.className = "turn-chevron";
   chevron.innerHTML =
     '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>';
-  const you = document.createElement("span");
-  you.className = "turn-you";
-  you.textContent = tx("You: {text}", { text: truncate(turnPreview(messages, "user"), 110) });
+  const label = document.createElement("span");
+  label.className = "turn-label";
+  label.textContent = "Neutrino";
   const meta = document.createElement("span");
   meta.className = "turn-meta";
   meta.textContent = tx("{n} of {m} messages folded", { n: hidden, m: messages.length });
@@ -1905,7 +2118,7 @@ function renderTurnFold(start, messages) {
   hint.className = "turn-hint";
   meta.appendChild(hint);
   summary.appendChild(chevron);
-  summary.appendChild(you);
+  summary.appendChild(label);
   summary.appendChild(meta);
   details.appendChild(summary);
   group.appendChild(details);
@@ -1921,7 +2134,7 @@ function renderTurnFold(start, messages) {
   const populate = () => {
     if (body.childNodes.length) return;
     messages.forEach((message, offset) => {
-      if (offset === reply) return; // the answer is never inside the fold
+      if (message.role === "user" || offset === reply) return;
       body.appendChild(renderMessage(message, start + offset));
     });
   };
@@ -1981,6 +2194,7 @@ function activateComposer() {
 }
 
 async function sendMessage() {
+  try { await agentModePending; } catch (error) { el.sub.textContent = error.message; return; }
   const selection = state.selection;
   if (!selection) return;
   const text = el.input.value;
@@ -2119,6 +2333,7 @@ function showHome({ menu = true } = {}) {
 
 /** Show a folder as an empty workspace ready for its first message. */
 function renderWorkspaceLanding(path) {
+  if (el.modePicker) { clearAgentModeFeedback(); clearLinkedConversation(); }
   const sameLanding = state.selection?.kind === "new" && state.selection.cwd === path;
   state.selection = { kind: "new", cwd: path };
   state.snapshot = null;
@@ -2394,11 +2609,14 @@ async function submitNewChat() {
   }
 }
 
-/** Create a browser-owned conversation in `cwd` and reveal its folder. */
+/** Create a browser-owned conversation in `cwd` and show all sidebar directories. */
 async function createConversation(cwd, selection, approvalMode, proPreset = currentProPreset()) {
   const payload = { cwd };
   if (PRO_MODE) payload.pro_preset = proPreset;
-  else if (selection && selection.provider && selection.model) payload.selection = selection;
+  else {
+    payload.agent_mode = currentAgentMode();
+    if (selection && selection.provider && selection.model) payload.selection = selection;
+  }
   if (approvalMode === "request" || approvalMode === "auto") payload.approval_mode = approvalMode;
   const response = await apiFetch("/api/conversations", {
     method: "POST",
@@ -2407,7 +2625,7 @@ async function createConversation(cwd, selection, approvalMode, proPreset = curr
   });
   const data = await response.json().catch(() => ({}));
   if (!response.ok) throw new Error(apiError(data, `HTTP ${response.status}`));
-  setWorkspace({ path: data.cwd || cwd });
+  setWorkspace(null);
   await loadOverview({ silent: true });
   return data;
 }
@@ -2588,6 +2806,9 @@ function planStatusLabel(status) {
   if (status === "done") return tr("Done");
   if (status === "active") return tr("Active");
   if (status === "failed") return tr("Failed");
+  if (status === "blocked") return tr("Blocked");
+  if (status === "cancelled") return tr("Cancelled");
+  if (status === "skipped") return tr("Skipped");
   return tr("Pending");
 }
 
@@ -2632,7 +2853,7 @@ function renderPlanCard(source) {
     steps.className = "plan-steps";
     let done = 0;
     for (const step of plan.steps) {
-      const status = ["done", "active", "failed", "pending"].includes(step.status) ? step.status : "pending";
+      const status = ["done", "active", "failed", "pending", "blocked", "cancelled", "skipped"].includes(step.status) ? step.status : "pending";
       if (status === "done") done += 1;
       const row = document.createElement("div");
       row.className = `plan-step ${status}`;
@@ -2990,7 +3211,7 @@ function proDelay(callback, ms) {
   if (typeof setTimeout === "function") setTimeout(callback, ms);
 }
 
-function startProTransition() {
+function startProTransition(target = "/pro") {
   if (PRO_MODE || proTransitionStarted) return;
   proTransitionStarted = true;
   const started = Date.now();
@@ -3006,7 +3227,7 @@ function startProTransition() {
   curtain.classList.add("pro-curtain-visible");
 
   proDelay(() => {
-    try { location.assign("/pro"); } catch { location.href = "/pro"; }
+    try { location.assign(typeof target === "string" ? target : "/pro"); } catch { location.href = typeof target === "string" ? target : "/pro"; }
   }, PRO_TRANSITION_COVER_MS);
 }
 
@@ -3027,6 +3248,8 @@ function removeProCurtains() {
  */
 function resetProTransition({ clearRecord = true } = {}) {
   removeProCurtains();
+  if (typeof workspaceNavigation !== "undefined") workspaceNavigation = false;
+  if (typeof el !== "undefined" && el.modePicker) renderAgentMode();
   document.documentElement?.classList?.remove?.("pro-transitioning");
   proTransitionStarted = false;
   if (!clearRecord) return;
@@ -3133,7 +3356,7 @@ function initializeProWorkspace() {
   // the record and the pre-paint cover behind. Neither may ever affect the
   // regular console, so clear them before wiring the badge.
   resetProTransition();
-  el.brandLogo?.addEventListener("click", startProTransition);
+  el.brandLogo?.addEventListener("click", () => startProTransition());
   initializeProTip();
 }
 
@@ -3250,6 +3473,7 @@ forgetStaleConversationEntry();
 
 initializeLanguage();
 initializeProWorkspace();
+initializeAgentMode();
 preferences.load()
   .then(async (config) => {
     const language = config?.settings?.language;
@@ -3264,7 +3488,8 @@ preferences.load()
     maybePromptBackground(config);
   })
   .catch(error => console.error(error));
-loadSeen().then(() => loadOverview()).then(() => {
+loadSeen().then(() => loadOverview()).then(async () => {
+  if (await openLinkedConversation()) return;
   // Reopen the folder the user had open last time, without stealing a click
   // that landed on a saved conversation while the overview was loading.
   if (state.workspace && !state.selection) renderWorkspaceLanding(state.workspace.path);