v2.3.2-coder-answer-endpoint: fix ask_user_input submit in CoderPane

The CoderPane runs its own inference runner and broker on the boocoder
service. The AskUserInputCard was calling /api/chats/:id/answer_user_input
on the main BooChat server, which has a different inference runner — the
answer was accepted but the next turn was enqueued on the wrong runner,
so nothing happened.

Fix: register the same answer_user_input endpoint on the boocoder, and
add an apiPrefix prop to AskUserInputCard so the CoderPane routes
through /api/coder/chats/:id/answer_user_input. BooChat's MessageList
continues to use the default (no prefix) path.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

.env.example

@@ -1,6 +1,6 @@
 NODE_ENV=production
 PORT=3000
-DATABASE_URL=postgres://boocode:CHANGE_ME@boocode_db:5432/boocode
+DATABASE_URL=postgres://boocode:CHANGE_ME@boocode_db:5432/boochat
 LLAMA_SWAP_URL=http://100.101.41.16:8401
 PROJECT_ROOT_WHITELIST=/opt
 BOOTSTRAP_ROOT=/opt/projects

.gitignore

@@ -1,6 +1,11 @@
 node_modules
 dist
 .env
+
+# Claude / Cursor (local agent & IDE config — CLAUDE.md and AGENTS.md stay tracked)
+.claude/
+.cursor/
+.cursorignore
 CLAUDE.local.md
 *.log
 .DS_Store

AGENTS.md

@@ -0,0 +1,109 @@
+# Agent navigation
+
+Cursor/agent entry point for the BooCode monorepo. **Deep engineering reference:** `CLAUDE.md` (Claude Code). This file is navigation + task routing only.
+
+Last updated: 2026-05-25
+
+## Doc map
+
+| Need | Read |
+|------|------|
+| Commands, gotchas, inference, DB, env | `CLAUDE.md` |
+| Read-only chat behavior | `BOOCHAT.md` |
+| Write tools, dispatch, pending changes | `BOOCODER.md` |
+| Shipped vs planned, version order | `boocode_roadmap.md` |
+| Latest release truth | `CHANGELOG.md` (top entry = current) |
+| System diagram + data flow | `docs/ARCHITECTURE.md` |
+| Current focus / blockers | `CURRENT.md` |
+| Batch convention | `openspec/README.md` |
+| Shipped batch snapshots | `openspec/changes/archived/` |
+| Chat agent personas + tool lists | `data/AGENTS.md` |
+| External repo lift inventory | `boocode_code_review.md` |
+
+## Monorepo layout (actual)
+
+Three **surfaces**, four **packages**. There is no `apps/chat/` directory.
+
+| Surface | Packages | Port | Deploy |
+|---------|----------|------|--------|
+| **BooChat** | `apps/server` (API + inference) + `apps/web` (SPA) | `100.114.205.53:9500` | Docker `boocode` container |
+| **BooTerm** | `apps/booterm` | `100.114.205.53:9501` | Docker `booterm` container |
+| **BooCoder** | `apps/coder` | host `:9502` | systemd `boocoder.service` (not Docker since v2.1.0) |
+
+Shared: Postgres 16 — Docker service `boocode_db`, **database name `boochat`**, host port `127.0.0.1:5500`.
+
+## Task routing
+
+| Task type | Start here |
+|-----------|------------|
+| Chat inference / tools / compaction | `apps/server/src/services/inference/` |
+| WS frames | `apps/server/src/types/ws-frames.ts` + `apps/web/src/api/ws-frames.ts` (keep in sync) |
+| Frontend chat UI | `apps/web/src/components/`, hooks in `apps/web/src/hooks/` |
+| BooCoder write tools / dispatch | `apps/coder/src/` — build server first (`pnpm -C apps/server build`) |
+| Provider picker / external agents | `apps/coder/src/services/provider-registry.ts`, `dispatcher.ts`, `agent-probe.ts` |
+| Terminal panes | `apps/booterm/src/`, frontend `TerminalPane.tsx` |
+| Schema changes | `apps/server/src/schema.sql` + sync `*_STATUSES` in `apps/server/src/types/api.ts` |
+| New batch / feature | `openspec/changes/<slug>/proposal.md` + `tasks.md` (see below) |
+
+## Verification (before claiming done)
+
+```bash
+pnpm -C apps/server test && pnpm -C apps/server build
+npx tsc -p apps/web/tsconfig.app.json --noEmit   # root tsc can miss web errors
+curl http://100.114.205.53:9500/api/health       # Tailscale IP, not localhost:9500
+curl http://100.114.205.53:9502/api/health       # BooCoder on host
+```
+
+Deploy truth beats source-only reads — check running health + `git log --oneline -3`.
+
+## Hard rules (from CLAUDE.md)
+
+- **Do not commit or push** unless Sam explicitly asks.
+- **No app-layer auth** — Authelia at the reverse proxy.
+- **Parts table is source of truth** — read message tool fields from `messages_with_parts` view, write via `insertParts`.
+- **New WS frame type** — update server + web schemas; publish via `publishFrame` / `publishUserFrame` only.
+- **New tool** — own file in `services/`, register in `tools.ts` `ALL_TOOLS`; whitelists derive from there, never hardcoded.
+- **Typecheck web with per-app tsconfig** — root `tsc --noEmit` uses project references and can miss errors.
+- **`includeUsage: true`** on `createOpenAICompatible` in `provider.ts` — do not remove.
+- **Agent dispatch** — direct `spawn`/`exec` on host via `install_path` (v2.1.0+); SSH helpers deprecated.
+- **Event dedup** — server publishes via broker; frontend must not duplicate `sessionEvents.emit` after API calls that already WS-broadcast.
+
+## Using openspec with Cursor
+
+Openspec is a **folder convention**, not a CLI. Use it to give agents a scoped brief before coding.
+
+### When starting a batch
+
+1. Create `openspec/changes/<slug>/` (lowercase-hyphenated, e.g. `v2-2-arena-ui`).
+2. Write `proposal.md` — why, scope, non-goals, dependencies.
+3. Write `tasks.md` — numbered checkbox steps (build + smoke).
+4. Optional `design.md` — schema/API decisions that outlive the batch.
+
+See `openspec/README.md` for the full shape. Shipped pre-v1.13.15 batches live in `openspec/changes/archived/` as snapshots only.
+
+### Prompting an agent
+
+```
+@openspec/changes/<slug>/proposal.md @openspec/changes/<slug>/tasks.md
+Implement tasks 1–3. Server tests must pass. Do not commit.
+```
+
+Attach the spec files with `@` so they load into context. Point at specific code paths when known:
+
+```
+@openspec/changes/v2-x/proposal.md
+Extend apps/coder/src/routes/providers.ts — follow provider-registry.ts patterns.
+```
+
+### After shipping
+
+- Tag: `vMAJOR.MINOR.PATCH-slug`
+- Add entry to top of `CHANGELOG.md`
+- Move or snapshot the openspec folder to `archived/` if you want history preserved
+- Update `CURRENT.md` and `boocode_roadmap.md` shipped table if the batch was roadmap-tracked
+
+### What not to use openspec for
+
+- One-line bug fixes — just describe the bug + file.
+- Exploratory questions — Ask mode + `@CLAUDE.md` is enough.
+- Duplicating `CLAUDE.md` — openspec is per-batch scope, not permanent conventions.

CHANGELOG.md

@@ -2,6 +2,22 @@
 
 All notable changes per release tag. Most recent on top, ordered by tag creation date (which matches the git history). Tag names follow `vMAJOR.MINOR.PATCH-slug` — the slug describes what shipped, so the tag name alone is enough to recall the batch.
 
+## v2.2.2-xml-placeholder-reject — 2026-05-26
+
+Reject placeholder XML tool args at parse time in `extractToolCallBlocks` (`xml-parser.ts`). Drops calls when any string arg is `...`, empty/whitespace, `<path>`, `<file>`, `placeholder`, or angle-bracket sentinels; appends the raw XML block to flushed prose instead of silently deleting it. Fixes qwen3.6 answer-then-spurious-tools tail that caused duplicate assistant rows (full answer + failed `xml_call_*` tools + regenerated answer). Four new tests in `xml-parser.test.ts`. Known nit: rejection logs via `console.debug` instead of pino — filed in `docs/DEFERRED-WORK.md` §6 for a later cleanup.
+
+## v2.2.1-pane-scoped-chats — 2026-05-26
+
+Follow-up fixes on the v2.2 Paseo provider stack. Pane-scoped chat resolution: `resolveChatId(sql, sessionId, paneId)` reads `sessions.workspace_panes`, requires `pane_id` on coder POST routes, and creates a scoped chat per coder/terminal pane instead of falling back to the session's first open chat (which fused BooCoder writes into the BooChat pane). Client `useWorkspacePanes` seeds new coder/terminal panes with dedicated chats on create, hydrate, and workspace sync; `CoderPane` blocks send until seeded and filters WS frames + `GET /messages?chat_id=` to that chat. External-agent tool UI: new `CoderMessageList` renders BooChat-style `ToolCallLine` timeline (tools before answer text on combined ACP rows). WS user-delta handling replaces content instead of appending (fixes garbled duplicate user messages when optimistic UI met full-body deltas). BooChat inference: `buildMessagesPayload` strips orphan assistant `tool_calls` without matching `tool` rows and skips stray tool rows when the owning assistant turn is incomplete (fixes "Tool results are missing for tool calls" on shared chats with ACP history). Pairs with `v2.2-paseo-providers`.
+
+## v2.2-paseo-providers — 2026-05-26
+
+Paseo-equivalent provider stack for BooCoder. Seven providers (boocode, cursor, claude, opencode, goose, qwen, copilot) with snapshot API (`provider-snapshot.ts`, ACP cold probe, per-provider model merge, cursor models from ACP). Frontend `AgentComposerBar` replaces `ProviderPicker` — provider / mode / model / thinking in the coder composer; `SlashCommandPicker` + `useProviderSnapshot` hook. ACP dispatch rewritten (`acp-dispatch.ts`, `acp-stream.ts`, `acp-spawn.ts`, `agent-turn-persist.ts`, `acp-tool-snapshot.ts`) with Paseo merge/stream/persist pattern, inline `PermissionCard` prompts, and `reasoning_delta` WS frames. Agent slash-command hints via ACP `available_commands_update` cached in `agent-commands-cache.ts` + `AgentCommandsHint`. Arena and MCP entry points accept `mode_id` / `thinking_option_id`. SSH helpers removed; all host exec via `host-exec.ts` direct spawn. Server adds coder proxy route + shared skill invoke. New tests: acp-derive, acp-tool-snapshot, cursor-models, provider-commands, provider-snapshot, agents. Docs: `AGENTS.md`, `docs/ARCHITECTURE.md`, openspec `v2-2-paseo-providers`.
+
+## v2.1.1-roadmap-cleanup — 2026-05-25
+
+Roadmap reconciliation, README updates, and openspec archive housekeeping. No runtime behavior changes.
+
 ## v2.1.0-provider-picker — 2026-05-25
 
 Provider picker: BooCoder moves from Docker container to host systemd service (`boocoder.service`). All agent dispatch (ACP + PTY) switches from SSH tunnel to direct `spawn`/`exec` — no more `sshSpawn`/`sshExec`/`sshSpawnWithStdin` (marked `@deprecated`). New provider registry (`provider-registry.ts`) with 5 providers (boocode, opencode, goose, claude, qwen), per-provider model discovery (llama-swap for ACP agents, `~/.qwen/settings.json` for qwen, static for claude), and `agent-probe.ts` runs direct `which`/`exec` instead of SSH. `GET /api/providers` route assembles the provider list with installed status, models, and transport (ACP→PTY fallback if `supports_acp` is false). Frontend `ProviderPicker` component in CoderPane header lets users pick provider/model per message; messages route through `tasks` row for external providers instead of inference enqueue. Smart scroll: `MessageList` only auto-scrolls when user is near bottom (150px threshold). DB schema adds `models`, `label`, `transport` columns to `available_agents`. Bug fixes: `loadContext` SELECT now includes `allowed_read_paths` (cross-repo read grants were silently failing), cap hit sentinel insertion moved before `buildMessagesPayload` call.

CLAUDE.md

@@ -2,6 +2,8 @@
 
 This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
 
+**Cursor agents:** start with `AGENTS.md` (navigation) and `docs/ARCHITECTURE.md` (diagram). This file is the deep engineering reference.
+
 ## What is BooCode
 
 Self-hosted single-user developer chat app. AI assistant with read-only file tools (view_file, list_dir, grep, find_files) running against a local llama-swap inference server. Sessions organized by project, with a multi-pane workspace (chat + file browser side by side).
@@ -133,7 +135,7 @@ Required: `DATABASE_URL`, `LLAMA_SWAP_URL`. Optional: `PORT` (3000), `HOST` (0.0
 BooCoder at port 9502: `curl http://100.114.205.53:9502/api/health`. Runs as `boocoder.service` on the host (not Docker). Deploy: `pnpm -C apps/server build && pnpm -C apps/coder build && sudo systemctl restart boocoder`. Health reports tool count: `{"ok":true,"db":true,"tools":33}`.
 
 - `FAST_MODEL` (optional) — cheaper model for titles, summaries, labeling (auto_name.ts, tool-summaries.ts). Falls back to session model or DEFAULT_MODEL when unset. Set to a small model on llama-swap (e.g. `nemotron-nano-4b`) to avoid loading the 35B for 20-token calls.
-- Qwen Code dispatch: `OPENAI_BASE_URL=http://100.101.41.16:8401/v1 OPENAI_API_KEY=dummy qwen -p "<task>" --output-format stream-json`. Install: `npm install -g @qwen-code/qwen-code@latest`. Node ≥22 required on host (container stays Node 20; dispatch via SSH). No `--yolo` flag — non-interactive mode (`-p`) runs autonomously without approval prompts. ACP bridge is HTTP daemon (not stdio); use PTY dispatch.
+- Qwen Code dispatch: `OPENAI_BASE_URL=http://100.101.41.16:8401/v1 OPENAI_API_KEY=dummy qwen -p "<task>" --output-format stream-json`. Install: `npm install -g @qwen-code/qwen-code@latest`. Node ≥22 required on host (container stays Node 20; BooCoder dispatches via direct spawn on host). No `--yolo` flag — non-interactive mode (`-p`) runs autonomously without approval prompts. ACP bridge is HTTP daemon (not stdio); use PTY dispatch.
 - Arena (v2.0.5): `POST /api/arena {project_id, input, contestants: [{agent?, model?}]}` dispatches the same task to N models/agents in parallel. Each contestant gets its own task + worktree. `GET /api/arena/:id` for results. `POST /api/arena/:id/select/:task_id` picks winner.
 
 ## Workflow

CURRENT.md

@@ -0,0 +1,10 @@
+# Current focus
+
+Last updated: 2026-05-26
+
+- **Batch:** v2.3-provider-lifecycle (openspec drafted; not started)
+- **Branch:** `main`
+- **Blockers:** none
+- **Last shipped:** `v2.2.2-xml-placeholder-reject`
+
+Update this file when starting or finishing a batch. Agents: read this first for session intent; if stale vs `CHANGELOG.md`, trust CHANGELOG for shipped state.

README.md

@@ -2,6 +2,10 @@
 
 Self-hosted single-user developer chat app. 3-app monorepo: BooChat (read-only chat), BooCoder (write tools + agent dispatch), BooTerm (PTY terminals).
 
+**Latest release:** `v2.2.1-pane-scoped-chats` (2026-05-26) · [`CHANGELOG.md`](CHANGELOG.md) · **Current focus:** [`CURRENT.md`](CURRENT.md)
+
+**Agent navigation:** [`AGENTS.md`](AGENTS.md) · **Architecture:** [`docs/ARCHITECTURE.md`](docs/ARCHITECTURE.md) · **Engineering reference:** [`CLAUDE.md`](CLAUDE.md)
+
 ## Stack
 
 - Node 20, Fastify, postgres (porsager/postgres), ws, zod
@@ -30,7 +34,7 @@ cp .env.example .env
 docker compose up -d boocode_db
 
 # run server (port 3000) and web (port 5173) in two shells
-DATABASE_URL=postgres://boocode:devpass@127.0.0.1:5500/boocode \
+DATABASE_URL=postgres://boocode:devpass@127.0.0.1:5500/boochat \
 LLAMA_SWAP_URL=http://100.101.41.16:8401 \
 pnpm dev:server
 
@@ -51,6 +55,14 @@ docker compose up --build -d
 Binds to `100.114.205.53:9500` (Tailscale). Authelia is expected to gate the
 upstream and inject `Remote-User`. Postgres binds loopback only.
 
+BooCoder runs as a **host systemd service** (`boocoder.service`, port `:9502`), not in Docker:
+
+```bash
+pnpm -C apps/server build && pnpm -C apps/coder build
+sudo systemctl restart boocoder
+curl http://100.114.205.53:9502/api/health
+```
+
 ## Services
 
 |Service|Port|Description|
@@ -58,11 +70,17 @@ upstream and inject `Remote-User`. Postgres binds loopback only.
 |BooChat|`100.114.205.53:9500`|Read-only chat + SPA |
 |BooTerm|`100.114.205.53:9501`|PTY/tmux terminal panes |
 |BooCoder|host:9502|Write tools + agent dispatch + MCP server (systemd service, not Docker) |
-|Postgres|`127.0.0.1:5500`|Shared database (`boochat_db`) |
-|codecontext|`:8765` (internal)|MCP server for architect tools |
+|Postgres|`127.0.0.1:5500`|Shared database (`boochat`; Docker service `boocode_db`) |
+|codecontext|internal `:8080`|Code graph sidecar (Docker network only) |
 
 ## What's shipped
 
-- **BooChat**: streaming chat, file-read tools, compaction, reasoning support, HTML/Markdown artifact panes, cross-repo read grants, MCP client (Context7 + multi-server), tool-cost tracking, skills system, agent registry, provider picker with model discovery
+See [`boocode_roadmap.md`](boocode_roadmap.md) for full version history. Highlights as of **v2.2.1**:
+
+- **BooChat**: streaming chat, file-read tools, compaction, reasoning support, HTML/Markdown artifact panes, cross-repo read grants, MCP client (multi-server + stdio), tool-cost tracking, skills system, builtin agent registry, multi-pane workspace (chat / terminal / coder)
 - **BooTerm**: in-browser terminal panes via tmux + xterm.js, per-session tmux sessions, SSH-out support
-- **BooCoder**: write tools (`edit_file`, `create_file`, `delete_file`, `apply_pending`, `rewind`), pending-changes queue with diff UI, ACP/PTY dual-path agent dispatch, MCP server (6 tools, stdio), CLI client, human inbox, Boomerang orchestration, path-guard fuzz suite
+- **BooCoder (v2.2)**: write tools (`edit_file`, `create_file`, `delete_file`, `apply_pending`, `rewind`), pending-changes queue with diff UI, Paseo-style provider snapshot (7 providers: boocode, cursor, claude, opencode, goose, qwen, copilot), `AgentComposerBar` (provider / mode / model / thinking), ACP dispatch with inline permission prompts + tool/reasoning streaming, PTY fallback, Arena, MCP server (6 tools, stdio), CLI client, human inbox, Boomerang orchestration, path-guard fuzz suite, **pane-scoped chats** (v2.2.1 — each coder/terminal pane owns its chat)
+
+## Planned
+
+- **v2.3 provider lifecycle** — config-backed provider registry (`/data/coder-providers.json`), enable/disable toggles, two-tier probe (openspec drafted). See [`CURRENT.md`](CURRENT.md).

apps/coder/.env.host

@@ -12,3 +12,4 @@ GITEA_BASE_URL=https://git.indifferentketchup.com
 GITEA_USER=indifferentketchup
 GITEA_SSH_HOST=100.114.205.53:2222
 MCP_CONFIG_PATH=/data/mcp.json
+SKILLS_ROOT=/opt/boocode/data/skills

apps/coder/src/index.ts

@@ -23,6 +23,7 @@ import { adaptWriteTool } from './services/tools/adapter.js';
 import { setInferenceContext, clearInferenceContext } from './services/tools/inference_context.js';
 // Routes
 import { registerMessageRoutes } from './routes/messages.js';
+import { registerSkillRoutes } from './routes/skills.js';
 import { registerPendingRoutes } from './routes/pending.js';
 import { registerTaskRoutes } from './routes/tasks.js';
 import { registerInboxRoutes } from './routes/inbox.js';
@@ -33,6 +34,9 @@ import { registerWebSocket } from './routes/ws.js';
 // Phase 4: dispatcher + agent probe
 import { createDispatcher } from './services/dispatcher.js';
 import { probeAgents } from './services/agent-probe.js';
+import { getProviderSnapshot, persistProbedModels } from './services/provider-snapshot.js';
+import { setPermissionHooks } from './services/permission-waiter.js';
+import { homedir } from 'node:os';
 
 async function main() {
   // MCP mode: stdio transport, no HTTP server
@@ -72,6 +76,33 @@ async function main() {
   // Broker: in-memory pub/sub for session + user channel streaming.
   const broker = createBroker(app.log);
 
+  setPermissionHooks({
+    onPrompt: async (prompt) => {
+      await sql`
+        UPDATE tasks SET state = 'blocked' WHERE id = ${prompt.taskId} AND state = 'running'
+      `;
+      broker.publishFrame(prompt.sessionId, {
+        type: 'permission_requested',
+        task_id: prompt.taskId,
+        session_id: prompt.sessionId,
+        kind: prompt.kind,
+        tool_title: prompt.toolTitle,
+        ...(prompt.input ? { input: prompt.input } : {}),
+        options: prompt.options.map((o) => ({ option_id: o.optionId, label: o.label })),
+      } as WsFrame);
+    },
+    onResolved: async (taskId, sessionId) => {
+      await sql`
+        UPDATE tasks SET state = 'running' WHERE id = ${taskId} AND state = 'blocked'
+      `;
+      broker.publishFrame(sessionId, {
+        type: 'permission_resolved',
+        task_id: taskId,
+        session_id: sessionId,
+      } as WsFrame);
+    },
+  });
+
   // --- Tool registry extension ---
   // Append BooCoder write tools (adapted to BooChat's ToolDef interface) to
   // the shared ALL_TOOLS registry. appendMcpTools re-sorts and rebuilds
@@ -134,6 +165,16 @@ async function main() {
   // Phase 4: probe available agents on startup
   await probeAgents(sql, app.log);
 
+  // Warm provider snapshot in background (ACP cold probes + model merges)
+  void getProviderSnapshot(sql, config, homedir(), true)
+    .then((entries) => persistProbedModels(sql, entries, app.log))
+    .catch((err) => {
+      app.log.warn(
+        { err: err instanceof Error ? err.message : String(err) },
+        'provider-snapshot: warm failed',
+      );
+    });
+
   // Phase 4: dispatcher — polls tasks table and runs inference
   const dispatcher = createDispatcher({ sql, inference: inferenceApi, broker, log: app.log, config });
   dispatcher.start();
@@ -141,6 +182,7 @@ async function main() {
 
   // Register routes
   registerMessageRoutes(app, sql, broker, inferenceApi);
+  registerSkillRoutes(app, sql, broker, inferenceApi);
   registerPendingRoutes(app, sql);
   registerTaskRoutes(app, sql, inferenceApi);
   registerInboxRoutes(app, sql);

apps/coder/src/routes/arena.ts

@@ -12,6 +12,8 @@ import type { Sql } from '../db.js';
 const ContestantSchema = z.object({
   agent: z.string().max(100).optional(),
   model: z.string().max(200).optional(),
+  mode_id: z.string().max(200).optional(),
+  thinking_option_id: z.string().max(200).optional(),
 });
 
 const CreateArenaBody = z.object({
@@ -24,6 +26,8 @@ interface TaskRow {
   id: string;
   agent: string | null;
   model: string | null;
+  mode_id: string | null;
+  thinking_option_id: string | null;
   state: string;
 }
 
@@ -42,9 +46,17 @@ export function registerArenaRoutes(app: FastifyInstance, sql: Sql): void {
     const tasks: TaskRow[] = [];
     for (const contestant of contestants) {
       const [task] = await sql<TaskRow[]>`
-        INSERT INTO tasks (project_id, input, agent, model, arena_id)
-        VALUES (${project_id}, ${input}, ${contestant.agent ?? null}, ${contestant.model ?? null}, ${arenaId})
-        RETURNING id, agent, model, state
+        INSERT INTO tasks (project_id, input, agent, model, mode_id, thinking_option_id, arena_id)
+        VALUES (
+          ${project_id},
+          ${input},
+          ${contestant.agent ?? null},
+          ${contestant.model ?? null},
+          ${contestant.mode_id ?? null},
+          ${contestant.thinking_option_id ?? null},
+          ${arenaId}
+        )
+        RETURNING id, agent, model, mode_id, thinking_option_id, state
       `;
       tasks.push(task!);
     }
@@ -52,10 +64,12 @@ export function registerArenaRoutes(app: FastifyInstance, sql: Sql): void {
     reply.code(201);
     return {
       arena_id: arenaId,
-      tasks: tasks.map(t => ({
+      tasks: tasks.map((t) => ({
         id: t.id,
         agent: t.agent,
         model: t.model,
+        mode_id: t.mode_id,
+        thinking_option_id: t.thinking_option_id,
         state: t.state,
       })),
     };
@@ -73,7 +87,7 @@ export function registerArenaRoutes(app: FastifyInstance, sql: Sql): void {
     }
 
     const tasks = await sql`
-      SELECT id, project_id, state, input, output_summary, agent, model, execution_path, session_id, started_at, ended_at, created_at, arena_id
+      SELECT id, project_id, state, input, output_summary, agent, model, mode_id, thinking_option_id, execution_path, session_id, started_at, ended_at, created_at, arena_id
       FROM tasks
       WHERE arena_id = ${arena_id}
       ORDER BY created_at

apps/coder/src/routes/chat-resolve.ts

@@ -0,0 +1,81 @@
+import type { Sql } from '../db.js';
+
+interface WorkspacePaneRow {
+  id: string;
+  kind: string;
+  chatId?: string;
+  chatIds?: string[];
+  activeChatIdx?: number;
+}
+
+function chatNameForKind(kind: string): string {
+  if (kind === 'coder' || kind === 'agent') return 'BooCoder';
+  if (kind === 'terminal') return 'Terminal';
+  return 'Chat';
+}
+
+function activeChatIdForPane(pane: WorkspacePaneRow): string | undefined {
+  const chatIds = pane.chatIds ?? [];
+  const idx = pane.activeChatIdx ?? 0;
+  if (idx >= 0 && idx < chatIds.length) return chatIds[idx];
+  return pane.chatId;
+}
+
+/** Resolve the active chat for a workspace pane; auto-seed when empty. */
+export async function resolveChatId(
+  sql: Sql,
+  sessionId: string,
+  paneId: string,
+): Promise<string | null> {
+  return sql.begin(async (tx) => {
+    const sessionRows = await tx<{ workspace_panes: WorkspacePaneRow[] }[]>`
+      SELECT workspace_panes FROM sessions WHERE id = ${sessionId} FOR UPDATE
+    `;
+    if (sessionRows.length === 0) return null;
+
+    const panes = sessionRows[0]!.workspace_panes ?? [];
+    const paneIdx = panes.findIndex((p) => p.id === paneId);
+    if (paneIdx < 0) return null;
+
+    const pane = panes[paneIdx]!;
+    const existingChatId = activeChatIdForPane(pane);
+    if (existingChatId) {
+      const chatRows = await tx<{ id: string }[]>`
+        SELECT id FROM chats
+        WHERE id = ${existingChatId}
+          AND session_id = ${sessionId}
+          AND status = 'open'
+      `;
+      if (chatRows.length > 0) return existingChatId;
+    }
+
+    const [newChat] = await tx<{ id: string }[]>`
+      INSERT INTO chats (session_id, name, status)
+      VALUES (${sessionId}, ${chatNameForKind(pane.kind)}, 'open')
+      RETURNING id
+    `;
+    if (!newChat) return null;
+
+    const nextChatIds = [...(pane.chatIds ?? []), newChat.id];
+    const nextActiveIdx = nextChatIds.length - 1;
+    const nextPanes = panes.map((p, i) =>
+      i === paneIdx
+        ? {
+            ...p,
+            chatIds: nextChatIds,
+            activeChatIdx: nextActiveIdx,
+            chatId: newChat.id,
+          }
+        : p,
+    );
+
+    await tx`
+      UPDATE sessions
+      SET workspace_panes = ${tx.json(nextPanes as never)},
+          updated_at = clock_timestamp()
+      WHERE id = ${sessionId}
+    `;
+
+    return newChat.id;
+  });
+}

apps/coder/src/routes/messages.ts

@@ -3,12 +3,43 @@ import { z } from 'zod';
 import type { Sql } from '../db.js';
 import type { Broker } from '@boocode/server/broker';
 import type { WsFrame } from '@boocode/server/ws-frames';
+import { resolveChatId } from './chat-resolve.js';
+
+const AnswerUserInputBody = z.object({
+  tool_call_id: z.string().min(1),
+  answers: z
+    .array(
+      z.object({
+        question: z.string(),
+        selected_options: z.array(z.string()),
+        free_text: z.string().nullable(),
+      }),
+    )
+    .min(1)
+    .max(3),
+});
+
+const AskUserInputArgs = z.object({
+  questions: z
+    .array(
+      z.object({
+        question: z.string(),
+        type: z.enum(['single_select', 'multi_select']),
+        options: z.array(z.string()).min(1),
+      }),
+    )
+    .min(1)
+    .max(3),
+});
 
 const SendBody = z.object({
   content: z.string().min(1).max(64_000),
+  pane_id: z.string().min(1).max(200),
   chat_id: z.string().uuid().optional(),
   provider: z.string().max(100).optional(),
   model: z.string().max(200).optional(),
+  mode_id: z.string().max(200).optional(),
+  thinking_option_id: z.string().max(200).optional(),
 });
 
 interface InferenceApi {
@@ -17,12 +48,100 @@ interface InferenceApi {
   hasActive: (chatId: string) => boolean;
 }
 
+interface MessageRow {
+  id: string;
+  role: string;
+  content: string | null;
+  status: string | null;
+  tool_calls: Array<{ id: string; name: string; args?: Record<string, unknown> }> | null;
+  tool_results: {
+    tool_call_id: string;
+    output: unknown;
+    truncated?: boolean;
+    error?: string;
+  } | null;
+  reasoning_parts: Array<{ text?: string }> | null;
+}
+
+function mapCoderMessageRow(row: MessageRow) {
+  if (row.role === 'tool') {
+    if (!row.tool_results?.tool_call_id) return null;
+    return {
+      id: row.id,
+      role: 'tool' as const,
+      tool_results: row.tool_results,
+    };
+  }
+  if (row.role !== 'user' && row.role !== 'assistant' && row.role !== 'system') {
+    return null;
+  }
+  const tool_calls = row.tool_calls?.map((tc) => ({
+    id: tc.id,
+    function: {
+      name: tc.name,
+      arguments: JSON.stringify(tc.args ?? {}),
+    },
+  }));
+  const reasoningText = row.reasoning_parts?.map((p) => p.text ?? '').join('') ?? '';
+  return {
+    id: row.id,
+    role: row.role as 'user' | 'assistant' | 'system',
+    content: row.content ?? '',
+    status: (row.status ?? 'complete') as 'streaming' | 'complete' | 'failed',
+    ...(reasoningText ? { reasoning_text: reasoningText } : {}),
+    ...(tool_calls?.length ? { tool_calls } : {}),
+  };
+}
+
 export function registerMessageRoutes(
   app: FastifyInstance,
   sql: Sql,
   broker: Broker,
   inference: InferenceApi,
 ): void {
+  // GET /api/sessions/:sessionId/messages — hydrate CoderPane on load / reconnect
+  app.get<{ Params: { sessionId: string }; Querystring: { chat_id?: string } }>(
+    '/api/sessions/:sessionId/messages',
+    async (req, reply) => {
+      const sessionId = req.params.sessionId;
+      const chatId = req.query.chat_id;
+      const sessionRows = await sql<{ id: string }[]>`
+        SELECT id FROM sessions WHERE id = ${sessionId}
+      `;
+      if (sessionRows.length === 0) {
+        reply.code(404);
+        return { error: 'session not found' };
+      }
+
+      if (chatId) {
+        const chatRows = await sql<{ id: string }[]>`
+          SELECT id FROM chats
+          WHERE id = ${chatId} AND session_id = ${sessionId} AND status = 'open'
+        `;
+        if (chatRows.length === 0) {
+          reply.code(404);
+          return { error: 'chat not found or not open in this session' };
+        }
+      }
+
+      const rows = chatId
+        ? await sql<MessageRow[]>`
+            SELECT id, role, content, status, tool_calls, tool_results, reasoning_parts
+            FROM messages_with_parts
+            WHERE session_id = ${sessionId} AND chat_id = ${chatId}
+            ORDER BY created_at ASC, id ASC
+          `
+        : await sql<MessageRow[]>`
+            SELECT id, role, content, status, tool_calls, tool_results, reasoning_parts
+            FROM messages_with_parts
+            WHERE session_id = ${sessionId}
+            ORDER BY created_at ASC, id ASC
+          `;
+
+      return rows.map(mapCoderMessageRow).filter((m) => m !== null);
+    },
+  );
+
   // POST /api/sessions/:sessionId/messages — send a user message + kick off inference
   app.post<{ Params: { sessionId: string } }>(
     '/api/sessions/:sessionId/messages',
@@ -34,7 +153,8 @@ export function registerMessageRoutes(
       }
 
       const sessionId = req.params.sessionId;
-      const { content, chat_id: explicitChatId, provider, model } = parsed.data;
+      const { content, pane_id, chat_id: explicitChatId, provider, model, mode_id, thinking_option_id } =
+        parsed.data;
       const isExternal = provider && provider !== 'boocode';
 
       // Validate session exists
@@ -46,8 +166,13 @@ export function registerMessageRoutes(
         return { error: 'session not found' };
       }
 
-      // Resolve chat_id: use explicit value or find/create a default chat
-      let chatId: string;
+      const resolved = await resolveChatId(sql, sessionId, pane_id);
+      if (!resolved) {
+        reply.code(404);
+        return { error: 'pane not found' };
+      }
+
+      let chatId = resolved;
       if (explicitChatId) {
         const chatRows = await sql<{ id: string }[]>`
           SELECT id FROM chats WHERE id = ${explicitChatId} AND session_id = ${sessionId} AND status = 'open'
@@ -57,20 +182,6 @@ export function registerMessageRoutes(
           return { error: 'chat not found or not open in this session' };
         }
         chatId = explicitChatId;
-      } else {
-        const existing = await sql<{ id: string }[]>`
-          SELECT id FROM chats WHERE session_id = ${sessionId} AND status = 'open' ORDER BY created_at LIMIT 1
-        `;
-        if (existing.length > 0) {
-          chatId = existing[0]!.id;
-        } else {
-          const [newChat] = await sql<{ id: string }[]>`
-            INSERT INTO chats (session_id, name, status)
-            VALUES (${sessionId}, 'Chat', 'open')
-            RETURNING id
-          `;
-          chatId = newChat!.id;
-        }
       }
 
       if (!isExternal) {
@@ -113,8 +224,8 @@ export function registerMessageRoutes(
         // External provider: create a task for the dispatcher
         const projectId = sessionRows[0]!.project_id;
         const [task] = await sql<{ id: string; state: string }[]>`
-          INSERT INTO tasks (project_id, input, agent, model, session_id)
-          VALUES (${projectId}, ${content}, ${provider}, ${model ?? null}, ${sessionId})
+          INSERT INTO tasks (project_id, input, agent, model, mode_id, thinking_option_id, session_id)
+          VALUES (${projectId}, ${content}, ${provider}, ${model ?? null}, ${mode_id ?? null}, ${thinking_option_id ?? null}, ${sessionId})
           RETURNING id, state
         `;
         reply.code(202);
@@ -135,6 +246,138 @@ export function registerMessageRoutes(
     },
   );
 
+  // POST /api/chats/:id/answer_user_input — answer a pending ask_user_input
+  app.post<{ Params: { id: string } }>(
+    '/api/chats/:id/answer_user_input',
+    async (req, reply) => {
+      const parsed = AnswerUserInputBody.safeParse(req.body);
+      if (!parsed.success) {
+        reply.code(400);
+        return { error: 'invalid_body', details: parsed.error.flatten() };
+      }
+      const { tool_call_id, answers } = parsed.data;
+
+      const chatRows = await sql<{ id: string; session_id: string }[]>`
+        SELECT id, session_id FROM chats WHERE id = ${req.params.id} AND status = 'open'
+      `;
+      if (chatRows.length === 0) {
+        reply.code(404);
+        return { error: 'chat_not_found' };
+      }
+      const chat = chatRows[0]!;
+      const sessionId = chat.session_id;
+
+      const callerRows = await sql<{
+        message_id: string;
+        payload: { id: string; name: string; args: Record<string, unknown> };
+      }[]>`
+        SELECT p.message_id, p.payload
+        FROM message_parts p
+        JOIN messages m ON m.id = p.message_id
+        WHERE m.chat_id = ${chat.id}
+          AND m.role = 'assistant'
+          AND p.kind = 'tool_call'
+          AND p.payload->>'id' = ${tool_call_id}
+        ORDER BY m.created_at DESC
+        LIMIT 1
+      `;
+      if (!callerRows[0]) {
+        reply.code(404);
+        return { error: 'unknown_tool_call_id' };
+      }
+      const foundCall = callerRows[0].payload;
+      if (foundCall.name !== 'ask_user_input') {
+        reply.code(400);
+        return { error: 'tool_call_not_ask_user_input' };
+      }
+
+      const argsParsed = AskUserInputArgs.safeParse(foundCall.args);
+      if (!argsParsed.success) {
+        reply.code(400);
+        return { error: 'mismatched_answer_shape', detail: 'tool_call args invalid' };
+      }
+      const questions = argsParsed.data.questions;
+      if (answers.length !== questions.length) {
+        reply.code(400);
+        return { error: 'mismatched_answer_shape', detail: `expected ${questions.length} answer(s), got ${answers.length}` };
+      }
+      for (let i = 0; i < questions.length; i++) {
+        const q = questions[i]!;
+        const a = answers[i]!;
+        for (const sel of a.selected_options) {
+          if (!q.options.includes(sel)) {
+            reply.code(400);
+            return { error: 'mismatched_answer_shape', detail: `answer ${i + 1} option not in question: ${sel}` };
+          }
+        }
+        if (q.type === 'single_select' && a.selected_options.length > 1) {
+          reply.code(400);
+          return { error: 'mismatched_answer_shape', detail: `answer ${i + 1} multi on single_select` };
+        }
+        if (a.selected_options.length === 0 && (!a.free_text || !a.free_text.trim())) {
+          reply.code(400);
+          return { error: 'mismatched_answer_shape', detail: `answer ${i + 1} is empty` };
+        }
+      }
+
+      const toolRows = await sql<{
+        message_id: string;
+        payload: { tool_call_id: string; output: unknown };
+      }[]>`
+        SELECT p.message_id, p.payload
+        FROM message_parts p
+        JOIN messages m ON m.id = p.message_id
+        WHERE m.chat_id = ${chat.id}
+          AND m.role = 'tool'
+          AND p.kind = 'tool_result'
+          AND p.payload->>'tool_call_id' = ${tool_call_id}
+        ORDER BY m.created_at DESC
+        LIMIT 1
+      `;
+      if (!toolRows[0]) {
+        reply.code(404);
+        return { error: 'unknown_tool_call_id', detail: 'tool message not found' };
+      }
+      if (toolRows[0].payload?.output !== null) {
+        reply.code(409);
+        return { error: 'tool_call_already_answered' };
+      }
+
+      const answerSet = { answers };
+      const newToolResults = { tool_call_id, output: answerSet, truncated: false };
+      const toolMessageId = toolRows[0].message_id;
+
+      const result = await sql.begin(async (tx) => {
+        await tx`DELETE FROM message_parts WHERE message_id = ${toolMessageId} AND kind = 'tool_result'`;
+        await tx`
+          INSERT INTO message_parts (message_id, sequence, kind, payload)
+          VALUES (${toolMessageId}, 0, 'tool_result', ${tx.json(newToolResults as never)})
+        `;
+        const [assistantMsg] = await tx<{ id: string }[]>`
+          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+          VALUES (${sessionId}, ${chat.id}, 'assistant', '', 'streaming', clock_timestamp())
+          RETURNING id
+        `;
+        await tx`UPDATE sessions SET updated_at = clock_timestamp() WHERE id = ${sessionId}`;
+        await tx`UPDATE chats SET updated_at = clock_timestamp() WHERE id = ${chat.id}`;
+        return { tool_message_id: toolMessageId, assistant_message_id: assistantMsg!.id };
+      });
+
+      broker.publishFrame(sessionId, {
+        type: 'tool_result',
+        tool_message_id: result.tool_message_id,
+        tool_call_id,
+        chat_id: chat.id,
+        output: answerSet,
+        truncated: false,
+      } as unknown as WsFrame);
+      inference.enqueue(sessionId, chat.id, result.assistant_message_id, 'default');
+
+      reply.code(202);
+      return result;
+    },
+  );
+
   // POST /api/sessions/:sessionId/stop — cancel active inference
   app.post<{ Params: { sessionId: string } }>(
     '/api/sessions/:sessionId/stop',

apps/coder/src/routes/providers.ts

@@ -1,80 +1,17 @@
 import type { FastifyInstance } from 'fastify';
 import type { Sql } from '../db.js';
 import type { Config } from '../config.js';
-import { PROVIDERS } from '../services/provider-registry.js';
-
-interface ProviderModel {
-  id: string;
-  label: string;
-}
-
-interface ProviderResponse {
-  name: string;
-  label: string;
-  transport: string;
-  installed: boolean;
-  models: ProviderModel[];
-}
-
-interface LlamaSwapModel {
-  id: string;
-  [key: string]: unknown;
-}
-
-async function fetchLlamaSwapModels(config: Config): Promise<ProviderModel[]> {
-  try {
-    const res = await fetch(`${config.LLAMA_SWAP_URL}/v1/models`);
-    if (!res.ok) return [];
-    const parsed = (await res.json()) as { data?: LlamaSwapModel[] };
-    return (parsed.data ?? []).map((m) => ({ id: m.id, label: m.id }));
-  } catch {
-    return [];
-  }
-}
+import { getProviderSnapshot, clearProviderSnapshotCache } from '../services/provider-snapshot.js';
 
 export function registerProviderRoutes(app: FastifyInstance, sql: Sql, config: Config): void {
-  app.get('/api/providers', async (_req, _reply) => {
-    const llamaModels = await fetchLlamaSwapModels(config);
+  app.get<{ Querystring: { cwd?: string } }>('/api/providers/snapshot', async (req, _reply) => {
+    const cwd = req.query.cwd;
+    return getProviderSnapshot(sql, config, cwd);
+  });
 
-    const agents = await sql<{ name: string; models: ProviderModel[]; label: string | null; transport: string | null; supports_acp: boolean }[]>`
-      SELECT name, models, label, transport, supports_acp FROM available_agents
-    `;
-    const agentMap = new Map(agents.map((a) => [a.name, a]));
-
-    const result: ProviderResponse[] = [];
-
-    for (const provider of PROVIDERS) {
-      const isNative = provider.name === 'boocode';
-      const agentRow = agentMap.get(provider.name);
-      const installed = isNative || !!agentRow;
-
-      if (!installed) continue;
-
-      let models: ProviderModel[];
-      if (provider.modelSource === 'llama-swap') {
-        models = llamaModels;
-      } else if (agentRow?.models && agentRow.models.length > 0) {
-        models = agentRow.models;
-      } else if (provider.staticModels) {
-        models = provider.staticModels;
-      } else {
-        models = [];
-      }
-
-      let transport: string = provider.transport;
-      if (agentRow) {
-        transport = provider.transport === 'acp' && !agentRow.supports_acp ? 'pty' : provider.transport;
-      }
-
-      result.push({
-        name: provider.name,
-        label: agentRow?.label ?? provider.label,
-        transport,
-        installed,
-        models,
-      });
-    }
-
-    return result;
+  app.post('/api/providers/refresh', async (_req, _reply) => {
+    clearProviderSnapshotCache();
+    const entries = await getProviderSnapshot(sql, config, undefined, true);
+    return { refreshed: entries.length };
   });
 }

apps/coder/src/routes/skills.ts

@@ -0,0 +1,93 @@
+import type { FastifyInstance } from 'fastify';
+import { z } from 'zod';
+import type { Sql } from '../db.js';
+import type { Broker } from '@boocode/server/broker';
+import type { WsFrame } from '@boocode/server/ws-frames';
+import { getSkillBody } from '@boocode/server/skills';
+import {
+  buildSkillInvokeSyntheticFrames,
+  buildSkillInvokeUserFrames,
+  DEFAULT_SKILL_USER_MESSAGE,
+  runSkillInvokeTransaction,
+} from '@boocode/server/skill-invoke';
+import { resolveChatId } from './chat-resolve.js';
+
+const SkillInvokeBody = z.object({
+  pane_id: z.string().min(1).max(200),
+  skill_name: z.string().min(1),
+  user_message: z.string().max(64_000).nullable().optional(),
+});
+
+interface InferenceApi {
+  enqueue: (sessionId: string, chatId: string, assistantId: string, user: string) => void;
+  hasActive: (chatId: string) => boolean;
+}
+
+export function registerSkillRoutes(
+  app: FastifyInstance,
+  sql: Sql,
+  broker: Broker,
+  inference: InferenceApi,
+): void {
+  app.post<{ Params: { sessionId: string } }>(
+    '/api/sessions/:sessionId/skill_invoke',
+    async (req, reply) => {
+      const parsed = SkillInvokeBody.safeParse(req.body);
+      if (!parsed.success) {
+        reply.code(400);
+        return { error: 'invalid body', details: parsed.error.flatten() };
+      }
+
+      const sessionId = req.params.sessionId;
+      const { pane_id, skill_name } = parsed.data;
+      const sessionRows = await sql<{ id: string }[]>`
+        SELECT id FROM sessions WHERE id = ${sessionId}
+      `;
+      if (sessionRows.length === 0) {
+        reply.code(404);
+        return { error: 'session not found' };
+      }
+
+      const chatId = await resolveChatId(sql, sessionId, pane_id);
+      if (!chatId) {
+        reply.code(404);
+        return { error: 'pane not found' };
+      }
+
+      if (inference.hasActive(chatId)) {
+        reply.code(409);
+        return { error: 'inference already running on this chat' };
+      }
+
+      const userText = parsed.data.user_message?.trim()
+        ? parsed.data.user_message
+        : DEFAULT_SKILL_USER_MESSAGE;
+
+      const body = await getSkillBody(skill_name);
+      if (body === null) {
+        reply.code(404);
+        return { error: 'unknown_skill', message: `unknown skill: ${skill_name}` };
+      }
+
+      const { result, toolCall } = await runSkillInvokeTransaction(sql, {
+        sessionId,
+        chatId,
+        skillName: skill_name,
+        skillBody: body,
+        userText,
+      });
+
+      for (const frame of buildSkillInvokeSyntheticFrames(chatId, result, toolCall, body)) {
+        broker.publishFrame(sessionId, frame as WsFrame);
+      }
+      for (const frame of buildSkillInvokeUserFrames(chatId, result.user_message_id, userText)) {
+        broker.publishFrame(sessionId, frame as WsFrame);
+      }
+
+      inference.enqueue(sessionId, chatId, result.assistant_message_id, 'default');
+
+      reply.code(202);
+      return result;
+    },
+  );
+}

apps/coder/src/routes/tasks.ts

@@ -1,6 +1,8 @@
 import type { FastifyInstance } from 'fastify';
 import { z } from 'zod';
 import type { Sql } from '../db.js';
+import { getPendingPermission, respondToPermission, cancelPendingPermission } from '../services/permission-waiter.js';
+import { getTaskCommands } from '../services/agent-commands-cache.js';
 
 interface InferenceApi {
   cancel: (sessionId: string, chatId: string) => Promise<boolean>;
@@ -11,6 +13,13 @@ const CreateBody = z.object({
   input: z.string().min(1).max(64_000),
   agent: z.string().max(100).optional(),
   model: z.string().max(200).optional(),
+  mode_id: z.string().max(200).optional(),
+  thinking_option_id: z.string().max(200).optional(),
+});
+
+const PermissionBody = z.object({
+  option_id: z.string().max(200).nullable(),
+  updated_input: z.record(z.unknown()).optional(),
 });
 
 const ListQuery = z.object({
@@ -27,11 +36,11 @@ export function registerTaskRoutes(app: FastifyInstance, sql: Sql, inference: In
       return { error: 'invalid body', details: parsed.error.flatten() };
     }
 
-    const { project_id, input, agent, model } = parsed.data;
+    const { project_id, input, agent, model, mode_id, thinking_option_id } = parsed.data;
 
     const [task] = await sql<{ id: string; state: string }[]>`
-      INSERT INTO tasks (project_id, input, agent, model)
-      VALUES (${project_id}, ${input}, ${agent ?? null}, ${model ?? null})
+      INSERT INTO tasks (project_id, input, agent, model, mode_id, thinking_option_id)
+      VALUES (${project_id}, ${input}, ${agent ?? null}, ${model ?? null}, ${mode_id ?? null}, ${thinking_option_id ?? null})
       RETURNING id, state
     `;
 
@@ -111,13 +120,15 @@ export function registerTaskRoutes(app: FastifyInstance, sql: Sql, inference: In
     }
 
     const task = rows[0]!;
-    if (task.state !== 'pending' && task.state !== 'running') {
+    if (task.state !== 'pending' && task.state !== 'running' && task.state !== 'blocked') {
       reply.code(409);
       return { error: `cannot cancel task in state '${task.state}'` };
     }
 
+    cancelPendingPermission(taskId);
+
     // If running, try to cancel inference
-    if (task.state === 'running' && task.session_id) {
+    if ((task.state === 'running' || task.state === 'blocked') && task.session_id) {
       // Find active chat in the task's session
       const chats = await sql<{ id: string }[]>`
         SELECT id FROM chats WHERE session_id = ${task.session_id} AND status = 'open'
@@ -130,9 +141,45 @@ export function registerTaskRoutes(app: FastifyInstance, sql: Sql, inference: In
     await sql`
       UPDATE tasks
       SET state = 'cancelled', ended_at = clock_timestamp()
-      WHERE id = ${taskId} AND state IN ('pending', 'running')
+      WHERE id = ${taskId} AND state IN ('pending', 'running', 'blocked')
     `;
 
     return { cancelled: true };
   });
+
+  // GET /api/tasks/:id/permission — pending permission prompt (if any)
+  app.get<{ Params: { id: string } }>('/api/tasks/:id/permission', async (req, reply) => {
+    const prompt = getPendingPermission(req.params.id);
+    if (!prompt) {
+      reply.code(404);
+      return { error: 'no pending permission' };
+    }
+    return prompt;
+  });
+
+  // POST /api/tasks/:id/permission — respond to a pending permission prompt
+  app.post<{ Params: { id: string } }>('/api/tasks/:id/permission', async (req, reply) => {
+    const parsed = PermissionBody.safeParse(req.body);
+    if (!parsed.success) {
+      reply.code(400);
+      return { error: 'invalid body', details: parsed.error.flatten() };
+    }
+
+    const ok = respondToPermission(req.params.id, parsed.data.option_id, parsed.data.updated_input as Record<string, unknown> | undefined);
+    if (!ok) {
+      reply.code(404);
+      return { error: 'no pending permission' };
+    }
+    return { ok: true };
+  });
+
+  // GET /api/tasks/:id/commands — cached ACP slash commands (if any)
+  app.get<{ Params: { id: string } }>('/api/tasks/:id/commands', async (req, reply) => {
+    const commands = getTaskCommands(req.params.id);
+    if (!commands?.length) {
+      reply.code(404);
+      return { error: 'no commands cached' };
+    }
+    return { taskId: req.params.id, commands };
+  });
 }

apps/coder/src/routes/ws.ts

@@ -25,7 +25,7 @@ export function registerWebSocket(
 
       // Send snapshot of existing messages so client can hydrate
       const messages = await sql<Record<string, unknown>[]>`
-        SELECT id, session_id, chat_id, role, content, kind, tool_calls, tool_results, status, last_seq,
+        SELECT id, session_id, chat_id, role, content, kind, tool_calls, tool_results, reasoning_parts, status, last_seq,
                tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata,
                summary, tail_start_id, compacted_at
         FROM messages_with_parts

apps/coder/src/schema.sql

@@ -66,3 +66,8 @@ CREATE OR REPLACE VIEW human_inbox AS
 ALTER TABLE available_agents ADD COLUMN IF NOT EXISTS models JSONB DEFAULT '[]'::jsonb;
 ALTER TABLE available_agents ADD COLUMN IF NOT EXISTS label TEXT;
 ALTER TABLE available_agents ADD COLUMN IF NOT EXISTS transport TEXT DEFAULT 'pty';
+
+-- v2.2.0: Paseo-style session config on tasks.
+ALTER TABLE tasks ADD COLUMN IF NOT EXISTS mode_id TEXT;
+ALTER TABLE tasks ADD COLUMN IF NOT EXISTS thinking_option_id TEXT;
+ALTER TABLE tasks ADD COLUMN IF NOT EXISTS feature_values JSONB;

apps/coder/src/services/__tests__/acp-derive.test.ts

@@ -0,0 +1,154 @@
+import { describe, it, expect } from 'vitest';
+import type { SessionConfigOption } from '@agentclientprotocol/sdk';
+import {
+  deriveModesFromACP,
+  deriveModelDefinitionsFromACP,
+  findThoughtLevelConfigId,
+} from '../acp-derive.js';
+
+describe('deriveModesFromACP', () => {
+  it('prefers modeState.availableModes when present', () => {
+    const { modes, currentModeId } = deriveModesFromACP(
+      [{ id: 'fallback', label: 'Fallback' }],
+      {
+        currentModeId: 'plan',
+        availableModes: [
+          { id: 'plan', name: 'Plan', description: 'Read-only planning' },
+          { id: 'code', name: 'Code' },
+        ],
+      },
+    );
+
+    expect(modes).toEqual([
+      { id: 'plan', label: 'Plan', description: 'Read-only planning' },
+      { id: 'code', label: 'Code', description: undefined },
+    ]);
+    expect(currentModeId).toBe('plan');
+  });
+
+  it('falls back to configOptions mode select', () => {
+    const configOptions: SessionConfigOption[] = [
+      {
+        type: 'select',
+        id: 'mode',
+        category: 'mode',
+        currentValue: 'auto',
+        options: [
+          { value: 'auto', name: 'Auto' },
+          { value: 'manual', name: 'Manual', description: 'Ask first' },
+        ],
+      },
+    ];
+
+    const { modes, currentModeId } = deriveModesFromACP([], null, configOptions);
+
+    expect(modes).toEqual([
+      { id: 'auto', label: 'Auto', description: undefined },
+      { id: 'manual', label: 'Manual', description: 'Ask first' },
+    ]);
+    expect(currentModeId).toBe('auto');
+  });
+
+  it('uses static fallback when no ACP mode data', () => {
+    const fallback = [{ id: 'default', label: 'Default' }];
+    const { modes, currentModeId } = deriveModesFromACP(fallback, null, null);
+
+    expect(modes).toEqual(fallback);
+    expect(currentModeId).toBeNull();
+  });
+});
+
+describe('deriveModelDefinitionsFromACP', () => {
+  it('maps availableModels with thought_level options', () => {
+    const configOptions: SessionConfigOption[] = [
+      {
+        type: 'select',
+        id: 'thought',
+        category: 'thought_level',
+        currentValue: 'medium',
+        options: [
+          { value: 'low', name: 'Low' },
+          { value: 'medium', name: 'Medium' },
+        ],
+      },
+    ];
+
+    const models = deriveModelDefinitionsFromACP(
+      {
+        currentModelId: 'gpt-4',
+        availableModels: [
+          { modelId: 'gpt-4', name: 'GPT-4' },
+          { modelId: 'gpt-4-mini', name: 'Mini', description: 'Cheaper' },
+        ],
+      },
+      configOptions,
+    );
+
+    expect(models).toEqual([
+      {
+        id: 'gpt-4',
+        label: 'GPT-4',
+        description: undefined,
+        isDefault: true,
+        thinkingOptions: [
+          { id: 'low', label: 'Low', isDefault: false },
+          { id: 'medium', label: 'Medium', isDefault: true },
+        ],
+        defaultThinkingOptionId: 'medium',
+      },
+      {
+        id: 'gpt-4-mini',
+        label: 'Mini',
+        description: 'Cheaper',
+        isDefault: false,
+        thinkingOptions: [
+          { id: 'low', label: 'Low', isDefault: false },
+          { id: 'medium', label: 'Medium', isDefault: true },
+        ],
+        defaultThinkingOptionId: 'medium',
+      },
+    ]);
+  });
+
+  it('falls back to model select config when no availableModels', () => {
+    const configOptions: SessionConfigOption[] = [
+      {
+        type: 'select',
+        id: 'model',
+        category: 'model',
+        currentValue: 'sonnet',
+        options: [
+          { value: 'sonnet', name: 'Sonnet' },
+          { value: 'opus', name: 'Opus' },
+        ],
+      },
+    ];
+
+    const models = deriveModelDefinitionsFromACP(null, configOptions);
+
+    expect(models).toEqual([
+      { id: 'sonnet', label: 'Sonnet', isDefault: true, defaultThinkingOptionId: undefined },
+      { id: 'opus', label: 'Opus', isDefault: false, defaultThinkingOptionId: undefined },
+    ]);
+  });
+});
+
+describe('findThoughtLevelConfigId', () => {
+  it('returns thought_level select id', () => {
+    const configOptions: SessionConfigOption[] = [
+      {
+        type: 'select',
+        id: 'effort',
+        category: 'thought_level',
+        currentValue: 'high',
+        options: [{ value: 'high', name: 'High' }],
+      },
+    ];
+
+    expect(findThoughtLevelConfigId(configOptions)).toBe('effort');
+  });
+
+  it('returns null when missing', () => {
+    expect(findThoughtLevelConfigId(null)).toBeNull();
+  });
+});

apps/coder/src/services/__tests__/acp-tool-snapshot.test.ts

@@ -0,0 +1,66 @@
+import { describe, it, expect } from 'vitest';
+import {
+  mergeToolSnapshot,
+  mapToolLifecycleStatus,
+  snapshotToWireToolCall,
+  synthesizeCanceledSnapshots,
+} from '../acp-tool-snapshot.js';
+
+describe('mergeToolSnapshot', () => {
+  it('preserves stable toolCallId across updates', () => {
+    const first = mergeToolSnapshot('tc-1', {
+      toolCallId: 'tc-1',
+      title: 'Read file',
+      kind: 'read',
+      status: 'in_progress',
+      rawInput: { path: 'foo.ts' },
+    });
+    const merged = mergeToolSnapshot(
+      'tc-1',
+      {
+        toolCallId: 'tc-1',
+        title: 'Read file',
+        status: 'completed',
+        rawOutput: { content: 'hello' },
+      },
+      first,
+    );
+    expect(merged.toolCallId).toBe('tc-1');
+    expect(merged.rawInput).toEqual({ path: 'foo.ts' });
+    expect(merged.status).toBe('completed');
+    expect(merged.rawOutput).toEqual({ content: 'hello' });
+  });
+});
+
+describe('snapshotToWireToolCall', () => {
+  it('embeds ACP lifecycle meta for UI merge', () => {
+    const wire = snapshotToWireToolCall({
+      toolCallId: 'tc-42',
+      title: 'Edit',
+      kind: 'edit',
+      status: 'completed',
+      rawInput: { path: 'a.ts' },
+      rawOutput: 'ok',
+    });
+    expect(wire.id).toBe('tc-42');
+    expect(wire.name).toBe('edit');
+    expect(wire.args._acp).toMatchObject({ status: 'completed', title: 'Edit', output: 'ok' });
+  });
+
+  it('maps synthesized cancel to canceled lifecycle', () => {
+    const [canceled] = synthesizeCanceledSnapshots([
+      { toolCallId: 'tc-1', title: 'Run', status: 'in_progress' },
+    ]);
+    const wire = snapshotToWireToolCall(canceled!);
+    expect(wire.args._acp).toMatchObject({ status: 'canceled' });
+  });
+});
+
+describe('mapToolLifecycleStatus', () => {
+  it('maps ACP statuses to UI lifecycle', () => {
+    expect(mapToolLifecycleStatus('completed')).toBe('completed');
+    expect(mapToolLifecycleStatus('failed')).toBe('failed');
+    expect(mapToolLifecycleStatus('in_progress')).toBe('running');
+    expect(mapToolLifecycleStatus(undefined, 'canceled')).toBe('canceled');
+  });
+});

apps/coder/src/services/__tests__/cursor-models.test.ts

@@ -0,0 +1,47 @@
+import { describe, it, expect } from 'vitest';
+import { parseCursorAgentModelsOutput } from '../cursor-models.js';
+
+describe('parseCursorAgentModelsOutput', () => {
+  it('parses cursor-agent models output with default marker', () => {
+    const output = `
+Available models
+claude-4-sonnet - Claude 4 Sonnet (default)
+gpt-4.1 - GPT-4.1
+Tip: use cursor-agent models for full list
+`.trim();
+
+    const models = parseCursorAgentModelsOutput(output);
+
+    expect(models).toEqual([
+      { id: 'claude-4-sonnet', label: 'Claude 4 Sonnet', isDefault: true },
+      { id: 'gpt-4.1', label: 'GPT-4.1', isDefault: false },
+    ]);
+  });
+
+  it('uses current marker when no default', () => {
+    const output = `
+model-a - Model A (current)
+model-b - Model B
+`.trim();
+
+    const models = parseCursorAgentModelsOutput(output);
+
+    expect(models.find((m) => m.id === 'model-a')?.isDefault).toBe(true);
+    expect(models.find((m) => m.id === 'model-b')?.isDefault).toBe(false);
+  });
+
+  it('defaults to first model when no markers', () => {
+    const output = 'alpha - Alpha\nbeta - Beta';
+    const models = parseCursorAgentModelsOutput(output);
+
+    expect(models[0]?.isDefault).toBe(true);
+    expect(models[1]?.isDefault).toBe(false);
+  });
+
+  it('skips malformed lines', () => {
+    const output = 'no-separator\nvalid - Valid';
+    const models = parseCursorAgentModelsOutput(output);
+
+    expect(models).toEqual([{ id: 'valid', label: 'Valid', isDefault: true }]);
+  });
+});

apps/coder/src/services/__tests__/provider-commands.test.ts

@@ -0,0 +1,26 @@
+import { describe, it, expect } from 'vitest';
+import { getManifestCommands, mergeCommands, PROVIDER_COMMANDS } from '../provider-commands.js';
+
+describe('provider-commands', () => {
+  it('defines commands for every external harness', () => {
+    for (const name of ['claude', 'opencode', 'cursor', 'goose', 'qwen', 'copilot']) {
+      expect(getManifestCommands(name).length, name).toBeGreaterThan(0);
+    }
+  });
+
+  it('boocode uses frontend skills — empty manifest', () => {
+    expect(getManifestCommands('boocode')).toEqual([]);
+    expect(PROVIDER_COMMANDS.boocode).toEqual([]);
+  });
+
+  it('mergeCommands dedupes by name with later override', () => {
+    const merged = mergeCommands(
+      [{ name: 'help', description: 'a' }],
+      [{ name: 'help', description: 'b' }, { name: 'clear' }],
+    );
+    expect(merged).toEqual([
+      { name: 'clear' },
+      { name: 'help', description: 'b' },
+    ]);
+  });
+});

apps/coder/src/services/__tests__/provider-snapshot.test.ts

@@ -0,0 +1,168 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import {
+  mergeModels,
+  prefixLlamaSwapModels,
+  clearProviderSnapshotCache,
+  getProviderSnapshot,
+} from '../provider-snapshot.js';
+
+vi.mock('../acp-probe.js', () => ({
+  probeAcpProvider: vi.fn(),
+}));
+
+import { probeAcpProvider } from '../acp-probe.js';
+
+const mockProbe = vi.mocked(probeAcpProvider);
+
+function mockSql(agents: Array<{
+  name: string;
+  install_path: string | null;
+  supports_acp: boolean;
+  models: Array<{ id: string; label: string }> | null;
+  label: string | null;
+  transport: string | null;
+}>) {
+  return vi.fn((strings: TemplateStringsArray) => {
+    const query = strings.join('');
+    if (query.includes('FROM available_agents')) {
+      return Promise.resolve(agents);
+    }
+    if (query.includes('UPDATE available_agents')) {
+      return Promise.resolve([]);
+    }
+    return Promise.resolve([]);
+  }) as unknown as import('../db.js').Sql;
+}
+
+const config = {
+  LLAMA_SWAP_URL: 'http://llama-swap.test',
+} as import('../config.js').Config;
+
+describe('prefixLlamaSwapModels', () => {
+  it('prefixes bare ids', () => {
+    expect(prefixLlamaSwapModels([{ id: 'qwen3', label: 'qwen3' }])).toEqual([
+      { id: 'llama-swap/qwen3', label: 'qwen3' },
+    ]);
+  });
+
+  it('leaves already-prefixed ids unchanged', () => {
+    expect(prefixLlamaSwapModels([{ id: 'llama-swap/qwen3', label: 'qwen3' }])).toEqual([
+      { id: 'llama-swap/qwen3', label: 'qwen3' },
+    ]);
+  });
+});
+
+describe('mergeModels', () => {
+  it('dedupes by id preserving first occurrence', () => {
+    const merged = mergeModels(
+      [{ id: 'a', label: 'A' }],
+      [{ id: 'a', label: 'A2' }, { id: 'b', label: 'B' }],
+    );
+    expect(merged).toEqual([
+      { id: 'a', label: 'A' },
+      { id: 'b', label: 'B' },
+    ]);
+  });
+});
+
+describe('getProviderSnapshot', () => {
+  beforeEach(() => {
+    clearProviderSnapshotCache();
+    vi.restoreAllMocks();
+    vi.stubGlobal(
+      'fetch',
+      vi.fn().mockResolvedValue({
+        ok: true,
+        json: async () => ({
+          data: [{ id: 'local-model' }, { id: 'llama-swap/existing' }],
+        }),
+      }),
+    );
+  });
+
+  it('merges opencode ACP models with prefixed llama-swap models', async () => {
+    mockProbe.mockResolvedValue({
+      ok: true,
+      models: [{ id: 'opencode/big-pickle', label: 'Big Pickle', isDefault: true }],
+      modes: [{ id: 'build', label: 'Build' }],
+      defaultModeId: 'build',
+      commands: [{ name: 'custom', description: 'From ACP probe' }],
+    });
+
+    const sql = mockSql([
+      {
+        name: 'opencode',
+        install_path: '/usr/bin/opencode',
+        supports_acp: true,
+        models: null,
+        label: 'OpenCode',
+        transport: 'acp',
+      },
+    ]);
+
+    const entries = await getProviderSnapshot(sql, config, '/tmp/project', true);
+    const opencode = entries.find((e) => e.name === 'opencode');
+
+    expect(opencode?.models.map((m) => m.id)).toEqual([
+      'opencode/big-pickle',
+      'llama-swap/local-model',
+      'llama-swap/existing',
+    ]);
+    expect(opencode?.commands.some((c) => c.name === 'help')).toBe(true);
+    expect(opencode?.commands.some((c) => c.name === 'custom')).toBe(true);
+  });
+
+  it('combines qwen-shaped probe and settings model lists via mergeModels', () => {
+    const merged = mergeModels(
+      [{ id: 'qwen-probed', label: 'Qwen Probed' }],
+      [{ id: 'from-settings', label: 'from-settings' }],
+    );
+    expect(merged.map((m) => m.id)).toEqual(['qwen-probed', 'from-settings']);
+  });
+
+  it('returns cached entries on second call within TTL', async () => {
+    mockProbe.mockResolvedValue({
+      ok: true,
+      models: [{ id: 'm1', label: 'M1' }],
+      modes: [],
+      defaultModeId: null,
+      commands: [],
+    });
+
+    const sql = mockSql([
+      {
+        name: 'goose',
+        install_path: '/usr/bin/goose',
+        supports_acp: true,
+        models: null,
+        label: 'Goose',
+        transport: 'acp',
+      },
+    ]);
+
+    await getProviderSnapshot(sql, config, '/tmp/cwd', true);
+    await getProviderSnapshot(sql, config, '/tmp/cwd', false);
+
+    expect(mockProbe).toHaveBeenCalledTimes(1);
+  });
+
+  it('attaches claude thinking options', async () => {
+    const sql = mockSql([
+      {
+        name: 'claude',
+        install_path: '/usr/bin/claude',
+        supports_acp: false,
+        models: [{ id: 'claude-sonnet', label: 'Sonnet' }],
+        label: 'Claude Code',
+        transport: 'pty',
+      },
+    ]);
+
+    const entries = await getProviderSnapshot(sql, config, '/tmp/project', true);
+    const claude = entries.find((e) => e.name === 'claude');
+
+    expect(claude?.models[0]?.thinkingOptions?.length).toBeGreaterThan(0);
+    expect(claude?.modes.length).toBeGreaterThan(0);
+    expect(claude?.commands.some((c) => c.name === 'help')).toBe(true);
+  });
+});

apps/coder/src/services/acp-client-fs.ts

@@ -0,0 +1,35 @@
+import { promises as fs } from 'node:fs';
+import { dirname, isAbsolute, join, resolve } from 'node:path';
+
+/** Resolve an ACP path against the agent worktree and read a slice of lines. */
+export async function readWorktreeTextFile(
+  worktreePath: string,
+  filePath: string,
+  line?: number | null,
+  limit?: number | null,
+): Promise<string> {
+  const absolute = isAbsolute(filePath) ? filePath : resolve(worktreePath, filePath);
+  if (!absolute.startsWith(resolve(worktreePath))) {
+    throw new Error(`path escapes worktree: ${filePath}`);
+  }
+  const raw = await fs.readFile(absolute, 'utf8');
+  if (!line && !limit) return raw;
+  const lines = raw.split(/\r?\n/);
+  const start = Math.max((line ?? 1) - 1, 0);
+  const end = limit ? start + limit : undefined;
+  return lines.slice(start, end).join('\n');
+}
+
+/** Write a file inside the worktree (creates parent dirs). */
+export async function writeWorktreeTextFile(
+  worktreePath: string,
+  filePath: string,
+  content: string,
+): Promise<void> {
+  const absolute = isAbsolute(filePath) ? filePath : resolve(worktreePath, filePath);
+  if (!absolute.startsWith(resolve(worktreePath))) {
+    throw new Error(`path escapes worktree: ${filePath}`);
+  }
+  await fs.mkdir(dirname(absolute), { recursive: true });
+  await fs.writeFile(absolute, content, 'utf8');
+}

apps/coder/src/services/acp-derive.ts

@@ -0,0 +1,128 @@
+/**
+ * ACP model/mode derivation — adapted from Paseo acp-agent.ts.
+ */
+import type {
+  SessionConfigOption,
+  SessionModelState,
+  SessionModeState,
+} from '@agentclientprotocol/sdk';
+import type { ProviderMode, ProviderModel, ThinkingOption } from './provider-types.js';
+
+type SelectConfigOption = Extract<SessionConfigOption, { type: 'select' }>;
+
+interface SelectConfigChoice {
+  value: string;
+  name: string;
+  description?: string | null;
+  group?: string;
+}
+
+function findSelectConfigOption({
+  configOptions,
+  category,
+  id,
+}: {
+  configOptions: SessionConfigOption[] | null | undefined;
+  category: string;
+  id?: string;
+}): SelectConfigOption | null {
+  const option = configOptions?.find(
+    (entry): entry is SelectConfigOption =>
+      entry.type === 'select' && entry.category === category && (!id || entry.id === id),
+  );
+  return option ?? null;
+}
+
+function flattenSelectOptions(options: SelectConfigOption['options']): SelectConfigChoice[] {
+  const flattened: SelectConfigChoice[] = [];
+  for (const option of options) {
+    if ('value' in option) {
+      flattened.push(option);
+      continue;
+    }
+    for (const groupOption of option.options) {
+      flattened.push({ ...groupOption, group: option.group });
+    }
+  }
+  return flattened;
+}
+
+function deriveSelectorOptions(
+  configOptions: SessionConfigOption[] | null | undefined,
+  category: string,
+): ThinkingOption[] {
+  const option = findSelectConfigOption({ configOptions, category });
+  if (!option) return [];
+
+  return flattenSelectOptions(option.options).map((value) => ({
+    id: value.value,
+    label: value.name,
+    isDefault: value.value === option.currentValue,
+  }));
+}
+
+export function deriveModesFromACP(
+  fallbackModes: ProviderMode[],
+  modeState?: SessionModeState | null,
+  configOptions?: SessionConfigOption[] | null,
+): { modes: ProviderMode[]; currentModeId: string | null } {
+  if (modeState?.availableModes?.length) {
+    return {
+      modes: modeState.availableModes.map((mode) => ({
+        id: mode.id,
+        label: mode.name,
+        description: mode.description ?? undefined,
+      })),
+      currentModeId: modeState.currentModeId ?? null,
+    };
+  }
+
+  const modeOption = findSelectConfigOption({ configOptions, category: 'mode' });
+  if (modeOption) {
+    const flatOptions = flattenSelectOptions(modeOption.options);
+    return {
+      modes: flatOptions.map((option) => ({
+        id: option.value,
+        label: option.name,
+        description: option.description ?? undefined,
+      })),
+      currentModeId: modeOption.currentValue,
+    };
+  }
+
+  return { modes: fallbackModes, currentModeId: null };
+}
+
+export function deriveModelDefinitionsFromACP(
+  models: SessionModelState | null | undefined,
+  configOptions?: SessionConfigOption[] | null,
+): ProviderModel[] {
+  const thinkingOptions = deriveSelectorOptions(configOptions, 'thought_level');
+  const defaultThinkingOptionId = thinkingOptions.find((o) => o.isDefault)?.id;
+
+  if (models?.availableModels?.length) {
+    return models.availableModels.map((model) => ({
+      id: model.modelId,
+      label: model.name,
+      description: model.description ?? undefined,
+      isDefault: model.modelId === models.currentModelId,
+      thinkingOptions: thinkingOptions.length > 0 ? thinkingOptions : undefined,
+      defaultThinkingOptionId: defaultThinkingOptionId ?? undefined,
+    }));
+  }
+
+  const modelOptions = deriveSelectorOptions(configOptions, 'model');
+  return modelOptions.map((option) => ({
+    id: option.id,
+    label: option.label,
+    isDefault: option.isDefault,
+    thinkingOptions: thinkingOptions.length > 0 ? thinkingOptions : undefined,
+    defaultThinkingOptionId: defaultThinkingOptionId ?? undefined,
+  }));
+}
+
+export function findThoughtLevelConfigId(
+  configOptions: SessionConfigOption[] | null | undefined,
+): string | null {
+  return findSelectConfigOption({ configOptions, category: 'thought_level' })?.id ?? null;
+}

apps/coder/src/services/acp-dispatch.ts

@@ -1,22 +1,12 @@
 /**
- * ACP dispatch — runs ACP-capable agents (opencode, goose) directly on the host.
+ * ACP dispatch — runs ACP-capable agents directly on the host.
  *
- * v2.1.1: BooCoder runs on the host now — agents are spawned directly,
- * no SSH needed. Uses @agentclientprotocol/sdk for structured JSON-RPC.
- *
- * Flow:
- * 1. Spawn `opencode acp` (or `goose acp`) in the worktree
- * 2. Wrap child's stdin/stdout into NDJSON streams
- * 3. Create a ClientSideConnection from the SDK
- * 4. Initialize → newSession → prompt(task)
- * 5. Collect session updates (tool calls, text output)
- * 6. On prompt completion → return collected output
+ * v2.3: Paseo-aligned tool lifecycle — stable toolCallId, merge on
+ * tool_call_update, reasoning stream, worktree FS client, persist-ready snapshots.
  */
 import type { FastifyBaseLogger } from 'fastify';
-import { Readable, Writable } from 'node:stream';
 import {
   ClientSideConnection,
-  ndJsonStream,
   type Client,
   type SessionNotification,
   type RequestPermissionRequest,
@@ -27,13 +17,32 @@ import {
   type WriteTextFileResponse,
   type CreateTerminalRequest,
   type CreateTerminalResponse,
+  type CreateElicitationRequest,
+  type CreateElicitationResponse,
+  type SessionConfigOption,
+  type ClientSideConnection as ConnectionType,
 } from '@agentclientprotocol/sdk';
+import type { Broker } from '@boocode/server/broker';
+import type { WsFrame } from '@boocode/server/ws-frames';
 import { spawn } from 'node:child_process';
+import { findThoughtLevelConfigId } from './acp-derive.js';
+import { resolveAcpSpawnArgs } from './acp-spawn.js';
+import { createAcpNdJsonStream } from './acp-stream.js';
+import { waitForPermissionResponse, waitForElicitationResponse, cancelPendingPermission } from './permission-waiter.js';
+import { mergeTaskCommands, getTaskCommands } from './agent-commands-cache.js';
+import { readWorktreeTextFile, writeWorktreeTextFile } from './acp-client-fs.js';
+import {
+  type AcpToolSnapshot,
+  mergeToolSnapshot,
+  snapshotToWireToolCall,
+  synthesizeCanceledSnapshots,
+} from './acp-tool-snapshot.js';
 
 export interface AcpDispatchResult {
   exitCode: number;
   output: string;
-  toolCalls: Array<{ title: string; input: unknown; output?: unknown }>;
+  toolSnapshots: AcpToolSnapshot[];
+  reasoningText: string;
   stopReason: string;
 }
 
@@ -42,212 +51,322 @@ export interface AcpDispatchOpts {
   task: string;
   worktreePath: string;
   model?: string;
+  modeId?: string;
+  thinkingOptionId?: string;
+  taskId?: string;
+  sessionId?: string;
+  chatId?: string;
+  messageId?: string;
+  broker?: Broker;
   installPath?: string;
   signal?: AbortSignal;
   log: FastifyBaseLogger;
 }
 
-function acpArgs(agent: string): string[] | null {
-  switch (agent) {
-    case 'opencode':
-      return ['acp'];
-    case 'goose':
-      return ['acp'];
-    default:
-      return null;
+async function applySessionOverrides(
+  connection: ConnectionType,
+  acpSessionId: string,
+  configOptions: SessionConfigOption[] | null | undefined,
+  opts: Pick<AcpDispatchOpts, 'model' | 'modeId' | 'thinkingOptionId' | 'log'>,
+): Promise<void> {
+  const { model, modeId, thinkingOptionId, log } = opts;
+
+  if (modeId) {
+    try {
+      await connection.setSessionMode({ sessionId: acpSessionId, modeId });
+    } catch (err) {
+      log.warn({ modeId, err: err instanceof Error ? err.message : String(err) }, 'acp-dispatch: setSessionMode failed');
+    }
+  }
+
+  if (model) {
+    try {
+      await connection.unstable_setSessionModel({ sessionId: acpSessionId, modelId: model });
+    } catch (err) {
+      log.warn({ model, err: err instanceof Error ? err.message : String(err) }, 'acp-dispatch: setSessionModel failed');
+    }
+  }
+
+  if (thinkingOptionId) {
+    const configId = findThoughtLevelConfigId(configOptions);
+    if (configId) {
+      try {
+        await connection.setSessionConfigOption({
+          sessionId: acpSessionId,
+          configId,
+          value: thinkingOptionId,
+        });
+      } catch (err) {
+        log.warn(
+          { thinkingOptionId, err: err instanceof Error ? err.message : String(err) },
+          'acp-dispatch: setSessionConfigOption failed',
+        );
+      }
+    }
   }
 }
 
-/**
- * Convert a Node.js Readable stream to a web ReadableStream<Uint8Array>.
- */
-function nodeReadableToWeb(nodeStream: NodeJS.ReadableStream): ReadableStream<Uint8Array> {
-  return new ReadableStream<Uint8Array>({
-    start(controller) {
-      nodeStream.on('data', (chunk: Buffer) => {
-        controller.enqueue(new Uint8Array(chunk));
-      });
-      nodeStream.on('end', () => {
-        controller.close();
-      });
-      nodeStream.on('error', (err) => {
-        controller.error(err);
-      });
-    },
-    cancel() {
-      if ('destroy' in nodeStream && typeof (nodeStream as Readable).destroy === 'function') {
-        (nodeStream as Readable).destroy();
+class AcpStreamContext {
+  readonly textChunks: string[] = [];
+  readonly reasoningChunks: string[] = [];
+  readonly toolSnapshots = new Map<string, AcpToolSnapshot>();
+  private aborted = false;
+
+  constructor(
+    private readonly opts: Pick<
+      AcpDispatchOpts,
+      'broker' | 'sessionId' | 'chatId' | 'messageId' | 'taskId'
+    >,
+    private readonly worktreePath: string,
+  ) {}
+
+  get reasoningText(): string {
+    return this.reasoningChunks.join('');
+  }
+
+  get output(): string {
+    return this.textChunks.join('');
+  }
+
+  get snapshots(): AcpToolSnapshot[] {
+    return [...this.toolSnapshots.values()];
+  }
+
+  markAborted(): void {
+    this.aborted = true;
+    for (const snap of synthesizeCanceledSnapshots(this.toolSnapshots.values())) {
+      this.toolSnapshots.set(snap.toolCallId, snap);
+      this.publishToolSnapshot(snap);
+    }
+  }
+
+  private canStream(): boolean {
+    return !!(this.opts.broker && this.opts.sessionId && this.opts.chatId && this.opts.messageId);
+  }
+
+  private publishToolSnapshot(snapshot: AcpToolSnapshot): void {
+    if (!this.canStream()) return;
+    const wire = snapshotToWireToolCall(snapshot);
+    this.opts.broker!.publishFrame(this.opts.sessionId!, {
+      type: 'tool_call',
+      message_id: this.opts.messageId!,
+      chat_id: this.opts.chatId!,
+      tool_call: wire,
+    } as WsFrame);
+  }
+
+  handleToolUpdate(toolCallId: string, update: Parameters<typeof mergeToolSnapshot>[1]): void {
+    const previous = this.toolSnapshots.get(toolCallId);
+    const snapshot = mergeToolSnapshot(toolCallId, update, previous);
+    this.toolSnapshots.set(toolCallId, snapshot);
+    this.publishToolSnapshot(snapshot);
+  }
+
+  async handleSessionUpdate(params: SessionNotification): Promise<void> {
+    const update = params.update;
+    switch (update.sessionUpdate) {
+      case 'agent_message_chunk': {
+        const content = update.content;
+        if (content.type === 'text' && 'text' in content) {
+          const text = (content as { text: string }).text;
+          this.textChunks.push(text);
+          if (this.canStream()) {
+            this.opts.broker!.publishFrame(this.opts.sessionId!, {
+              type: 'delta',
+              message_id: this.opts.messageId!,
+              chat_id: this.opts.chatId!,
+              content: text,
+            } as WsFrame);
+          }
+        }
+        break;
       }
-    },
-  });
+      case 'agent_thought_chunk': {
+        const content = update.content;
+        if (content.type === 'text' && 'text' in content) {
+          const text = (content as { text: string }).text;
+          this.reasoningChunks.push(text);
+          if (this.canStream()) {
+            this.opts.broker!.publishFrame(this.opts.sessionId!, {
+              type: 'reasoning_delta',
+              message_id: this.opts.messageId!,
+              chat_id: this.opts.chatId!,
+              content: text,
+            } as WsFrame);
+          }
+        }
+        break;
+      }
+      case 'tool_call':
+        this.handleToolUpdate(update.toolCallId, update);
+        break;
+      case 'tool_call_update':
+        this.handleToolUpdate(update.toolCallId, update);
+        break;
+      case 'available_commands_update': {
+        const commands = update.availableCommands.map((cmd) => ({
+          name: cmd.name,
+          description: cmd.description ?? undefined,
+        }));
+        if (this.opts.taskId && commands.length > 0) {
+          mergeTaskCommands(this.opts.taskId, commands);
+          if (this.canStream() && this.opts.sessionId) {
+            const all = getTaskCommands(this.opts.taskId) ?? commands;
+            this.opts.broker!.publishFrame(this.opts.sessionId, {
+              type: 'agent_commands',
+              task_id: this.opts.taskId,
+              session_id: this.opts.sessionId,
+              commands: all,
+            } as WsFrame);
+          }
+        }
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  buildClient(agent: string, modeId: string | undefined, taskId: string | undefined, sessionId: string | undefined): Client {
+    return {
+      sessionUpdate: (params) => this.handleSessionUpdate(params),
+      requestPermission: async (params: RequestPermissionRequest): Promise<RequestPermissionResponse> => {
+        if (taskId && sessionId) {
+          return waitForPermissionResponse(taskId, sessionId, agent, modeId, params);
+        }
+        const firstOption = params.options[0];
+        if (firstOption) {
+          return { outcome: { outcome: 'selected', optionId: firstOption.optionId } };
+        }
+        return { outcome: { outcome: 'cancelled' } };
+      },
+      readTextFile: async (params: ReadTextFileRequest): Promise<ReadTextFileResponse> => {
+        const content = await readWorktreeTextFile(
+          this.worktreePath,
+          params.path,
+          params.line,
+          params.limit,
+        );
+        return { content };
+      },
+      writeTextFile: async (params: WriteTextFileRequest): Promise<WriteTextFileResponse> => {
+        await writeWorktreeTextFile(this.worktreePath, params.path, params.content);
+        return {};
+      },
+      createTerminal: async (_params: CreateTerminalRequest): Promise<CreateTerminalResponse> => {
+        return { terminalId: 'noop' };
+      },
+      unstable_createElicitation: async (params: CreateElicitationRequest): Promise<CreateElicitationResponse> => {
+        if (taskId && sessionId) {
+          return waitForElicitationResponse(taskId, sessionId, agent, modeId, params);
+        }
+        return { action: 'decline' };
+      },
+    };
+  }
 }
 
-/**
- * Convert a Node.js Writable stream to a web WritableStream<Uint8Array>.
- */
-function nodeWritableToWeb(nodeStream: NodeJS.WritableStream): WritableStream<Uint8Array> {
-  return new WritableStream<Uint8Array>({
-    write(chunk) {
-      return new Promise<void>((resolve, reject) => {
-        const ok = (nodeStream as Writable).write(chunk, (err) => {
-          if (err) reject(err);
-        });
-        if (ok) resolve();
-        else (nodeStream as Writable).once('drain', resolve);
-      });
-    },
-    close() {
-      return new Promise<void>((resolve) => {
-        (nodeStream as Writable).end(resolve);
-      });
-    },
-    abort() {
-      (nodeStream as Writable).destroy();
-    },
-  });
-}
-
-/**
- * Dispatch a task to an ACP-capable agent via SSH.
- *
- * Opens a structured ACP session, sends the task as a prompt, and collects
- * all session updates. Returns the collected output and tool calls.
- */
 export async function dispatchViaAcp(opts: AcpDispatchOpts): Promise<AcpDispatchResult> {
-  const { agent, task, worktreePath, installPath, signal, log } = opts;
+  const {
+    agent,
+    task,
+    worktreePath,
+    installPath,
+    signal,
+    log,
+    taskId,
+    modeId,
+    sessionId,
+    chatId,
+    messageId,
+    broker,
+  } = opts;
 
-  const args = acpArgs(agent);
+  const args = resolveAcpSpawnArgs(agent);
   if (!args) {
     return {
       exitCode: 1,
       output: `Agent '${agent}' does not support ACP.`,
-      toolCalls: [],
+      toolSnapshots: [],
+      reasoningText: '',
       stopReason: 'error',
     };
   }
 
   const binary = installPath ?? agent;
-  log.info({ agent, binary, worktreePath }, 'acp-dispatch: spawning');
+  log.info({ agent, binary, worktreePath, modeId, model: opts.model }, 'acp-dispatch: spawning');
   const child = spawn(binary, args, {
     cwd: worktreePath,
     stdio: ['pipe', 'pipe', 'pipe'],
     env: { ...process.env },
   });
 
-  // Wire up abort
+  const streamCtx = new AcpStreamContext(
+    { broker, sessionId, chatId, messageId, taskId },
+    worktreePath,
+  );
+
   let killed = false;
   const cleanup = () => {
     if (!killed) {
       killed = true;
+      streamCtx.markAborted();
       child.kill('SIGTERM');
       setTimeout(() => child.kill('SIGKILL'), 5_000);
     }
+    if (taskId) cancelPendingPermission(taskId);
   };
 
   if (signal) {
     if (signal.aborted) {
       cleanup();
-      return { exitCode: 130, output: 'Aborted before start', toolCalls: [], stopReason: 'cancelled' };
+      return {
+        exitCode: 130,
+        output: 'Aborted before start',
+        toolSnapshots: streamCtx.snapshots,
+        reasoningText: '',
+        stopReason: 'cancelled',
+      };
     }
     signal.addEventListener('abort', cleanup, { once: true });
   }
 
   try {
-    // Create web streams from the child process stdio
-    const inputStream = nodeReadableToWeb(child.stdout!);
-    const outputStream = nodeWritableToWeb(child.stdin!);
-
-    // Create the NDJSON ACP stream
-    const stream = ndJsonStream(outputStream, inputStream);
-
-    // Collected session updates
-    const textChunks: string[] = [];
-    const toolCalls: Array<{ title: string; input: unknown; output?: unknown }> = [];
-
-    // Create client-side connection — we are the "client" (editor), the agent is remote
+    const stream = createAcpNdJsonStream(child);
     const connection = new ClientSideConnection(
-      (_agentInterface): Client => ({
-        // Handle session updates from the agent
-        async sessionUpdate(params: SessionNotification): Promise<void> {
-          const update = params.update;
-          if (update.sessionUpdate === 'agent_message_chunk') {
-            // ContentChunk with content: ContentBlock
-            const content = update.content;
-            if (content.type === 'text' && 'text' in content) {
-              textChunks.push((content as { text: string }).text);
-            }
-          } else if (update.sessionUpdate === 'tool_call') {
-            toolCalls.push({
-              title: update.title,
-              input: update.rawInput,
-            });
-          } else if (update.sessionUpdate === 'tool_call_update') {
-            const last = toolCalls[toolCalls.length - 1];
-            if (last && update.rawOutput !== undefined) {
-              last.output = update.rawOutput;
-            }
-          }
-        },
-
-        // Permission requests — auto-approve by selecting the first option (worktree is isolated)
-        async requestPermission(params: RequestPermissionRequest): Promise<RequestPermissionResponse> {
-          // Select the first available option to auto-approve
-          const firstOption = params.options[0];
-          if (firstOption) {
-            return {
-              outcome: { outcome: 'selected', optionId: firstOption.optionId },
-            };
-          }
-          // No options available — cancel
-          return { outcome: { outcome: 'cancelled' } };
-        },
-
-        // File system operations — let the agent handle them directly in the worktree
-        async readTextFile(_params: ReadTextFileRequest): Promise<ReadTextFileResponse> {
-          return { content: '' };
-        },
-        async writeTextFile(_params: WriteTextFileRequest): Promise<WriteTextFileResponse> {
-          return {};
-        },
-        async createTerminal(_params: CreateTerminalRequest): Promise<CreateTerminalResponse> {
-          return { terminalId: 'noop' };
-        },
-      }),
+      () => streamCtx.buildClient(agent, modeId, taskId, sessionId),
       stream,
     );
 
-    // Initialize the connection
-    // ProtocolVersion is a number in this SDK version
-    const initResult = await connection.initialize({
+    await connection.initialize({
       protocolVersion: 1,
-      clientInfo: { name: 'boocoder', version: '2.0.1' },
+      clientInfo: { name: 'boocoder', version: '2.3.0' },
       clientCapabilities: {},
     });
-    log.info({ agentInfo: initResult.agentInfo }, 'acp-dispatch: initialized');
 
-    // Create a new session
-    const session = await connection.newSession({
-      cwd: worktreePath,
-      mcpServers: [],
-    });
-    log.info({ sessionId: session.sessionId }, 'acp-dispatch: session created');
+    const acpSession = await connection.newSession({ cwd: worktreePath, mcpServers: [] });
+    log.info({ sessionId: acpSession.sessionId }, 'acp-dispatch: session created');
+
+    await applySessionOverrides(connection, acpSession.sessionId, acpSession.configOptions, opts);
 
-    // Send the prompt
     const promptResult = await connection.prompt({
-      sessionId: session.sessionId,
+      sessionId: acpSession.sessionId,
       prompt: [{ type: 'text', text: task }],
     });
 
     const stopReason = promptResult.stopReason ?? 'end_turn';
-    log.info({ agent, stopReason, toolCallCount: toolCalls.length }, 'acp-dispatch: prompt completed');
+    log.info(
+      { agent, stopReason, toolCallCount: streamCtx.snapshots.length, reasoningChars: streamCtx.reasoningText.length },
+      'acp-dispatch: prompt completed',
+    );
 
-    // Clean shutdown
-    await connection.closeSession({ sessionId: session.sessionId }).catch(() => {});
+    await connection.closeSession({ sessionId: acpSession.sessionId }).catch(() => {});
 
     return {
       exitCode: 0,
-      output: textChunks.join(''),
-      toolCalls,
+      output: streamCtx.output,
+      toolSnapshots: streamCtx.snapshots,
+      reasoningText: streamCtx.reasoningText,
       stopReason,
     };
   } catch (err) {
@@ -256,14 +375,13 @@ export async function dispatchViaAcp(opts: AcpDispatchOpts): Promise<AcpDispatch
     return {
       exitCode: 1,
       output: message,
-      toolCalls: [],
+      toolSnapshots: streamCtx.snapshots,
+      reasoningText: streamCtx.reasoningText,
       stopReason: 'error',
     };
   } finally {
     if (signal) signal.removeEventListener('abort', cleanup);
     cleanup();
-
-    // Wait for child to exit
     await new Promise<void>((resolve) => {
       child.on('close', resolve);
       setTimeout(resolve, 3_000);

apps/coder/src/services/acp-probe.ts

@@ -0,0 +1,155 @@
+/**
+ * Short-lived ACP probe — opens a session and reads models/modes from the response.
+ */
+import { spawn } from 'node:child_process';
+import {
+  ClientSideConnection,
+  type Client,
+  type NewSessionResponse,
+  type ReadTextFileRequest,
+  type ReadTextFileResponse,
+  type WriteTextFileRequest,
+  type WriteTextFileResponse,
+  type CreateTerminalRequest,
+  type CreateTerminalResponse,
+  type RequestPermissionRequest,
+  type RequestPermissionResponse,
+} from '@agentclientprotocol/sdk';
+import { deriveModesFromACP, deriveModelDefinitionsFromACP } from './acp-derive.js';
+import { getManifestDefaultModeId, getManifestModes } from './provider-manifest.js';
+import { resolveAcpSpawnArgs } from './acp-spawn.js';
+import { createAcpNdJsonStream } from './acp-stream.js';
+import type { ProviderModel, ProviderMode } from './provider-types.js';
+import type { AgentCommand } from './agent-commands-cache.js';
+
+const PROBE_TIMEOUT_MS = 30_000;
+
+export interface AcpProbeResult {
+  ok: boolean;
+  models: ProviderModel[];
+  modes: ProviderMode[];
+  defaultModeId: string | null;
+  commands: AgentCommand[];
+  error?: string;
+}
+
+function parseSessionResponse(session: NewSessionResponse, agent: string): AcpProbeResult {
+  const fallbackModes = getManifestModes(agent);
+  const { modes, currentModeId } = deriveModesFromACP(
+    fallbackModes,
+    session.modes,
+    session.configOptions,
+  );
+  const models = deriveModelDefinitionsFromACP(session.models, session.configOptions);
+
+  return {
+    ok: true,
+    models,
+    modes,
+    defaultModeId: currentModeId ?? getManifestDefaultModeId(agent),
+    commands: [],
+  };
+}
+
+export async function probeAcpProvider(
+  agent: string,
+  installPath: string,
+  cwd: string,
+): Promise<AcpProbeResult> {
+  const args = resolveAcpSpawnArgs(agent);
+  if (!args) {
+    return {
+      ok: false,
+      models: [],
+      modes: getManifestModes(agent),
+      defaultModeId: getManifestDefaultModeId(agent),
+      commands: [],
+      error: 'no ACP spawn args',
+    };
+  }
+
+  const child = spawn(installPath, args, {
+    cwd,
+    stdio: ['pipe', 'pipe', 'pipe'],
+    env: { ...process.env },
+  });
+
+  let killed = false;
+  const kill = () => {
+    if (!killed) {
+      killed = true;
+      child.kill('SIGTERM');
+      setTimeout(() => child.kill('SIGKILL'), 2_000);
+    }
+  };
+
+  const timeout = setTimeout(kill, PROBE_TIMEOUT_MS);
+
+  const probedCommands: AgentCommand[] = [];
+
+  try {
+    const stream = createAcpNdJsonStream(child);
+
+    const connection = new ClientSideConnection(
+      (_agentInterface): Client => ({
+        async sessionUpdate(params) {
+          const update = params.update;
+          if (update.sessionUpdate === 'available_commands_update') {
+            for (const cmd of update.availableCommands) {
+              probedCommands.push({
+                name: cmd.name,
+                description: cmd.description ?? undefined,
+              });
+            }
+          }
+        },
+        async requestPermission(params: RequestPermissionRequest): Promise<RequestPermissionResponse> {
+          const first = params.options[0];
+          if (first) {
+            return { outcome: { outcome: 'selected', optionId: first.optionId } };
+          }
+          return { outcome: { outcome: 'cancelled' } };
+        },
+        async readTextFile(_params: ReadTextFileRequest): Promise<ReadTextFileResponse> {
+          return { content: '' };
+        },
+        async writeTextFile(_params: WriteTextFileRequest): Promise<WriteTextFileResponse> {
+          return {};
+        },
+        async createTerminal(_params: CreateTerminalRequest): Promise<CreateTerminalResponse> {
+          return { terminalId: 'noop' };
+        },
+      }),
+      stream,
+    );
+
+    await connection.initialize({
+      protocolVersion: 1,
+      clientInfo: { name: 'boocoder-probe', version: '2.2.0' },
+      clientCapabilities: {},
+    });
+
+    const session = await connection.newSession({ cwd, mcpServers: [] });
+    const result = parseSessionResponse(session, agent);
+    result.commands = probedCommands;
+    await connection.closeSession({ sessionId: session.sessionId }).catch(() => {});
+    return result;
+  } catch (err) {
+    const message = err instanceof Error ? err.message : String(err);
+    return {
+      ok: false,
+      models: [],
+      modes: getManifestModes(agent),
+      defaultModeId: getManifestDefaultModeId(agent),
+      commands: probedCommands,
+      error: message,
+    };
+  } finally {
+    clearTimeout(timeout);
+    kill();
+    await new Promise<void>((resolve) => {
+      child.on('close', resolve);
+      setTimeout(resolve, 2_000);
+    });
+  }
+}

apps/coder/src/services/acp-spawn.ts

@@ -0,0 +1,29 @@
+/**
+ * Resolve ACP spawn argv per provider (host-probe verified 2026-05-25).
+ */
+export function resolveAcpSpawnArgs(agent: string): string[] | null {
+  switch (agent) {
+    case 'opencode':
+    case 'goose':
+      return ['acp'];
+    case 'cursor':
+      return ['acp'];
+    case 'copilot':
+      return ['--acp'];
+    case 'qwen':
+      return ['--acp'];
+    default:
+      return null;
+  }
+}
+
+export function resolveAcpProbeBinaries(agent: string): string[] {
+  switch (agent) {
+    case 'cursor':
+      return ['cursor-agent', 'agent'];
+    case 'copilot':
+      return ['copilot'];
+    default:
+      return [agent];
+  }
+}

apps/coder/src/services/acp-stream.ts

@@ -0,0 +1,44 @@
+import { Readable, Writable } from 'node:stream';
+import type { ChildProcess } from 'node:child_process';
+import { ndJsonStream } from '@agentclientprotocol/sdk';
+
+export function nodeReadableToWeb(nodeStream: NodeJS.ReadableStream): ReadableStream<Uint8Array> {
+  return new ReadableStream<Uint8Array>({
+    start(controller) {
+      nodeStream.on('data', (chunk: Buffer) => controller.enqueue(new Uint8Array(chunk)));
+      nodeStream.on('end', () => controller.close());
+      nodeStream.on('error', (err) => controller.error(err));
+    },
+    cancel() {
+      if ('destroy' in nodeStream && typeof (nodeStream as Readable).destroy === 'function') {
+        (nodeStream as Readable).destroy();
+      }
+    },
+  });
+}
+
+export function nodeWritableToWeb(nodeStream: NodeJS.WritableStream): WritableStream<Uint8Array> {
+  return new WritableStream<Uint8Array>({
+    write(chunk) {
+      return new Promise<void>((resolve, reject) => {
+        const ok = (nodeStream as Writable).write(chunk, (err) => {
+          if (err) reject(err);
+        });
+        if (ok) resolve();
+        else (nodeStream as Writable).once('drain', resolve);
+      });
+    },
+    close() {
+      return new Promise<void>((resolve) => {
+        (nodeStream as Writable).end(resolve);
+      });
+    },
+    abort() {
+      (nodeStream as Writable).destroy();
+    },
+  });
+}
+
+export function createAcpNdJsonStream(child: ChildProcess) {
+  return ndJsonStream(nodeWritableToWeb(child.stdin!), nodeReadableToWeb(child.stdout!));
+}

apps/coder/src/services/acp-tool-snapshot.ts

@@ -0,0 +1,120 @@
+/**
+ * ACP tool snapshot merge + wire mapping — lifted from Paseo acp-agent.ts patterns.
+ * Stable toolCallId, merge on tool_call_update, status lifecycle for UI + DB.
+ */
+import type { ToolCall, ToolCallUpdate, ToolCallStatus, ToolKind } from '@agentclientprotocol/sdk';
+
+export type AcpToolLifecycleStatus = 'running' | 'completed' | 'failed' | 'canceled';
+
+export interface AcpToolSnapshot {
+  toolCallId: string;
+  title: string;
+  kind?: ToolKind | null;
+  status?: ToolCallStatus | null;
+  rawInput?: unknown;
+  rawOutput?: unknown;
+}
+
+export interface AcpWireMeta {
+  status: AcpToolLifecycleStatus;
+  kind?: string | null;
+  title?: string;
+  output?: unknown;
+  error?: string;
+}
+
+function coalesceDefined<T>(next: T | null | undefined, previous: T | null | undefined, fallback: T | null): T | null {
+  if (next !== undefined && next !== null) return next;
+  if (previous !== undefined && previous !== null) return previous;
+  return fallback;
+}
+
+export function mergeToolSnapshot(
+  toolCallId: string,
+  update: ToolCall | ToolCallUpdate,
+  previous?: AcpToolSnapshot,
+): AcpToolSnapshot {
+  return {
+    toolCallId,
+    title: update.title ?? previous?.title ?? toolCallId,
+    kind: update.kind ?? previous?.kind ?? null,
+    status: update.status ?? previous?.status ?? null,
+    rawInput: update.rawInput !== undefined ? update.rawInput : previous?.rawInput,
+    rawOutput: update.rawOutput !== undefined ? update.rawOutput : previous?.rawOutput,
+  };
+}
+
+export function mapToolLifecycleStatus(
+  status: ToolCallStatus | null | undefined,
+  rawOutput?: unknown,
+): AcpToolLifecycleStatus {
+  if (rawOutput === 'canceled') return 'canceled';
+  switch (status) {
+    case 'completed':
+      return 'completed';
+    case 'failed':
+      return 'failed';
+    case 'pending':
+    case 'in_progress':
+    default:
+      return 'running';
+  }
+}
+
+function readErrorMessage(rawOutput: unknown): string | undefined {
+  if (typeof rawOutput === 'string' && rawOutput.trim()) return rawOutput;
+  if (rawOutput && typeof rawOutput === 'object' && !Array.isArray(rawOutput)) {
+    const rec = rawOutput as Record<string, unknown>;
+    const msg = rec.message ?? rec.error ?? rec.reason;
+    if (typeof msg === 'string' && msg.trim()) return msg;
+  }
+  return undefined;
+}
+
+function asRecord(value: unknown): Record<string, unknown> {
+  if (value && typeof value === 'object' && !Array.isArray(value)) {
+    return value as Record<string, unknown>;
+  }
+  return {};
+}
+
+export function snapshotToWireToolCall(snapshot: AcpToolSnapshot): {
+  id: string;
+  name: string;
+  args: Record<string, unknown>;
+} {
+  const lifecycle = mapToolLifecycleStatus(snapshot.status, snapshot.rawOutput);
+  const input = asRecord(snapshot.rawInput);
+  const error = lifecycle === 'failed' ? readErrorMessage(snapshot.rawOutput) : undefined;
+  const meta: AcpWireMeta = {
+    status: lifecycle,
+    kind: snapshot.kind ?? null,
+    title: snapshot.title,
+    ...(snapshot.rawOutput !== undefined ? { output: snapshot.rawOutput } : {}),
+    ...(error ? { error } : {}),
+  };
+  return {
+    id: snapshot.toolCallId,
+    name: String(snapshot.kind ?? snapshot.title),
+    args: { ...input, _acp: meta },
+  };
+}
+
+export function snapshotToPartPayload(snapshot: AcpToolSnapshot): {
+  id: string;
+  name: string;
+  args: Record<string, unknown>;
+} {
+  const wire = snapshotToWireToolCall(snapshot);
+  return { id: wire.id, name: wire.name, args: wire.args };
+}
+
+export function synthesizeCanceledSnapshots(snapshots: Iterable<AcpToolSnapshot>): AcpToolSnapshot[] {
+  const out: AcpToolSnapshot[] = [];
+  for (const snapshot of snapshots) {
+    if (mapToolLifecycleStatus(snapshot.status) === 'running') {
+      out.push({ ...snapshot, status: 'failed', rawOutput: snapshot.rawOutput ?? 'canceled' });
+    }
+  }
+  return out;
+}

apps/coder/src/services/agent-commands-cache.ts

@@ -0,0 +1,28 @@
+/** In-memory cache of ACP available_commands_update per task. */
+
+import type { AgentCommand } from './provider-types.js';
+import { mergeCommands } from './provider-commands.js';
+
+export type { AgentCommand };
+
+const commandsByTask = new Map<string, AgentCommand[]>();
+
+export function setTaskCommands(taskId: string, commands: AgentCommand[]): void {
+  if (commands.length === 0) return;
+  commandsByTask.set(taskId, commands);
+}
+
+/** Merge by command name; later lists override earlier entries. */
+export function mergeTaskCommands(taskId: string, commands: AgentCommand[]): void {
+  if (commands.length === 0) return;
+  const merged = mergeCommands(commandsByTask.get(taskId) ?? [], commands);
+  commandsByTask.set(taskId, merged);
+}
+
+export function getTaskCommands(taskId: string): AgentCommand[] | null {
+  return commandsByTask.get(taskId) ?? null;
+}
+
+export function clearTaskCommands(taskId: string): void {
+  commandsByTask.delete(taskId);
+}

apps/coder/src/services/agent-probe.ts

@@ -2,77 +2,99 @@ import type { Sql } from '../db.js';
 import type { FastifyBaseLogger } from 'fastify';
 import { exec as execCb } from 'node:child_process';
 import { promisify } from 'node:util';
-import { PROVIDERS_BY_NAME } from './provider-registry.js';
+import { PROVIDERS_BY_NAME, PROBED_AGENT_NAMES } from './provider-registry.js';
+import { resolveAcpProbeBinaries } from './acp-spawn.js';
+import { clearProviderSnapshotCache } from './provider-snapshot.js';
+import { readQwenSettingsModels } from './qwen-settings.js';
 
 const exec = promisify(execCb);
 
-const KNOWN_AGENTS = ['opencode', 'goose', 'claude', 'qwen'].map((name) => ({
-  name,
-  supportsAcp: PROVIDERS_BY_NAME.get(name)?.transport === 'acp',
-}));
+async function resolveInstallPath(agentName: string): Promise<string | null> {
+  const candidates = resolveAcpProbeBinaries(agentName);
+  for (const bin of candidates) {
+    try {
+      const { stdout } = await exec(`which ${bin}`, { timeout: 10_000 });
+      const path = stdout.trim();
+      if (path) return path;
+    } catch {
+      /* try next */
+    }
+  }
+  return null;
+}
+
+async function detectAcpSupport(agentName: string, installPath: string): Promise<boolean> {
+  const transport = PROVIDERS_BY_NAME.get(agentName)?.transport;
+  if (transport !== 'acp') return false;
+
+  if (agentName === 'copilot') {
+    try {
+      const { stdout } = await exec(`"${installPath}" --help`, { timeout: 10_000 });
+      return stdout.includes('--acp');
+    } catch {
+      return false;
+    }
+  }
+
+  if (agentName === 'qwen') {
+    try {
+      const { stdout } = await exec(`"${installPath}" --help`, { timeout: 10_000 });
+      return stdout.includes('--acp');
+    } catch {
+      return false;
+    }
+  }
+
+  try {
+    await exec(`"${installPath}" acp --help`, { timeout: 10_000 });
+    return true;
+  } catch {
+    return false;
+  }
+}
 
 /**
  * Probe for available agents on the HOST.
- *
- * v2.1.1: BooCoder runs on the host now — agents are local binaries,
- * no SSH needed. Direct `which` / `exec` calls.
  */
 export async function probeAgents(sql: Sql, log: FastifyBaseLogger): Promise<void> {
+  clearProviderSnapshotCache();
   log.info('agent-probe: scanning for known agents');
 
-  for (const agent of KNOWN_AGENTS) {
+  for (const agentName of PROBED_AGENT_NAMES) {
     try {
-      const { stdout: whichOut } = await exec(`which ${agent.name}`, { timeout: 10_000 });
-      const installPath = whichOut.trim();
+      const installPath = await resolveInstallPath(agentName);
       if (!installPath) continue;
 
       let version: string | null = null;
       try {
-        const { stdout: verOut } = await exec(`${agent.name} --version`, { timeout: 15_000 });
+        const { stdout: verOut } = await exec(`"${installPath}" --version`, { timeout: 15_000 });
         version = verOut.trim().slice(0, 100);
       } catch {
-        // Some agents may not support --version
+        /* optional */
       }
 
-      let supportsAcp = agent.supportsAcp;
+      const providerDef = PROVIDERS_BY_NAME.get(agentName);
+      let supportsAcp = providerDef?.transport === 'acp';
       if (supportsAcp) {
-        try {
-          await exec(`${agent.name} acp --help`, { timeout: 10_000 });
-        } catch {
-          supportsAcp = false;
-        }
+        supportsAcp = await detectAcpSupport(agentName, installPath);
       }
 
       let models: Array<{ id: string; label: string }> = [];
-      const providerDef = PROVIDERS_BY_NAME.get(agent.name);
-
       if (providerDef?.modelSource === 'static' && providerDef.staticModels) {
         models = providerDef.staticModels;
       }
 
-      if (agent.name === 'qwen') {
-        try {
-          const { stdout: catOut } = await exec('cat ~/.qwen/settings.json', { timeout: 10_000 });
-          if (catOut.trim()) {
-            const settings = JSON.parse(catOut) as {
-              modelProviders?: { openai?: Array<{ id: string }> };
-            };
-            const openaiModels = settings?.modelProviders?.openai;
-            if (Array.isArray(openaiModels)) {
-              models = openaiModels.map((m) => ({ id: m.id, label: m.id }));
-            }
-          }
-        } catch {
-          // ~/.qwen/settings.json missing or unparseable
-        }
+      if (agentName === 'qwen') {
+        models = await readQwenSettingsModels();
       }
 
-      const label = providerDef?.label ?? agent.name;
-      const transport = providerDef?.transport ?? 'pty';
+      const label = providerDef?.label ?? agentName;
+      const transport =
+        providerDef?.transport === 'acp' && !supportsAcp ? 'pty' : (providerDef?.transport ?? 'pty');
 
       await sql`
         INSERT INTO available_agents (name, install_path, version, supports_acp, last_probed_at, models, label, transport)
-        VALUES (${agent.name}, ${installPath}, ${version}, ${supportsAcp}, clock_timestamp(), ${sql.json(models as never)}, ${label}, ${transport})
+        VALUES (${agentName}, ${installPath}, ${version}, ${supportsAcp}, clock_timestamp(), ${sql.json(models as never)}, ${label}, ${transport})
         ON CONFLICT (name) DO UPDATE SET
           install_path = EXCLUDED.install_path,
           version = EXCLUDED.version,
@@ -82,10 +104,10 @@ export async function probeAgents(sql: Sql, log: FastifyBaseLogger): Promise<voi
           label = EXCLUDED.label,
           transport = EXCLUDED.transport
       `;
-      log.info({ agent: agent.name, version, installPath, supportsAcp, modelCount: models.length }, 'agent-probe: found');
+      log.info({ agent: agentName, version, installPath, supportsAcp, modelCount: models.length }, 'agent-probe: found');
     } catch (err) {
       const msg = err instanceof Error ? err.message : String(err);
-      log.debug({ agent: agent.name, err: msg }, 'agent-probe: not found');
+      log.debug({ agent: agentName, err: msg }, 'agent-probe: not found');
     }
   }
 

apps/coder/src/services/agent-turn-persist.ts

@@ -0,0 +1,56 @@
+import type { Sql } from '../db.js';
+import type { AcpToolSnapshot } from './acp-tool-snapshot.js';
+import { snapshotToPartPayload } from './acp-tool-snapshot.js';
+
+interface PartInsert {
+  message_id: string;
+  sequence: number;
+  kind: 'reasoning' | 'tool_call';
+  payload: unknown;
+}
+
+async function insertParts(sql: Sql, parts: PartInsert[]): Promise<void> {
+  if (parts.length === 0) return;
+  await sql`
+    INSERT INTO message_parts ${sql(
+      parts.map((p) => ({
+        message_id: p.message_id,
+        sequence: p.sequence,
+        kind: p.kind,
+        payload: sql.json(p.payload as never),
+      })),
+      'message_id',
+      'sequence',
+      'kind',
+      'payload',
+    )}
+  `;
+}
+
+/** Persist external-agent reasoning + tool calls into message_parts for reload. */
+export async function persistExternalAgentTurn(
+  sql: Sql,
+  assistantMessageId: string,
+  snapshots: AcpToolSnapshot[],
+  reasoningText: string,
+): Promise<void> {
+  const parts: PartInsert[] = [];
+  let seq = 0;
+  if (reasoningText.trim()) {
+    parts.push({
+      message_id: assistantMessageId,
+      sequence: seq++,
+      kind: 'reasoning',
+      payload: { text: reasoningText },
+    });
+  }
+  for (const snapshot of snapshots) {
+    parts.push({
+      message_id: assistantMessageId,
+      sequence: seq++,
+      kind: 'tool_call',
+      payload: snapshotToPartPayload(snapshot),
+    });
+  }
+  await insertParts(sql, parts);
+}

apps/coder/src/services/cursor-models.ts

@@ -0,0 +1,39 @@
+/**
+ * Cursor model list parser — lifted from Paseo cursor-acp-agent.ts
+ */
+import type { ProviderModel } from './provider-types.js';
+
+const CURSOR_MODEL_MARKER_PATTERN = /\s+\((?:default|current)\)$/;
+
+export function parseCursorAgentModelsOutput(output: string): ProviderModel[] {
+  const parsed = output
+    .split(/\r?\n/)
+    .map((line) => line.trim())
+    .filter((line) => line && line !== 'Available models' && !line.startsWith('Tip:'))
+    .map((line) => {
+      const separatorIndex = line.indexOf(' - ');
+      if (separatorIndex <= 0) return null;
+
+      const id = line.slice(0, separatorIndex).trim();
+      const rawLabel = line.slice(separatorIndex + 3).trim();
+      if (!id || !rawLabel) return null;
+
+      let marker: 'default' | 'current' | null = null;
+      if (rawLabel.endsWith(' (default)')) marker = 'default';
+      else if (rawLabel.endsWith(' (current)')) marker = 'current';
+
+      return { id, label: rawLabel.replace(CURSOR_MODEL_MARKER_PATTERN, ''), marker };
+    })
+    .filter((m): m is { id: string; label: string; marker: 'default' | 'current' | null } => m !== null);
+
+  const defaultModelId =
+    parsed.find((m) => m.marker === 'default')?.id ??
+    parsed.find((m) => m.marker === 'current')?.id ??
+    parsed[0]?.id;
+
+  return parsed.map((model) => ({
+    id: model.id,
+    label: model.label,
+    isDefault: model.id === defaultModelId,
+  }));
+}

apps/coder/src/services/dispatcher.ts

@@ -1,10 +1,14 @@
 import type { Sql } from '../db.js';
 import type { FastifyBaseLogger } from 'fastify';
 import type { Broker } from '@boocode/server/broker';
+import type { WsFrame } from '@boocode/server/ws-frames';
 import type { Config } from '../config.js';
 import { createWorktree, diffWorktree, cleanupWorktree } from './worktrees.js';
 import { dispatchViaAcp } from './acp-dispatch.js';
 import { dispatchViaPty } from './pty-dispatch.js';
+import { clearTaskCommands, setTaskCommands } from './agent-commands-cache.js';
+import { getManifestCommands } from './provider-commands.js';
+import { persistExternalAgentTurn } from './agent-turn-persist.js';
 
 interface InferenceRunner {
   enqueue: (sessionId: string, chatId: string, assistantId: string, user: string) => void;
@@ -24,7 +28,7 @@ const POLL_INTERVAL_MS = 5_000;
 const COMPLETION_POLL_MS = 2_000;
 
 export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<void> } {
-  const { sql, inference, log, config } = deps;
+  const { sql, inference, broker, log, config } = deps;
   let timer: ReturnType<typeof setInterval> | null = null;
   let running = false;
   let stopping = false;
@@ -34,8 +38,17 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
     if (running || stopping) return;
 
     // Grab one pending task
-    const rows = await sql<{ id: string; project_id: string; input: string; agent: string | null; model: string | null; session_id: string | null }[]>`
-      SELECT id, project_id, input, agent, model, session_id
+    const rows = await sql<{
+      id: string;
+      project_id: string;
+      input: string;
+      agent: string | null;
+      model: string | null;
+      mode_id: string | null;
+      thinking_option_id: string | null;
+      session_id: string | null;
+    }[]>`
+      SELECT id, project_id, input, agent, model, mode_id, thinking_option_id, session_id
       FROM tasks
       WHERE state = 'pending'
       ORDER BY created_at
@@ -51,7 +64,16 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
     });
   }
 
-  async function runTask(task: { id: string; project_id: string; input: string; agent: string | null; model: string | null; session_id: string | null }): Promise<void> {
+  async function runTask(task: {
+    id: string;
+    project_id: string;
+    input: string;
+    agent: string | null;
+    model: string | null;
+    mode_id: string | null;
+    thinking_option_id: string | null;
+    session_id: string | null;
+  }): Promise<void> {
     const taskId = task.id;
 
     // Determine execution path: if agent is specified AND exists in available_agents → Path B
@@ -179,7 +201,16 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
   // ─── Path B: External Agent Dispatch ──────<E29480><E29480><EFBFBD>─────────────────────────────────
 
   async function runExternalAgent(
-    task: { id: string; project_id: string; input: string; agent: string | null; model: string | null; session_id: string | null },
+    task: {
+      id: string;
+      project_id: string;
+      input: string;
+      agent: string | null;
+      model: string | null;
+      mode_id: string | null;
+      thinking_option_id: string | null;
+      session_id: string | null;
+    },
     supportsAcp: boolean,
     installPath: string | null,
   ): Promise<void> {
@@ -265,6 +296,33 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
 
       // Step 2: Dispatch to agent
       let outputSummary: string;
+      let assistantContent = '';
+      let acpReasoning = '';
+
+      const [assistantMsg] = await sql<{ id: string }[]>`
+        INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+        VALUES (${sessionId}, ${chatId}, 'assistant', '', 'streaming', clock_timestamp())
+        RETURNING id
+      `;
+      const assistantId = assistantMsg!.id;
+
+      broker.publishFrame(sessionId, {
+        type: 'message_started',
+        message_id: assistantId,
+        chat_id: chatId,
+        role: 'assistant',
+      } as WsFrame);
+
+      const manifestCommands = getManifestCommands(agent);
+      if (manifestCommands.length > 0) {
+        setTaskCommands(taskId, manifestCommands);
+        broker.publishFrame(sessionId, {
+          type: 'agent_commands',
+          task_id: taskId,
+          session_id: sessionId,
+          commands: manifestCommands,
+        } as WsFrame);
+      }
 
       if (supportsAcp) {
         const result = await dispatchViaAcp({
@@ -273,16 +331,20 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
           worktreePath,
           installPath: installPath ?? undefined,
           model: task.model ?? undefined,
+          modeId: task.mode_id ?? undefined,
+          thinkingOptionId: task.thinking_option_id ?? undefined,
+          taskId,
+          sessionId,
+          chatId,
+          messageId: assistantId,
+          broker,
           signal: ac.signal,
           log,
         });
+        assistantContent = result.output.slice(0, 50_000);
+        acpReasoning = result.reasoningText.slice(0, 200_000);
         outputSummary = result.output.slice(0, 500);
-
-        // Store agent output as an assistant message
-        await sql`
-          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
-          VALUES (${sessionId}, ${chatId}, 'assistant', ${result.output.slice(0, 50_000)}, 'complete', clock_timestamp())
-        `;
+        await persistExternalAgentTurn(sql, assistantId, result.toolSnapshots, acpReasoning);
       } else {
         const result = await dispatchViaPty({
           agent,
@@ -290,19 +352,36 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
           worktreePath,
           installPath: installPath ?? undefined,
           model: task.model ?? undefined,
+          modeId: task.mode_id ?? undefined,
+          thinkingOptionId: task.thinking_option_id ?? undefined,
           signal: ac.signal,
           log,
         });
+        assistantContent = (result.stdout || result.stderr || '(no output)').slice(0, 50_000);
         outputSummary = (result.stdout || result.stderr).slice(0, 500);
 
-        // Store agent output as an assistant message
-        const content = result.stdout || result.stderr || '(no output)';
-        await sql`
-          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
-          VALUES (${sessionId}, ${chatId}, 'assistant', ${content.slice(0, 50_000)}, 'complete', clock_timestamp())
-        `;
+        if (assistantContent) {
+          broker.publishFrame(sessionId, {
+            type: 'delta',
+            message_id: assistantId,
+            chat_id: chatId,
+            content: assistantContent,
+          } as WsFrame);
+        }
       }
 
+      await sql`
+        UPDATE messages
+        SET content = ${assistantContent}, status = 'complete', finished_at = clock_timestamp()
+        WHERE id = ${assistantId}
+      `;
+
+      broker.publishFrame(sessionId, {
+        type: 'message_complete',
+        message_id: assistantId,
+        chat_id: chatId,
+      } as WsFrame);
+
       if (stopping) {
         await sql`
           UPDATE tasks SET state = 'cancelled', ended_at = clock_timestamp() WHERE id = ${taskId}
@@ -344,6 +423,7 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
         WHERE id = ${taskId}
       `;
       log.info({ taskId, agent, costTokens: extCostTokens }, 'dispatcher: task completed (external)');
+      clearTaskCommands(taskId);
 
     } catch (err) {
       const errMsg = err instanceof Error ? err.message : String(err);
@@ -357,6 +437,7 @@ export function createDispatcher(deps: Deps): { start(): void; stop(): Promise<v
 
       // Best-effort cleanup
       await cleanupWorktree(projectPath, taskId);
+      clearTaskCommands(taskId);
     }
   }
 

apps/coder/src/services/host-exec.ts

@@ -0,0 +1,66 @@
+/**
+ * Local shell exec on the BooCoder host (replaces deprecated ssh.ts for worktrees).
+ */
+import { spawn } from 'node:child_process';
+
+export interface HostExecResult {
+  exitCode: number;
+  stdout: string;
+  stderr: string;
+}
+
+export async function hostExec(
+  command: string,
+  opts?: { signal?: AbortSignal; timeoutMs?: number },
+): Promise<HostExecResult> {
+  return new Promise<HostExecResult>((resolve, reject) => {
+    const child = spawn('bash', ['-lc', command], {
+      stdio: ['pipe', 'pipe', 'pipe'],
+    });
+
+    let stdout = '';
+    let stderr = '';
+    let killed = false;
+
+    child.stdout!.on('data', (chunk: Buffer) => { stdout += chunk.toString(); });
+    child.stderr!.on('data', (chunk: Buffer) => { stderr += chunk.toString(); });
+
+    const cleanup = () => {
+      if (!killed) {
+        killed = true;
+        child.kill('SIGTERM');
+      }
+    };
+
+    if (opts?.signal) {
+      if (opts.signal.aborted) {
+        cleanup();
+        reject(new Error('host exec aborted before start'));
+        return;
+      }
+      opts.signal.addEventListener('abort', cleanup, { once: true });
+    }
+
+    let timer: ReturnType<typeof setTimeout> | undefined;
+    if (opts?.timeoutMs) {
+      timer = setTimeout(() => {
+        cleanup();
+        reject(new Error(`host exec timed out after ${opts.timeoutMs}ms`));
+      }, opts.timeoutMs);
+    }
+
+    child.on('close', (code) => {
+      if (timer) clearTimeout(timer);
+      if (opts?.signal) opts.signal.removeEventListener('abort', cleanup);
+      resolve({ exitCode: code ?? 1, stdout, stderr });
+    });
+
+    child.on('error', (err) => {
+      if (timer) clearTimeout(timer);
+      if (opts?.signal) opts.signal.removeEventListener('abort', cleanup);
+      reject(err);
+    });
+
+    child.stdin!.end();
+  });
+}

apps/coder/src/services/mcp-server.ts

@@ -57,14 +57,29 @@ export async function startMcpServer(sql: Sql): Promise<void> {
       input: z.string().describe('Task description / prompt for the agent'),
       agent: z.string().optional().describe('Agent name (optional — uses default if omitted)'),
       model: z.string().optional().describe('Model override (optional)'),
+      mode_id: z.string().optional().describe('Permission/mode id (optional)'),
+      thinking_option_id: z.string().optional().describe('Thinking/effort option id (optional)'),
     },
     async (args) => {
       const [row] = await sql<TaskRow[]>`
-        INSERT INTO tasks (project_id, input, agent, model, state)
-        VALUES (${args.project_id}, ${args.input}, ${args.agent ?? null}, ${args.model ?? null}, 'pending')
+        INSERT INTO tasks (project_id, input, agent, model, mode_id, thinking_option_id, state)
+        VALUES (
+          ${args.project_id},
+          ${args.input},
+          ${args.agent ?? null},
+          ${args.model ?? null},
+          ${args.mode_id ?? null},
+          ${args.thinking_option_id ?? null},
+          'pending'
+        )
         RETURNING id, state
       `;
-      return textResult({ task_id: row!.id, state: row!.state });
+      return textResult({
+        task_id: row!.id,
+        state: row!.state,
+        mode_id: args.mode_id ?? null,
+        thinking_option_id: args.thinking_option_id ?? null,
+      });
     },
   );
 
@@ -147,11 +162,21 @@ export async function startMcpServer(sql: Sql): Promise<void> {
       input: z.string().describe('Task prompt'),
       agent: z.string().describe('Agent name (must match available_agents registry)'),
       model: z.string().optional().describe('Model override (optional)'),
+      mode_id: z.string().optional().describe('Permission/mode id (optional)'),
+      thinking_option_id: z.string().optional().describe('Thinking/effort option id (optional)'),
     },
     async (args) => {
       const [row] = await sql<TaskRow[]>`
-        INSERT INTO tasks (project_id, input, agent, model, state)
-        VALUES (${args.project_id}, ${args.input}, ${args.agent}, ${args.model ?? null}, 'pending')
+        INSERT INTO tasks (project_id, input, agent, model, mode_id, thinking_option_id, state)
+        VALUES (
+          ${args.project_id},
+          ${args.input},
+          ${args.agent},
+          ${args.model ?? null},
+          ${args.mode_id ?? null},
+          ${args.thinking_option_id ?? null},
+          'pending'
+        )
         RETURNING id, state
       `;
 
@@ -161,7 +186,13 @@ export async function startMcpServer(sql: Sql): Promise<void> {
       `;
       const executionPath = agentRow?.supports_acp ? 'acp' : 'pty';
 
-      return textResult({ task_id: row!.id, state: row!.state, execution_path: executionPath });
+      return textResult({
+        task_id: row!.id,
+        state: row!.state,
+        execution_path: executionPath,
+        mode_id: args.mode_id ?? null,
+        thinking_option_id: args.thinking_option_id ?? null,
+      });
     },
   );
 

apps/coder/src/services/permission-waiter.ts

@@ -0,0 +1,207 @@
+/**
+ * Blocks ACP dispatch on permission/elicitation prompts until the user responds via API.
+ */
+import type { RequestPermissionRequest, RequestPermissionResponse, CreateElicitationRequest, CreateElicitationResponse } from '@agentclientprotocol/sdk';
+import { isUnattendedMode } from './provider-manifest.js';
+
+const DEFAULT_TIMEOUT_MS = 120_000;
+
+interface PendingPermission {
+  type: 'permission';
+  request: RequestPermissionRequest;
+  sessionId: string;
+  resolve: (response: RequestPermissionResponse) => void;
+  reject: (err: Error) => void;
+  timer: ReturnType<typeof setTimeout>;
+}
+
+interface PendingElicitation {
+  type: 'elicitation';
+  request: CreateElicitationRequest;
+  sessionId: string;
+  resolve: (response: CreateElicitationResponse) => void;
+  reject: (err: Error) => void;
+  timer: ReturnType<typeof setTimeout>;
+}
+
+type PendingEntry = PendingPermission | PendingElicitation;
+
+const pendingByTask = new Map<string, PendingEntry>();
+
+export type PermissionKind = 'tool' | 'question' | 'plan' | 'elicitation';
+
+export interface PermissionPrompt {
+  taskId: string;
+  kind: PermissionKind;
+  toolTitle?: string;
+  description?: string;
+  input?: Record<string, unknown>;
+  options: Array<{ optionId: string; label: string }>;
+}
+
+export interface PermissionHooks {
+  onPrompt?: (prompt: PermissionPrompt & { sessionId: string }) => void | Promise<void>;
+  onResolved?: (taskId: string, sessionId: string) => void | Promise<void>;
+}
+
+let hooks: PermissionHooks = {};
+
+export function setPermissionHooks(next: PermissionHooks): void {
+  hooks = next;
+}
+
+function resolveKind(params: RequestPermissionRequest): PermissionKind {
+  const input = params.toolCall?.rawInput;
+  if (input && typeof input === 'object' && !Array.isArray(input) && 'questions' in input && Array.isArray((input as Record<string, unknown>).questions)) {
+    return 'question';
+  }
+  return 'tool';
+}
+
+function toPrompt(taskId: string, params: RequestPermissionRequest): PermissionPrompt {
+  const kind = resolveKind(params);
+  const rawInput = params.toolCall?.rawInput;
+  const input = rawInput && typeof rawInput === 'object' && !Array.isArray(rawInput)
+    ? rawInput as Record<string, unknown>
+    : undefined;
+  return {
+    taskId,
+    kind,
+    toolTitle: params.toolCall?.title ?? undefined,
+    ...(input ? { input } : {}),
+    options: params.options.map((o) => ({
+      optionId: o.optionId,
+      label: o.name,
+    })),
+  };
+}
+
+export function waitForPermissionResponse(
+  taskId: string,
+  sessionId: string,
+  provider: string,
+  modeId: string | undefined,
+  params: RequestPermissionRequest,
+  timeoutMs = DEFAULT_TIMEOUT_MS,
+): Promise<RequestPermissionResponse> {
+  if (isUnattendedMode(provider, modeId)) {
+    const first = params.options[0];
+    if (first) {
+      return Promise.resolve({ outcome: { outcome: 'selected', optionId: first.optionId } });
+    }
+    return Promise.resolve({ outcome: { outcome: 'cancelled' } });
+  }
+
+  return new Promise((resolve, reject) => {
+    const existing = pendingByTask.get(taskId);
+    if (existing) {
+      clearTimeout(existing.timer);
+      existing.reject(new Error('superseded by newer permission request'));
+    }
+
+    const timer = setTimeout(() => {
+      pendingByTask.delete(taskId);
+      void hooks.onResolved?.(taskId, sessionId);
+      resolve({ outcome: { outcome: 'cancelled' } });
+    }, timeoutMs);
+
+    pendingByTask.set(taskId, { type: 'permission', request: params, sessionId, resolve, reject, timer });
+
+    const prompt = toPrompt(taskId, params);
+    void hooks.onPrompt?.({ ...prompt, sessionId });
+  });
+}
+
+export function respondToPermission(taskId: string, optionId: string | null, updatedInput?: Record<string, unknown>): boolean {
+  const pending = pendingByTask.get(taskId);
+  if (!pending) return false;
+
+  clearTimeout(pending.timer);
+  pendingByTask.delete(taskId);
+
+  if (pending.type === 'elicitation') {
+    if (updatedInput) {
+      const content = updatedInput as { [key: string]: string | number | boolean | string[] };
+      pending.resolve({ action: 'accept', content });
+    } else {
+      pending.resolve({ action: 'decline' });
+    }
+  } else {
+    if (optionId) {
+      pending.resolve({ outcome: { outcome: 'selected', optionId } });
+    } else {
+      pending.resolve({ outcome: { outcome: 'cancelled' } });
+    }
+  }
+
+  void hooks.onResolved?.(taskId, pending.sessionId);
+  return true;
+}
+
+export function getPendingPermission(taskId: string): PermissionPrompt | null {
+  const pending = pendingByTask.get(taskId);
+  if (!pending) return null;
+  if (pending.type === 'elicitation') {
+    return elicitationToPrompt(taskId, pending.request);
+  }
+  return toPrompt(taskId, pending.request);
+}
+
+function elicitationToPrompt(taskId: string, params: CreateElicitationRequest): PermissionPrompt {
+  const input: Record<string, unknown> = { message: params.message };
+  if ('requestedSchema' in params) {
+    input.requestedSchema = params.requestedSchema;
+  }
+  return {
+    taskId,
+    kind: 'elicitation',
+    toolTitle: params.message,
+    input,
+    options: [],
+  };
+}
+
+export function waitForElicitationResponse(
+  taskId: string,
+  sessionId: string,
+  provider: string,
+  modeId: string | undefined,
+  params: CreateElicitationRequest,
+  timeoutMs = DEFAULT_TIMEOUT_MS,
+): Promise<CreateElicitationResponse> {
+  if (isUnattendedMode(provider, modeId)) {
+    return Promise.resolve({ action: 'decline' });
+  }
+
+  return new Promise((resolve, reject) => {
+    const existing = pendingByTask.get(taskId);
+    if (existing) {
+      clearTimeout(existing.timer);
+      existing.reject(new Error('superseded by newer elicitation request'));
+    }
+
+    const timer = setTimeout(() => {
+      pendingByTask.delete(taskId);
+      void hooks.onResolved?.(taskId, sessionId);
+      resolve({ action: 'cancel' });
+    }, timeoutMs);
+
+    pendingByTask.set(taskId, { type: 'elicitation', request: params, sessionId, resolve, reject, timer });
+
+    const prompt = elicitationToPrompt(taskId, params);
+    void hooks.onPrompt?.({ ...prompt, sessionId });
+  });
+}
+
+export function cancelPendingPermission(taskId: string): void {
+  const pending = pendingByTask.get(taskId);
+  if (!pending) return;
+  clearTimeout(pending.timer);
+  pendingByTask.delete(taskId);
+  if (pending.type === 'elicitation') {
+    pending.resolve({ action: 'cancel' });
+  } else {
+    pending.resolve({ outcome: { outcome: 'cancelled' } });
+  }
+  void hooks.onResolved?.(taskId, pending.sessionId);
+}

apps/coder/src/services/provider-commands.ts

@@ -0,0 +1,84 @@
+/**
+ * Static slash-command hints per harness (interactive TUI / agent session).
+ * Live ACP `available_commands_update` merges on top during dispatch.
+ */
+import type { AgentCommand } from './provider-types.js';
+
+const CLAUDE_COMMANDS: AgentCommand[] = [
+  { name: 'help', description: 'Show available slash commands' },
+  { name: 'clear', description: 'Clear conversation history' },
+  { name: 'compact', description: 'Compact context window' },
+  { name: 'cost', description: 'Show session cost' },
+  { name: 'memory', description: 'Manage project memory' },
+  { name: 'model', description: 'Switch model' },
+  { name: 'permissions', description: 'View or change permission mode' },
+  { name: 'review', description: 'Review current changes' },
+  { name: 'status', description: 'Show session status' },
+  { name: 'vim', description: 'Toggle vim-style input' },
+];
+
+const OPENCODE_COMMANDS: AgentCommand[] = [
+  { name: 'help', description: 'Show available commands' },
+  { name: 'new', description: 'Start a new session' },
+  { name: 'models', description: 'List or switch models' },
+  { name: 'agents', description: 'List or switch agents' },
+  { name: 'compact', description: 'Compact context' },
+  { name: 'share', description: 'Share session' },
+  { name: 'export', description: 'Export session' },
+];
+
+const CURSOR_COMMANDS: AgentCommand[] = [
+  { name: 'help', description: 'Show available slash commands' },
+  { name: 'clear', description: 'Clear conversation' },
+  { name: 'compact', description: 'Compact context' },
+  { name: 'resume', description: 'Resume a prior session' },
+];
+
+const GOOSE_COMMANDS: AgentCommand[] = [
+  { name: 'help', description: 'Show available commands' },
+  { name: 'clear', description: 'Clear conversation' },
+  { name: 'compact', description: 'Compact context' },
+  { name: 'exit', description: 'Exit session' },
+];
+
+const QWEN_COMMANDS: AgentCommand[] = [
+  { name: 'help', description: 'Show available slash commands' },
+  { name: 'clear', description: 'Clear conversation' },
+  { name: 'memory', description: 'Manage memory' },
+  { name: 'hooks', description: 'Manage hooks' },
+  { name: 'review', description: 'Review changes' },
+];
+
+const COPILOT_COMMANDS: AgentCommand[] = [
+  { name: 'help', description: 'Show available commands' },
+  { name: 'explain', description: 'Explain selected code' },
+  { name: 'fix', description: 'Fix issues in context' },
+  { name: 'tests', description: 'Generate or run tests' },
+  { name: 'doc', description: 'Generate documentation' },
+  { name: 'clear', description: 'Clear conversation' },
+];
+
+/** boocode harness uses /api/skills — merged on the frontend. */
+export const PROVIDER_COMMANDS: Record<string, AgentCommand[]> = {
+  claude: CLAUDE_COMMANDS,
+  opencode: OPENCODE_COMMANDS,
+  cursor: CURSOR_COMMANDS,
+  goose: GOOSE_COMMANDS,
+  qwen: QWEN_COMMANDS,
+  copilot: COPILOT_COMMANDS,
+  boocode: [],
+};
+
+export function getManifestCommands(provider: string): AgentCommand[] {
+  return PROVIDER_COMMANDS[provider] ?? [];
+}
+
+export function mergeCommands(...lists: AgentCommand[][]): AgentCommand[] {
+  const byName = new Map<string, AgentCommand>();
+  for (const list of lists) {
+    for (const cmd of list) {
+      byName.set(cmd.name, cmd);
+    }
+  }
+  return [...byName.values()].sort((a, b) => a.name.localeCompare(b.name));
+}

apps/coder/src/services/provider-manifest.ts

@@ -0,0 +1,108 @@
+/**
+ * Static provider mode metadata — lifted from Paseo provider-manifest.ts patterns.
+ */
+import type { ProviderMode } from './provider-types.js';
+
+export interface ProviderManifestEntry {
+  defaultModeId: string | null;
+  modes: ProviderMode[];
+  /** Claude effort levels exposed as thinking options on models. */
+  thinkingOptions?: Array<{ id: string; label: string }>;
+}
+
+const CLAUDE_MODES: ProviderMode[] = [
+  { id: 'default', label: 'Always Ask', description: 'Prompts for permission the first time a tool is used' },
+  { id: 'auto', label: 'Auto mode', description: 'Model classifier reviews permission prompts automatically' },
+  { id: 'acceptEdits', label: 'Accept File Edits', description: 'Automatically approves edit-focused tools' },
+  { id: 'plan', label: 'Plan Mode', description: 'Analyze without executing tools or edits' },
+  { id: 'bypassPermissions', label: 'Bypass', description: 'Skip all permission prompts', isUnattended: true },
+];
+
+const OPENCODE_MODES: ProviderMode[] = [
+  { id: 'build', label: 'Build', description: 'Allows edits and tool execution' },
+  { id: 'plan', label: 'Plan', description: 'Read-only planning mode' },
+  { id: 'full-access', label: 'Full Access', description: 'Auto-approves all tool prompts', isUnattended: true },
+];
+
+const COPILOT_MODES: ProviderMode[] = [
+  {
+    id: 'https://agentclientprotocol.com/protocol/session-modes#agent',
+    label: 'Agent',
+    description: 'Default agent mode',
+  },
+  {
+    id: 'https://agentclientprotocol.com/protocol/session-modes#plan',
+    label: 'Plan',
+    description: 'Plan mode for multi-step work',
+  },
+  {
+    id: 'allow-all',
+    label: 'Allow All',
+    description: 'Automatically approves all tool, path, and URL requests',
+    isUnattended: true,
+  },
+];
+
+const CURSOR_CLI_MODES: ProviderMode[] = [
+  { id: 'agent', label: 'Agent', description: 'Full agent capabilities with tool access' },
+  { id: 'plan', label: 'Plan', description: 'Read-only planning mode' },
+  { id: 'ask', label: 'Ask', description: 'Q&A read-only mode' },
+];
+
+const QWEN_PTY_MODES: ProviderMode[] = [
+  { id: 'default', label: 'Default', description: 'Prompt for approval' },
+  { id: 'plan', label: 'Plan', description: 'Plan only — no edits' },
+  { id: 'auto-edit', label: 'Auto Edit', description: 'Auto-approve edit tools' },
+  { id: 'auto', label: 'Auto', description: 'LLM classifier auto-approves safe actions' },
+  { id: 'yolo', label: 'YOLO', description: 'Auto-approve all tools', isUnattended: true },
+];
+
+const CLAUDE_THINKING = [
+  { id: 'low', label: 'Low' },
+  { id: 'medium', label: 'Medium' },
+  { id: 'high', label: 'High' },
+  { id: 'xhigh', label: 'Extra High' },
+  { id: 'max', label: 'Max' },
+];
+
+export const PROVIDER_MANIFEST: Record<string, ProviderManifestEntry> = {
+  claude: {
+    defaultModeId: 'default',
+    modes: CLAUDE_MODES,
+    thinkingOptions: CLAUDE_THINKING,
+  },
+  opencode: {
+    defaultModeId: 'build',
+    modes: OPENCODE_MODES,
+  },
+  copilot: {
+    defaultModeId: 'https://agentclientprotocol.com/protocol/session-modes#agent',
+    modes: COPILOT_MODES,
+  },
+  cursor: {
+    defaultModeId: 'agent',
+    modes: CURSOR_CLI_MODES,
+  },
+  goose: {
+    defaultModeId: null,
+    modes: [],
+  },
+  qwen: {
+    defaultModeId: 'default',
+    modes: QWEN_PTY_MODES,
+  },
+};
+
+export function getManifestModes(provider: string): ProviderMode[] {
+  return PROVIDER_MANIFEST[provider]?.modes ?? [];
+}
+
+export function getManifestDefaultModeId(provider: string): string | null {
+  return PROVIDER_MANIFEST[provider]?.defaultModeId ?? null;
+}
+
+export function isUnattendedMode(provider: string, modeId: string | undefined): boolean {
+  if (!modeId) return false;
+  const modes = getManifestModes(provider);
+  return modes.some((m) => m.id === modeId && m.isUnattended);
+}

apps/coder/src/services/provider-registry.ts

@@ -2,10 +2,21 @@ export interface ProviderDef {
   name: string;
   label: string;
   transport: 'native' | 'acp' | 'pty';
-  modelSource: 'llama-swap' | 'static';
+  modelSource: 'llama-swap' | 'static' | 'probe';
   staticModels?: Array<{ id: string; label: string }>;
+  /** Merge llama-swap models into probed list (OpenCode). */
+  mergeLlamaSwap?: boolean;
 }
 
+/**
+ * Model discovery rules (see provider-snapshot.ts):
+ * - boocode: llama-swap only
+ * - opencode: ACP probe + mergeLlamaSwap (prefixed llama-swap/* ids)
+ * - qwen: ACP probe + merge ~/.qwen/settings.json; PTY fallback reads settings only
+ * - cursor: ACP probe + cursor-agent models CLI fallback
+ * - goose / copilot: ACP probe only
+ * - claude: static manifest models + thinking options
+ */
 export const PROVIDERS: ProviderDef[] = [
   {
     name: 'boocode',
@@ -13,17 +24,24 @@ export const PROVIDERS: ProviderDef[] = [
     transport: 'native',
     modelSource: 'llama-swap',
   },
+  {
+    name: 'cursor',
+    label: 'Cursor Agent',
+    transport: 'acp',
+    modelSource: 'probe',
+  },
   {
     name: 'opencode',
     label: 'OpenCode',
     transport: 'acp',
-    modelSource: 'llama-swap',
+    modelSource: 'probe',
+    mergeLlamaSwap: true,
   },
   {
     name: 'goose',
     label: 'Goose',
     transport: 'acp',
-    modelSource: 'llama-swap',
+    modelSource: 'probe',
   },
   {
     name: 'claude',
@@ -38,9 +56,18 @@ export const PROVIDERS: ProviderDef[] = [
   {
     name: 'qwen',
     label: 'Qwen Code',
-    transport: 'pty',
-    modelSource: 'static',
+    transport: 'acp',
+    modelSource: 'probe',
+  },
+  {
+    name: 'copilot',
+    label: 'GitHub Copilot',
+    transport: 'acp',
+    modelSource: 'probe',
   },
 ];
 
 export const PROVIDERS_BY_NAME = new Map(PROVIDERS.map((p) => [p.name, p]));
+
+/** External agents probed on host (excludes native boocode). */
+export const PROBED_AGENT_NAMES = PROVIDERS.filter((p) => p.name !== 'boocode').map((p) => p.name);

apps/coder/src/services/provider-snapshot.ts

@@ -0,0 +1,266 @@
+/**
+ * Provider snapshot cache — cold ACP probe per provider + static manifest merge.
+ */
+import { homedir } from 'node:os';
+import { exec as execCb } from 'node:child_process';
+import { promisify } from 'node:util';
+import type { FastifyBaseLogger } from 'fastify';
+import type { Sql } from '../db.js';
+import type { Config } from '../config.js';
+import { PROVIDERS, type ProviderDef } from './provider-registry.js';
+import {
+  getManifestDefaultModeId,
+  getManifestModes,
+  PROVIDER_MANIFEST,
+} from './provider-manifest.js';
+import { probeAcpProvider } from './acp-probe.js';
+import { parseCursorAgentModelsOutput } from './cursor-models.js';
+import type { ProviderModel, ProviderSnapshotEntry } from './provider-types.js';
+import { getManifestCommands, mergeCommands } from './provider-commands.js';
+import { readQwenSettingsModels } from './qwen-settings.js';
+
+const exec = promisify(execCb);
+
+interface AgentRow {
+  name: string;
+  install_path: string | null;
+  supports_acp: boolean;
+  models: ProviderModel[] | null;
+  label: string | null;
+  transport: string | null;
+}
+
+async function fetchLlamaSwapModels(config: Config): Promise<ProviderModel[]> {
+  try {
+    const res = await fetch(`${config.LLAMA_SWAP_URL}/v1/models`);
+    if (!res.ok) return [];
+    const parsed = (await res.json()) as { data?: Array<{ id: string }> };
+    return (parsed.data ?? []).map((m) => ({ id: m.id, label: m.id }));
+  } catch {
+    return [];
+  }
+}
+
+async function fetchCursorModelsCli(installPath: string): Promise<ProviderModel[]> {
+  try {
+    const { stdout } = await exec(`"${installPath}" models`, { timeout: 15_000, maxBuffer: 1024 * 1024 });
+    return parseCursorAgentModelsOutput(stdout);
+  } catch {
+    return [];
+  }
+}
+
+/** Prefix llama-swap model ids so they don't collide with provider-native models. */
+export function prefixLlamaSwapModels(models: ProviderModel[]): ProviderModel[] {
+  return models.map((m) => ({
+    ...m,
+    id: m.id.startsWith('llama-swap/') ? m.id : `llama-swap/${m.id}`,
+  }));
+}
+
+function attachClaudeThinking(models: ProviderModel[]): ProviderModel[] {
+  const thinking = PROVIDER_MANIFEST.claude?.thinkingOptions;
+  if (!thinking?.length) return models;
+  return models.map((m) => ({
+    ...m,
+    thinkingOptions: thinking,
+    defaultThinkingOptionId: 'medium',
+  }));
+}
+
+export function mergeModels(...lists: ProviderModel[][]): ProviderModel[] {
+  const seen = new Set<string>();
+  const out: ProviderModel[] = [];
+  for (const list of lists) {
+    for (const m of list) {
+      if (seen.has(m.id)) continue;
+      seen.add(m.id);
+      out.push(m);
+    }
+  }
+  return out;
+}
+
+async function buildProviderEntry(
+  provider: ProviderDef,
+  agentRow: AgentRow | undefined,
+  llamaModels: ProviderModel[],
+  cwd: string,
+): Promise<ProviderSnapshotEntry | null> {
+  const isNative = provider.name === 'boocode';
+  const installed = isNative || !!agentRow;
+  if (!installed) return null;
+
+  let transport = provider.transport;
+  if (agentRow && provider.transport === 'acp' && !agentRow.supports_acp) {
+    transport = 'pty';
+  }
+
+  const fallbackModes = getManifestModes(provider.name);
+  const defaultModeId = getManifestDefaultModeId(provider.name);
+
+  if (isNative) {
+    return {
+      name: provider.name,
+      label: provider.label,
+      transport,
+      status: 'ready',
+      installed: true,
+      models: llamaModels,
+      modes: [],
+      defaultModeId: null,
+      commands: getManifestCommands(provider.name),
+    };
+  }
+
+  let models: ProviderModel[] = [];
+  if (provider.modelSource === 'llama-swap' && provider.mergeLlamaSwap) {
+    models = llamaModels;
+  } else if (agentRow?.models?.length) {
+    models = agentRow.models;
+  } else if (provider.staticModels) {
+    models = provider.staticModels.map((m) => ({ id: m.id, label: m.label }));
+  }
+
+  if (provider.name === 'claude') {
+    models = attachClaudeThinking(models);
+    return {
+      name: provider.name,
+      label: agentRow?.label ?? provider.label,
+      transport,
+      status: 'ready',
+      installed: true,
+      models,
+      modes: fallbackModes,
+      defaultModeId,
+      commands: getManifestCommands(provider.name),
+    };
+  }
+
+  if (transport === 'acp' && agentRow?.install_path && agentRow.supports_acp) {
+    const probe = await probeAcpProvider(provider.name, agentRow.install_path, cwd);
+    if (probe.models.length > 0) {
+      models = probe.models;
+    } else if (provider.name === 'cursor' && agentRow.install_path) {
+      models = await fetchCursorModelsCli(agentRow.install_path);
+    } else if (provider.modelSource === 'llama-swap') {
+      models = llamaModels;
+    }
+
+    if (provider.name === 'qwen') {
+      const settingsModels = await readQwenSettingsModels();
+      models = mergeModels(models, settingsModels);
+    }
+
+    if (provider.mergeLlamaSwap && provider.modelSource !== 'llama-swap') {
+      const nativeModels = probe.models.length > 0 ? probe.models : models;
+      models = mergeModels(nativeModels, prefixLlamaSwapModels(llamaModels));
+    }
+
+    return {
+      name: provider.name,
+      label: agentRow.label ?? provider.label,
+      transport,
+      status: probe.ok ? 'ready' : 'error',
+      installed: true,
+      models,
+      modes: probe.modes.length > 0 ? probe.modes : fallbackModes,
+      defaultModeId: probe.defaultModeId ?? defaultModeId,
+      commands: mergeCommands(getManifestCommands(provider.name), probe.commands),
+      error: probe.error,
+    };
+  }
+
+  // PTY-only providers (qwen fallback when ACP unavailable)
+  if (provider.name === 'qwen') {
+    if (models.length === 0) {
+      models = await readQwenSettingsModels();
+    }
+  }
+
+  return {
+    name: provider.name,
+    label: agentRow?.label ?? provider.label,
+    transport,
+    status: 'ready',
+    installed: true,
+    models,
+    modes: fallbackModes,
+    defaultModeId,
+    commands: getManifestCommands(provider.name),
+  };
+}
+
+const snapshotCache = new Map<string, { at: number; entries: ProviderSnapshotEntry[] }>();
+const snapshotInflight = new Map<string, Promise<ProviderSnapshotEntry[]>>();
+const CACHE_TTL_MS = 5 * 60_000;
+
+export async function getProviderSnapshot(
+  sql: Sql,
+  config: Config,
+  cwd?: string,
+  force = false,
+): Promise<ProviderSnapshotEntry[]> {
+  const resolvedCwd = cwd?.trim() || homedir();
+  const cacheKey = resolvedCwd;
+  const cached = snapshotCache.get(cacheKey);
+  if (!force && cached && Date.now() - cached.at < CACHE_TTL_MS) {
+    return cached.entries;
+  }
+
+  const inflight = snapshotInflight.get(cacheKey);
+  if (!force && inflight) {
+    return inflight;
+  }
+
+  const build = async (): Promise<ProviderSnapshotEntry[]> => {
+    const llamaModels = await fetchLlamaSwapModels(config);
+    const agents = await sql<AgentRow[]>`
+      SELECT name, install_path, supports_acp, models, label, transport FROM available_agents
+    `;
+    const agentMap = new Map(agents.map((a) => [a.name, a]));
+
+    const built = await Promise.all(
+      PROVIDERS.map((provider) =>
+        buildProviderEntry(provider, agentMap.get(provider.name), llamaModels, resolvedCwd),
+      ),
+    );
+    const entries = built.filter((entry): entry is ProviderSnapshotEntry => entry !== null);
+
+    snapshotCache.set(cacheKey, { at: Date.now(), entries });
+    return entries;
+  };
+
+  const promise = build().finally(() => {
+    snapshotInflight.delete(cacheKey);
+  });
+  snapshotInflight.set(cacheKey, promise);
+  return promise;
+}
+
+export function clearProviderSnapshotCache(): void {
+  snapshotCache.clear();
+  snapshotInflight.clear();
+}
+
+/** Persist probed model lists back to available_agents for fast legacy reads. */
+export async function persistProbedModels(
+  sql: Sql,
+  entries: ProviderSnapshotEntry[],
+  log: FastifyBaseLogger,
+): Promise<void> {
+  let count = 0;
+  for (const entry of entries) {
+    if (entry.name === 'boocode' || entry.models.length === 0) continue;
+    const flatModels = entry.models.map(({ id, label }) => ({ id, label }));
+    await sql`
+      UPDATE available_agents
+      SET models = ${sql.json(flatModels as never)}, last_probed_at = clock_timestamp()
+      WHERE name = ${entry.name}
+    `;
+    count++;
+  }
+  if (count > 0) {
+    log.info({ count }, 'provider-snapshot: persisted models to available_agents');
+  }
+}

apps/coder/src/services/provider-types.ts

@@ -0,0 +1,51 @@
+/** Shared provider / snapshot types (Paseo-shaped, BooCoder-native). */
+
+export interface ProviderMode {
+  id: string;
+  label: string;
+  description?: string;
+  /** Auto-approve tool permissions when this mode is selected. */
+  isUnattended?: boolean;
+}
+
+export interface ThinkingOption {
+  id: string;
+  label: string;
+  isDefault?: boolean;
+}
+
+export interface ProviderModel {
+  id: string;
+  label: string;
+  description?: string;
+  isDefault?: boolean;
+  thinkingOptions?: ThinkingOption[];
+  defaultThinkingOptionId?: string;
+}
+
+export type ProviderSnapshotStatus = 'ready' | 'error';
+
+export interface AgentCommand {
+  name: string;
+  description?: string;
+}
+
+export interface ProviderSnapshotEntry {
+  name: string;
+  label: string;
+  transport: string;
+  status: ProviderSnapshotStatus;
+  installed: boolean;
+  models: ProviderModel[];
+  modes: ProviderMode[];
+  defaultModeId: string | null;
+  commands: AgentCommand[];
+  error?: string;
+}
+
+export interface AgentSessionConfig {
+  provider: string;
+  model?: string;
+  modeId?: string;
+  thinkingOptionId?: string;
+}

apps/coder/src/services/pty-dispatch.ts

@@ -1,15 +1,5 @@
 /**
  * PTY dispatch — runs external agents directly on the host.
- *
- * v2.1.3: Spawns agent binaries directly (no sh -c wrapper) using the
- * install_path from agent-probe. Follows Paseo's pattern: direct binary
- * path + args array + cwd.
- *
- * Supported agents:
- * - claude: `claude -p --model <model>` (print mode, reads task from stdin)
- * - opencode: `opencode --model <model>` (stdin pipe)
- * - qwen: `qwen -p <task> --output-format stream-json`
- * - goose: `goose run --text <task>`
  */
 import type { FastifyBaseLogger } from 'fastify';
 import { spawn } from 'node:child_process';
@@ -25,27 +15,44 @@ export interface PtyDispatchOpts {
   task: string;
   worktreePath: string;
   model?: string;
+  modeId?: string;
+  thinkingOptionId?: string;
   installPath?: string;
   signal?: AbortSignal;
   log: FastifyBaseLogger;
 }
 
-interface AgentCommand {
+interface PtySpawnSpec {
   binary: string;
   args: string[];
   stdin?: string;
 }
 
-function buildAgentCommand(agent: string, task: string, model?: string, installPath?: string): AgentCommand | null {
+function buildPtySpawnSpec(
+  agent: string,
+  task: string,
+  model?: string,
+  modeId?: string,
+  thinkingOptionId?: string,
+  installPath?: string,
+): PtySpawnSpec | null {
   const binary = installPath ?? agent;
 
   switch (agent) {
-    case 'claude':
-      return {
-        binary,
-        args: model ? ['-p', '--model', model] : ['-p'],
-        stdin: task,
-      };
+    case 'claude': {
+      const args = ['-p'];
+      if (model) args.push('--model', model);
+      if (modeId) args.push('--permission-mode', modeId);
+      if (thinkingOptionId) args.push('--effort', thinkingOptionId);
+      return { binary, args, stdin: task };
+    }
+
+    case 'qwen': {
+      const args = ['-p', task, '--output-format', 'stream-json'];
+      if (model) args.push('--model', model);
+      if (modeId) args.push('--approval-mode', modeId);
+      return { binary, args };
+    }
 
     case 'opencode':
       return {
@@ -54,20 +61,10 @@ function buildAgentCommand(agent: string, task: string, model?: string, installP
         stdin: task,
       };
 
-    case 'qwen':
-      return {
-        binary,
-        args: model
-          ? ['-p', task, '--model', model, '--output-format', 'stream-json']
-          : ['-p', task, '--output-format', 'stream-json'],
-      };
-
     case 'goose':
       return {
         binary,
-        args: model
-          ? ['run', '--text', task, '--model', model]
-          : ['run', '--text', task],
+        args: model ? ['run', '--text', task, '--model', model] : ['run', '--text', task],
       };
 
     default:
@@ -76,9 +73,9 @@ function buildAgentCommand(agent: string, task: string, model?: string, installP
 }
 
 export async function dispatchViaPty(opts: PtyDispatchOpts): Promise<DispatchResult> {
-  const { agent, task, worktreePath, model, installPath, signal, log } = opts;
+  const { agent, task, worktreePath, model, modeId, thinkingOptionId, installPath, signal, log } = opts;
 
-  const cmd = buildAgentCommand(agent, task, model, installPath);
+  const cmd = buildPtySpawnSpec(agent, task, model, modeId, thinkingOptionId, installPath);
   if (!cmd) {
     return {
       exitCode: 1,
@@ -87,7 +84,7 @@ export async function dispatchViaPty(opts: PtyDispatchOpts): Promise<DispatchRes
     };
   }
 
-  log.info({ agent, binary: cmd.binary, worktreePath }, 'pty-dispatch: starting');
+  log.info({ agent, binary: cmd.binary, worktreePath, modeId }, 'pty-dispatch: starting');
 
   return new Promise<DispatchResult>((resolve, reject) => {
     const child = spawn(cmd.binary, cmd.args, {

apps/coder/src/services/qwen-settings.ts

@@ -0,0 +1,21 @@
+import { readFile } from 'node:fs/promises';
+import { join } from 'node:path';
+import { homedir } from 'node:os';
+import type { ProviderModel } from './provider-types.js';
+
+const QWEN_SETTINGS_PATH = join(homedir(), '.qwen', 'settings.json');
+
+export async function readQwenSettingsModels(): Promise<ProviderModel[]> {
+  try {
+    const raw = await readFile(QWEN_SETTINGS_PATH, 'utf8');
+    if (!raw.trim()) return [];
+    const settings = JSON.parse(raw) as {
+      modelProviders?: { openai?: Array<{ id: string }> };
+    };
+    const openaiModels = settings?.modelProviders?.openai;
+    if (!Array.isArray(openaiModels)) return [];
+    return openaiModels.map((m) => ({ id: m.id, label: m.id }));
+  } catch {
+    return [];
+  }
+}

apps/coder/src/services/ssh.ts

@@ -1,129 +0,0 @@
-/**
- * @deprecated v2.1.1 — BooCoder runs on the host now. Use direct spawn/exec instead.
- * Kept for one release cycle in case of rollback.
- *
- * SSH helper — spawns commands on the host via SSH.
- *
- * BooCode's container cannot directly spawn host processes (opencode, goose, claude, pi).
- * They live on the HOST at /usr/local/bin/ or Sam's PATH. We SSH to the host over the
- * Tailscale IP (same mechanism BooTerm uses: samkintop@100.114.205.53).
- */
-import { spawn, type ChildProcess } from 'node:child_process';
-
-export const SSH_HOST = process.env.BOOCODER_SSH_HOST ?? '100.114.205.53';
-export const SSH_USER = process.env.BOOCODER_SSH_USER ?? 'samkintop';
-
-/** Common SSH args — strict host checking disabled for container-to-host trust. */
-const SSH_BASE_ARGS = [
-  '-o', 'StrictHostKeyChecking=no',
-  '-o', 'UserKnownHostsFile=/dev/null',
-  '-o', 'LogLevel=ERROR',
-  '-o', 'BatchMode=yes',
-];
-
-export interface SshExecResult {
-  exitCode: number;
-  stdout: string;
-  stderr: string;
-}
-
-/**
- * Execute a command on the host via SSH, collecting all output.
- * Returns when the remote process exits.
- */
-export async function sshExec(
-  command: string,
-  opts?: { signal?: AbortSignal; timeoutMs?: number },
-): Promise<SshExecResult> {
-  return new Promise<SshExecResult>((resolve, reject) => {
-    const child = spawn('ssh', [
-      ...SSH_BASE_ARGS,
-      `${SSH_USER}@${SSH_HOST}`,
-      command,
-    ], {
-      stdio: ['pipe', 'pipe', 'pipe'],
-    });
-
-    let stdout = '';
-    let stderr = '';
-    let killed = false;
-
-    child.stdout!.on('data', (chunk: Buffer) => { stdout += chunk.toString(); });
-    child.stderr!.on('data', (chunk: Buffer) => { stderr += chunk.toString(); });
-
-    const cleanup = () => {
-      if (!killed) {
-        killed = true;
-        child.kill('SIGTERM');
-      }
-    };
-
-    // Abort signal
-    if (opts?.signal) {
-      if (opts.signal.aborted) {
-        cleanup();
-        reject(new Error('SSH exec aborted before start'));
-        return;
-      }
-      opts.signal.addEventListener('abort', cleanup, { once: true });
-    }
-
-    // Timeout
-    let timer: ReturnType<typeof setTimeout> | undefined;
-    if (opts?.timeoutMs) {
-      timer = setTimeout(() => {
-        cleanup();
-        reject(new Error(`SSH exec timed out after ${opts.timeoutMs}ms`));
-      }, opts.timeoutMs);
-    }
-
-    child.on('close', (code) => {
-      if (timer) clearTimeout(timer);
-      if (opts?.signal) opts.signal.removeEventListener('abort', cleanup);
-      resolve({ exitCode: code ?? 1, stdout, stderr });
-    });
-
-    child.on('error', (err) => {
-      if (timer) clearTimeout(timer);
-      if (opts?.signal) opts.signal.removeEventListener('abort', cleanup);
-      reject(err);
-    });
-
-    // Close stdin immediately — we're not sending input via sshExec
-    child.stdin!.end();
-  });
-}
-
-/**
- * Spawn an SSH child process with a command on the host.
- * Returns the raw ChildProcess for callers that need streaming I/O (ACP, PTY).
- */
-export function sshSpawn(command: string): ChildProcess {
-  return spawn('ssh', [
-    ...SSH_BASE_ARGS,
-    `${SSH_USER}@${SSH_HOST}`,
-    command,
-  ], {
-    stdio: ['pipe', 'pipe', 'pipe'],
-  });
-}
-
-/**
- * Spawn an SSH child process that pipes stdin through.
- * Used for agents that read a task from stdin (e.g. `echo "task" | claude -p`).
- */
-export function sshSpawnWithStdin(command: string, input: string): ChildProcess {
-  const child = spawn('ssh', [
-    ...SSH_BASE_ARGS,
-    `${SSH_USER}@${SSH_HOST}`,
-    command,
-  ], {
-    stdio: ['pipe', 'pipe', 'pipe'],
-  });
-
-  // Write the input and close stdin
-  child.stdin!.write(input);
-  child.stdin!.end();
-
-  return child;
-}

apps/coder/src/services/worktrees.ts

@@ -6,7 +6,7 @@
  * After the agent completes, we diff the worktree against HEAD and
  * queue the diff into pending_changes.
  */
-import { sshExec } from './ssh.js';
+import { hostExec } from './host-exec.js';
 
 const WORKTREE_BASE = '/tmp/booworktrees';
 
@@ -23,10 +23,10 @@ export async function createWorktree(
   const branchName = `task-${taskId}`;
 
   // Ensure the base directory exists
-  await sshExec(`mkdir -p ${WORKTREE_BASE}`, { signal: opts?.signal });
+  await hostExec(`mkdir -p ${WORKTREE_BASE}`, { signal: opts?.signal });
 
   // Create the worktree with a new branch from HEAD
-  const result = await sshExec(
+  const result = await hostExec(
     `git -C ${shellEscape(projectPath)} worktree add ${shellEscape(worktreePath)} -b ${shellEscape(branchName)} HEAD`,
     { signal: opts?.signal, timeoutMs: 30_000 },
   );
@@ -49,7 +49,7 @@ export async function diffWorktree(
 ): Promise<string> {
   // First, commit any uncommitted changes in the worktree so we can diff branches
   // Stage all changes
-  const addResult = await sshExec(
+  const addResult = await hostExec(
     `cd ${shellEscape(worktreePath)} && git add -A`,
     { signal: opts?.signal, timeoutMs: 30_000 },
   );
@@ -58,7 +58,7 @@ export async function diffWorktree(
   }
 
   // Check if there are staged changes
-  const statusResult = await sshExec(
+  const statusResult = await hostExec(
     `cd ${shellEscape(worktreePath)} && git diff --cached --quiet`,
     { signal: opts?.signal, timeoutMs: 10_000 },
   );
@@ -69,13 +69,13 @@ export async function diffWorktree(
   }
 
   // Commit staged changes (needed to produce a clean branch diff)
-  await sshExec(
+  await hostExec(
     `cd ${shellEscape(worktreePath)} && git -c user.email=boocoder@local -c user.name=BooCoder commit -m "task changes" --allow-empty`,
     { signal: opts?.signal, timeoutMs: 15_000 },
   );
 
   // Diff the worktree branch against the parent commit (HEAD of main tree)
-  const diffResult = await sshExec(
+  const diffResult = await hostExec(
     `git -C ${shellEscape(projectPath)} diff HEAD...$(git -C ${shellEscape(worktreePath)} rev-parse HEAD)`,
     { signal: opts?.signal, timeoutMs: 60_000 },
   );
@@ -99,13 +99,13 @@ export async function cleanupWorktree(
   const branchName = `task-${taskId}`;
 
   // Remove the worktree (--force handles dirty state)
-  await sshExec(
+  await hostExec(
     `git -C ${shellEscape(projectPath)} worktree remove ${shellEscape(worktreePath)} --force`,
     { timeoutMs: 15_000 },
   ).catch(() => {});
 
   // Delete the task branch
-  await sshExec(
+  await hostExec(
     `git -C ${shellEscape(projectPath)} branch -D ${shellEscape(branchName)}`,
     { timeoutMs: 10_000 },
   ).catch(() => {});

apps/coder/web/src/api/client.ts

@@ -1,4 +1,4 @@
-import type { Project, Session, Chat, Message, PendingChange } from './types';
+import type { Project, Session, Chat, Message, PendingChange, AskUserAnswer } from './types';
 
 export class ApiError extends Error {
   constructor(
@@ -52,6 +52,14 @@ export const api = {
         method: 'POST',
         body: JSON.stringify(body ?? {}),
       }),
+    answerUserInput: (chatId: string, toolCallId: string, answers: AskUserAnswer[]) =>
+      request<{ tool_message_id: string; assistant_message_id: string }>(
+        `/api/chats/${chatId}/answer_user_input`,
+        {
+          method: 'POST',
+          body: JSON.stringify({ tool_call_id: toolCallId, answers }),
+        },
+      ),
   },
 
   messages: {

apps/coder/web/src/api/types.ts

@@ -32,16 +32,37 @@ export interface Chat {
 export interface ToolCall {
   id: string;
   name: string;
-  arguments: string;
+  args: unknown;
 }
 
 export interface ToolResult {
   tool_call_id: string;
-  output: string;
+  output: unknown;
   truncated?: boolean;
   error?: boolean;
 }
 
+// Batch 9.7: ask_user_input shapes. The tool_call.args is { questions: AskUserQuestion[] }
+// (1-3 entries); the eventual tool_result.output is { answers: AskUserAnswer[] } in the
+// same order. AskUserInputCard renders questions and POSTs answers.
+export type AskUserQuestionType = 'single_select' | 'multi_select';
+
+export interface AskUserQuestion {
+  question: string;
+  type: AskUserQuestionType;
+  options: string[];
+}
+
+export interface AskUserAnswer {
+  question: string;
+  selected_options: string[];
+  free_text: string | null;
+}
+
+export interface AskUserAnswerSet {
+  answers: AskUserAnswer[];
+}
+
 export interface Message {
   id: string;
   session_id: string;

apps/coder/web/src/components/AskUserInputCard.tsx

@@ -0,0 +1,323 @@
+import { useMemo, useState } from 'react';
+import { Check } from 'lucide-react';
+import { api } from '@/api/client';
+import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
+import { Button } from '@/components/ui/button';
+import type {
+  AskUserAnswer,
+  AskUserAnswerSet,
+  AskUserQuestion,
+  ToolCall,
+  ToolResult,
+} from '@/api/types';
+
+// Batch 9.7: Inline interactive picker. Renders inside MessageList in place of
+// the standard ToolCallLine when the assistant emits an ask_user_input tool
+// call. While the tool result is null (server pre-stamps a sentinel with
+// output=null), shows the form; once the WS tool_result frame arrives with a
+// real AnswerSet, flips to read-only review mode.
+
+interface Props {
+  toolCall: ToolCall;
+  toolResult: ToolResult | null;
+  chatId: string;
+}
+
+function parseQuestions(raw: unknown): AskUserQuestion[] {
+  if (!raw || typeof raw !== 'object' || !('questions' in raw)) return [];
+  const arr = (raw as { questions: unknown }).questions;
+  if (!Array.isArray(arr)) return [];
+  const out: AskUserQuestion[] = [];
+  for (const item of arr) {
+    if (!item || typeof item !== 'object') continue;
+    const q = item as { question?: unknown; type?: unknown; options?: unknown };
+    if (typeof q.question !== 'string') continue;
+    if (q.type !== 'single_select' && q.type !== 'multi_select') continue;
+    if (!Array.isArray(q.options)) continue;
+    const opts = q.options.filter((o): o is string => typeof o === 'string');
+    if (opts.length < 2) continue;
+    out.push({ question: q.question, type: q.type, options: opts });
+  }
+  return out;
+}
+
+function parseAnswerSet(raw: unknown): AskUserAnswerSet | null {
+  if (!raw || typeof raw !== 'object' || !('answers' in raw)) return null;
+  const arr = (raw as { answers: unknown }).answers;
+  if (!Array.isArray(arr)) return null;
+  const answers: AskUserAnswer[] = [];
+  for (const item of arr) {
+    if (!item || typeof item !== 'object') continue;
+    const a = item as { question?: unknown; selected_options?: unknown; free_text?: unknown };
+    if (typeof a.question !== 'string') continue;
+    if (!Array.isArray(a.selected_options)) continue;
+    if (a.free_text !== null && typeof a.free_text !== 'string') continue;
+    const sel = a.selected_options.filter((s): s is string => typeof s === 'string');
+    answers.push({
+      question: a.question,
+      selected_options: sel,
+      free_text: (a.free_text as string | null) ?? null,
+    });
+  }
+  return { answers };
+}
+
+export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
+  const questions = useMemo(() => parseQuestions(toolCall.args), [toolCall.args]);
+
+  if (questions.length === 0) {
+    return (
+      <div className="rounded border border-destructive/40 bg-destructive/10 text-xs px-3 py-2 text-destructive">
+        ask_user_input: malformed tool args
+      </div>
+    );
+  }
+
+  // Tool result with a non-null output means the answer is already submitted.
+  // The pending sentinel uses output=null, so this branch only triggers after
+  // the real WS tool_result frame lands.
+  const answered = toolResult && toolResult.output !== null;
+  if (answered) {
+    const answerSet = parseAnswerSet(toolResult!.output);
+    return <AnsweredView questions={questions} answers={answerSet} />;
+  }
+
+  return (
+    <PendingView questions={questions} toolCallId={toolCall.id} chatId={chatId} />
+  );
+}
+
+function PendingView({
+  questions,
+  toolCallId,
+  chatId,
+}: {
+  questions: AskUserQuestion[];
+  toolCallId: string;
+  chatId: string;
+}) {
+  // Per-question selections + free text. Selections are option arrays so the
+  // multi_select case is uniform; single_select just constrains to length 1.
+  const [selections, setSelections] = useState<string[][]>(() => questions.map(() => []));
+  const [freeTexts, setFreeTexts] = useState<string[]>(() => questions.map(() => ''));
+  const [submitting, setSubmitting] = useState(false);
+
+  const singleQuestion = questions.length === 1;
+  const anyFreeText = freeTexts.some((t) => t.trim().length > 0);
+
+  // Submit button shows when:
+  //   - more than one question (always batched), OR
+  //   - one question and the user has typed free text (committing it needs an
+  //     explicit Submit so an accidental Tab/click doesn't lose it).
+  // For one question with no free text, clicking an option submits inline.
+  const showSubmitButton = !singleQuestion || anyFreeText;
+
+  // Every question must have at least one of (option, free text).
+  const allComplete = questions.every((_, i) => {
+    return selections[i]!.length > 0 || freeTexts[i]!.trim().length > 0;
+  });
+
+  function buildAnswers(): AskUserAnswer[] {
+    return questions.map((q, i) => {
+      const freeText = freeTexts[i]!.trim();
+      return {
+        question: q.question,
+        selected_options: selections[i]!,
+        free_text: freeText.length > 0 ? freeText : null,
+      };
+    });
+  }
+
+  async function submit(answers: AskUserAnswer[]) {
+    if (submitting) return;
+    setSubmitting(true);
+    try {
+      await api.chats.answerUserInput(chatId, toolCallId, answers);
+      // Card stays mounted; the incoming WS tool_result frame will flip it
+      // into AnsweredView via the parent prop change.
+    } catch (err) {
+      console.error('ask_user_input submit failed:', err instanceof Error ? err.message : err);
+      setSubmitting(false);
+    }
+  }
+
+  function pickSingle(qIdx: number, option: string) {
+    setSelections((prev) => prev.map((arr, i) => (i === qIdx ? [option] : arr)));
+    // Immediate submit for the single-question single-select shortcut. Only
+    // fires when no free text exists anywhere — once the user typed, the
+    // Submit button takes over so the typed text isn't silently dropped.
+    if (singleQuestion && !anyFreeText) {
+      const answers: AskUserAnswer[] = [
+        {
+          question: questions[0]!.question,
+          selected_options: [option],
+          free_text: null,
+        },
+      ];
+      void submit(answers);
+    }
+  }
+
+  function toggleMulti(qIdx: number, option: string) {
+    setSelections((prev) =>
+      prev.map((arr, i) => {
+        if (i !== qIdx) return arr;
+        return arr.includes(option) ? arr.filter((o) => o !== option) : [...arr, option];
+      }),
+    );
+  }
+
+  function setFreeText(qIdx: number, value: string) {
+    setFreeTexts((prev) => prev.map((t, i) => (i === qIdx ? value : t)));
+  }
+
+  return (
+    <div className="rounded-lg border bg-muted/20 text-sm">
+      <div className="px-4 py-3 space-y-4">
+        {questions.map((q, i) => (
+          <div key={i} className="space-y-2">
+            {questions.length > 1 && (
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Question {i + 1}
+              </div>
+            )}
+            <div className="font-medium leading-snug">{q.question}</div>
+            {q.type === 'single_select' ? (
+              <RadioGroup
+                value={selections[i]![0] ?? ''}
+                onValueChange={(v) => pickSingle(i, v)}
+                disabled={submitting}
+                className="gap-1.5"
+              >
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <RadioGroupItem id={id} value={opt} className="mt-0.5" />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </RadioGroup>
+            ) : (
+              <div className="grid gap-1.5">
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  const checked = selections[i]!.includes(opt);
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <input
+                        id={id}
+                        type="checkbox"
+                        checked={checked}
+                        disabled={submitting}
+                        onChange={() => toggleMulti(i, opt)}
+                        className="mt-1 size-3.5 rounded border-input accent-primary"
+                      />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </div>
+            )}
+            <div className="pt-1 space-y-1">
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Or type a custom answer
+              </div>
+              <input
+                type="text"
+                value={freeTexts[i]}
+                disabled={submitting}
+                placeholder="Free text…"
+                onChange={(e) => setFreeText(i, e.target.value)}
+                className="w-full rounded border border-input bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:opacity-60"
+              />
+            </div>
+          </div>
+        ))}
+      </div>
+      {showSubmitButton && (
+        <div className="flex justify-end gap-2 border-t px-4 py-2">
+          <Button
+            type="button"
+            size="sm"
+            disabled={!allComplete || submitting}
+            onClick={() => void submit(buildAnswers())}
+          >
+            {submitting ? 'Submitting…' : 'Submit'}
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+}
+
+function AnsweredView({
+  questions,
+  answers,
+}: {
+  questions: AskUserQuestion[];
+  answers: AskUserAnswerSet | null;
+}) {
+  if (!answers) {
+    return (
+      <div className="rounded-lg border bg-muted/20 text-xs px-4 py-3 text-muted-foreground">
+        ask_user_input: answers unavailable
+      </div>
+    );
+  }
+
+  return (
+    <div className="rounded-lg border bg-muted/10 text-sm">
+      <div className="px-4 py-3 space-y-3">
+        {questions.map((q, i) => {
+          const a = answers.answers[i];
+          if (!a) return null;
+          return (
+            <div key={i} className="space-y-1.5">
+              {questions.length > 1 && (
+                <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                  Question {i + 1}
+                </div>
+              )}
+              <div className="font-medium leading-snug">{q.question}</div>
+              <div className="space-y-0.5">
+                {q.options.map((opt, j) => {
+                  const selected = a.selected_options.includes(opt);
+                  return (
+                    <div
+                      key={j}
+                      className={
+                        selected
+                          ? 'flex items-start gap-2 text-sm leading-snug text-foreground'
+                          : 'flex items-start gap-2 text-sm leading-snug text-muted-foreground/60 line-through'
+                      }
+                    >
+                      <span className="mt-0.5 size-3.5 shrink-0 inline-flex items-center justify-center">
+                        {selected && <Check className="size-3 text-primary" />}
+                      </span>
+                      <span>{opt}</span>
+                    </div>
+                  );
+                })}
+              </div>
+              {a.free_text && (
+                <div className="rounded bg-background border px-2 py-1 text-xs font-mono whitespace-pre-wrap">
+                  {a.free_text}
+                </div>
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}

apps/coder/web/src/components/ChatPane.tsx

@@ -1,6 +1,6 @@
 import { useState, useRef, useEffect } from 'react';
 import { Send, Square } from 'lucide-react';
-import type { Message } from '@/api/types';
+import type { Message, ToolResult } from '@/api/types';
 import { api } from '@/api/client';
 import { MessageBubble } from './MessageBubble';
 
@@ -66,6 +66,14 @@ export function ChatPane({ sessionId, chatId, messages, isStreaming, connected }
   // Filter out system messages for display (sentinels)
   const visibleMessages = messages.filter((m) => m.role !== 'system');
 
+  // Build a lookup map from tool_call_id -> ToolResult for all messages
+  const toolResultsMap: Record<string, ToolResult> = {};
+  for (const msg of messages) {
+    if (msg.tool_results) {
+      toolResultsMap[msg.tool_results.tool_call_id] = msg.tool_results;
+    }
+  }
+
   return (
     <div className="flex flex-col h-full">
       {/* Connection indicator */}
@@ -88,7 +96,7 @@ export function ChatPane({ sessionId, chatId, messages, isStreaming, connected }
           </div>
         )}
         {visibleMessages.map((msg) => (
-          <MessageBubble key={msg.id} message={msg} />
+          <MessageBubble key={msg.id} message={msg} chatId={msg.chat_id} toolResultsMap={toolResultsMap} />
         ))}
         <div ref={messagesEndRef} />
       </div>

apps/coder/web/src/components/MessageBubble.tsx

@@ -1,13 +1,16 @@
 import Markdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
-import type { Message } from '@/api/types';
+import type { Message, ToolResult } from '@/api/types';
 import { Wrench, AlertCircle, Loader2 } from 'lucide-react';
+import { AskUserInputCard } from './AskUserInputCard';
 
 interface Props {
   message: Message;
+  chatId: string;
+  toolResultsMap: Record<string, ToolResult>;
 }
 
-export function MessageBubble({ message }: Props) {
+export function MessageBubble({ message, chatId }: Props) {
   if (message.role === 'tool') {
     return <ToolResultBubble message={message} />;
   }
@@ -34,18 +37,31 @@ export function MessageBubble({ message }: Props) {
 
         {message.tool_calls && message.tool_calls.length > 0 && (
           <div className="mb-2 space-y-1">
-            {message.tool_calls.map((tc) => (
-              <div
-                key={tc.id}
-                className="flex items-center gap-1.5 text-xs text-zinc-400 bg-zinc-900/50 rounded px-2 py-1"
-              >
-                <Wrench size={11} />
-                <span className="font-mono">{tc.name}</span>
-                <span className="text-zinc-500 truncate max-w-[200px]">
-                  {truncateArgs(tc.arguments)}
-                </span>
-              </div>
-            ))}
+            {message.tool_calls.map((tc) => {
+              if (tc.name === 'ask_user_input') {
+                const result = message.tool_results ?? null;
+                return (
+                  <AskUserInputCard
+                    key={tc.id}
+                    toolCall={tc}
+                    toolResult={result}
+                    chatId={chatId}
+                  />
+                );
+              }
+              return (
+                <div
+                  key={tc.id}
+                  className="flex items-center gap-1.5 text-xs text-zinc-400 bg-zinc-900/50 rounded px-2 py-1"
+                >
+                  <Wrench size={11} />
+                  <span className="font-mono">{tc.name}</span>
+                  <span className="text-zinc-500 truncate max-w-[200px]">
+                    {truncateArgs(tc.args)}
+                  </span>
+                </div>
+              );
+            })}
           </div>
         )}
 
@@ -70,12 +86,12 @@ export function MessageBubble({ message }: Props) {
   );
 }
 
-function ToolResultBubble({ message }: Props) {
+function ToolResultBubble({ message }: { message: Message }) {
   const result = message.tool_results;
   if (!result) return null;
 
   const isError = result.error;
-  const output = result.output || '';
+  const output = result.output != null ? String(result.output) : '';
   const displayOutput =
     output.length > 300 ? output.slice(0, 300) + '...' : output;
 
@@ -99,17 +115,21 @@ function ToolResultBubble({ message }: Props) {
   );
 }
 
-function truncateArgs(args: string): string {
+function truncateArgs(args: unknown): string {
   if (!args) return '';
   try {
-    const parsed = JSON.parse(args);
-    const keys = Object.keys(parsed);
-    if (keys.length === 0) return '';
-    const first = keys[0]!;
-    const val = String(parsed[first]);
-    const display = val.length > 40 ? val.slice(0, 40) + '...' : val;
-    return `${first}: ${display}`;
+    if (typeof args === 'object' && args !== null) {
+      const obj = args as Record<string, unknown>;
+      const keys = Object.keys(obj);
+      if (keys.length === 0) return '';
+      const first = keys[0]!;
+      const val = String(obj[first] ?? '');
+      const display = val.length > 40 ? val.slice(0, 40) + '...' : val;
+      return `${first}: ${display}`;
+    }
+    const str = String(args);
+    return str.length > 50 ? str.slice(0, 50) + '...' : str;
   } catch {
-    return args.length > 50 ? args.slice(0, 50) + '...' : args;
+    return String(args).length > 50 ? String(args).slice(0, 50) + '...' : String(args);
   }
 }

apps/coder/web/src/components/ui/button.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+
+export interface ButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link';
+  size?: 'default' | 'sm' | 'lg' | 'icon';
+}
+
+const variantClasses: Record<string, string> = {
+  default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+  destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+  outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
+  secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+  ghost: 'hover:bg-accent hover:text-accent-foreground',
+  link: 'text-primary underline-offset-4 hover:underline',
+};
+
+const sizeClasses: Record<string, string> = {
+  default: 'h-9 px-4 py-2',
+  sm: 'h-8 rounded-md px-3 text-xs',
+  lg: 'h-10 rounded-md px-8',
+  icon: 'h-9 w-9',
+};
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant = 'default', size = 'default', ...props }, ref) => {
+    const base =
+      'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-60';
+    const cls = [base, variantClasses[variant] ?? '', sizeClasses[size] ?? '', className ?? ''].join(' ');
+    return <button className={cls} ref={ref} {...props} />;
+  },
+);
+Button.displayName = 'Button';
+
+export { Button };

apps/coder/web/src/components/ui/radio-group.tsx

@@ -0,0 +1,56 @@
+import * as React from 'react';
+
+const RadioGroupContext = React.createContext<{
+  value: string | undefined;
+  onValueChange: (v: string) => void;
+  disabled?: boolean;
+} | null>(null);
+
+interface RadioGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+  value?: string;
+  onValueChange?: (value: string) => void;
+  disabled?: boolean;
+}
+
+const RadioGroup = React.forwardRef<HTMLDivElement, RadioGroupProps>(
+  ({ className, value, onValueChange, disabled, ...props }, ref) => {
+    const ctx = React.useMemo(() => ({ value, onValueChange: onValueChange ?? (() => {}), disabled }), [value, onValueChange, disabled]);
+    return (
+      <RadioGroupContext.Provider value={ctx}>
+        <div
+          ref={ref}
+          role="radiogroup"
+          className={className}
+          {...props}
+        />
+      </RadioGroupContext.Provider>
+    );
+  },
+);
+RadioGroup.displayName = 'RadioGroup';
+
+interface RadioGroupItemProps extends React.InputHTMLAttributes<HTMLInputElement> {
+  value: string;
+}
+
+const RadioGroupItem = React.forwardRef<HTMLInputElement, RadioGroupItemProps>(
+  ({ className, value, ...props }, ref) => {
+    const ctx = React.useContext(RadioGroupContext);
+    if (!ctx) return <input ref={ref} type="radio" className={className} value={value} {...props} />;
+    const checked = ctx.value === value;
+    return (
+      <input
+        ref={ref}
+        type="radio"
+        checked={checked}
+        disabled={ctx.disabled}
+        onChange={() => ctx.onValueChange(value)}
+        className={className}
+        {...props}
+      />
+    );
+  },
+);
+RadioGroupItem.displayName = 'RadioGroupItem';
+
+export { RadioGroup, RadioGroupItem };

apps/server/package.json

@@ -19,7 +19,9 @@
     "./types": { "types": "./dist/types/api.d.ts", "default": "./dist/types/api.js" },
     "./ws-frames": { "types": "./dist/types/ws-frames.d.ts", "default": "./dist/types/ws-frames.js" },
     "./db": { "types": "./dist/db.d.ts", "default": "./dist/db.js" },
-    "./config": { "types": "./dist/config.d.ts", "default": "./dist/config.js" }
+    "./config": { "types": "./dist/config.d.ts", "default": "./dist/config.js" },
+    "./skills": { "types": "./dist/services/skills.d.ts", "default": "./dist/services/skills.js" },
+    "./skill-invoke": { "types": "./dist/services/skill-invoke.d.ts", "default": "./dist/services/skill-invoke.js" }
   },
   "scripts": {
     "dev": "tsx watch src/index.ts",

apps/server/src/index.ts

@@ -14,6 +14,7 @@ import { registerArtifactRoutes } from './routes/artifacts.js';
 import { registerChatRoutes } from './routes/chats.js';
 import { registerSidebarRoutes } from './routes/sidebar.js';
 import { registerWebSocket } from './routes/ws.js';
+import { registerCoderProxy } from './routes/coder-proxy.js';
 import { registerModelRoutes } from './routes/models.js';
 import { registerAgentRoutes } from './routes/agents.js';
 import { registerSkillsRoutes } from './routes/skills.js';
@@ -212,36 +213,10 @@ async function main() {
   });
   registerWebSocket(app, sql, broker);
 
-  // v2.0.0: reverse proxy /api/coder/* to the boocoder container. Keeps the
-  // SPA's HTTP requests going through a single origin (avoids CORS). WS for
-  // the coder pane connects directly to boocoder:9502 from the browser (same
-  // Tailscale network — no CORS issue for WebSocket upgrade requests).
+  // v2.0.0: reverse proxy /api/coder/* to boocoder (HTTP + WS). CoderPane
+  // connects WS through /api/coder/ws/sessions/:id on the same origin.
   const BOOCODER_ORIGIN = process.env.BOOCODER_URL ?? 'http://boocoder:3000';
-  app.all('/api/coder/*', async (req, reply) => {
-    const targetPath = req.url.replace('/api/coder', '/api');
-    const targetUrl = `${BOOCODER_ORIGIN}${targetPath}`;
-    const headers: Record<string, string> = {};
-    if (req.headers['content-type']) headers['content-type'] = req.headers['content-type'] as string;
-    if (req.headers['authorization']) headers['authorization'] = req.headers['authorization'] as string;
-
-    try {
-      const res = await fetch(targetUrl, {
-        method: req.method as string,
-        headers,
-        body: req.method !== 'GET' && req.method !== 'HEAD' ? JSON.stringify(req.body) : undefined,
-      });
-      reply.code(res.status);
-      for (const [key, value] of res.headers) {
-        if (key === 'transfer-encoding') continue;
-        reply.header(key, value);
-      }
-      const body = await res.text();
-      return reply.send(body);
-    } catch (err) {
-      app.log.error({ err, targetUrl }, 'coder proxy error');
-      reply.code(502).send({ error: 'boocoder backend unavailable' });
-    }
-  });
+  registerCoderProxy(app, BOOCODER_ORIGIN);
 
   const webDist = process.env.WEB_DIST_PATH ?? resolve(process.cwd(), '../web/dist');
   if (existsSync(webDist)) {

apps/server/src/routes/coder-proxy.ts

@@ -0,0 +1,91 @@
+import type { FastifyInstance } from 'fastify';
+import WebSocket from 'ws';
+
+function boocoderWsUrl(origin: string, path: string): string {
+  const u = new URL(origin);
+  u.protocol = u.protocol === 'https:' ? 'wss:' : 'ws:';
+  u.pathname = path;
+  u.search = '';
+  return u.toString();
+}
+
+/**
+ * Reverse-proxy BooCoder HTTP + WebSocket through BooChat's single origin.
+ * WS must be registered before the HTTP catch-all — fetch() cannot upgrade.
+ */
+export function registerCoderProxy(app: FastifyInstance, boocoderOrigin: string): void {
+  app.get<{ Params: { sessionId: string } }>(
+    '/api/coder/ws/sessions/:sessionId',
+    { websocket: true },
+    (clientSocket, req) => {
+      const sessionId = req.params.sessionId;
+      const target = boocoderWsUrl(boocoderOrigin, `/api/ws/sessions/${sessionId}`);
+      const upstream = new WebSocket(target);
+
+      upstream.on('open', () => {
+        app.log.debug({ sessionId }, 'coder ws proxy: upstream connected');
+      });
+
+      upstream.on('message', (data, isBinary) => {
+        if (clientSocket.readyState !== clientSocket.OPEN) return;
+        clientSocket.send(data, { binary: isBinary });
+      });
+
+      upstream.on('close', (code, reason) => {
+        if (clientSocket.readyState === clientSocket.OPEN) {
+          clientSocket.close(code, reason.toString());
+        }
+      });
+
+      upstream.on('error', (err) => {
+        app.log.warn({ err, sessionId, target }, 'coder ws proxy: upstream error');
+        if (clientSocket.readyState === clientSocket.OPEN) {
+          clientSocket.close(1011, 'upstream error');
+        }
+      });
+
+      clientSocket.on('message', (data, isBinary) => {
+        if (upstream.readyState !== WebSocket.OPEN) return;
+        upstream.send(data, { binary: isBinary });
+      });
+
+      clientSocket.on('close', () => {
+        if (upstream.readyState === WebSocket.OPEN || upstream.readyState === WebSocket.CONNECTING) {
+          upstream.close();
+        }
+      });
+
+      clientSocket.on('error', () => {
+        if (upstream.readyState === WebSocket.OPEN || upstream.readyState === WebSocket.CONNECTING) {
+          upstream.close();
+        }
+      });
+    },
+  );
+
+  app.all('/api/coder/*', async (req, reply) => {
+    const targetPath = req.url.replace('/api/coder', '/api');
+    const targetUrl = `${boocoderOrigin}${targetPath}`;
+    const headers: Record<string, string> = {};
+    if (req.headers['content-type']) headers['content-type'] = req.headers['content-type'] as string;
+    if (req.headers['authorization']) headers['authorization'] = req.headers['authorization'] as string;
+
+    try {
+      const res = await fetch(targetUrl, {
+        method: req.method as string,
+        headers,
+        body: req.method !== 'GET' && req.method !== 'HEAD' ? JSON.stringify(req.body) : undefined,
+      });
+      reply.code(res.status);
+      for (const [key, value] of res.headers) {
+        if (key === 'transfer-encoding') continue;
+        reply.header(key, value);
+      }
+      const body = await res.text();
+      return reply.send(body);
+    } catch (err) {
+      app.log.error({ err, targetUrl }, 'coder proxy error');
+      reply.code(502).send({ error: 'boocoder backend unavailable' });
+    }
+  });
+}

apps/server/src/routes/sessions.ts

@@ -33,7 +33,8 @@ const WorkspacePaneZ = z.object({
   kind: z.enum([
     'chat',
     'terminal',
-    'agent',
+    'coder',
+    'agent', // legacy alias — normalized to coder on write
     'empty',
     'settings',
     'markdown_artifact',
@@ -307,9 +308,12 @@ export function registerSessionRoutes(
         reply.code(400);
         return { error: 'invalid body', details: parsed.error.flatten() };
       }
+      const workspacePanes = parsed.data.workspace_panes.map((pane) =>
+        pane.kind === 'agent' ? { ...pane, kind: 'coder' as const } : pane,
+      );
       const rows = await sql<Session[]>`
         UPDATE sessions
-        SET workspace_panes = ${sql.json(parsed.data.workspace_panes as never)},
+        SET workspace_panes = ${sql.json(workspacePanes as never)},
             updated_at = clock_timestamp()
         WHERE id = ${req.params.id}
         RETURNING id, project_id, name, model, system_prompt, status, created_at, updated_at,

apps/server/src/routes/skills.ts

@@ -1,9 +1,13 @@
-import { randomUUID } from 'node:crypto';
 import type { FastifyInstance } from 'fastify';
 import { z } from 'zod';
 import type { Sql } from '../db.js';
 import type { Chat } from '../types/api.js';
 import { getSkillBody, listSkills } from '../services/skills.js';
+import {
+  buildSkillInvokeSyntheticFrames,
+  DEFAULT_SKILL_USER_MESSAGE,
+  runSkillInvokeTransaction,
+} from '../services/skill-invoke.js';
 
 // Batch 9.6 slash-invoke handlers. Mirrors the MessageHandlers shape in
 // routes/messages.ts so index.ts can pass thin adapters around broker +
@@ -35,8 +39,6 @@ const SkillInvokeBody = z.object({
   user_message: z.string().max(64_000).nullable().optional(),
 });
 
-const DEFAULT_USER_MESSAGE = 'Apply this skill.';
-
 export function registerSkillsRoutes(
   app: FastifyInstance,
   sql: Sql,
@@ -62,7 +64,9 @@ export function registerSkillsRoutes(
         return { error: 'invalid body', details: parsed.error.flatten() };
       }
       const { skill_name } = parsed.data;
-      const userText = parsed.data.user_message?.trim() ? parsed.data.user_message : DEFAULT_USER_MESSAGE;
+      const userText = parsed.data.user_message?.trim()
+        ? parsed.data.user_message
+        : DEFAULT_SKILL_USER_MESSAGE;
 
       const chatRows = await sql<Chat[]>`
         SELECT id, session_id FROM chats WHERE id = ${req.params.id} AND status = 'open'
@@ -80,87 +84,20 @@ export function registerSkillsRoutes(
         return { error: 'unknown_skill', message: `unknown skill: ${skill_name}` };
       }
 
-      const toolCallId = randomUUID();
-      const toolCalls = [{ id: toolCallId, name: 'skill_use', args: { name: skill_name } }];
-      const toolResults = { tool_call_id: toolCallId, output: body, truncated: false };
-
-      const result = await sql.begin(async (tx) => {
-        const [synthAssistant] = await tx<{ id: string }[]>`
-          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
-          VALUES (${sessionId}, ${chat.id}, 'assistant', '', 'complete', clock_timestamp())
-          RETURNING id
-        `;
-        // v1.13.20: parts-only write. Single skill_use tool_call, no text
-        // content, so one part at seq 0.
-        await tx`
-          INSERT INTO message_parts (message_id, sequence, kind, payload)
-          VALUES (${synthAssistant!.id}, 0, 'tool_call', ${tx.json({
-            id: toolCallId,
-            name: 'skill_use',
-            args: { name: skill_name },
-          } as never)})
-        `;
-        const [toolMsg] = await tx<{ id: string }[]>`
-          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
-          VALUES (${sessionId}, ${chat.id}, 'tool', '', 'complete', clock_timestamp())
-          RETURNING id
-        `;
-        // v1.13.20: parts-only write of the synthetic tool result (skill body).
-        await tx`
-          INSERT INTO message_parts (message_id, sequence, kind, payload)
-          VALUES (${toolMsg!.id}, 0, 'tool_result', ${tx.json(toolResults as never)})
-        `;
-        const [userMsg] = await tx<{ id: string }[]>`
-          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
-          VALUES (${sessionId}, ${chat.id}, 'user', ${userText}, 'complete', clock_timestamp())
-          RETURNING id
-        `;
-        const [assistantMsg] = await tx<{ id: string }[]>`
-          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
-          VALUES (${sessionId}, ${chat.id}, 'assistant', '', 'streaming', clock_timestamp())
-          RETURNING id
-        `;
-        await tx`UPDATE sessions SET updated_at = clock_timestamp() WHERE id = ${sessionId}`;
-        await tx`UPDATE chats SET updated_at = clock_timestamp() WHERE id = ${chat.id}`;
-        return {
-          synth_assistant_id: synthAssistant!.id,
-          tool_message_id: toolMsg!.id,
-          user_message_id: userMsg!.id,
-          assistant_message_id: assistantMsg!.id,
-        };
+      const { result, toolCall } = await runSkillInvokeTransaction(sql, {
+        sessionId,
+        chatId: chat.id,
+        skillName: skill_name,
+        skillBody: body,
+        userText,
       });
 
       // Synthetic frames so useSessionStream's reducer reflects the new
       // history without a refetch. Frame shapes match the streaming-inference
       // protocol (see services/inference.ts InferenceFrame).
-      handlers.publishSessionFrame(sessionId, {
-        type: 'message_started',
-        message_id: result.synth_assistant_id,
-        chat_id: chat.id,
-        role: 'assistant',
-      });
-      handlers.publishSessionFrame(sessionId, {
-        type: 'tool_call',
-        message_id: result.synth_assistant_id,
-        chat_id: chat.id,
-        tool_call: toolCalls[0]!,
-      });
-      handlers.publishSessionFrame(sessionId, {
-        type: 'message_complete',
-        message_id: result.synth_assistant_id,
-        chat_id: chat.id,
-      });
-      // The tool_result frame's reducer branch creates the tool-role message
-      // in-place when it doesn't already exist — no separate message_started
-      // is needed for the tool side.
-      handlers.publishSessionFrame(sessionId, {
-        type: 'tool_result',
-        tool_message_id: result.tool_message_id,
-        tool_call_id: toolCallId,
-        chat_id: chat.id,
-        output: body,
-        truncated: false,
-      });
+      for (const frame of buildSkillInvokeSyntheticFrames(chat.id, result, toolCall, body)) {
+        handlers.publishSessionFrame(sessionId, frame);
+      }
       handlers.publishUserMessage(sessionId, chat.id, result.user_message_id, userText);
       handlers.enqueueInference(sessionId, chat.id, result.assistant_message_id, 'default');
 

apps/server/src/services/__tests__/agents.test.ts

@@ -0,0 +1,33 @@
+import { describe, it, expect } from 'vitest';
+import { isAgentRegistryMarkdown, parseAgentsMd } from '../agents.js';
+
+describe('isAgentRegistryMarkdown', () => {
+  it('rejects Cursor navigation AGENTS.md at repo root', () => {
+    expect(
+      isAgentRegistryMarkdown('# Agent navigation\n\n## Doc map\n'),
+    ).toBe(false);
+  });
+
+  it('accepts the global data/AGENTS.md registry shape', () => {
+    expect(isAgentRegistryMarkdown('# Agents\n\n## Code Reviewer\n---\n')).toBe(true);
+  });
+});
+
+describe('parseAgentsMd', () => {
+  it('does not emit errors for navigation sections when file is skipped upstream', () => {
+    // When isAgentRegistryMarkdown returns false, getAgentsForProject never calls this.
+    // Sanity: a nav-shaped file would produce six "missing fence" errors if parsed.
+    const nav = `# Agent navigation
+
+## Doc map
+| Need | Read |
+|------|------|
+
+## Task routing
+Start here
+`;
+    const r = parseAgentsMd(nav);
+    expect(r.agents).toHaveLength(0);
+    expect(r.errors.length).toBeGreaterThan(0);
+  });
+});

apps/server/src/services/__tests__/inference.test.ts

@@ -226,6 +226,76 @@ describe('buildMessagesPayload', async () => {
     expect(result[4]).toMatchObject({ role: 'assistant', content: 'here it is' });
   });
 
+  it('strips assistant tool_calls when matching tool results are missing', async () => {
+    const session = makeSession();
+    const project = makeProject();
+    const toolCall: ToolCall = {
+      id: 'call_orphan',
+      name: 'grep',
+      args: { pattern: 'foo' },
+    };
+    const history: Message[] = [
+      makeMessage('user', 'search'),
+      makeMessage('assistant', 'partial answer', { tool_calls: [toolCall] }),
+      makeMessage('assistant', 'final answer'),
+    ];
+    const result = await buildMessagesPayload(session, project, history);
+    // tool_calls stripped from the orphan turn; text content kept.
+    expect(result).toHaveLength(4);
+    expect(result[1]).toMatchObject({ role: 'user', content: 'search' });
+    expect(result[2]).toMatchObject({ role: 'assistant', content: 'partial answer' });
+    expect(result[2]!.tool_calls).toBeUndefined();
+    expect(result[3]).toMatchObject({ role: 'assistant', content: 'final answer' });
+  });
+
+  it('drops tool-call-only assistant rows when tool results never arrived', async () => {
+    const session = makeSession();
+    const project = makeProject();
+    const toolCall: ToolCall = {
+      id: 'call_orphan_only',
+      name: 'grep',
+      args: { pattern: 'foo' },
+    };
+    const history: Message[] = [
+      makeMessage('user', 'search'),
+      makeMessage('assistant', '', { tool_calls: [toolCall] }),
+      makeMessage('assistant', 'final answer'),
+    ];
+    const result = await buildMessagesPayload(session, project, history);
+    expect(result).toHaveLength(3);
+    expect(result[2]).toMatchObject({ role: 'assistant', content: 'final answer' });
+  });
+
+  it('skips stray tool rows when the owning assistant tool_calls were stripped', async () => {
+    const session = makeSession();
+    const project = makeProject();
+    const toolCallA: ToolCall = {
+      id: 'call_a',
+      name: 'grep',
+      args: { pattern: 'foo' },
+    };
+    const toolCallB: ToolCall = {
+      id: 'call_b',
+      name: 'read',
+      args: { path: 'x' },
+    };
+    const toolResult: ToolResult = {
+      tool_call_id: 'call_a',
+      output: 'match',
+      truncated: false,
+    };
+    const history: Message[] = [
+      makeMessage('user', 'search'),
+      makeMessage('assistant', '', { tool_calls: [toolCallA, toolCallB] }),
+      makeMessage('tool', '', { tool_results: toolResult }),
+      makeMessage('assistant', 'final answer'),
+    ];
+    const result = await buildMessagesPayload(session, project, history);
+    expect(result).toHaveLength(3);
+    expect(result.find((m) => m.role === 'tool')).toBeUndefined();
+    expect(result[2]).toMatchObject({ role: 'assistant', content: 'final answer' });
+  });
+
   it('skips tool rows with no tool_results', async () => {
     const session = makeSession();
     const project = makeProject();

apps/server/src/services/__tests__/xml-parser.test.ts

@@ -270,6 +270,44 @@ describe('extractToolCallBlocks (v1.13.16 — unified extraction)', () => {
     expect(result.flushed).toBe(input);
     expect(result.remaining).toBe('');
   });
+
+  describe('placeholder arg rejection (qwen3.6 answer-then-spurious-tools)', () => {
+    it('rejects <invoke> with path "..." — 0 calls, block in flushed', () => {
+      const block = '<invoke name="view_file"><parameter name="path">...</parameter></invoke>';
+      const result = extractToolCallBlocks(`Answer text.\n${block}`);
+      expect(result.calls).toEqual([]);
+      expect(result.flushed).toContain('Answer text.');
+      expect(result.flushed).toContain(block);
+      expect(result.remaining).toBe('');
+    });
+
+    it('rejects <invoke> with empty path — 0 calls, block in flushed', () => {
+      const block = '<invoke name="view_file"><parameter name="path"></parameter></invoke>';
+      const result = extractToolCallBlocks(block);
+      expect(result.calls).toEqual([]);
+      expect(result.flushed).toBe(block);
+      expect(result.remaining).toBe('');
+    });
+
+    it('rejects <invoke> with path "<path>" — 0 calls', () => {
+      const block = '<invoke name="view_file"><parameter name="path"><path></parameter></invoke>';
+      const result = extractToolCallBlocks(block);
+      expect(result.calls).toEqual([]);
+      expect(result.flushed).toBe(block);
+    });
+
+    it('returns 1 valid call and flushes placeholder block when mixed in same buffer', () => {
+      const valid =
+        '<invoke name="view_file"><parameter name="path">/opt/boocode/README.md</parameter></invoke>';
+      const placeholder =
+        '<invoke name="view_file"><parameter name="path">...</parameter></invoke>';
+      const result = extractToolCallBlocks(`${valid} tail ${placeholder}`);
+      expect(result.calls).toEqual([{ name: 'view_file', args: { path: '/opt/boocode/README.md' } }]);
+      expect(result.flushed).toContain('tail');
+      expect(result.flushed).toContain(placeholder);
+      expect(result.remaining).toBe('');
+    });
+  });
 });
 
 describe('levenshtein', () => {

apps/server/src/services/agents.ts

@@ -83,6 +83,10 @@ export function slugify(name: string): string {
 
 interface ParsedFrontmatter {
   temperature?: number;
+  top_p?: number;
+  top_k?: number;
+  min_p?: number;
+  presence_penalty?: number;
   tools?: string[];
   description?: string;
   model?: string;
@@ -132,6 +136,46 @@ function parseFrontmatter(yaml: string): { data: ParsedFrontmatter; errors: stri
       const n = Number(valueRaw);
       if (Number.isFinite(n)) data.temperature = n;
       else errors.push(`temperature must be a number (got "${valueRaw}")`);
+    } else if (key === 'top_p') {
+      const n = Number(valueRaw);
+      if (Number.isFinite(n)) {
+        data.top_p = n;
+        if (n < 0 || n > 1) {
+          console.warn(`agents: top_p ${n} out of range 0-1, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`top_p must be a number (got "${valueRaw}")`);
+      }
+    } else if (key === 'top_k') {
+      const n = Number(valueRaw);
+      if (Number.isInteger(n)) {
+        data.top_k = n;
+        if (n < 0 || n > 200) {
+          console.warn(`agents: top_k ${n} out of range 0-200, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`top_k must be an integer (got "${valueRaw}")`);
+      }
+    } else if (key === 'min_p') {
+      const n = Number(valueRaw);
+      if (Number.isFinite(n)) {
+        data.min_p = n;
+        if (n < 0 || n > 1) {
+          console.warn(`agents: min_p ${n} out of range 0-1, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`min_p must be a number (got "${valueRaw}")`);
+      }
+    } else if (key === 'presence_penalty') {
+      const n = Number(valueRaw);
+      if (Number.isFinite(n)) {
+        data.presence_penalty = n;
+        if (n < -2 || n > 2) {
+          console.warn(`agents: presence_penalty ${n} out of range -2-2, ignoring (falling back to default)`);
+        }
+      } else {
+        errors.push(`presence_penalty must be a number (got "${valueRaw}")`);
+      }
     } else if (key === 'tools') {
       if (valueRaw === '') {
         data.tools = [];
@@ -276,6 +320,10 @@ function parseAgentSection(section: RawSection): Omit<Agent, 'source'> {
     description: fm.description ?? '',
     system_prompt: systemPrompt,
     temperature: typeof fm.temperature === 'number' ? fm.temperature : DEFAULT_TEMPERATURE,
+    top_p: typeof fm.top_p === 'number' ? fm.top_p : null,
+    top_k: typeof fm.top_k === 'number' ? fm.top_k : null,
+    min_p: typeof fm.min_p === 'number' ? fm.min_p : null,
+    presence_penalty: typeof fm.presence_penalty === 'number' ? fm.presence_penalty : null,
     tools: filteredTools,
     model: typeof fm.model === 'string' && fm.model.length > 0 ? fm.model : null,
     max_tool_calls: typeof fm.max_tool_calls === 'number' ? fm.max_tool_calls : null,
@@ -309,6 +357,14 @@ export function parseAgentsMd(content: string): ParseResult {
   return { agents, errors };
 }
 
+/** True when a file at `<project>/AGENTS.md` is an agent registry, not Cursor/doc nav. */
+export function isAgentRegistryMarkdown(content: string): boolean {
+  const firstLine = content.trimStart().split('\n')[0]?.trim() ?? '';
+  // BooCode monorepo root AGENTS.md is navigation only; registry is /data/AGENTS.md.
+  if (firstLine === '# Agent navigation') return false;
+  return true;
+}
+
 // ---- mtime-keyed cache + public API ----------------------------------------
 
 interface CacheEntry {
@@ -397,7 +453,7 @@ export async function getAgentsForProject(projectPath: string): Promise<AgentsRe
     for (const a of r.agents) byName.set(a.name, { ...a, source: 'global' });
     errors.push(...r.errors);
   }
-  if (projectContent !== null) {
+  if (projectContent !== null && isAgentRegistryMarkdown(projectContent)) {
     const r = parseAgentsMd(projectContent);
     for (const a of r.agents) byName.set(a.name, { ...a, source: 'project' });
     errors.push(...r.errors);

apps/server/src/services/inference/payload.ts

@@ -37,6 +37,34 @@ export interface OpenAiMessage {
 // omit it and exercise the byte-stability surface directly through
 // buildSystemPromptWithFingerprint. The observer Map in system-prompt.ts
 // updates regardless of whether log is passed.
+function toolResultIdsFollowing(history: Message[], assistantIdx: number): Set<string> {
+  const ids = new Set<string>();
+  for (let j = assistantIdx + 1; j < history.length; j++) {
+    const row = history[j]!;
+    if (row.role === 'user' || row.role === 'assistant') break;
+    if (row.role === 'tool' && row.tool_results?.tool_call_id) {
+      ids.add(row.tool_results.tool_call_id);
+    }
+  }
+  return ids;
+}
+
+function findAssistantOwnerForToolCall(history: Message[], toolIdx: number, callId: string): number | null {
+  for (let k = toolIdx - 1; k >= 0; k--) {
+    const row = history[k]!;
+    if (row.role === 'user') break;
+    if (row.role === 'assistant' && row.tool_calls?.some((tc) => tc.id === callId)) return k;
+  }
+  return null;
+}
+
+function assistantToolCallsArePayloadComplete(history: Message[], assistantIdx: number): boolean {
+  const assistant = history[assistantIdx]!;
+  if (!assistant.tool_calls?.length) return false;
+  const fulfilled = toolResultIdsFollowing(history, assistantIdx);
+  return assistant.tool_calls.every((tc) => fulfilled.has(tc.id));
+}
+
 export async function buildMessagesPayload(
   session: Session,
   project: Project,
@@ -97,6 +125,10 @@ export async function buildMessagesPayload(
     if (m.role === 'tool') {
       const tr = m.tool_results;
       if (!tr) continue;
+      const ownerIdx = findAssistantOwnerForToolCall(history, i, tr.tool_call_id);
+      if (ownerIdx == null || !assistantToolCallsArePayloadComplete(history, ownerIdx)) {
+        continue;
+      }
       const outputText = tr.error
         ? `error: ${tr.error}`
         : typeof tr.output === 'string'
@@ -115,11 +147,15 @@ export async function buildMessagesPayload(
         content: m.content && m.content.length > 0 ? m.content : null,
       };
       if (m.tool_calls && m.tool_calls.length > 0) {
-        msg.tool_calls = m.tool_calls.map((tc) => ({
-          id: tc.id,
-          type: 'function' as const,
-          function: { name: tc.name, arguments: JSON.stringify(tc.args) },
-        }));
+        if (assistantToolCallsArePayloadComplete(history, i)) {
+          msg.tool_calls = m.tool_calls.map((tc) => ({
+            id: tc.id,
+            type: 'function' as const,
+            function: { name: tc.name, arguments: JSON.stringify(tc.args) },
+          }));
+        }
+        // Orphaned tool_calls (no matching tool rows) are stripped so the
+        // upstream API does not reject the payload on the next user turn.
       }
       // v1.13.1-C: collapse reasoning_parts into a single string. The view
       // returns them ordered by sequence; multiple reasoning parts on one
@@ -127,6 +163,11 @@ export async function buildMessagesPayload(
       if (m.reasoning_parts && m.reasoning_parts.length > 0) {
         msg.reasoning = m.reasoning_parts.map((p) => p.text ?? '').join('');
       }
+      const hasPayload =
+        (msg.content != null && msg.content.trim().length > 0) ||
+        (msg.tool_calls != null && msg.tool_calls.length > 0) ||
+        (msg.reasoning != null && msg.reasoning.length > 0);
+      if (!hasPayload) continue;
       out.push(msg);
       continue;
     }

apps/server/src/services/inference/sentinel-summaries.ts

@@ -86,7 +86,7 @@ export async function runCapHitSummary(
       ctx,
       session.model,
       messages,
-      { tools: null, temperature: agent?.temperature },
+      { tools: null, temperature: agent?.temperature, top_p: agent?.top_p ?? undefined, top_k: agent?.top_k ?? undefined, min_p: agent?.min_p ?? undefined, presence_penalty: agent?.presence_penalty ?? undefined },
       (delta) => {
         accumulated += delta;
         ctx.publish(sessionId, {
@@ -346,7 +346,7 @@ export async function runDoomLoopSummary(
       ctx,
       session.model,
       messages,
-      { tools: null, temperature: agent?.temperature },
+      { tools: null, temperature: agent?.temperature, top_p: agent?.top_p ?? undefined, top_k: agent?.top_k ?? undefined, min_p: agent?.min_p ?? undefined, presence_penalty: agent?.presence_penalty ?? undefined },
       (delta) => {
         accumulated += delta;
         ctx.publish(sessionId, {
@@ -545,7 +545,7 @@ export async function runStepCapSummary(
       ctx,
       session.model,
       messages,
-      { tools: null, temperature: agent?.temperature },
+      { tools: null, temperature: agent?.temperature, top_p: agent?.top_p ?? undefined, top_k: agent?.top_k ?? undefined, min_p: agent?.min_p ?? undefined, presence_penalty: agent?.presence_penalty ?? undefined },
       (delta) => {
         accumulated += delta;
         ctx.publish(sessionId, {

apps/server/src/services/inference/stream-phase.ts

@@ -31,6 +31,10 @@ interface StreamOptions {
   // (rare; we still omit from the request body to avoid OpenAI 400).
   tools: ToolJsonSchema[] | null;
   temperature?: number;
+  top_p?: number | null;
+  top_k?: number | null;
+  min_p?: number | null;
+  presence_penalty?: number | null;
 }
 
 // v1.13.1-A: convert BooCode's OpenAI-shaped history into AI SDK
@@ -199,6 +203,9 @@ export async function streamCompletion(
       ? { tools: aiTools, toolChoice: 'auto' as const, experimental_repairToolCall: repairToolCall }
       : {}),
     ...(typeof opts.temperature === 'number' ? { temperature: opts.temperature } : {}),
+    ...(typeof opts.top_p === 'number' ? { topP: opts.top_p } : {}),
+    ...(typeof opts.top_k === 'number' ? { topK: opts.top_k } : {}),
+    ...(typeof opts.presence_penalty === 'number' ? { presencePenalty: opts.presence_penalty } : {}),
     abortSignal: signal,
   });
 
@@ -388,6 +395,10 @@ export async function executeStreamPhase(
     : toolJsonSchemas()
   ).filter((t) => webToolsEnabled || !WEB_TOOL_NAMES.has(t.function.name));
   const effectiveTemperature = agent?.temperature;
+  const effectiveTopP = agent?.top_p ?? undefined;
+  const effectiveTopK = agent?.top_k ?? undefined;
+  const effectiveMinP = agent?.min_p ?? undefined;
+  const effectivePresencePenalty = agent?.presence_penalty ?? undefined;
 
   // v1.12.2: ctx_max lookup is cached after the first hit per model, so this
   // is a Map probe in steady state. We capture nCtx once at the top of the
@@ -425,7 +436,7 @@ export async function executeStreamPhase(
       ctx,
       session.model,
       messages,
-      { tools: effectiveTools, temperature: effectiveTemperature },
+      { tools: effectiveTools, temperature: effectiveTemperature, top_p: effectiveTopP, top_k: effectiveTopK, min_p: effectiveMinP, presence_penalty: effectivePresencePenalty },
       (delta) => {
         state.accumulated += delta;
         ctx.publish(sessionId, {

apps/server/src/services/inference/xml-parser.ts

@@ -24,6 +24,34 @@ export interface ParsedCall {
   args: Record<string, unknown>;
 }
 
+const PLACEHOLDER_LITERALS = new Set(['...', 'placeholder', '<path>', '<file>']);
+const ANGLE_BRACKET_SENTINEL_RE = /^<[^>]+>$/;
+
+/** True when a string arg looks like a model placeholder, not a real path/value. */
+export function isPlaceholderArgValue(value: unknown): boolean {
+  if (typeof value !== 'string') return false;
+  const trimmed = value.trim();
+  if (trimmed === '') return true;
+  if (PLACEHOLDER_LITERALS.has(trimmed)) return true;
+  if (ANGLE_BRACKET_SENTINEL_RE.test(trimmed)) return true;
+  return false;
+}
+
+function hasPlaceholderArgs(args: Record<string, unknown>): boolean {
+  for (const value of Object.values(args)) {
+    if (isPlaceholderArgValue(value)) return true;
+  }
+  return false;
+}
+
+function logRejectedPlaceholder(parsed: ParsedCall): void {
+  // Pure helper — no Fastify logger here (stream-phase.ts stays unchanged).
+  console.debug(
+    { toolName: parsed.name, args: parsed.args },
+    'rejected placeholder tool call at parse time',
+  );
+}
+
 // v1.10.5: Qwen-flavor parser. Tightened in v1.13.16 to tolerate whitespace
 // around `=` (e.g. `<function = view_file>`). Name capture is non-whitespace,
 // non-`>` so a stray space doesn't get absorbed into the function name.
@@ -152,7 +180,14 @@ export function extractToolCallBlocks(buffer: string): ToolCallExtraction {
     const blockEnd = next.closeIdx + next.spec.close.length;
     const block = buffer.slice(next.openIdx, blockEnd);
     const parsed = next.spec.parse(block);
-    if (parsed) calls.push(parsed);
+    if (parsed) {
+      if (hasPlaceholderArgs(parsed.args)) {
+        logRejectedPlaceholder(parsed);
+        flushed += block;
+      } else {
+        calls.push(parsed);
+      }
+    }
     pos = blockEnd;
   }
 

apps/server/src/services/skill-invoke.ts

@@ -0,0 +1,148 @@
+import { randomUUID } from 'node:crypto';
+import type { Sql } from '../db.js';
+
+export const DEFAULT_SKILL_USER_MESSAGE = 'Apply this skill.';
+
+export interface SkillInvokeTransactionResult {
+  synth_assistant_id: string;
+  tool_message_id: string;
+  user_message_id: string;
+  assistant_message_id: string;
+}
+
+export interface SkillInvokeToolCall {
+  id: string;
+  name: 'skill_use';
+  args: { name: string };
+}
+
+export type SkillInvokeSessionFrame = Record<string, unknown> & { type: string };
+
+export async function runSkillInvokeTransaction(
+  sql: Sql,
+  args: {
+    sessionId: string;
+    chatId: string;
+    skillName: string;
+    skillBody: string;
+    userText: string;
+  },
+): Promise<{ result: SkillInvokeTransactionResult; toolCall: SkillInvokeToolCall }> {
+  const toolCallId = randomUUID();
+  const toolCall: SkillInvokeToolCall = {
+    id: toolCallId,
+    name: 'skill_use',
+    args: { name: args.skillName },
+  };
+  const toolResults = {
+    tool_call_id: toolCallId,
+    output: args.skillBody,
+    truncated: false,
+  };
+
+  const result = await sql.begin(async (tx) => {
+    const [synthAssistant] = await tx<{ id: string }[]>`
+      INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+      VALUES (${args.sessionId}, ${args.chatId}, 'assistant', '', 'complete', clock_timestamp())
+      RETURNING id
+    `;
+    await tx`
+      INSERT INTO message_parts (message_id, sequence, kind, payload)
+      VALUES (${synthAssistant!.id}, 0, 'tool_call', ${tx.json({
+        id: toolCallId,
+        name: 'skill_use',
+        args: { name: args.skillName },
+      } as never)})
+    `;
+    const [toolMsg] = await tx<{ id: string }[]>`
+      INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+      VALUES (${args.sessionId}, ${args.chatId}, 'tool', '', 'complete', clock_timestamp())
+      RETURNING id
+    `;
+    await tx`
+      INSERT INTO message_parts (message_id, sequence, kind, payload)
+      VALUES (${toolMsg!.id}, 0, 'tool_result', ${tx.json(toolResults as never)})
+    `;
+    const [userMsg] = await tx<{ id: string }[]>`
+      INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+      VALUES (${args.sessionId}, ${args.chatId}, 'user', ${args.userText}, 'complete', clock_timestamp())
+      RETURNING id
+    `;
+    const [assistantMsg] = await tx<{ id: string }[]>`
+      INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+      VALUES (${args.sessionId}, ${args.chatId}, 'assistant', '', 'streaming', clock_timestamp())
+      RETURNING id
+    `;
+    await tx`UPDATE sessions SET updated_at = clock_timestamp() WHERE id = ${args.sessionId}`;
+    await tx`UPDATE chats SET updated_at = clock_timestamp() WHERE id = ${args.chatId}`;
+    return {
+      synth_assistant_id: synthAssistant!.id,
+      tool_message_id: toolMsg!.id,
+      user_message_id: userMsg!.id,
+      assistant_message_id: assistantMsg!.id,
+    };
+  });
+
+  return { result, toolCall };
+}
+
+export function buildSkillInvokeSyntheticFrames(
+  chatId: string,
+  result: SkillInvokeTransactionResult,
+  toolCall: SkillInvokeToolCall,
+  skillBody: string,
+): SkillInvokeSessionFrame[] {
+  return [
+    {
+      type: 'message_started',
+      message_id: result.synth_assistant_id,
+      chat_id: chatId,
+      role: 'assistant',
+    },
+    {
+      type: 'tool_call',
+      message_id: result.synth_assistant_id,
+      chat_id: chatId,
+      tool_call: toolCall,
+    },
+    {
+      type: 'message_complete',
+      message_id: result.synth_assistant_id,
+      chat_id: chatId,
+    },
+    {
+      type: 'tool_result',
+      tool_message_id: result.tool_message_id,
+      tool_call_id: toolCall.id,
+      chat_id: chatId,
+      output: skillBody,
+      truncated: false,
+    },
+  ];
+}
+
+export function buildSkillInvokeUserFrames(
+  chatId: string,
+  userMessageId: string,
+  userText: string,
+): SkillInvokeSessionFrame[] {
+  return [
+    {
+      type: 'message_started',
+      message_id: userMessageId,
+      chat_id: chatId,
+      role: 'user',
+    },
+    {
+      type: 'delta',
+      message_id: userMessageId,
+      chat_id: chatId,
+      content: userText,
+    },
+    {
+      type: 'message_complete',
+      message_id: userMessageId,
+      chat_id: chatId,
+    },
+  ];
+}

apps/server/src/services/skills.ts

@@ -16,7 +16,7 @@ import { pathGuard, PathScopeError } from './path_guard.js';
 // new skills, per-entry mtime check on body access so a hot-edited SKILL.md
 // is re-read without a restart. No watcher.
 
-const SKILLS_ROOT = '/data/skills';
+const SKILLS_ROOT = process.env.SKILLS_ROOT ?? '/data/skills';
 const MAX_RESOURCE_BYTES = 5 * 1024 * 1024;
 const LIST_CACHE_TTL_MS = 60_000;
 

apps/server/src/types/api.ts

@@ -99,6 +99,10 @@ export interface Agent {
   description: string;
   system_prompt: string;
   temperature: number;
+  top_p: number | null;  // null means omit from request body
+  top_k: number | null;  // null means omit from request body
+  min_p: number | null;  // null means omit from request body
+  presence_penalty: number | null;  // null means omit from request body
   tools: string[];       // whitelist of tool names; empty = no tools allowed
   model: string | null;  // null means "session.model wins"
   source: AgentSource;

apps/server/src/types/ws-frames.ts

@@ -85,6 +85,13 @@ export const DeltaFrame = z.object({
   content: z.string(),
 });
 
+export const ReasoningDeltaFrame = z.object({
+  type: z.literal('reasoning_delta'),
+  message_id: Uuid,
+  chat_id: Uuid.optional(),
+  content: z.string(),
+});
+
 export const ToolCallFrame = z.object({
   type: z.literal('tool_call'),
   message_id: Uuid,
@@ -256,6 +263,39 @@ export const ProjectDeletedFrame = z.object({
   project_id: Uuid,
 });
 
+const PermissionOptionShape = z.object({
+  option_id: z.string(),
+  label: z.string(),
+});
+
+export const PermissionRequestedFrame = z.object({
+  type: z.literal('permission_requested'),
+  task_id: Uuid,
+  session_id: Uuid,
+  kind: z.enum(['tool', 'question', 'plan', 'elicitation']).optional(),
+  tool_title: z.string().optional(),
+  input: z.record(z.unknown()).optional(),
+  options: z.array(PermissionOptionShape),
+});
+
+export const PermissionResolvedFrame = z.object({
+  type: z.literal('permission_resolved'),
+  task_id: Uuid,
+  session_id: Uuid,
+});
+
+const AgentCommandShape = z.object({
+  name: z.string(),
+  description: z.string().optional(),
+});
+
+export const AgentCommandsFrame = z.object({
+  type: z.literal('agent_commands'),
+  task_id: Uuid,
+  session_id: Uuid,
+  commands: z.array(AgentCommandShape),
+});
+
 // ---- discriminated union ---------------------------------------------------
 
 export const WsFrameSchema = z.discriminatedUnion('type', [
@@ -263,6 +303,7 @@ export const WsFrameSchema = z.discriminatedUnion('type', [
   SnapshotFrame,
   MessageStartedFrame,
   DeltaFrame,
+  ReasoningDeltaFrame,
   ToolCallFrame,
   ToolResultFrame,
   MessageCompleteFrame,
@@ -271,6 +312,9 @@ export const WsFrameSchema = z.discriminatedUnion('type', [
   ChatRenamedFrame,
   CompactedFrame,
   ErrorFrame,
+  PermissionRequestedFrame,
+  PermissionResolvedFrame,
+  AgentCommandsFrame,
   // per-user
   ChatStatusFrame,
   SessionUpdatedFrame,
@@ -300,6 +344,7 @@ export const KNOWN_FRAME_TYPES: readonly WsFrame['type'][] = [
   'snapshot',
   'message_started',
   'delta',
+  'reasoning_delta',
   'tool_call',
   'tool_result',
   'message_complete',
@@ -308,6 +353,9 @@ export const KNOWN_FRAME_TYPES: readonly WsFrame['type'][] = [
   'chat_renamed',
   'compacted',
   'error',
+  'permission_requested',
+  'permission_resolved',
+  'agent_commands',
   'chat_status',
   'session_updated',
   'session_renamed',

apps/web/src/api/client.ts

@@ -13,7 +13,13 @@ import type {
   Skill,
   AskUserAnswer,
   ToolCostStat,
-  Provider,
+  ProviderSnapshotEntry,
+  CoderSendMessageBody,
+  CoderSendMessageResponse,
+  CoderMessageWire,
+  CoderTaskDetail,
+  PermissionPrompt,
+  AgentCommand,
 } from './types';
 
 export class ApiError extends Error {
@@ -300,7 +306,46 @@ export const api = {
   models: () => request<ModelInfo[]>('/api/models'),
 
   coder: {
-    providers: () => request<Provider[]>('/api/coder/providers'),
+    snapshot: (cwd?: string) => {
+      const qs = cwd ? `?cwd=${encodeURIComponent(cwd)}` : '';
+      return request<ProviderSnapshotEntry[]>(`/api/coder/providers/snapshot${qs}`);
+    },
+    refreshProviders: () =>
+      request<{ refreshed: number }>('/api/coder/providers/refresh', { method: 'POST' }),
+    sendMessage: (sessionId: string, body: CoderSendMessageBody) =>
+      request<CoderSendMessageResponse>(`/api/coder/sessions/${sessionId}/messages`, {
+        method: 'POST',
+        body: JSON.stringify(body),
+      }),
+    getTaskPermission: (taskId: string) =>
+      request<PermissionPrompt>(`/api/coder/tasks/${taskId}/permission`),
+    respondTaskPermission: (taskId: string, optionId: string | null, updatedInput?: Record<string, unknown>) =>
+      request<{ ok: boolean }>(`/api/coder/tasks/${taskId}/permission`, {
+        method: 'POST',
+        body: JSON.stringify({ option_id: optionId, ...(updatedInput ? { updated_input: updatedInput } : {}) }),
+      }),
+    getTaskCommands: (taskId: string) =>
+      request<{ taskId: string; commands: AgentCommand[] }>(`/api/coder/tasks/${taskId}/commands`),
+    getTask: (taskId: string) =>
+      request<CoderTaskDetail>(`/api/coder/tasks/${taskId}`),
+    listMessages: (sessionId: string, chatId?: string) =>
+      request<CoderMessageWire[]>(
+        `/api/coder/sessions/${sessionId}/messages${chatId ? `?chat_id=${encodeURIComponent(chatId)}` : ''}`,
+      ),
+    skillInvoke: (sessionId: string, paneId: string, skillName: string, userMessage: string | null) =>
+      request<{
+        user_message_id: string;
+        assistant_message_id: string;
+        synth_assistant_id: string;
+        tool_message_id: string;
+      }>(`/api/coder/sessions/${sessionId}/skill_invoke`, {
+        method: 'POST',
+        body: JSON.stringify({
+          pane_id: paneId,
+          skill_name: skillName,
+          user_message: userMessage,
+        }),
+      }),
   },
 
   agents: {

apps/web/src/api/types.ts

@@ -209,14 +209,99 @@ export interface ModelInfo {
 export interface ProviderModel {
   id: string;
   label: string;
+  description?: string;
+  isDefault?: boolean;
+  thinkingOptions?: ThinkingOption[];
+  defaultThinkingOptionId?: string;
 }
 
-export interface Provider {
+export interface ProviderMode {
+  id: string;
+  label: string;
+  description?: string;
+  isUnattended?: boolean;
+}
+
+export interface ThinkingOption {
+  id: string;
+  label: string;
+  isDefault?: boolean;
+}
+
+export type ProviderSnapshotStatus = 'ready' | 'error';
+
+export interface ProviderSnapshotEntry {
   name: string;
   label: string;
   transport: string;
+  status: ProviderSnapshotStatus;
   installed: boolean;
   models: ProviderModel[];
+  modes: ProviderMode[];
+  defaultModeId: string | null;
+  commands: AgentCommand[];
+  error?: string;
+}
+
+export interface AgentSessionConfig {
+  provider: string;
+  model: string;
+  modeId: string | null;
+  thinkingOptionId: string | null;
+}
+
+export type PermissionKind = 'tool' | 'question' | 'plan' | 'elicitation';
+
+export interface PermissionPrompt {
+  taskId: string;
+  kind?: PermissionKind;
+  toolTitle?: string;
+  input?: Record<string, unknown>;
+  options: Array<{ optionId: string; label: string }>;
+}
+
+export interface AgentCommand {
+  name: string;
+  description?: string;
+}
+
+export interface CoderSendMessageBody {
+  content: string;
+  pane_id: string;
+  chat_id?: string;
+  provider?: string;
+  model?: string;
+  mode_id?: string;
+  thinking_option_id?: string;
+}
+
+export interface CoderSendMessageResponse {
+  user_message_id?: string;
+  assistant_message_id?: string;
+  task_id?: string;
+  dispatched?: boolean;
+}
+
+export interface CoderMessageWire {
+  id: string;
+  role: 'user' | 'assistant' | 'system';
+  content: string;
+  status?: 'streaming' | 'complete' | 'failed';
+  reasoning_text?: string;
+  tool_calls?: Array<{
+    id: string;
+    function: { name: string; arguments: string };
+  }>;
+}
+
+export interface CoderTaskDetail {
+  id: string;
+  state: 'pending' | 'running' | 'completed' | 'failed' | 'blocked' | 'cancelled';
+  input: string;
+  output_summary: string | null;
+  agent: string | null;
+  model: string | null;
+  session_id: string | null;
 }
 
 export interface SidebarSession {

apps/web/src/api/ws-frames.ts

@@ -85,6 +85,13 @@ export const DeltaFrame = z.object({
   content: z.string(),
 });
 
+export const ReasoningDeltaFrame = z.object({
+  type: z.literal('reasoning_delta'),
+  message_id: Uuid,
+  chat_id: Uuid.optional(),
+  content: z.string(),
+});
+
 export const ToolCallFrame = z.object({
   type: z.literal('tool_call'),
   message_id: Uuid,
@@ -256,6 +263,39 @@ export const ProjectDeletedFrame = z.object({
   project_id: Uuid,
 });
 
+const PermissionOptionShape = z.object({
+  option_id: z.string(),
+  label: z.string(),
+});
+
+export const PermissionRequestedFrame = z.object({
+  type: z.literal('permission_requested'),
+  task_id: Uuid,
+  session_id: Uuid,
+  kind: z.enum(['tool', 'question', 'plan', 'elicitation']).optional(),
+  tool_title: z.string().optional(),
+  input: z.record(z.unknown()).optional(),
+  options: z.array(PermissionOptionShape),
+});
+
+export const PermissionResolvedFrame = z.object({
+  type: z.literal('permission_resolved'),
+  task_id: Uuid,
+  session_id: Uuid,
+});
+
+const AgentCommandShape = z.object({
+  name: z.string(),
+  description: z.string().optional(),
+});
+
+export const AgentCommandsFrame = z.object({
+  type: z.literal('agent_commands'),
+  task_id: Uuid,
+  session_id: Uuid,
+  commands: z.array(AgentCommandShape),
+});
+
 // ---- discriminated union ---------------------------------------------------
 
 export const WsFrameSchema = z.discriminatedUnion('type', [
@@ -263,6 +303,7 @@ export const WsFrameSchema = z.discriminatedUnion('type', [
   SnapshotFrame,
   MessageStartedFrame,
   DeltaFrame,
+  ReasoningDeltaFrame,
   ToolCallFrame,
   ToolResultFrame,
   MessageCompleteFrame,
@@ -271,6 +312,9 @@ export const WsFrameSchema = z.discriminatedUnion('type', [
   ChatRenamedFrame,
   CompactedFrame,
   ErrorFrame,
+  PermissionRequestedFrame,
+  PermissionResolvedFrame,
+  AgentCommandsFrame,
   // per-user
   ChatStatusFrame,
   SessionUpdatedFrame,
@@ -300,6 +344,7 @@ export const KNOWN_FRAME_TYPES: readonly WsFrame['type'][] = [
   'snapshot',
   'message_started',
   'delta',
+  'reasoning_delta',
   'tool_call',
   'tool_result',
   'message_complete',
@@ -308,6 +353,9 @@ export const KNOWN_FRAME_TYPES: readonly WsFrame['type'][] = [
   'chat_renamed',
   'compacted',
   'error',
+  'permission_requested',
+  'permission_resolved',
+  'agent_commands',
   'chat_status',
   'session_updated',
   'session_renamed',

apps/web/src/components/AgentCommandsHint.tsx

@@ -0,0 +1,39 @@
+import { ChevronDown } from 'lucide-react';
+import { useState } from 'react';
+import type { AgentCommand } from '@/api/types';
+import { cn } from '@/lib/utils';
+
+interface Props {
+  commands: AgentCommand[];
+}
+
+export function AgentCommandsHint({ commands }: Props) {
+  const [open, setOpen] = useState(false);
+
+  if (commands.length === 0) return null;
+
+  return (
+    <div className="mx-2 mb-1 rounded-md border border-border/60 bg-muted/30 text-xs">
+      <button
+        type="button"
+        onClick={() => setOpen((v) => !v)}
+        className="w-full flex items-center justify-between px-2 py-1.5 text-muted-foreground hover:text-foreground max-md:min-h-[44px]"
+      >
+        <span>Slash commands ({commands.length})</span>
+        <ChevronDown className={cn('size-3.5 transition-transform', open && 'rotate-180')} />
+      </button>
+      {open && (
+        <ul className="px-2 pb-2 space-y-1 border-t border-border/40 max-h-48 overflow-y-auto overscroll-contain touch-pan-y">
+          {commands.map((cmd) => (
+            <li key={cmd.name} className="font-mono">
+              <span className="text-primary/80">/{cmd.name}</span>
+              {cmd.description && (
+                <span className="ml-1.5 text-muted-foreground font-sans line-clamp-1">{cmd.description}</span>
+              )}
+            </li>
+          ))}
+        </ul>
+      )}
+    </div>
+  );
+}

apps/web/src/components/AgentComposerBar.tsx

@@ -0,0 +1,308 @@
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { Check, ChevronDown, RefreshCw, Shield, Cpu, Brain } from 'lucide-react';
+import { api } from '@/api/client';
+import type { AgentSessionConfig, ProviderSnapshotEntry, AgentCommand } from '@/api/types';
+import { useProviderSnapshot, refreshProviderSnapshot } from '@/hooks/useProviderSnapshot';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import { BottomSheet } from '@/components/BottomSheet';
+import { useViewport } from '@/hooks/useViewport';
+import { cn } from '@/lib/utils';
+
+const PREFS_KEY = 'boocode.coder.agent-prefs';
+
+
+type ProviderPrefs = Record<string, {
+  model: string;
+  modeId: string | null;
+  thinkingOptionId: string | null;
+}>;
+
+function loadPrefs(): ProviderPrefs {
+  try {
+    const raw = localStorage.getItem(PREFS_KEY);
+    return raw ? (JSON.parse(raw) as ProviderPrefs) : {};
+  } catch {
+    return {};
+  }
+}
+
+function savePrefs(prefs: ProviderPrefs): void {
+  localStorage.setItem(PREFS_KEY, JSON.stringify(prefs));
+}
+
+function defaultsForProvider(entry: ProviderSnapshotEntry): AgentSessionConfig {
+  const model =
+    entry.models.find((m) => m.isDefault)?.id ??
+    entry.models[0]?.id ??
+    '';
+  const selectedModel = entry.models.find((m) => m.id === model);
+  const modeId = entry.defaultModeId ?? entry.modes[0]?.id ?? null;
+  const thinkingOptionId =
+    selectedModel?.defaultThinkingOptionId ??
+    selectedModel?.thinkingOptions?.find((t) => t.isDefault)?.id ??
+    selectedModel?.thinkingOptions?.[0]?.id ??
+    null;
+
+  return {
+    provider: entry.name,
+    model,
+    modeId,
+    thinkingOptionId,
+  };
+}
+
+function resolveConfig(
+  entry: ProviderSnapshotEntry,
+  prefs: ProviderPrefs,
+): AgentSessionConfig {
+  const saved = prefs[entry.name];
+  const base = defaultsForProvider(entry);
+
+  const model =
+    saved?.model && entry.models.some((m) => m.id === saved.model)
+      ? saved.model
+      : base.model;
+
+  const selectedModel = entry.models.find((m) => m.id === model);
+  const modeId =
+    saved?.modeId && entry.modes.some((m) => m.id === saved.modeId)
+      ? saved.modeId
+      : base.modeId;
+
+  const thinkingOptions = selectedModel?.thinkingOptions ?? [];
+  const thinkingOptionId =
+    saved?.thinkingOptionId &&
+    thinkingOptions.some((t) => t.id === saved.thinkingOptionId)
+      ? saved.thinkingOptionId
+      : base.thinkingOptionId;
+
+  return { provider: entry.name, model, modeId, thinkingOptionId };
+}
+
+interface PickerProps {
+  label: string;
+  value: string;
+  disabled?: boolean;
+  options: Array<{ id: string; label: string }>;
+  onPick: (id: string) => void;
+  icon?: React.ReactNode;
+}
+
+function CompactPicker({ label, value, disabled, options, onPick, icon }: PickerProps) {
+  const { isMobile } = useViewport();
+  const [open, setOpen] = useState(false);
+  const currentLabel = options.find((o) => o.id === value)?.label ?? (value || label);
+
+  const list = (
+    <div className="py-1">
+      {options.map((o) => (
+        <button
+          key={o.id}
+          type="button"
+          onClick={() => {
+            onPick(o.id);
+            setOpen(false);
+          }}
+          className="w-full text-left flex items-center gap-2 font-mono text-xs px-2 py-1.5 hover:bg-accent rounded"
+        >
+          <Check className={cn('size-3 shrink-0', o.id === value ? 'opacity-100' : 'opacity-0')} />
+          <span className="truncate">{o.label}</span>
+        </button>
+      ))}
+    </div>
+  );
+
+  if (isMobile) {
+    return (
+      <>
+        <button
+          type="button"
+          disabled={disabled}
+          onClick={() => setOpen(true)}
+          aria-label={`${label}: ${currentLabel}`}
+          className="inline-flex items-center justify-center min-h-[44px] min-w-[44px] rounded text-muted-foreground hover:text-foreground disabled:opacity-40"
+        >
+          {icon ?? <Cpu className="size-4" />}
+        </button>
+        <BottomSheet open={open} onClose={() => setOpen(false)} title={label}>
+          <div className="px-2">{list}</div>
+        </BottomSheet>
+      </>
+    );
+  }
+
+  return (
+    <DropdownMenu open={open} onOpenChange={setOpen}>
+      <DropdownMenuTrigger asChild>
+        <button
+          type="button"
+          disabled={disabled}
+          className="text-xs font-mono text-muted-foreground hover:text-foreground flex items-center gap-1 px-1.5 py-0.5 rounded hover:bg-muted/60 disabled:opacity-40 max-w-[140px]"
+        >
+          {icon}
+          <span className="truncate">{currentLabel}</span>
+          <ChevronDown className="size-3 opacity-70 shrink-0" />
+        </button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="start" className="max-h-64 overflow-y-auto min-w-[160px]">
+        {options.map((o) => (
+          <DropdownMenuItem key={o.id} onSelect={() => onPick(o.id)} className="font-mono text-xs">
+            <Check className={cn('size-3 shrink-0', o.id === value ? 'opacity-100' : 'opacity-0')} />
+            {o.label}
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}
+
+interface Props {
+  projectPath?: string;
+  value: AgentSessionConfig;
+  onChange: (next: AgentSessionConfig) => void;
+  onProviderCommandsChange?: (commands: AgentCommand[]) => void;
+}
+
+export function AgentComposerBar({ projectPath, value, onChange, onProviderCommandsChange }: Props) {
+  const allEntries = useProviderSnapshot(projectPath);
+  const entries = useMemo(
+    () => allEntries?.filter((e) => e.installed && e.status !== 'error') ?? null,
+    [allEntries],
+  );
+  const [refreshing, setRefreshing] = useState(false);
+
+  const hydratedRef = useRef(false);
+
+  useEffect(() => {
+    hydratedRef.current = false;
+  }, [projectPath]);
+
+  useEffect(() => {
+    if (!entries?.length || hydratedRef.current) return;
+    hydratedRef.current = true;
+    const prefs = loadPrefs();
+    const entry =
+      entries.find((e) => e.name === value.provider) ??
+      entries.find((e) => e.name === 'boocode') ??
+      entries[0];
+    if (!entry) return;
+    onChange(resolveConfig(entry, prefs));
+  }, [entries, onChange, value.provider]);
+
+  const currentEntry = useMemo(
+    () => entries?.find((e) => e.name === value.provider),
+    [entries, value.provider],
+  );
+
+  const currentModel = useMemo(
+    () => currentEntry?.models.find((m) => m.id === value.model),
+    [currentEntry, value.model],
+  );
+
+  const thinkingOptions = currentModel?.thinkingOptions ?? [];
+
+  useEffect(() => {
+    onProviderCommandsChange?.(currentEntry?.commands ?? []);
+  }, [currentEntry, onProviderCommandsChange]);
+
+  function persist(next: AgentSessionConfig): void {
+    const prefs = loadPrefs();
+    prefs[next.provider] = {
+      model: next.model,
+      modeId: next.modeId,
+      thinkingOptionId: next.thinkingOptionId,
+    };
+    savePrefs(prefs);
+    onChange(next);
+  }
+
+  function pickProvider(name: string): void {
+    const entry = entries?.find((e) => e.name === name);
+    if (!entry) return;
+    persist(resolveConfig(entry, loadPrefs()));
+  }
+
+  function pickModel(model: string): void {
+    const entry = currentEntry;
+    if (!entry) return;
+    const selected = entry.models.find((m) => m.id === model);
+    const thinkingOptionId =
+      selected?.defaultThinkingOptionId ??
+      selected?.thinkingOptions?.find((t) => t.isDefault)?.id ??
+      selected?.thinkingOptions?.[0]?.id ??
+      null;
+    persist({ ...value, model, thinkingOptionId });
+  }
+
+  async function handleRefresh(): Promise<void> {
+    setRefreshing(true);
+    try {
+      await api.coder.refreshProviders();
+      await refreshProviderSnapshot(projectPath);
+    } finally {
+      setRefreshing(false);
+    }
+  }
+
+  if (!entries) {
+    return (
+      <div className="text-xs text-muted-foreground px-2 py-1">Loading agents…</div>
+    );
+  }
+
+  const providerOptions = entries.map((e) => ({ id: e.name, label: e.label }));
+  const modeOptions = (currentEntry?.modes ?? []).map((m) => ({ id: m.id, label: m.label }));
+  const modelOptions = (currentEntry?.models ?? []).map((m) => ({ id: m.id, label: m.label }));
+  const thinkingOpts = thinkingOptions.map((t) => ({ id: t.id, label: t.label }));
+
+  return (
+    <div className="flex flex-wrap items-center gap-1 px-2 py-1 border-b border-border bg-muted/20 shrink-0">
+      <CompactPicker
+        label="Provider"
+        value={value.provider}
+        options={providerOptions}
+        onPick={pickProvider}
+        icon={<Cpu className="size-3 shrink-0" />}
+      />
+      <CompactPicker
+        label="Mode"
+        value={value.modeId ?? ''}
+        disabled={modeOptions.length === 0}
+        options={modeOptions}
+        onPick={(modeId) => persist({ ...value, modeId })}
+        icon={<Shield className="size-3 shrink-0" />}
+      />
+      <CompactPicker
+        label="Model"
+        value={value.model}
+        disabled={modelOptions.length === 0}
+        options={modelOptions}
+        onPick={pickModel}
+      />
+      {thinkingOpts.length > 0 && (
+        <CompactPicker
+          label="Thinking"
+          value={value.thinkingOptionId ?? ''}
+          options={thinkingOpts}
+          onPick={(thinkingOptionId) => persist({ ...value, thinkingOptionId })}
+          icon={<Brain className="size-3 shrink-0" />}
+        />
+      )}
+      <button
+        type="button"
+        onClick={() => void handleRefresh()}
+        disabled={refreshing}
+        className="ml-auto inline-flex items-center justify-center size-7 max-md:min-h-[44px] max-md:min-w-[44px] rounded text-muted-foreground hover:text-foreground disabled:opacity-40"
+        aria-label="Refresh provider list"
+        title="Refresh providers"
+      >
+        <RefreshCw className={cn('size-3.5', refreshing && 'animate-spin')} />
+      </button>
+    </div>
+  );
+}

apps/web/src/components/AgentPicker.tsx

@@ -96,7 +96,7 @@ export function AgentPicker({ projectId, value, onChange }: Props) {
           <ChevronDown className="size-3 opacity-70" />
         </button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="start" className="max-h-80 overflow-y-auto w-72">
+      <DropdownMenuContent align="start" className="max-h-80 overflow-y-auto w-96">
         {error && (
           <div className="px-2 py-1.5 text-xs text-destructive">{error}</div>
         )}
@@ -128,7 +128,7 @@ export function AgentPicker({ projectId, value, onChange }: Props) {
                     <span className="font-medium">{a.name}</span>
                   </div>
                   {a.description && (
-                    <span className="text-muted-foreground pl-[18px] truncate w-full">
+                    <span className="text-muted-foreground pl-[18px] line-clamp-2 w-full">
                       {a.description}
                     </span>
                   )}

apps/web/src/components/AskUserInputCard.tsx

@@ -1,7 +1,6 @@
 import { useMemo, useState } from 'react';
 import { Check } from 'lucide-react';
 import { toast } from 'sonner';
-import { api } from '@/api/client';
 import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
 import { Button } from '@/components/ui/button';
 import type {
@@ -22,6 +21,7 @@ interface Props {
   toolCall: ToolCall;
   toolResult: ToolResult | null;
   chatId: string;
+  apiPrefix?: string;
 }
 
 function parseQuestions(raw: unknown): AskUserQuestion[] {
@@ -63,7 +63,7 @@ function parseAnswerSet(raw: unknown): AskUserAnswerSet | null {
   return { answers };
 }
 
-export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
+export function AskUserInputCard({ toolCall, toolResult, chatId, apiPrefix = '' }: Props) {
   const questions = useMemo(() => parseQuestions(toolCall.args), [toolCall.args]);
 
   if (questions.length === 0) {
@@ -74,9 +74,6 @@ export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
     );
   }
 
-  // Tool result with a non-null output means the answer is already submitted.
-  // The pending sentinel uses output=null, so this branch only triggers after
-  // the real WS tool_result frame lands.
   const answered = toolResult && toolResult.output !== null;
   if (answered) {
     const answerSet = parseAnswerSet(toolResult!.output);
@@ -84,7 +81,7 @@ export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
   }
 
   return (
-    <PendingView questions={questions} toolCallId={toolCall.id} chatId={chatId} />
+    <PendingView questions={questions} toolCallId={toolCall.id} chatId={chatId} apiPrefix={apiPrefix} />
   );
 }
 
@@ -92,10 +89,12 @@ function PendingView({
   questions,
   toolCallId,
   chatId,
+  apiPrefix = '',
 }: {
   questions: AskUserQuestion[];
   toolCallId: string;
   chatId: string;
+  apiPrefix?: string;
 }) {
   // Per-question selections + free text. Selections are option arrays so the
   // multi_select case is uniform; single_select just constrains to length 1.
@@ -133,9 +132,16 @@ function PendingView({
     if (submitting) return;
     setSubmitting(true);
     try {
-      await api.chats.answerUserInput(chatId, toolCallId, answers);
-      // Card stays mounted; the incoming WS tool_result frame will flip it
-      // into AnsweredView via the parent prop change.
+      const url = `${apiPrefix}/api/chats/${chatId}/answer_user_input`;
+      const res = await fetch(url, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ tool_call_id: toolCallId, answers }),
+      });
+      if (!res.ok) {
+        const body = await res.json().catch(() => ({})) as { error?: string; detail?: string };
+        throw new Error(body.detail ?? body.error ?? `HTTP ${res.status}`);
+      }
     } catch (err) {
       toast.error(err instanceof Error ? err.message : 'submit failed');
       setSubmitting(false);

apps/web/src/components/ChatInput.tsx

@@ -23,7 +23,8 @@ import { FileMentionPopover } from '@/components/FileMentionPopover';
 import { DropOverlay } from '@/components/DropOverlay';
 import { AgentPicker } from '@/components/AgentPicker';
 import { ContextBar } from '@/components/ContextBar';
-import { SkillSlashCommand } from '@/components/SkillSlashCommand';
+import { SlashCommandPicker } from '@/components/SlashCommandPicker';
+import { isSlashCommandToken, parseSlashInput, slashQuery } from '@/lib/slash-command';
 import { api } from '@/api/client';
 import type { Message } from '@/api/types';
 import { sessionEvents } from '@/hooks/sessionEvents';
@@ -87,10 +88,8 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, session
   // Batch 9.6: slash-command dropdown. Opens when `/` is the first char of
   // the input and stays open while the input is `/<word>` with no whitespace.
   // Disabled entirely when the caller doesn't pass onSlashCommand.
-  // v1.12 CP7.5: anchorRect was a snapshot taken at open time. SkillSlashCommand
-  // now reads the live textarea rect via inputRef (textareaRef below) so it can
-  // recompute on visualViewport changes (iOS keyboard open/close), so the
-  // anchorRect field is no longer needed in this state.
+  // SlashCommandPicker reads the live textarea rect via inputRef (textareaRef below)
+  // so it can recompute on visualViewport changes (iOS keyboard open/close).
   const [slashState, setSlashState] = useState<{
     query: string;
   } | null>(null);
@@ -168,13 +167,11 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, session
     // input parses to a known skill. Falls through to onSend for unknown
     // slash names (literal text) or when slash dispatch isn't wired.
     if (onSlashCommand && attachments.length === 0 && text.startsWith('/')) {
-      const match = text.match(/^\/(\S+)\s*([\s\S]*)$/);
-      if (match && skillsLookup.has(match[1]!)) {
-        const skillName = match[1]!;
-        const args = (match[2] ?? '').trim();
+      const parsed = parseSlashInput(text);
+      if (parsed && skillsLookup.has(parsed.cmdName)) {
         setBusy(true);
         try {
-          await onSlashCommand(skillName, args);
+          await onSlashCommand(parsed.cmdName, parsed.args);
           setValue('');
           setAttachments([]);
           setSlashState(null);
@@ -268,8 +265,8 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, session
     // slash-prefixed token with no whitespace (i.e. user is still typing the
     // skill name). Hand off to args mode the moment a space appears or the
     // slash leaves position 0.
-    if (onSlashCommand && /^\/[^\s]*$/.test(newValue)) {
-      const query = newValue.slice(1);
+    if (onSlashCommand && isSlashCommandToken(newValue)) {
+      const query = slashQuery(newValue);
       if (!slashState) {
         setSlashState({ query });
       } else if (slashState.query !== query) {
@@ -496,7 +493,7 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, session
 
   function onKeyDown(e: KeyboardEvent<HTMLTextAreaElement>) {
     if (mentionState?.open) return;
-    // SkillSlashCommand owns Arrow/Enter/Tab/Esc via a document listener; let
+    // SlashCommandPicker owns Arrow/Enter/Tab/Esc via a document listener; let
     // it consume them so the textarea doesn't also submit on Enter.
     if (slashState) return;
     // IME safety: never act on Enter while an IME composition is in flight
@@ -658,12 +655,13 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, session
         />
       )}
       {slashState && (
-        <SkillSlashCommand
+        <SlashCommandPicker
           query={slashState.query}
-          skills={skills}
+          items={skills}
           inputRef={textareaRef}
           onSelect={handleSlashSelect}
           onClose={() => setSlashState(null)}
+          emptyLabel="No skills available"
         />
       )}
     </div>

apps/web/src/components/ChatTabBar.tsx

@@ -183,13 +183,13 @@ export function ChatTabBar({
           </DropdownMenuTrigger>
           <DropdownMenuContent align="end" className="min-w-40">
             <DropdownMenuItem onSelect={() => onAddPane('chat')}>
-              <MessageSquare size={14} /> New chat
+              <MessageSquare size={14} /> New BooChat
             </DropdownMenuItem>
             <DropdownMenuItem onSelect={() => onAddPane('terminal')}>
-              <Terminal size={14} /> New terminal
+              <Terminal size={14} /> New BooTerm
             </DropdownMenuItem>
             <DropdownMenuItem onSelect={() => onAddPane('coder')}>
-              <Code size={14} /> New coder
+              <Code size={14} /> New BooCode
             </DropdownMenuItem>
           </DropdownMenuContent>
         </DropdownMenu>

apps/web/src/components/MessageBubble.tsx

@@ -14,6 +14,7 @@ import {
   ContextMenu,
   ContextMenuContent,
   ContextMenuItem,
+  ContextMenuSeparator,
   ContextMenuSub,
   ContextMenuSubContent,
   ContextMenuSubTrigger,
@@ -37,14 +38,15 @@ function useTerminals(): TerminalRegistration[] {
   return list;
 }
 
-// Wrap a message body with a right-click context menu offering "Send to
-// terminal → <pane name>". The submenu is disabled when nothing is selected
-// or no terminal panes are open; clicking a target emits a sendToTerminal
-// event that TerminalPane subscribes to (filtered by pane_id).
+// Wrap a message body with a right-click context menu offering Copy and
+// "Send to terminal → <pane name>". Send is disabled when nothing is
+// selected or no terminal panes are open; clicking a target emits a
+// sendToTerminal event that TerminalPane subscribes to (filtered by pane_id).
 function SendToTerminalMenu({ children }: { children: ReactNode }) {
   const [selection, setSelection] = useState('');
   const terminals = useTerminals();
-  const canSend = selection.length > 0 && terminals.length > 0;
+  const hasSelection = selection.length > 0;
+  const canSend = hasSelection && terminals.length > 0;
 
   return (
     <ContextMenu
@@ -57,6 +59,17 @@ function SendToTerminalMenu({ children }: { children: ReactNode }) {
     >
       <ContextMenuTrigger asChild>{children}</ContextMenuTrigger>
       <ContextMenuContent>
+        <ContextMenuItem
+          disabled={!hasSelection}
+          onSelect={() => {
+            void navigator.clipboard.writeText(selection).catch((err) => {
+              toast.error(err instanceof Error ? err.message : 'copy failed');
+            });
+          }}
+        >
+          Copy
+        </ContextMenuItem>
+        <ContextMenuSeparator />
         <ContextMenuSub>
           <ContextMenuSubTrigger disabled={!canSend}>Send to terminal</ContextMenuSubTrigger>
           <ContextMenuSubContent>

apps/web/src/components/ModelPicker.tsx

@@ -107,7 +107,7 @@ export function ModelPicker({ value, onChange }: Props) {
           <ChevronDown className="size-3 opacity-70" />
         </button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" className="max-h-72 overflow-y-auto">
+      <DropdownMenuContent align="end" className="max-h-72 min-w-[16rem] overflow-y-auto">
         {error && (
           <div className="px-2 py-1.5 text-xs text-destructive">{error}</div>
         )}

apps/web/src/components/NewPaneMenu.tsx

@@ -29,13 +29,13 @@ export function NewPaneMenu({ onAddPane, disabled }: Props) {
       </DropdownMenuTrigger>
       <DropdownMenuContent align="end">
         <DropdownMenuItem onSelect={() => onAddPane('chat')}>
-          <MessageSquare size={14} /> New chat
+          <MessageSquare size={14} /> New BooChat
         </DropdownMenuItem>
         <DropdownMenuItem onSelect={() => onAddPane('terminal')}>
-          <Terminal size={14} /> New terminal
+          <Terminal size={14} /> New BooTerm
         </DropdownMenuItem>
         <DropdownMenuItem onSelect={() => onAddPane('coder')}>
-          <Code size={14} /> New coder
+          <Code size={14} /> New BooCode
         </DropdownMenuItem>
       </DropdownMenuContent>
     </DropdownMenu>

apps/web/src/components/PermissionCard.tsx

@@ -0,0 +1,423 @@
+import { useState } from 'react';
+import { ShieldAlert, MessageCircleQuestion } from 'lucide-react';
+import type { PermissionPrompt } from '@/api/types';
+import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
+import { Button } from '@/components/ui/button';
+import { cn } from '@/lib/utils';
+
+interface Props {
+  prompt: PermissionPrompt;
+  onRespond: (optionId: string | null, updatedInput?: Record<string, unknown>) => void;
+  busy?: boolean;
+}
+
+// ---------------------------------------------------------------------------
+// Question detection — ACP's RequestPermissionRequest carries the tool input
+// in `input`. Claude Code's AskUserQuestion puts { questions: [...] } there.
+// ---------------------------------------------------------------------------
+
+interface Question {
+  question: string;
+  header?: string;
+  options: string[];
+  multiSelect: boolean;
+}
+
+function parseQuestions(input: Record<string, unknown> | undefined): Question[] | null {
+  if (!input) return null;
+  const raw = input.questions;
+  if (!Array.isArray(raw)) return null;
+  const out: Question[] = [];
+  for (const item of raw) {
+    if (!item || typeof item !== 'object') continue;
+    const q = item as { question?: unknown; header?: unknown; options?: unknown; multiSelect?: unknown };
+    if (typeof q.question !== 'string') continue;
+    const opts = Array.isArray(q.options)
+      ? q.options.filter((o): o is string => typeof o === 'string')
+      : [];
+    out.push({
+      question: q.question,
+      header: typeof q.header === 'string' ? q.header : undefined,
+      options: opts,
+      multiSelect: q.multiSelect === true,
+    });
+  }
+  return out.length > 0 ? out : null;
+}
+
+// ---------------------------------------------------------------------------
+// Elicitation detection — ACP's createElicitation carries a JSON Schema in
+// `input.requestedSchema`. For now, render each property as a text input.
+// ---------------------------------------------------------------------------
+
+interface ElicitationField {
+  key: string;
+  title: string;
+  description?: string;
+  type: string;
+  enumValues?: string[];
+}
+
+function parseElicitation(input: Record<string, unknown> | undefined): { message: string; fields: ElicitationField[] } | null {
+  if (!input) return null;
+  const schema = input.requestedSchema;
+  if (!schema || typeof schema !== 'object') return null;
+  const s = schema as Record<string, unknown>;
+  const props = s.properties;
+  if (!props || typeof props !== 'object') return null;
+  const fields: ElicitationField[] = [];
+  for (const [key, val] of Object.entries(props as Record<string, unknown>)) {
+    if (!val || typeof val !== 'object') continue;
+    const p = val as Record<string, unknown>;
+    fields.push({
+      key,
+      title: typeof p.title === 'string' ? p.title : key,
+      description: typeof p.description === 'string' ? p.description : undefined,
+      type: typeof p.type === 'string' ? p.type : 'string',
+      enumValues: Array.isArray(p.enum) ? p.enum.filter((e): e is string => typeof e === 'string') : undefined,
+    });
+  }
+  if (fields.length === 0) return null;
+  return { message: typeof input.message === 'string' ? input.message : '', fields };
+}
+
+export function PermissionCard({ prompt, onRespond, busy }: Props) {
+  const isQuestion = prompt.kind === 'question';
+  const isElicitation = prompt.kind === 'elicitation';
+
+  if (isQuestion) {
+    const questions = parseQuestions(prompt.input);
+    if (questions) {
+      return <QuestionView questions={questions} prompt={prompt} onRespond={onRespond} busy={busy} />;
+    }
+  }
+
+  if (isElicitation) {
+    const elicitation = parseElicitation(prompt.input);
+    if (elicitation) {
+      return <ElicitationView elicitation={elicitation} prompt={prompt} onRespond={onRespond} busy={busy} />;
+    }
+  }
+
+  // Standard tool permission — approve/deny buttons
+  return (
+    <div className="mx-3 my-2 rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-2 text-sm">
+      <div className="flex items-start gap-2">
+        <ShieldAlert className="size-4 text-amber-600 shrink-0 mt-0.5" />
+        <div className="flex-1 min-w-0">
+          <p className="font-medium text-foreground">Permission required</p>
+          {prompt.toolTitle && (
+            <p className="text-xs text-muted-foreground mt-0.5 truncate">{prompt.toolTitle}</p>
+          )}
+          <div className="flex flex-wrap gap-2 mt-2">
+            {prompt.options.map((opt) => (
+              <button
+                key={opt.optionId}
+                type="button"
+                disabled={busy}
+                onClick={() => onRespond(opt.optionId)}
+                className={cn(
+                  'rounded-md border border-input bg-background px-2.5 py-1 text-xs hover:bg-accent',
+                  'max-md:min-h-[44px] disabled:opacity-40',
+                )}
+              >
+                {opt.label}
+              </button>
+            ))}
+            <button
+              type="button"
+              disabled={busy}
+              onClick={() => onRespond(null)}
+              className="rounded-md border border-destructive/40 px-2.5 py-1 text-xs text-destructive hover:bg-destructive/10 max-md:min-h-[44px] disabled:opacity-40"
+            >
+              Deny
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+// ---------------------------------------------------------------------------
+// QuestionView — renders Claude's AskUserQuestion as interactive radio/checkbox
+// ---------------------------------------------------------------------------
+
+function QuestionView({
+  questions,
+  prompt,
+  onRespond,
+  busy,
+}: {
+  questions: Question[];
+  prompt: PermissionPrompt;
+  onRespond: Props['onRespond'];
+  busy?: boolean;
+}) {
+  const [selections, setSelections] = useState<string[][]>(() => questions.map(() => []));
+  const [freeTexts, setFreeTexts] = useState<string[]>(() => questions.map(() => ''));
+  const [submitting, setSubmitting] = useState(false);
+  const disabled = busy || submitting;
+
+  const allComplete = questions.every((_, i) =>
+    selections[i]!.length > 0 || freeTexts[i]!.trim().length > 0,
+  );
+
+  function buildAnswers(): Record<string, string> {
+    const answers: Record<string, string> = {};
+    for (let i = 0; i < questions.length; i++) {
+      const q = questions[i]!;
+      const key = q.question;
+      const selected = selections[i]!;
+      const free = freeTexts[i]!.trim();
+      if (free) {
+        answers[key] = free;
+      } else if (selected.length > 0) {
+        answers[key] = selected.join(', ');
+      }
+    }
+    return answers;
+  }
+
+  function handleSubmit() {
+    if (!allComplete || submitting) return;
+    setSubmitting(true);
+    const answers = buildAnswers();
+    const firstAllow = prompt.options.find((o) =>
+      o.label.toLowerCase().includes('allow') || o.label.toLowerCase().includes('yes'),
+    );
+    onRespond(firstAllow?.optionId ?? prompt.options[0]?.optionId ?? null, {
+      ...prompt.input,
+      answers,
+    });
+  }
+
+  function pickSingle(qIdx: number, option: string) {
+    setSelections((prev) => prev.map((arr, i) => (i === qIdx ? [option] : arr)));
+    if (questions.length === 1 && !freeTexts[0]!.trim()) {
+      setSubmitting(true);
+      const firstAllow = prompt.options.find((o) =>
+        o.label.toLowerCase().includes('allow') || o.label.toLowerCase().includes('yes'),
+      );
+      onRespond(firstAllow?.optionId ?? prompt.options[0]?.optionId ?? null, {
+        ...prompt.input,
+        answers: { [questions[0]!.question]: option },
+      });
+    }
+  }
+
+  function toggleMulti(qIdx: number, option: string) {
+    setSelections((prev) =>
+      prev.map((arr, i) => {
+        if (i !== qIdx) return arr;
+        return arr.includes(option) ? arr.filter((o) => o !== option) : [...arr, option];
+      }),
+    );
+  }
+
+  return (
+    <div className="mx-3 my-2 rounded-lg border bg-muted/20 text-sm">
+      <div className="px-4 py-3 space-y-4">
+        {questions.map((q, i) => (
+          <div key={i} className="space-y-2">
+            {questions.length > 1 && (
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                {q.header ?? `Question ${i + 1}`}
+              </div>
+            )}
+            <div className="font-medium leading-snug">{q.question}</div>
+            {q.options.length > 0 && !q.multiSelect && (
+              <RadioGroup
+                value={selections[i]![0] ?? ''}
+                onValueChange={(v) => pickSingle(i, v)}
+                disabled={disabled}
+                className="gap-1.5"
+              >
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <RadioGroupItem id={id} value={opt} className="mt-0.5" />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </RadioGroup>
+            )}
+            {q.options.length > 0 && q.multiSelect && (
+              <div className="grid gap-1.5">
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  const checked = selections[i]!.includes(opt);
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <input
+                        id={id}
+                        type="checkbox"
+                        checked={checked}
+                        disabled={disabled}
+                        onChange={() => toggleMulti(i, opt)}
+                        className="mt-1 size-3.5 rounded border-input accent-primary"
+                      />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </div>
+            )}
+            <div className="pt-1 space-y-1">
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Or type a custom answer
+              </div>
+              <input
+                type="text"
+                value={freeTexts[i]}
+                disabled={disabled}
+                placeholder="Free text…"
+                onChange={(e) =>
+                  setFreeTexts((prev) => prev.map((t, idx) => (idx === i ? e.target.value : t)))
+                }
+                className="w-full rounded border border-input bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:opacity-60"
+              />
+            </div>
+          </div>
+        ))}
+      </div>
+      {(questions.length > 1 || freeTexts.some((t) => t.trim())) && (
+        <div className="flex justify-between items-center border-t px-4 py-2">
+          <button
+            type="button"
+            disabled={disabled}
+            onClick={() => onRespond(null)}
+            className="text-xs text-destructive hover:underline disabled:opacity-40"
+          >
+            Dismiss
+          </button>
+          <Button
+            type="button"
+            size="sm"
+            disabled={!allComplete || disabled}
+            onClick={handleSubmit}
+          >
+            {submitting ? 'Submitting…' : 'Submit'}
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+}
+
+// ---------------------------------------------------------------------------
+// ElicitationView — renders ACP elicitation forms (JSON Schema-driven)
+// ---------------------------------------------------------------------------
+
+function ElicitationView({
+  elicitation,
+  prompt,
+  onRespond,
+  busy,
+}: {
+  elicitation: { message: string; fields: ElicitationField[] };
+  prompt: PermissionPrompt;
+  onRespond: Props['onRespond'];
+  busy?: boolean;
+}) {
+  const [values, setValues] = useState<Record<string, string>>(() => {
+    const init: Record<string, string> = {};
+    for (const f of elicitation.fields) init[f.key] = '';
+    return init;
+  });
+  const [submitting, setSubmitting] = useState(false);
+  const disabled = busy || submitting;
+
+  const allFilled = elicitation.fields.every((f) => (values[f.key] ?? '').trim().length > 0);
+
+  function handleSubmit() {
+    if (!allFilled || submitting) return;
+    setSubmitting(true);
+    const content: Record<string, unknown> = {};
+    for (const f of elicitation.fields) {
+      const raw = values[f.key]!.trim();
+      if (f.type === 'number' || f.type === 'integer') {
+        content[f.key] = Number(raw);
+      } else if (f.type === 'boolean') {
+        content[f.key] = raw === 'true' || raw === 'yes' || raw === '1';
+      } else {
+        content[f.key] = raw;
+      }
+    }
+    const firstAllow = prompt.options[0];
+    onRespond(firstAllow?.optionId ?? null, content);
+  }
+
+  return (
+    <div className="mx-3 my-2 rounded-lg border bg-muted/20 text-sm">
+      <div className="px-4 py-3 space-y-3">
+        <div className="flex items-start gap-2">
+          <MessageCircleQuestion className="size-4 text-blue-500 shrink-0 mt-0.5" />
+          <p className="font-medium leading-snug">{elicitation.message}</p>
+        </div>
+        {elicitation.fields.map((f) => (
+          <div key={f.key} className="space-y-1">
+            <label className="text-xs font-medium text-muted-foreground">{f.title}</label>
+            {f.description && (
+              <p className="text-[11px] text-muted-foreground/70">{f.description}</p>
+            )}
+            {f.enumValues ? (
+              <RadioGroup
+                value={values[f.key] ?? ''}
+                onValueChange={(v) => setValues((prev) => ({ ...prev, [f.key]: v }))}
+                disabled={disabled}
+                className="gap-1.5"
+              >
+                {f.enumValues.map((opt, j) => {
+                  const id = `e-${f.key}-${j}`;
+                  return (
+                    <label key={j} htmlFor={id} className="flex items-start gap-2 text-sm cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40">
+                      <RadioGroupItem id={id} value={opt} className="mt-0.5" />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </RadioGroup>
+            ) : (
+              <input
+                type={f.type === 'number' || f.type === 'integer' ? 'number' : 'text'}
+                value={values[f.key] ?? ''}
+                disabled={disabled}
+                onChange={(e) => setValues((prev) => ({ ...prev, [f.key]: e.target.value }))}
+                className="w-full rounded border border-input bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:opacity-60"
+              />
+            )}
+          </div>
+        ))}
+      </div>
+      <div className="flex justify-between items-center border-t px-4 py-2">
+        <button
+          type="button"
+          disabled={disabled}
+          onClick={() => onRespond(null)}
+          className="text-xs text-destructive hover:underline disabled:opacity-40"
+        >
+          Dismiss
+        </button>
+        <Button
+          type="button"
+          size="sm"
+          disabled={!allFilled || disabled}
+          onClick={handleSubmit}
+        >
+          {submitting ? 'Submitting…' : 'Submit'}
+        </Button>
+      </div>
+    </div>
+  );
+}

apps/web/src/components/ProjectSidebar.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { NavLink, useLocation, useNavigate } from 'react-router-dom';
-import { ChevronRight, ExternalLink, Folder, MessageSquare, Plus, Settings as SettingsIcon, X } from 'lucide-react';
+import { ChevronRight, ExternalLink, Folder, MessageSquare, Plus, Settings as SettingsIcon, X, Code } from 'lucide-react';
 import { toast } from 'sonner';
 import { Button } from '@/components/ui/button';
 import { sessionEvents } from '@/hooks/sessionEvents';
@@ -26,6 +26,7 @@ import { useViewport } from '@/hooks/useViewport';
 import { usePullToRefresh } from '@/hooks/usePullToRefresh';
 import type { SidebarProject } from '@/api/types';
 import { giteaUrlFor } from '@/lib/projectUrls';
+import { isCoderSessionName } from '@/lib/coder-session';
 import { cn } from '@/lib/utils';
 
 const EXPANDED_KEY = 'boocode.sidebar.expanded';
@@ -382,7 +383,11 @@ export function ProjectSidebar() {
                               to={`/session/${s.id}`}
                               className={`flex items-center gap-2 rounded-md px-2 py-1 text-sm min-w-0 ${rowCls(activeSession === s.id)}`}
                             >
-                              <MessageSquare className="size-3.5 shrink-0 opacity-70" />
+                              {isCoderSessionName(s.name) ? (
+                                <Code className="size-3.5 shrink-0 opacity-70" />
+                              ) : (
+                                <MessageSquare className="size-3.5 shrink-0 opacity-70" />
+                              )}
                               <span className="truncate flex-1" title={s.name}>{s.name}</span>
                               <span className="text-xs text-muted-foreground shrink-0 tabular-nums">
                                 {relTime(s.updated_at)}

apps/web/src/components/ProviderPicker.tsx

@@ -1,178 +0,0 @@
-import { useEffect, useState } from 'react';
-import { Check, ChevronDown, Cpu } from 'lucide-react';
-import { api } from '@/api/client';
-import type { Provider } from '@/api/types';
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from '@/components/ui/dropdown-menu';
-import { BottomSheet } from '@/components/BottomSheet';
-import { useViewport } from '@/hooks/useViewport';
-
-interface Props {
-  provider: string;
-  model: string;
-  onChange: (provider: string, model: string) => void | Promise<void>;
-}
-
-function ProviderModelList({
-  providers,
-  error,
-  currentProvider,
-  currentModel,
-  onPick,
-}: {
-  providers: Provider[] | null;
-  error: string | null;
-  currentProvider: string;
-  currentModel: string;
-  onPick: (provider: string, model: string) => void;
-}) {
-  if (error) {
-    return <div className="px-2 py-1.5 text-xs text-destructive">{error}</div>;
-  }
-  if (providers === null) {
-    return <div className="px-2 py-1.5 text-xs text-muted-foreground">Loading...</div>;
-  }
-
-  const singleProvider = providers.length === 1;
-
-  return (
-    <>
-      {providers.map((p) => (
-        <div key={p.name}>
-          {!singleProvider && (
-            <div className="px-2 pt-2 pb-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/70">
-              {p.label}
-            </div>
-          )}
-          {p.models.map((m) => (
-            <button
-              key={`${p.name}:${m.id}`}
-              type="button"
-              onClick={() => onPick(p.name, m.id)}
-              className="w-full text-left flex items-center gap-2 font-mono text-xs px-2 py-1.5 hover:bg-accent rounded"
-            >
-              <Check
-                className={`size-3 shrink-0 ${
-                  p.name === currentProvider && m.id === currentModel
-                    ? 'opacity-100'
-                    : 'opacity-0'
-                }`}
-              />
-              <span className="truncate">{m.label}</span>
-            </button>
-          ))}
-        </div>
-      ))}
-    </>
-  );
-}
-
-export function ProviderPicker({ provider, model, onChange }: Props) {
-  const { isMobile } = useViewport();
-  const [providers, setProviders] = useState<Provider[] | null>(null);
-  const [error, setError] = useState<string | null>(null);
-  const [open, setOpen] = useState(false);
-
-  useEffect(() => {
-    if (!open || providers !== null) return;
-    api.coder
-      .providers()
-      .then(setProviders)
-      .catch((err) =>
-        setError(err instanceof Error ? err.message : 'failed to load providers'),
-      );
-  }, [open, providers]);
-
-  function handlePick(prov: string, mod: string) {
-    setOpen(false);
-    void onChange(prov, mod);
-  }
-
-  const currentProviderLabel =
-    providers?.find((p) => p.name === provider)?.label ?? provider;
-
-  const triggerText = providers && providers.length > 1
-    ? `${currentProviderLabel} / ${model}`
-    : model;
-
-  if (isMobile) {
-    return (
-      <>
-        <button
-          type="button"
-          onClick={() => setOpen(true)}
-          aria-label={`Provider: ${currentProviderLabel}, Model: ${model}`}
-          title={`${currentProviderLabel} / ${model}`}
-          className="inline-flex items-center justify-center min-h-[44px] min-w-[44px] rounded text-muted-foreground hover:text-foreground"
-        >
-          <Cpu className="size-4" />
-        </button>
-        <BottomSheet open={open} onClose={() => setOpen(false)} title="Provider / Model">
-          <div className="px-2 py-2 space-y-1">
-            <ProviderModelList
-              providers={providers}
-              error={error}
-              currentProvider={provider}
-              currentModel={model}
-              onPick={handlePick}
-            />
-          </div>
-        </BottomSheet>
-      </>
-    );
-  }
-
-  return (
-    <DropdownMenu open={open} onOpenChange={setOpen}>
-      <DropdownMenuTrigger asChild>
-        <button
-          type="button"
-          className="text-xs font-mono text-muted-foreground hover:text-foreground flex items-center gap-1 px-1.5 py-0.5 rounded hover:bg-muted/60 max-w-[260px]"
-        >
-          <span className="truncate">{triggerText}</span>
-          <ChevronDown className="size-3 opacity-70 shrink-0" />
-        </button>
-      </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" className="max-h-80 overflow-y-auto min-w-[200px]">
-        {error && (
-          <div className="px-2 py-1.5 text-xs text-destructive">{error}</div>
-        )}
-        {providers === null && !error && (
-          <div className="px-2 py-1.5 text-xs text-muted-foreground">Loading...</div>
-        )}
-        {providers && providers.map((p) => {
-          const singleProvider = providers.length === 1;
-          return (
-            <div key={p.name}>
-              {!singleProvider && (
-                <div className="px-2 pt-2 pb-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/70 select-none">
-                  {p.label}
-                </div>
-              )}
-              {p.models.map((m) => (
-                <DropdownMenuItem
-                  key={`${p.name}:${m.id}`}
-                  onSelect={() => handlePick(p.name, m.id)}
-                  className="font-mono text-xs"
-                >
-                  <Check
-                    className={`size-3 shrink-0 ${
-                      p.name === provider && m.id === model
-                        ? 'opacity-100'
-                        : 'opacity-0'
-                    }`}
-                  />
-                  {m.label}
-                </DropdownMenuItem>
-              ))}
-            </div>
-          );
-        })}
-      </DropdownMenuContent>
-    </DropdownMenu>
-  );
-}

apps/web/src/components/SessionLandingPage.tsx

@@ -1,8 +1,10 @@
-import { useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { Archive, MessageSquare, Send, ChevronDown, ChevronRight, RotateCcw, Trash2 } from 'lucide-react';
+import { toast } from 'sonner';
 import type { Chat } from '@/api/types';
+import { api } from '@/api/client';
 import { Button } from '@/components/ui/button';
-import { Textarea } from '@/components/ui/textarea';
+import { ChatInput } from '@/components/ChatInput';
 import {
   ContextMenu,
   ContextMenuContent,
@@ -25,6 +27,8 @@ interface Props {
   chats: Chat[];
   onOpenChat: (chatId: string) => void;
   onSend: (content: string) => void;
+  /** Create a chat and return its id. Used by slash-command handler. */
+  createChat: () => Promise<{ id: string }>;
   onReopenChat: (chatId: string) => Promise<void>;
   onArchiveChat: (chatId: string) => Promise<void>;
   onRenameChat: (chatId: string, name: string) => Promise<void>;
@@ -153,12 +157,15 @@ export function SessionLandingPage({
   chats,
   onOpenChat,
   onSend,
+  projectId,
+  createChat,
   onReopenChat,
   onArchiveChat,
   onRenameChat,
   onDeleteChat,
 }: Props) {
   const [composerValue, setComposerValue] = useState('');
+  const [chatId, setChatId] = useState<string | null>(null);
   const [showArchived, setShowArchived] = useState(false);
   const [renamingId, setRenamingId] = useState<string | null>(null);
   const [renameValue, setRenameValue] = useState('');
@@ -172,13 +179,43 @@ export function SessionLandingPage({
     .filter((c) => c.status === 'archived')
     .sort((a, b) => new Date(b.updated_at).getTime() - new Date(a.updated_at).getTime());
 
-  function handleSend() {
+  // Create a chat lazily on first send or slash command.
+  const ensureChat = useCallback(async (): Promise<string> => {
+    if (chatId) return chatId;
+    try {
+      const chat = await createChat();
+      setChatId(chat.id);
+      return chat.id;
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'Failed to create chat');
+      throw err;
+    }
+  }, [chatId, createChat]);
+
+  async function handleSend() {
     const text = composerValue.trim();
     if (!text) return;
-    onSend(text);
-    setComposerValue('');
+    try {
+      const cid = await ensureChat();
+      onSend(text);
+      setComposerValue('');
+    } catch {
+      // Error already surfaced via toast.
+    }
   }
 
+  // v2.3: slash-command dispatch on landing page. Creates a chat first if
+  // one doesn't exist, then invokes the skill on that chat.
+  const handleSlashCommand = useCallback(async (skillName: string, userMessage: string) => {
+    try {
+      const cid = await ensureChat();
+      await api.chats.skillInvoke(cid, skillName, userMessage.length > 0 ? userMessage : null);
+      setComposerValue('');
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : `/${skillName} failed`);
+    }
+  }, [ensureChat]);
+
   function startRename(chat: Chat) {
     setRenamingId(chat.id);
     setRenameValue(chat.name ?? '');
@@ -293,33 +330,17 @@ export function SessionLandingPage({
         )}
       </div>
 
-      <div className="border-t px-4 py-3 flex items-end gap-2 shrink-0">
-        <Textarea
-          value={composerValue}
-          onChange={(e) => setComposerValue(e.target.value)}
-          onKeyDown={(e) => {
-            if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {
-              e.preventDefault();
-              handleSend();
-              return;
-            }
-            if (e.key === 'Enter' && !e.shiftKey) {
-              e.preventDefault();
-              handleSend();
-            }
-          }}
-          placeholder="Start a new chat..."
-          rows={2}
-          className="resize-none min-h-[52px] max-h-[160px]"
+      {/* v2.3: ChatInput with slash-command support replaces the bare Textarea.
+          chatId is created lazily on first send/slash. */}
+      <div className="border-t px-4 py-3 shrink-0">
+        <ChatInput
+          projectId={projectId}
+          onSend={handleSend}
+          onSlashCommand={handleSlashCommand}
+          chatId={chatId ?? undefined}
+          chatLabel={chatId ? undefined : 'Chat'}
+          disabled={false}
         />
-        <Button
-          onClick={handleSend}
-          disabled={!composerValue.trim()}
-          size="icon-lg"
-          aria-label="Send"
-        >
-          <Send />
-        </Button>
       </div>
 
       <Dialog open={archiveConfirm !== null} onOpenChange={(open) => { if (!open) setArchiveConfirm(null); }}>

apps/web/src/components/SkillSlashCommand.tsx

@@ -1,221 +0,0 @@
-import { useEffect, useMemo, useRef, useState } from 'react';
-import type { CSSProperties, RefObject } from 'react';
-import { createPortal } from 'react-dom';
-import { cn } from '@/lib/utils';
-import type { Skill } from '@/api/types';
-
-interface Props {
-  query: string;
-  skills: Skill[];
-  // v1.12 CP7.5: was `anchorRect: {top, left}` (snapshot at open time). Now a
-  // live ref so the dropdown can re-stat the input on visualViewport events —
-  // critical on iOS where the keyboard shifts the visual viewport and the
-  // dropdown would otherwise sit in the wrong place (often hidden).
-  inputRef: RefObject<HTMLElement | null>;
-  onSelect: (skillName: string) => void;
-  onClose: () => void;
-}
-
-// max-h-[320px] on the popover — use as the height budget for above/below
-// fit decisions. Slightly under-estimates when the list is short, but the
-// only consequence is we sometimes flip below when we'd fit above; no UX
-// breakage either way.
-const DROPDOWN_HEIGHT_BUDGET = 320;
-
-// Batch 9.6: slash-command dropdown. Models FileMentionPopover's pattern —
-// fixed-positioned popover, keyboard nav, click-outside-to-close. shadcn
-// `Command` (cmdk) isn't installed in this project; per the addendum we use
-// a plain div + Tailwind instead of pulling a new primitive autonomously.
-//
-// v1.12 CP7.5: portalled to document.body (escapes transformed/will-change
-// ancestor stacking contexts that hid the popover inside ChatInput on iOS)
-// + visualViewport-aware positioning (handles keyboard open/close + the iOS
-// "shift layout to keep input visible" auto-scroll).
-
-// Case-insensitive prefix match on `name` only. Description is display-only
-// in v1 (substring search across description is deferred to a polish batch).
-function filterByPrefix(skills: Skill[], query: string): Skill[] {
-  const q = query.toLowerCase();
-  const filtered = q
-    ? skills.filter((s) => s.name.toLowerCase().startsWith(q))
-    : skills;
-  // Stable alphabetical ordering matches the server's cache order (skills.ts
-  // sorts on name asc) but we re-sort here so a stale client cache doesn't
-  // surprise the user.
-  return [...filtered].sort((a, b) => a.name.localeCompare(b.name));
-}
-
-export function SkillSlashCommand({ query, skills, inputRef, onSelect, onClose }: Props) {
-  const [highlightIndex, setHighlightIndex] = useState(0);
-  const popoverRef = useRef<HTMLDivElement>(null);
-  const filtered = useMemo(() => filterByPrefix(skills, query), [skills, query]);
-
-  // Anchor + viewport tracking. `rect` is the input's bounding rect in layout
-  // viewport coords. `vvTick` forces a re-render whenever visualViewport
-  // changes even if the rect itself didn't (e.g. user scrolled the visual
-  // viewport without the input moving in layout space).
-  const [rect, setRect] = useState<DOMRect | null>(
-    () => inputRef.current?.getBoundingClientRect() ?? null,
-  );
-  const [vvTick, setVvTick] = useState(0);
-
-  useEffect(() => { setHighlightIndex(0); }, [query]);
-
-  // v1.12 CP7.5: recalc on viewport changes. iOS Safari fires
-  // visualViewport.resize when the soft keyboard opens/closes; .scroll fires
-  // when the page is shifted to keep the focused input visible above the
-  // keyboard. Both events should trigger a position recompute.
-  useEffect(() => {
-    function recalc() {
-      setRect(inputRef.current?.getBoundingClientRect() ?? null);
-      setVvTick((t) => t + 1);
-    }
-    recalc();
-    const vv = window.visualViewport;
-    vv?.addEventListener('resize', recalc);
-    vv?.addEventListener('scroll', recalc);
-    window.addEventListener('resize', recalc);
-    return () => {
-      vv?.removeEventListener('resize', recalc);
-      vv?.removeEventListener('scroll', recalc);
-      window.removeEventListener('resize', recalc);
-    };
-  }, [inputRef]);
-
-  // Arrow / Enter / Tab / Escape. Bound on document so keystrokes from the
-  // textarea reach the popover even though focus stays in the textarea.
-  useEffect(() => {
-    function handleKeyDown(e: KeyboardEvent) {
-      if (e.key === 'ArrowDown') {
-        e.preventDefault();
-        setHighlightIndex((prev) => (prev < filtered.length - 1 ? prev + 1 : 0));
-      } else if (e.key === 'ArrowUp') {
-        e.preventDefault();
-        setHighlightIndex((prev) => (prev > 0 ? prev - 1 : filtered.length - 1));
-      } else if (e.key === 'Enter' || e.key === 'Tab') {
-        if (filtered.length === 0) return;
-        e.preventDefault();
-        const target = filtered[highlightIndex] ?? filtered[0];
-        if (target) onSelect(target.name);
-      } else if (e.key === 'Escape') {
-        e.preventDefault();
-        onClose();
-      }
-    }
-    document.addEventListener('keydown', handleKeyDown);
-    return () => document.removeEventListener('keydown', handleKeyDown);
-  }, [filtered, highlightIndex, onSelect, onClose]);
-
-  useEffect(() => {
-    function handleMouseDown(e: MouseEvent) {
-      if (popoverRef.current && !popoverRef.current.contains(e.target as Node)) {
-        onClose();
-      }
-    }
-    document.addEventListener('mousedown', handleMouseDown);
-    return () => document.removeEventListener('mousedown', handleMouseDown);
-  }, [onClose]);
-
-  useEffect(() => {
-    const el = popoverRef.current?.querySelector('[data-highlighted="true"]');
-    if (el) el.scrollIntoView({ block: 'nearest' });
-  }, [highlightIndex]);
-
-  // v1.12 CP7.5: visualViewport-corrected positioning. getBoundingClientRect
-  // returns layout-viewport coords; iOS Safari's `position: fixed` positions
-  // relative to the layout viewport too — but the visible area can be offset
-  // (vv.offsetTop/offsetLeft) when iOS scrolls the input above the keyboard.
-  // Subtracting the vv offsets keeps the dropdown locked to the input's
-  // visual position. vvTick is in the dep list to force recompute on
-  // visualViewport events even when the rect itself didn't change.
-  //
-  // Default: position above the input (matches original UX). Flip below if
-  // above doesn't fit (input too close to top of visible viewport). When
-  // below would overlap the keyboard, cap top so the dropdown stays visible.
-  const style = useMemo<CSSProperties>(() => {
-    if (!rect) return { display: 'none' };
-    const vv = window.visualViewport;
-    const vvOffsetTop = vv?.offsetTop ?? 0;
-    const vvOffsetLeft = vv?.offsetLeft ?? 0;
-    const vvHeight = vv?.height ?? window.innerHeight;
-
-    const anchorTop = rect.top - vvOffsetTop;
-    const anchorBottom = rect.bottom - vvOffsetTop;
-    const left = rect.left - vvOffsetLeft;
-
-    const fitsAbove = anchorTop >= DROPDOWN_HEIGHT_BUDGET;
-    if (fitsAbove) {
-      // translate(-100%) on Y so the dropdown grows upward from anchorTop.
-      return {
-        position: 'fixed',
-        top: anchorTop,
-        left,
-        transform: 'translateY(-100%)',
-      };
-    }
-    // Render below; clamp so the bottom edge stays inside the visible viewport.
-    const maxTop = Math.max(0, vvHeight - DROPDOWN_HEIGHT_BUDGET);
-    return {
-      position: 'fixed',
-      top: Math.min(anchorBottom, maxTop),
-      left,
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [rect, vvTick]);
-
-  const popover = filtered.length === 0 ? (
-    <div
-      ref={popoverRef}
-      className="z-50 bg-popover border border-border rounded-md shadow min-w-[320px] p-2"
-      style={style}
-    >
-      <div className="text-xs text-muted-foreground px-2 py-1">
-        {query ? `No skill starts with "/${query}"` : 'No skills available'}
-      </div>
-    </div>
-  ) : (
-    <div
-      ref={popoverRef}
-      className="z-50 bg-popover border border-border rounded-md shadow min-w-[320px] max-w-[420px] max-h-[320px] overflow-y-auto"
-      style={style}
-    >
-      {filtered.map((skill, i) => (
-        <button
-          key={skill.name}
-          type="button"
-          data-highlighted={i === highlightIndex}
-          className={cn(
-            'w-full text-left px-2.5 py-2 cursor-pointer block',
-            i === highlightIndex && 'bg-muted',
-          )}
-          onMouseEnter={() => setHighlightIndex(i)}
-          onMouseDown={(e) => {
-            // mousedown not click — click runs after blur/focus shuffles which
-            // can race with the textarea's onBlur close path.
-            e.preventDefault();
-            onSelect(skill.name);
-          }}
-        >
-          <div className="font-mono text-xs font-bold text-foreground">/{skill.name}</div>
-          <div
-            className="text-xs text-muted-foreground overflow-hidden"
-            style={{
-              display: '-webkit-box',
-              WebkitLineClamp: 2,
-              WebkitBoxOrient: 'vertical',
-            }}
-          >
-            {skill.description}
-          </div>
-        </button>
-      ))}
-    </div>
-  );
-
-  // v1.12 CP7.5: portal to document.body to escape ChatInput's stacking
-  // context. The original render-in-place rendered the dropdown inside the
-  // composer's transformed/will-change ancestor tree, which on iOS Safari +
-  // Vivaldi caused the popover to either disappear or sit at z-index 0
-  // behind the autofill toolbar. document.body has no transform ancestor.
-  return createPortal(popover, document.body);
-}

apps/web/src/components/SlashCommandPicker.tsx

@@ -0,0 +1,181 @@
+import { useEffect, useMemo, useRef, useState } from 'react';
+import type { CSSProperties, RefObject } from 'react';
+import { createPortal } from 'react-dom';
+import { cn } from '@/lib/utils';
+
+export interface SlashCommandItem {
+  name: string;
+  description?: string;
+}
+
+interface Props {
+  query: string;
+  items: SlashCommandItem[];
+  inputRef: RefObject<HTMLElement | null>;
+  onSelect: (name: string) => void;
+  onClose: () => void;
+  emptyLabel?: string;
+}
+
+const DROPDOWN_HEIGHT_BUDGET = 320;
+
+function filterByPrefix(items: SlashCommandItem[], query: string): SlashCommandItem[] {
+  const q = query.toLowerCase();
+  const filtered = q ? items.filter((s) => s.name.toLowerCase().startsWith(q)) : items;
+  return [...filtered].sort((a, b) => a.name.localeCompare(b.name));
+}
+
+export function SlashCommandPicker({
+  query,
+  items,
+  inputRef,
+  onSelect,
+  onClose,
+  emptyLabel = 'No commands available',
+}: Props) {
+  const [highlightIndex, setHighlightIndex] = useState(0);
+  const popoverRef = useRef<HTMLDivElement>(null);
+  const filtered = useMemo(() => filterByPrefix(items, query), [items, query]);
+
+  const [rect, setRect] = useState<DOMRect | null>(
+    () => inputRef.current?.getBoundingClientRect() ?? null,
+  );
+  const [vvTick, setVvTick] = useState(0);
+
+  useEffect(() => { setHighlightIndex(0); }, [query]);
+
+  useEffect(() => {
+    function recalc() {
+      setRect(inputRef.current?.getBoundingClientRect() ?? null);
+      setVvTick((t) => t + 1);
+    }
+    recalc();
+    const vv = window.visualViewport;
+    vv?.addEventListener('resize', recalc);
+    vv?.addEventListener('scroll', recalc);
+    window.addEventListener('resize', recalc);
+    return () => {
+      vv?.removeEventListener('resize', recalc);
+      vv?.removeEventListener('scroll', recalc);
+      window.removeEventListener('resize', recalc);
+    };
+  }, [inputRef]);
+
+  useEffect(() => {
+    function handleKeyDown(e: KeyboardEvent) {
+      if (e.key === 'ArrowDown') {
+        e.preventDefault();
+        setHighlightIndex((prev) => (prev < filtered.length - 1 ? prev + 1 : 0));
+      } else if (e.key === 'ArrowUp') {
+        e.preventDefault();
+        setHighlightIndex((prev) => (prev > 0 ? prev - 1 : filtered.length - 1));
+      } else if (e.key === 'Enter' || e.key === 'Tab') {
+        if (filtered.length === 0) return;
+        e.preventDefault();
+        const target = filtered[highlightIndex] ?? filtered[0];
+        if (target) onSelect(target.name);
+      } else if (e.key === 'Escape') {
+        e.preventDefault();
+        onClose();
+      }
+    }
+    document.addEventListener('keydown', handleKeyDown);
+    return () => document.removeEventListener('keydown', handleKeyDown);
+  }, [filtered, highlightIndex, onSelect, onClose]);
+
+  useEffect(() => {
+    function handleMouseDown(e: MouseEvent) {
+      if (popoverRef.current && !popoverRef.current.contains(e.target as Node)) {
+        onClose();
+      }
+    }
+    document.addEventListener('mousedown', handleMouseDown);
+    return () => document.removeEventListener('mousedown', handleMouseDown);
+  }, [onClose]);
+
+  useEffect(() => {
+    const el = popoverRef.current?.querySelector('[data-highlighted="true"]');
+    if (el) el.scrollIntoView({ block: 'nearest' });
+  }, [highlightIndex]);
+
+  const style = useMemo<CSSProperties>(() => {
+    if (!rect) return { display: 'none' };
+    const vv = window.visualViewport;
+    const vvOffsetTop = vv?.offsetTop ?? 0;
+    const vvHeight = vv?.height ?? window.innerHeight;
+    // Visible region in layout-viewport coords (what position:fixed uses)
+    const visibleTop = vvOffsetTop;
+    const visibleBottom = vvOffsetTop + vvHeight;
+
+    const spaceAbove = rect.top - visibleTop;
+    const spaceBelow = visibleBottom - rect.bottom;
+
+    if (spaceAbove >= Math.min(DROPDOWN_HEIGHT_BUDGET, spaceBelow)) {
+      // Place above: clamp to visible top
+      const popupTop = Math.max(visibleTop, rect.top - DROPDOWN_HEIGHT_BUDGET);
+      return {
+        position: 'fixed',
+        top: popupTop,
+        left: rect.left,
+        maxHeight: rect.top - popupTop,
+      };
+    }
+    // Place below: clamp to visible bottom
+    return {
+      position: 'fixed',
+      top: rect.bottom,
+      left: rect.left,
+      maxHeight: Math.min(DROPDOWN_HEIGHT_BUDGET, visibleBottom - rect.bottom),
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [rect, vvTick]);
+
+  const popover = filtered.length === 0 ? (
+    <div
+      ref={popoverRef}
+      className="z-50 bg-popover border border-border rounded-md shadow min-w-[320px] p-2"
+      style={style}
+    >
+      <div className="text-xs text-muted-foreground px-2 py-1">
+        {query ? `No command starts with "/${query}"` : emptyLabel}
+      </div>
+    </div>
+  ) : (
+    <div
+      ref={popoverRef}
+      className="z-50 bg-popover border border-border rounded-md shadow min-w-[320px] max-w-[420px] max-h-[320px] overflow-y-auto overscroll-contain touch-pan-y"
+      style={style}
+    >
+      {filtered.map((item, i) => (
+        <div
+          key={item.name}
+          role="option"
+          aria-selected={i === highlightIndex}
+          data-highlighted={i === highlightIndex}
+          className={cn(
+            'w-full text-left px-2.5 py-2 cursor-pointer block',
+            i === highlightIndex && 'bg-muted',
+          )}
+          onMouseEnter={() => setHighlightIndex(i)}
+          onClick={() => onSelect(item.name)}
+        >
+          <div className="font-mono text-xs font-bold text-foreground">/{item.name}</div>
+          {item.description && (
+            <div
+              className="text-xs text-muted-foreground overflow-hidden"
+              style={{
+                display: '-webkit-box',
+                WebkitLineClamp: 2,
+                WebkitBoxOrient: 'vertical',
+              }}
+            >
+              {item.description}
+            </div>
+          )}
+        </div>
+      ))}
+    </div>
+  );
+
+  return createPortal(popover, document.body);
+}

apps/web/src/components/Workspace.tsx

@@ -1,7 +1,8 @@
 import { useEffect, useMemo, useState } from 'react';
-import { PanelRight, MessageSquare, Terminal, Code, Clipboard, Plus, X } from 'lucide-react';
+import { MessageSquare, Terminal, Code, Clipboard, Plus, X } from 'lucide-react';
+import { api } from '@/api/client';
 import type { Chat, Project, Session, WorkspacePane } from '@/api/types';
-import { MAX_PANES, type UseWorkspacePanesResult } from '@/hooks/useWorkspacePanes';
+import { MAX_PANES, activePaneChatId, type UseWorkspacePanesResult } from '@/hooks/useWorkspacePanes';
 import type { UseSessionChatsResult } from '@/hooks/useSessionChats';
 import { useViewport } from '@/hooks/useViewport';
 import { terminalsRegistry } from '@/lib/events';
@@ -34,6 +35,8 @@ interface Props {
   // v1.9: passed through to SettingsPane when one is mounted in the grid.
   session: Session;
   project: Project | null;
+  /** New BooCode opens a fresh coder session; chat/terminal split in-place. */
+  onAddPane: (kind: 'chat' | 'terminal' | 'coder') => void;
 }
 
 export function Workspace({
@@ -45,6 +48,7 @@ export function Workspace({
   chatsHook,
   session,
   project,
+  onAddPane,
 }: Props) {
   const {
     panes,
@@ -59,6 +63,7 @@ export function Workspace({
     showLandingPage,
     addSplitPane,
     removePane,
+    isPaneChatPending,
     handlePaneDragStart,
     handlePaneDragOver,
     handlePaneDragLeave,
@@ -134,44 +139,11 @@ export function Workspace({
     return out;
   }, [panes]);
 
+  // Per-coder-pane WS connection (status dot lives in the pane header).
+  const [coderConnected, setCoderConnected] = useState<Record<string, boolean>>({});
+
   return (
     <div className="flex flex-col h-full min-h-0">
-      {!isMobile && (
-        <div className="flex items-center gap-2 border-b border-border bg-muted/20 px-3 py-1.5 shrink-0">
-          <DropdownMenu>
-            <DropdownMenuTrigger asChild>
-              <button
-                type="button"
-                // v1.9: settings panes excluded from the MAX cap (decision c).
-                disabled={panes.filter((p) => p.kind !== 'settings').length >= MAX_PANES}
-                className={cn(
-                  'flex items-center gap-1 text-xs px-2 py-1 rounded hover:bg-muted',
-                  panes.filter((p) => p.kind !== 'settings').length >= MAX_PANES &&
-                    'opacity-40 cursor-not-allowed hover:bg-transparent'
-                )}
-              >
-                <PanelRight size={14} />
-                Split
-              </button>
-            </DropdownMenuTrigger>
-            <DropdownMenuContent>
-              <DropdownMenuItem onSelect={() => addSplitPane('chat')}>
-                <MessageSquare size={14} /> Chat
-              </DropdownMenuItem>
-              <DropdownMenuItem onSelect={() => addSplitPane('terminal')}>
-                <Terminal size={14} /> Terminal
-              </DropdownMenuItem>
-              <DropdownMenuItem onSelect={() => addSplitPane('coder')}>
-                <Code size={14} /> Coder
-              </DropdownMenuItem>
-            </DropdownMenuContent>
-          </DropdownMenu>
-        </div>
-      )}
-
-      {/* v1.8: mobile multi-pane SwipeablePaneTab strip removed; the header
-          pill (MobileTabSwitcher) is the mobile pane switcher. */}
-
       <div
         className={cn('flex-1 min-h-0', isMobile ? 'flex' : 'grid')}
         style={
@@ -185,6 +157,7 @@ export function Workspace({
         {panes.map((pane, idx) => {
           const isSettings = pane.kind === 'settings';
           const isTerminal = pane.kind === 'terminal';
+          const isCoder = pane.kind === 'coder';
           const isArtifact = pane.kind === 'markdown_artifact' || pane.kind === 'html_artifact';
           // v1.9: when maximized, hide every pane except the settings one.
           // display:none keeps the React tree mounted so streams / drafts
@@ -197,9 +170,8 @@ export function Workspace({
             }
             return null;
           }
-          // Terminal panes own their tab strip (no chats, no ChatTabBar) and
-          // are not drag-reorderable for now — keeps the layout grid simple.
-          const isChromeless = isSettings || isTerminal || isArtifact;
+          // Terminal + coder panes own their tab strip (no chats, no ChatTabBar).
+          const isChromeless = isSettings || isTerminal || isCoder || isArtifact;
           return (
           <div
             key={pane.id}
@@ -233,13 +205,66 @@ export function Workspace({
                   onCloseAll={() => closeAllTabs(idx)}
                   onAddPane={(kind) => {
                     if (kind === 'chat') void createChat(idx);
-                    else addSplitPane(kind);
+                    else onAddPane(kind);
                   }}
                   onShowHistory={() => showLandingPage(idx)}
                   onRename={renameChat}
                   onRemovePane={panes.length > 1 ? () => removePane(idx) : undefined}
                 />
               )}
+              {isCoder && (
+                <div className="flex items-center gap-2 border-b border-border bg-muted/30 px-2 py-1 shrink-0">
+                  <Code size={12} className="text-muted-foreground" />
+                  <span className="text-xs text-muted-foreground">BooCode</span>
+                  <div className="ml-auto flex items-center gap-1.5">
+                    <DropdownMenu>
+                      <DropdownMenuTrigger asChild>
+                        <button
+                          type="button"
+                          onClick={(e) => e.stopPropagation()}
+                          className="inline-flex items-center justify-center size-5 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:size-7"
+                          aria-label="New pane"
+                          title="New pane"
+                        >
+                          <Plus size={12} />
+                        </button>
+                      </DropdownMenuTrigger>
+                      <DropdownMenuContent align="end" className="min-w-40">
+                        <DropdownMenuItem onSelect={() => onAddPane('chat')}>
+                          <MessageSquare size={14} /> New BooChat
+                        </DropdownMenuItem>
+                        <DropdownMenuItem onSelect={() => onAddPane('terminal')}>
+                          <Terminal size={14} /> New BooTerm
+                        </DropdownMenuItem>
+                        <DropdownMenuItem onSelect={() => onAddPane('coder')}>
+                          <Code size={14} /> New BooCode
+                        </DropdownMenuItem>
+                      </DropdownMenuContent>
+                    </DropdownMenu>
+                    <span
+                      className={cn(
+                        'inline-block w-1.5 h-1.5 rounded-full shrink-0',
+                        coderConnected[pane.id] ? 'bg-green-500' : 'bg-red-500',
+                      )}
+                      title={coderConnected[pane.id] ? 'Connected' : 'Disconnected'}
+                    />
+                    {panes.length > 1 && (
+                      <button
+                        type="button"
+                        onClick={(e) => {
+                          e.stopPropagation();
+                          removePane(idx);
+                        }}
+                        className="inline-flex items-center justify-center size-5 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:size-7"
+                        aria-label="Close BooCode pane"
+                        title="Close BooCode pane"
+                      >
+                        <X size={12} />
+                      </button>
+                    )}
+                  </div>
+                </div>
+              )}
               {isTerminal && (
                 <div className="flex items-center gap-2 border-b border-border bg-muted/30 px-2 py-1 shrink-0">
                   <Terminal size={12} className="text-muted-foreground" />
@@ -259,14 +284,14 @@ export function Workspace({
                       </button>
                     </DropdownMenuTrigger>
                     <DropdownMenuContent align="end" className="min-w-40">
-                      <DropdownMenuItem onSelect={() => addSplitPane('chat')}>
-                        <MessageSquare size={14} /> New chat
+                      <DropdownMenuItem onSelect={() => onAddPane('chat')}>
+                        <MessageSquare size={14} /> New BooChat
                       </DropdownMenuItem>
-                      <DropdownMenuItem onSelect={() => addSplitPane('terminal')}>
-                        <Terminal size={14} /> New terminal
+                      <DropdownMenuItem onSelect={() => onAddPane('terminal')}>
+                        <Terminal size={14} /> New BooTerm
                       </DropdownMenuItem>
-                      <DropdownMenuItem onSelect={() => addSplitPane('coder')}>
-                        <Code size={14} /> New coder
+                      <DropdownMenuItem onSelect={() => onAddPane('coder')}>
+                        <Code size={14} /> New BooCode
                       </DropdownMenuItem>
                     </DropdownMenuContent>
                   </DropdownMenu>
@@ -323,7 +348,18 @@ export function Workspace({
                   active={idx === activePaneIdx}
                 />
               ) : pane.kind === 'coder' ? (
-                <CoderPane sessionId={sessionId} />
+                <CoderPane
+                  sessionId={sessionId}
+                  paneId={pane.id}
+                  chatId={activePaneChatId(pane)}
+                  chatPending={isPaneChatPending(pane.id)}
+                  projectPath={project?.path}
+                  onConnectedChange={(connected) =>
+                    setCoderConnected((prev) =>
+                      prev[pane.id] === connected ? prev : { ...prev, [pane.id]: connected },
+                    )
+                  }
+                />
               ) : pane.kind === 'markdown_artifact' && pane.markdown_artifact_state ? (
                 <MarkdownArtifactPane
                   chatId={pane.markdown_artifact_state.chat_id}
@@ -351,6 +387,7 @@ export function Workspace({
                   sessionId={sessionId}
                   projectId={projectId}
                   chats={chats}
+                  createChat={() => api.chats.create(sessionId)}
                   onOpenChat={(chatId) => openChatInPane(idx, chatId)}
                   onSend={(content) => void handleLandingSend(idx, content)}
                   onReopenChat={async (chatId) => {

apps/web/src/components/panes/CoderMessageList.tsx

@@ -0,0 +1,246 @@
+import { useCallback, useEffect, useMemo, useRef, type ReactNode } from 'react';
+import { MarkdownRenderer } from '@/components/MarkdownRenderer';
+import { ToolCallGroup } from '@/components/ToolCallGroup';
+import { ToolCallLine, type ToolRun } from '@/components/ToolCallLine';
+import { AskUserInputCard } from '@/components/AskUserInputCard';
+import { wireToolCallToRun, type CoderToolCallWire } from '@/lib/coder-tools';
+
+export interface CoderMessageWire {
+  id: string;
+  role: 'user' | 'assistant' | 'system';
+  content: string;
+  status?: 'streaming' | 'complete' | 'failed';
+  reasoning_text?: string;
+  tool_calls?: CoderToolCallWire[];
+}
+
+export interface CoderToolMessageWire {
+  id: string;
+  role: 'tool';
+  tool_results: {
+    tool_call_id: string;
+    output: unknown;
+    truncated?: boolean;
+    error?: string;
+  };
+}
+
+export type CoderTimelineWire = CoderMessageWire | CoderToolMessageWire;
+
+function isToolMessage(m: CoderTimelineWire): m is CoderToolMessageWire {
+  return m.role === 'tool';
+}
+
+type RenderItem =
+  | { kind: 'message'; message: CoderMessageWire }
+  | { kind: 'tool_run'; run: ToolRun; key: string }
+  | { kind: 'tool_group'; runs: ToolRun[]; key: string };
+
+const GROUP_THRESHOLD = 3;
+const SCROLL_THRESHOLD_PX = 150;
+
+function flattenCoderMessages(messages: CoderTimelineWire[]): RenderItem[] {
+  const items: RenderItem[] = [];
+  const runsByCallId = new Map<string, ToolRun>();
+
+  for (const m of messages) {
+    if (isToolMessage(m)) {
+      const run = runsByCallId.get(m.tool_results.tool_call_id);
+      if (run) {
+        run.result = {
+          tool_call_id: m.tool_results.tool_call_id,
+          output: m.tool_results.output,
+          truncated: m.tool_results.truncated ?? false,
+          ...(m.tool_results.error ? { error: m.tool_results.error } : {}),
+        };
+      }
+      continue;
+    }
+
+    if (m.role === 'user' || m.role === 'system') {
+      items.push({ kind: 'message', message: m });
+      continue;
+    }
+
+    const hasToolCalls = (m.tool_calls?.length ?? 0) > 0;
+    const hasText = m.content.trim().length > 0;
+    const hasReasoning = (m.reasoning_text?.trim().length ?? 0) > 0;
+    // External agents persist tool calls + final answer on one row. Render tools
+    // before the answer text so the timeline matches BooChat (tools, then reply).
+    const externalCombined = hasToolCalls && (hasText || hasReasoning);
+
+    if (externalCombined) {
+      if (hasReasoning) {
+        items.push({
+          kind: 'message',
+          message: { ...m, content: '', reasoning_text: m.reasoning_text },
+        });
+      }
+      for (const tc of m.tool_calls!) {
+        const run = wireToolCallToRun(tc);
+        runsByCallId.set(tc.id, run);
+        items.push({ kind: 'tool_run', run, key: tc.id });
+      }
+      if (hasText || m.status === 'streaming') {
+        items.push({
+          kind: 'message',
+          message: { ...m, reasoning_text: undefined },
+        });
+      }
+      continue;
+    }
+
+    // Native inference: separate assistant rows per step — mirror MessageList.
+    if (hasText || hasReasoning || m.status === 'streaming') {
+      items.push({ kind: 'message', message: m });
+    }
+    if (hasToolCalls) {
+      for (const tc of m.tool_calls!) {
+        const run = wireToolCallToRun(tc);
+        runsByCallId.set(tc.id, run);
+        items.push({ kind: 'tool_run', run, key: tc.id });
+      }
+    }
+  }
+
+  return items;
+}
+
+function groupToolRuns(items: RenderItem[]): RenderItem[] {
+  const out: RenderItem[] = [];
+  let i = 0;
+  while (i < items.length) {
+    const item = items[i]!;
+    if (item.kind !== 'tool_run') {
+      out.push(item);
+      i += 1;
+      continue;
+    }
+    const name = item.run.call.name;
+    if (name === 'ask_user_input') {
+      out.push(item);
+      i += 1;
+      continue;
+    }
+    let j = i + 1;
+    while (
+      j < items.length &&
+      items[j]!.kind === 'tool_run' &&
+      (items[j] as { kind: 'tool_run'; run: ToolRun }).run.call.name === name
+    ) {
+      j += 1;
+    }
+    const run = items.slice(i, j) as Array<{ kind: 'tool_run'; run: ToolRun; key: string }>;
+    if (run.length >= GROUP_THRESHOLD) {
+      out.push({ kind: 'tool_group', runs: run.map((r) => r.run), key: `group-${run[0]!.key}` });
+    } else {
+      for (const r of run) out.push(r);
+    }
+    i = j;
+  }
+  return out;
+}
+
+function CoderTextBubble({ message }: { message: CoderMessageWire }) {
+  const isUser = message.role === 'user';
+  const isStreaming = message.status === 'streaming';
+  const hasText = message.content.trim().length > 0;
+  const hasReasoning = (message.reasoning_text?.trim().length ?? 0) > 0;
+
+  if (isUser) {
+    return (
+      <div className="flex flex-col items-end gap-1">
+        <div className="max-w-[80%] rounded-lg bg-primary text-primary-foreground px-3 py-2 text-sm whitespace-pre-wrap break-words min-w-0">
+          {message.content}
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col gap-2">
+      {hasReasoning && (
+        <details className="rounded border border-border/40 bg-muted/20 px-2 py-1">
+          <summary className="cursor-pointer text-xs text-muted-foreground select-none">Reasoning</summary>
+          <pre className="mt-1 max-h-48 overflow-y-auto whitespace-pre-wrap text-[11px] text-muted-foreground font-mono">
+            {message.reasoning_text}
+          </pre>
+        </details>
+      )}
+      {(hasText || (isStreaming && !hasReasoning)) && (
+        <div className="max-w-[90%] text-sm leading-relaxed space-y-2 break-words min-w-0">
+          {hasText ? <MarkdownRenderer content={message.content} /> : null}
+          {isStreaming && (
+            <span className="inline-block w-1.5 h-3.5 align-baseline bg-muted-foreground/60 animate-pulse" />
+          )}
+        </div>
+      )}
+      {message.status === 'failed' && (
+        <div className="text-xs text-destructive">message failed</div>
+      )}
+    </div>
+  );
+}
+
+interface Props {
+  messages: CoderTimelineWire[];
+  chatId?: string;
+  footer?: ReactNode;
+}
+
+export function CoderMessageList({ messages, chatId, footer }: Props) {
+  const endRef = useRef<HTMLDivElement>(null);
+  const scrollRef = useRef<HTMLDivElement>(null);
+  const isNearBottomRef = useRef(true);
+
+  const renderItems = useMemo(
+    () => groupToolRuns(flattenCoderMessages(messages)),
+    [messages],
+  );
+
+  const handleScroll = useCallback(() => {
+    const el = scrollRef.current;
+    if (!el) return;
+    isNearBottomRef.current =
+      el.scrollHeight - el.scrollTop - el.clientHeight < SCROLL_THRESHOLD_PX;
+  }, []);
+
+  useEffect(() => {
+    if (isNearBottomRef.current) {
+      endRef.current?.scrollIntoView({ block: 'end' });
+    }
+  }, [messages]);
+
+  if (messages.length === 0) {
+    return null;
+  }
+
+  return (
+    <div className="flex-1 overflow-y-auto" ref={scrollRef} onScroll={handleScroll}>
+      <div className="max-w-[1000px] mx-auto w-full px-6 py-4 space-y-4">
+        {renderItems.map((item) => {
+          if (item.kind === 'message') {
+            return <CoderTextBubble key={item.message.id} message={item.message} />;
+          }
+          if (item.kind === 'tool_run') {
+            if (item.run.call.name === 'ask_user_input' && chatId) {
+              return (
+                <AskUserInputCard
+                  key={item.key}
+                  toolCall={item.run.call}
+                  toolResult={item.run.result}
+                  chatId={chatId}
+                  apiPrefix="/api/coder"
+                />
+              );
+            }
+            return <ToolCallLine key={item.key} run={item.run} />;
+          }
+          return <ToolCallGroup key={item.key} runs={item.runs} />;
+        })}
+        {footer}
+        <div ref={endRef} />
+      </div>
+    </div>
+  );
+}

apps/web/src/components/panes/CoderPane.tsx

@@ -1,16 +1,21 @@
-// v2.0.0: BooCoder pane — renders the BooCoder chat + diff interface inside
-// BooChat's multi-pane workspace.
+// BooCoder pane — chat + diff inside BooChat's multi-pane workspace.
 //
-// Architecture:
-// - REST calls go through /api/coder/* which BooChat's server proxies to
-//   the boocoder container at http://boocoder:3000/api/*
-// - WS connects directly to the boocoder container at :9502 (same Tailscale
-//   network, no CORS for WebSocket). In dev, the Vite proxy handles it.
+// REST: /api/coder/* proxied by BooChat to host boocoder.service (:9502).
+// WS: /api/coder/ws/sessions/:id (Vite dev proxies to :9502).
 
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Code, Send, Check, X, RefreshCw } from 'lucide-react';
-import { MarkdownRenderer } from '@/components/MarkdownRenderer';
-import { ProviderPicker } from '@/components/ProviderPicker';
+import { AgentComposerBar } from '@/components/AgentComposerBar';
+import { PermissionCard } from '@/components/PermissionCard';
+import { AgentCommandsHint } from '@/components/AgentCommandsHint';
+import { SlashCommandPicker } from '@/components/SlashCommandPicker';
+import { api } from '@/api/client';
+import type { AgentSessionConfig, PermissionPrompt, AgentCommand } from '@/api/types';
+import { useSkills } from '@/hooks/useSkills';
+import { toast } from 'sonner';
+import { isSlashCommandToken, mergeCommandsByName, parseSlashInput, slashQuery } from '@/lib/slash-command';
+import { mergeWireToolCall } from '@/lib/coder-tools';
+import { CoderMessageList, type CoderTimelineWire } from '@/components/panes/CoderMessageList';
 import { cn } from '@/lib/utils';
 
 // ---------------------------------------------------------------------------
@@ -22,16 +27,26 @@ interface CoderMessage {
   role: 'user' | 'assistant' | 'system';
   content: string;
   status?: 'streaming' | 'complete' | 'failed';
+  reasoning_text?: string;
   tool_calls?: Array<{
     id: string;
     function: { name: string; arguments: string };
   }>;
-  tool_results?: {
+}
+
+interface CoderToolMessage {
+  id: string;
+  role: 'tool';
+  tool_results: {
     tool_call_id: string;
-    content: string;
+    output: unknown;
+    truncated?: boolean;
+    error?: string;
   };
 }
 
+type CoderTimelineMessage = CoderMessage | CoderToolMessage;
+
 interface PendingChange {
   id: string;
   file_path: string;
@@ -43,24 +58,106 @@ interface PendingChange {
 
 interface Props {
   sessionId: string;
+  paneId: string;
+  chatId?: string;
+  chatPending?: boolean;
+  projectPath?: string;
+  onConnectedChange?: (connected: boolean) => void;
 }
 
-// ---------------------------------------------------------------------------
-// Hooks
-// ---------------------------------------------------------------------------
+interface WsHandlers {
+  onPermissionRequested?: (prompt: PermissionPrompt) => void;
+  onPermissionResolved?: (taskId: string) => void;
+  onAssistantComplete?: () => void;
+  onAgentCommands?: (taskId: string, commands: AgentCommand[]) => void;
+  onConnectedChange?: (connected: boolean) => void;
+}
 
-function useCoderMessages(sessionId: string) {
-  const [messages, setMessages] = useState<CoderMessage[]>([]);
+type RawCoderMessage = {
+  id: string;
+  role: string;
+  chat_id?: string;
+  content?: string | null;
+  status?: string | null;
+  reasoning_text?: string;
+  reasoning_parts?: Array<{ text?: string }> | null;
+  tool_results?: {
+    tool_call_id: string;
+    output: unknown;
+    truncated?: boolean;
+    error?: string;
+  } | null;
+  tool_calls?: Array<
+    | { id: string; name: string; args?: Record<string, unknown> }
+    | { id: string; function: { name: string; arguments: string } }
+  > | null;
+};
+
+function mapCoderTimelineRow(raw: RawCoderMessage): CoderTimelineMessage | null {
+  if (raw.role === 'tool') {
+    if (!raw.tool_results?.tool_call_id) return null;
+    return {
+      id: raw.id,
+      role: 'tool',
+      tool_results: raw.tool_results,
+    };
+  }
+  if (raw.role !== 'user' && raw.role !== 'assistant' && raw.role !== 'system') return null;
+  const tool_calls = raw.tool_calls?.map((tc) => {
+    if ('function' in tc) {
+      return { id: tc.id, function: tc.function };
+    }
+    return {
+      id: tc.id,
+      function: {
+        name: tc.name,
+        arguments: JSON.stringify(tc.args ?? {}),
+      },
+    };
+  });
+  const reasoning_text =
+    raw.reasoning_text ??
+    raw.reasoning_parts?.map((p) => p.text ?? '').join('') ??
+    '';
+  return {
+    id: raw.id,
+    role: raw.role as CoderMessage['role'],
+    content: raw.content ?? '',
+    status: (raw.status ?? 'complete') as CoderMessage['status'],
+    ...(reasoning_text ? { reasoning_text } : {}),
+    ...(tool_calls?.length ? { tool_calls } : {}),
+  };
+}
+
+function useCoderMessages(sessionId: string, chatId: string | undefined, handlers: WsHandlers) {
+  const [messages, setMessages] = useState<CoderTimelineMessage[]>([]);
   const [connected, setConnected] = useState(false);
   const wsRef = useRef<WebSocket | null>(null);
+  const handlersRef = useRef(handlers);
+  handlersRef.current = handlers;
+  const chatIdRef = useRef(chatId);
+  chatIdRef.current = chatId;
+
+  const loadMessages = useCallback(() => {
+    if (!chatId) {
+      setMessages([]);
+      return Promise.resolve();
+    }
+    return api.coder
+      .listMessages(sessionId, chatId)
+      .then((rows) =>
+        setMessages(
+          rows
+            .map(mapCoderTimelineRow)
+            .filter((m): m is CoderTimelineMessage => m !== null),
+        ),
+      )
+      .catch(() => {/* boocoder may be down */});
+  }, [sessionId, chatId]);
 
   useEffect(() => {
-    // Fetch existing messages on mount
-    fetch(`/api/coder/sessions/${sessionId}/messages`)
-      .then((res) => res.ok ? res.json() : [])
-      .then((data: CoderMessage[]) => setMessages(data))
-      .catch(() => {/* noop — coder backend may not be running */});
-  }, [sessionId]);
+    void loadMessages();
+  }, [loadMessages]);
 
   useEffect(() => {
     // WS connects to the coder backend. In production, this goes through the
@@ -77,38 +174,139 @@ function useCoderMessages(sessionId: string) {
     ws.onmessage = (ev) => {
       try {
         const frame = JSON.parse(ev.data as string);
-        if (frame.type === 'message_started') {
-          setMessages((prev) => [
-            ...prev,
-            { id: frame.message_id, role: frame.role ?? 'assistant', content: '', status: 'streaming' },
-          ]);
+        const scopedChatId = chatIdRef.current;
+        if (
+          scopedChatId &&
+          frame.chat_id &&
+          frame.chat_id !== scopedChatId &&
+          frame.type !== 'snapshot'
+        ) {
+          return;
+        }
+        if (frame.type === 'snapshot' && Array.isArray(frame.messages)) {
+          const rawMessages = (frame.messages as RawCoderMessage[]).filter(
+            (m) => !scopedChatId || m.chat_id === scopedChatId,
+          );
+          setMessages(
+            rawMessages
+              .map(mapCoderTimelineRow)
+              .filter((m): m is CoderTimelineMessage => m !== null),
+          );
+        } else if (frame.type === 'message_started') {
+          setMessages((prev) => {
+            if (prev.some((m) => m.id === frame.message_id)) return prev;
+            const role = frame.role ?? 'assistant';
+            const tempIdx =
+              role === 'user'
+                ? prev.findIndex((m) => m.id.startsWith('temp-') && m.role === 'user')
+                : -1;
+            if (tempIdx >= 0) {
+              return prev.map((m, i) =>
+                i === tempIdx ? { ...m, id: frame.message_id, status: 'streaming' } : m,
+              );
+            }
+            return [
+              ...prev,
+              { id: frame.message_id, role, content: '', status: 'streaming' },
+            ];
+          });
         } else if (frame.type === 'delta') {
           setMessages((prev) =>
-            prev.map((m) =>
-              m.id === frame.message_id
-                ? { ...m, content: m.content + (frame.content ?? '') }
-                : m
-            )
+            prev.map((m) => {
+              if (m.id !== frame.message_id || m.role === 'tool') return m;
+              const chunk = frame.content ?? '';
+              if (m.role === 'user') {
+                return { ...m, content: chunk || m.content };
+              }
+              return { ...m, content: m.content + chunk };
+            }),
           );
         } else if (frame.type === 'message_complete') {
-          setMessages((prev) =>
-            prev.map((m) =>
-              m.id === frame.message_id ? { ...m, status: 'complete' } : m
-            )
-          );
+          setMessages((prev) => {
+            const completed = prev.find(
+              (m): m is CoderMessage => m.id === frame.message_id && m.role === 'assistant',
+            );
+            const next = prev.map((m) =>
+              m.id === frame.message_id && m.role !== 'tool'
+                ? { ...m, status: 'complete' as const }
+                : m,
+            );
+            if (completed) {
+              queueMicrotask(() => handlersRef.current.onAssistantComplete?.());
+            }
+            return next;
+          });
         } else if (frame.type === 'tool_call') {
+          const tc = frame.tool_call as { id: string; name: string; args?: Record<string, unknown> } | undefined;
+          if (tc?.id) {
+            setMessages((prev) =>
+              prev.map((m) =>
+                m.role !== 'assistant' || m.id !== frame.message_id
+                  ? m
+                  : { ...m, tool_calls: mergeWireToolCall(m.tool_calls, { ...tc, args: tc.args ?? {} }) },
+              ),
+            );
+          }
+        } else if (frame.type === 'tool_result') {
+          setMessages((prev) => {
+            const exists = prev.some((m) => m.id === frame.tool_message_id);
+            if (exists) {
+              return prev.map((m) =>
+                m.role === 'tool' && m.id === frame.tool_message_id
+                  ? {
+                      ...m,
+                      tool_results: {
+                        tool_call_id: frame.tool_call_id,
+                        output: frame.output,
+                        truncated: frame.truncated,
+                        ...(frame.error ? { error: frame.error } : {}),
+                      },
+                    }
+                  : m,
+              );
+            }
+            return [
+              ...prev,
+              {
+                id: frame.tool_message_id,
+                role: 'tool' as const,
+                tool_results: {
+                  tool_call_id: frame.tool_call_id,
+                  output: frame.output,
+                  truncated: frame.truncated,
+                  ...(frame.error ? { error: frame.error } : {}),
+                },
+              },
+            ];
+          });
+        } else if (frame.type === 'reasoning_delta') {
           setMessages((prev) =>
             prev.map((m) =>
-              m.id === frame.message_id
-                ? {
-                    ...m,
-                    tool_calls: [
-                      ...(m.tool_calls ?? []),
-                      { id: frame.tool_call_id, function: { name: frame.name, arguments: frame.arguments ?? '' } },
-                    ],
-                  }
-                : m
-            )
+              m.id === frame.message_id && m.role === 'assistant'
+                ? { ...m, reasoning_text: (m.reasoning_text ?? '') + (frame.content ?? '') }
+                : m,
+            ),
+          );
+        } else if (frame.type === 'permission_requested') {
+          handlersRef.current.onPermissionRequested?.({
+            taskId: frame.task_id,
+            kind: frame.kind,
+            toolTitle: frame.tool_title,
+            ...(frame.input ? { input: frame.input as Record<string, unknown> } : {}),
+            options: (frame.options ?? []).map((o: { option_id: string; label: string }) => ({
+              optionId: o.option_id,
+              label: o.label,
+            })),
+          });
+        } else if (frame.type === 'permission_resolved') {
+          handlersRef.current.onPermissionResolved?.(frame.task_id);
+        } else if (frame.type === 'agent_commands') {
+          handlersRef.current.onAgentCommands?.(
+            frame.task_id,
+            (frame.commands ?? []).map((c: { name: string; description?: string }) => ({
+              name: c.name,
+              description: c.description,
+            })),
           );
         }
       } catch {
@@ -122,7 +320,11 @@ function useCoderMessages(sessionId: string) {
     };
   }, [sessionId]);
 
-  return { messages, setMessages, connected };
+  useEffect(() => {
+    handlersRef.current.onConnectedChange?.(connected);
+  }, [connected]);
+
+  return { messages, setMessages, connected, loadMessages };
 }
 
 function usePendingChanges(sessionId: string) {
@@ -165,48 +367,6 @@ function usePendingChanges(sessionId: string) {
 // Sub-components
 // ---------------------------------------------------------------------------
 
-function CoderMessageBubble({ message }: { message: CoderMessage }) {
-  const isUser = message.role === 'user';
-  return (
-    <div className={cn('flex flex-col gap-1 px-3 py-2', isUser ? 'items-end' : 'items-start')}>
-      <div
-        className={cn(
-          'rounded-lg px-3 py-2 max-w-[85%] text-sm',
-          isUser
-            ? 'bg-primary text-primary-foreground'
-            : 'bg-muted text-foreground'
-        )}
-      >
-        {isUser ? (
-          <p className="whitespace-pre-wrap">{message.content}</p>
-        ) : (
-          <div className="prose prose-sm dark:prose-invert max-w-none">
-            <MarkdownRenderer content={message.content} />
-          </div>
-        )}
-        {message.tool_calls && message.tool_calls.length > 0 && (
-          <div className="mt-2 border-t border-border/50 pt-2 space-y-1">
-            {message.tool_calls.map((tc) => (
-              <div key={tc.id} className="text-xs font-mono text-muted-foreground">
-                <span className="text-primary/70">{tc.function.name}</span>
-                {tc.function.arguments && (
-                  <span className="ml-1 opacity-60">
-                    ({tc.function.arguments.slice(0, 80)}
-                    {tc.function.arguments.length > 80 ? '...' : ''})
-                  </span>
-                )}
-              </div>
-            ))}
-          </div>
-        )}
-        {message.status === 'streaming' && (
-          <span className="inline-block w-2 h-4 bg-current opacity-60 animate-pulse ml-0.5" />
-        )}
-      </div>
-    </div>
-  );
-}
-
 function DiffPanel({
   changes,
   loading,
@@ -296,115 +456,273 @@ function DiffPanel({
 // Main component
 // ---------------------------------------------------------------------------
 
-export function CoderPane({ sessionId }: Props) {
-  const { messages, setMessages, connected } = useCoderMessages(sessionId);
+export function CoderPane({
+  sessionId,
+  paneId,
+  chatId,
+  chatPending = false,
+  projectPath,
+  onConnectedChange,
+}: Props) {
+  const [agentConfig, setAgentConfig] = useState<AgentSessionConfig>({
+    provider: 'boocode',
+    model: '',
+    modeId: null,
+    thinkingOptionId: null,
+  });
+  const [activeTaskId, setActiveTaskId] = useState<string | null>(null);
+  const [permissionPrompt, setPermissionPrompt] = useState<PermissionPrompt | null>(null);
+  const [permissionBusy, setPermissionBusy] = useState(false);
+  const [providerCommands, setProviderCommands] = useState<AgentCommand[]>([]);
+  const [liveTaskCommands, setLiveTaskCommands] = useState<AgentCommand[]>([]);
+  const { skills } = useSkills();
+  const [slashState, setSlashState] = useState<{ query: string } | null>(null);
+
+  const displayedCommands = useMemo(() => {
+    const base =
+      agentConfig.provider === 'boocode'
+        ? skills.map((s) => ({ name: s.name, description: s.description }))
+        : providerCommands;
+    return mergeCommandsByName(base, liveTaskCommands);
+  }, [agentConfig.provider, skills, providerCommands, liveTaskCommands]);
+
+  const skillsByName = useMemo(() => new Set(skills.map((s) => s.name)), [skills]);
+  const commandsByName = useMemo(
+    () => new Set(displayedCommands.map((c) => c.name)),
+    [displayedCommands],
+  );
+
+  const { messages, setMessages, connected, loadMessages } = useCoderMessages(sessionId, chatId, {
+    onConnectedChange,
+    onPermissionRequested: (prompt) => {
+      setActiveTaskId(prompt.taskId);
+      setPermissionPrompt(prompt);
+    },
+    onPermissionResolved: (taskId) => {
+      if (activeTaskId === taskId || permissionPrompt?.taskId === taskId) {
+        setPermissionPrompt(null);
+      }
+    },
+    onAssistantComplete: () => {
+      setActiveTaskId(null);
+      setPermissionPrompt(null);
+      setLiveTaskCommands([]);
+    },
+    onAgentCommands: (_taskId, commands) => {
+      setLiveTaskCommands(commands);
+    },
+  });
   const { changes, loading, refresh, approve, reject } = usePendingChanges(sessionId);
   const [input, setInput] = useState('');
   const [sending, setSending] = useState(false);
-  const [provider, setProvider] = useState('boocode');
-  const [model, setModel] = useState('qwen3.6-35b-a3b-mxfp4');
-  const messagesEndRef = useRef<HTMLDivElement>(null);
   const inputRef = useRef<HTMLTextAreaElement>(null);
 
-  // Auto-scroll on new messages
-  useEffect(() => {
-    messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
-  }, [messages]);
-
   // Refresh pending changes when a message_complete arrives
   useEffect(() => {
-    const lastMsg = messages[messages.length - 1];
-    if (lastMsg?.role === 'assistant' && lastMsg.status === 'complete') {
+    const lastAssistant = [...messages].reverse().find(
+      (m): m is CoderMessage => m.role === 'assistant',
+    );
+    if (lastAssistant?.status === 'complete') {
       refresh();
     }
   }, [messages, refresh]);
 
+  // Poll fallbacks when WS is disconnected (reconnect uses WS as source of truth)
+  useEffect(() => {
+    if (!activeTaskId || connected) return;
+    const interval = setInterval(() => {
+      if (!permissionPrompt) {
+        void api.coder
+          .getTaskPermission(activeTaskId)
+          .then((prompt) => {
+            setPermissionPrompt({
+              taskId: prompt.taskId,
+              toolTitle: prompt.toolTitle,
+              options: prompt.options,
+            });
+          })
+          .catch(() => {/* no pending permission */});
+      }
+      void api.coder
+        .getTaskCommands(activeTaskId)
+        .then((res) => setLiveTaskCommands(res.commands))
+        .catch(() => {/* not cached yet */});
+      void api.coder
+        .getTask(activeTaskId)
+        .then((task) => {
+          if (task.state === 'running' || task.state === 'pending' || task.state === 'blocked') {
+            return;
+          }
+          setActiveTaskId(null);
+          setPermissionPrompt(null);
+          setLiveTaskCommands([]);
+          void loadMessages();
+        })
+        .catch(() => {/* task gone */});
+    }, 2000);
+    return () => clearInterval(interval);
+  }, [activeTaskId, connected, permissionPrompt, loadMessages]);
+
+  const handleProviderCommandsChange = useCallback((commands: AgentCommand[]) => {
+    setProviderCommands(commands);
+  }, []);
+
+  const handlePermissionRespond = useCallback(async (optionId: string | null, updatedInput?: Record<string, unknown>) => {
+    if (!permissionPrompt) return;
+    setPermissionBusy(true);
+    try {
+      await api.coder.respondTaskPermission(permissionPrompt.taskId, optionId, updatedInput);
+      setPermissionPrompt(null);
+    } finally {
+      setPermissionBusy(false);
+    }
+  }, [permissionPrompt]);
+
   const handleSend = useCallback(async () => {
     const text = input.trim();
-    if (!text || sending) return;
+    if (!text || sending || !chatId) return;
+
+    if (text.startsWith('/')) {
+      const parsed = parseSlashInput(text);
+      if (parsed) {
+        const { cmdName, args } = parsed;
+        if (agentConfig.provider === 'boocode' && skillsByName.has(cmdName)) {
+          setInput('');
+          setSlashState(null);
+          setSending(true);
+          setPermissionPrompt(null);
+          setLiveTaskCommands([]);
+          try {
+            await api.coder.skillInvoke(
+              sessionId,
+              paneId,
+              cmdName,
+              args.length > 0 ? args : null,
+            );
+          } catch (err) {
+            toast.error(err instanceof Error ? err.message : 'skill invocation failed');
+          } finally {
+            setSending(false);
+          }
+          return;
+        }
+        if (!commandsByName.has(cmdName)) {
+          // Unknown slash — fall through and send as literal text.
+        }
+      }
+    }
 
     setInput('');
+    setSlashState(null);
     setSending(true);
+    setPermissionPrompt(null);
+    setLiveTaskCommands([]);
 
-    // Optimistic user message
     const tempId = `temp-${Date.now()}`;
     setMessages((prev) => [...prev, { id: tempId, role: 'user', content: text, status: 'complete' }]);
 
     try {
-      const res = await fetch(`/api/coder/sessions/${sessionId}/messages`, {
-        method: 'POST',
-        headers: { 'content-type': 'application/json' },
-        body: JSON.stringify({
-          content: text,
-          provider: provider !== 'boocode' ? provider : undefined,
-          model: model || undefined,
-        }),
+      const data = await api.coder.sendMessage(sessionId, {
+        content: text,
+        pane_id: paneId,
+        chat_id: chatId,
+        provider: agentConfig.provider !== 'boocode' ? agentConfig.provider : undefined,
+        model: agentConfig.model || undefined,
+        mode_id: agentConfig.modeId ?? undefined,
+        thinking_option_id: agentConfig.thinkingOptionId ?? undefined,
       });
-      if (res.ok) {
-        const data = await res.json();
-        // Replace temp message with real one if server returned it
-        if (data.user_message_id) {
-          setMessages((prev) =>
-            prev.map((m) => m.id === tempId ? { ...m, id: data.user_message_id } : m)
-          );
-        }
+      if (data.user_message_id) {
+        setMessages((prev) =>
+          prev.map((m) => (m.id === tempId ? { ...m, id: data.user_message_id! } : m))
+        );
       }
-    } catch {
-      // The WS will bring the real messages; optimistic is good enough
+      if (data.task_id) {
+        setActiveTaskId(data.task_id);
+      } else {
+        setActiveTaskId(null);
+      }
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'failed to send');
     } finally {
       setSending(false);
     }
-  }, [input, sending, sessionId, provider, model, setMessages]);
+  }, [
+    input,
+    sending,
+    sessionId,
+    paneId,
+    chatId,
+    agentConfig,
+    skillsByName,
+    commandsByName,
+    setMessages,
+  ]);
+
+  const handleSlashSelect = useCallback((name: string) => {
+    const next = `/${name} `;
+    setInput(next);
+    setSlashState(null);
+    requestAnimationFrame(() => {
+      const ta = inputRef.current;
+      if (ta) {
+        ta.selectionStart = ta.selectionEnd = next.length;
+        ta.focus();
+      }
+    });
+  }, []);
+
+  const handleInputChange = useCallback((e: React.ChangeEvent<HTMLTextAreaElement>) => {
+    const newValue = e.target.value;
+    setInput(newValue);
+    if (isSlashCommandToken(newValue)) {
+      setSlashState({ query: slashQuery(newValue) });
+    } else {
+      setSlashState(null);
+    }
+  }, []);
 
   const handleKeyDown = useCallback(
     (e: React.KeyboardEvent) => {
+      if (slashState) return;
+      if (e.nativeEvent.isComposing) return;
       if (e.key === 'Enter' && !e.shiftKey) {
         e.preventDefault();
         void handleSend();
       }
     },
-    [handleSend]
+    [handleSend, slashState]
   );
 
   return (
     <div className="flex flex-col h-full bg-background">
-      {/* Header */}
-      <div className="flex items-center gap-2 px-3 py-1.5 border-b border-border bg-muted/30 shrink-0">
-        <Code size={14} className="text-muted-foreground shrink-0" />
-        <ProviderPicker
-          provider={provider}
-          model={model}
-          onChange={(prov, mod) => {
-            setProvider(prov);
-            setModel(mod);
-          }}
-        />
-        <span
-          className={cn(
-            'inline-block w-1.5 h-1.5 rounded-full ml-auto shrink-0',
-            connected ? 'bg-green-500' : 'bg-red-500'
-          )}
-          title={connected ? 'Connected' : 'Disconnected'}
-        />
-      </div>
-
-      {/* Chat area */}
-      <div className="flex-1 min-h-0 overflow-y-auto">
+      {/* Chat area — BooChat-style timeline (text + tool runs as siblings) */}
+      <div className="flex-1 min-h-0 flex flex-col">
         {messages.length === 0 ? (
-          <div className="flex flex-col items-center justify-center h-full text-sm text-muted-foreground gap-2">
+          <div className="flex flex-col items-center justify-center flex-1 text-sm text-muted-foreground gap-2">
             <Code size={32} className="opacity-40" />
-            <p>Send a message to start coding</p>
+            <p>{chatPending || !chatId ? 'Preparing pane chat…' : 'Send a message to start coding'}</p>
           </div>
         ) : (
-          <div className="py-2">
-            {messages.map((msg) => (
-              <CoderMessageBubble key={msg.id} message={msg} />
-            ))}
-            <div ref={messagesEndRef} />
-          </div>
+          <CoderMessageList
+            messages={messages as CoderTimelineWire[]}
+            chatId={chatId}
+            footer={
+              activeTaskId && !permissionPrompt && sending === false ? (
+                <p className="text-xs text-muted-foreground animate-pulse">Agent running…</p>
+              ) : undefined
+            }
+          />
         )}
       </div>
 
+      {permissionPrompt && (
+        <PermissionCard
+          prompt={permissionPrompt}
+          onRespond={(id, input) => void handlePermissionRespond(id, input)}
+          busy={permissionBusy}
+        />
+      )}
+
       {/* Diff panel — only shows when there are pending changes */}
       {changes.filter((c) => c.status === 'pending').length > 0 && (
         <div className="h-48 shrink-0">
@@ -418,28 +736,46 @@ export function CoderPane({ sessionId }: Props) {
         </div>
       )}
 
-      {/* Input */}
-      <div className="shrink-0 border-t border-border p-2">
+      {/* Composer + input */}
+      <div className="shrink-0 border-t border-border">
+        {displayedCommands.length > 0 && <AgentCommandsHint commands={displayedCommands} />}
+        <AgentComposerBar
+          projectPath={projectPath}
+          value={agentConfig}
+          onChange={setAgentConfig}
+          onProviderCommandsChange={handleProviderCommandsChange}
+        />
+        <div className="p-2">
         <div className="flex items-end gap-2">
           <textarea
             ref={inputRef}
             value={input}
-            onChange={(e) => setInput(e.target.value)}
+            onChange={handleInputChange}
             onKeyDown={handleKeyDown}
-            placeholder="Ask BooCoder to write code..."
+            placeholder="Type / for commands…"
             rows={1}
             className="flex-1 resize-none rounded-md border border-input bg-background px-3 py-2 text-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring max-h-32 min-h-[36px] max-md:min-h-[44px]"
           />
           <button
             type="button"
             onClick={() => void handleSend()}
-            disabled={!input.trim() || sending}
+            disabled={!input.trim() || sending || !chatId || chatPending}
             className="inline-flex items-center justify-center size-9 max-md:min-h-[44px] max-md:min-w-[44px] rounded-md bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-40 disabled:cursor-not-allowed shrink-0"
             aria-label="Send message"
           >
             <Send size={16} />
           </button>
         </div>
+        </div>
+        {slashState && (
+          <SlashCommandPicker
+            query={slashState.query}
+            items={displayedCommands}
+            inputRef={inputRef}
+            onSelect={handleSlashSelect}
+            onClose={() => setSlashState(null)}
+          />
+        )}
       </div>
     </div>
   );

apps/web/src/components/ui/textarea.tsx

@@ -2,9 +2,10 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 
-function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
-  return (
+const Textarea = React.forwardRef<HTMLTextAreaElement, React.ComponentProps<"textarea">>(
+  ({ className, ...props }, ref) => (
     <textarea
+      ref={ref}
       data-slot="textarea"
       className={cn(
         "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
@@ -13,6 +14,7 @@ function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
       {...props}
     />
   )
-}
+)
+Textarea.displayName = "Textarea"
 
 export { Textarea }

apps/web/src/hooks/useProviderSnapshot.ts

@@ -0,0 +1,49 @@
+import { useEffect, useSyncExternalStore } from 'react';
+import { api } from '@/api/client';
+import type { ProviderSnapshotEntry } from '@/api/types';
+
+let cached: ProviderSnapshotEntry[] | null = null;
+let inflight: Promise<ProviderSnapshotEntry[]> | null = null;
+const listeners = new Set<() => void>();
+
+function notify(): void {
+  for (const fn of listeners) fn();
+}
+
+function subscribe(fn: () => void): () => void {
+  listeners.add(fn);
+  return () => listeners.delete(fn);
+}
+
+function getSnapshot(): ProviderSnapshotEntry[] | null {
+  return cached;
+}
+
+async function doFetch(cwd?: string): Promise<ProviderSnapshotEntry[]> {
+  const data = await api.coder.snapshot(cwd);
+  cached = data;
+  inflight = null;
+  notify();
+  return data;
+}
+
+function ensureLoaded(cwd?: string): void {
+  if (cached || inflight) return;
+  inflight = doFetch(cwd).catch((err) => {
+    inflight = null;
+    console.error('provider snapshot fetch failed:', err);
+    return [];
+  });
+}
+
+export function refreshProviderSnapshot(cwd?: string): Promise<ProviderSnapshotEntry[]> {
+  cached = null;
+  inflight = null;
+  return doFetch(cwd);
+}
+
+export function useProviderSnapshot(cwd?: string): ProviderSnapshotEntry[] | null {
+  const entries = useSyncExternalStore(subscribe, getSnapshot);
+  useEffect(() => { ensureLoaded(cwd); }, [cwd]);
+  return entries;
+}

apps/web/src/hooks/useSessionStream.ts

@@ -48,9 +48,14 @@ function applyFrame(state: State, frame: WsFrame): State {
       return { ...state, messages: [...state.messages, newMsg] };
     }
     case 'delta': {
-      const next = state.messages.map((m) =>
-        m.id === frame.message_id ? { ...m, content: m.content + frame.content } : m
-      );
+      const next = state.messages.map((m) => {
+        if (m.id !== frame.message_id) return m;
+        const chunk = frame.content ?? '';
+        if (m.role === 'user') {
+          return { ...m, content: chunk || m.content };
+        }
+        return { ...m, content: m.content + chunk };
+      });
       return { ...state, messages: next };
     }
     case 'tool_call': {

apps/web/src/hooks/useWorkspacePanes.ts

@@ -32,19 +32,19 @@ function chatPane(chatId: string): WorkspacePane {
   return { id: generateId(), kind: 'chat', chatId, chatIds: [chatId], activeChatIdx: 0 };
 }
 
-// v1.10 booterm: terminal panes carry no chats. Their `id` is used as the
-// tmux window key on booterm — see apps/booterm/src/pty/manager.ts. They
-// persist in localStorage along with chat panes so a refresh resumes the
-// same tmux window via the idempotent start endpoint.
-function terminalPane(id: string = generateId()): WorkspacePane {
-  return { id, kind: 'terminal', chatIds: [], activeChatIdx: -1 };
+function chatNameForPaneKind(kind: 'coder' | 'terminal'): string {
+  return kind === 'coder' ? 'BooCoder' : 'Terminal';
 }
 
-// v2.0.0: coder pane — renders the BooCoder interface (chat + diff panel).
-// Like terminal panes, carries no chats — the CoderPane component manages
-// its own session/messages via the /api/coder proxy.
-function coderPane(id: string = generateId()): WorkspacePane {
-  return { id, kind: 'coder', chatIds: [], activeChatIdx: -1 };
+function scopedPane(id: string, kind: 'coder' | 'terminal', chatId: string): WorkspacePane {
+  return { id, kind, chatId, chatIds: [chatId], activeChatIdx: 0 };
+}
+
+/** Active chat id for a pane row (chat / coder / terminal). */
+export function activePaneChatId(pane: WorkspacePane): string | undefined {
+  const idx = pane.activeChatIdx ?? 0;
+  if (idx >= 0 && pane.chatIds?.[idx]) return pane.chatIds[idx];
+  return pane.chatId;
 }
 
 // v1.9: settings pane factory. No chats, no state beyond identity — the
@@ -79,8 +79,20 @@ function htmlArtifactPane(state: HtmlArtifactState): WorkspacePane {
 // v1.9: settings panes are ephemeral. Filter them out before persisting so a
 // page reload always returns to a clean workspace; the user re-opens via the
 // sidebar Settings button when needed.
+function normalizePaneKind(pane: WorkspacePane): WorkspacePane {
+  // v2.3: server once accepted legacy 'agent' before 'coder' landed in the schema.
+  if ((pane.kind as string) === 'agent') {
+    return { ...pane, kind: 'coder' };
+  }
+  return pane;
+}
+
+function normalizePanes(panes: WorkspacePane[]): WorkspacePane[] {
+  return panes.map(normalizePaneKind);
+}
+
 function persistablePanes(panes: WorkspacePane[]): WorkspacePane[] {
-  return panes.filter((p) => p.kind !== 'settings');
+  return normalizePanes(panes).filter((p) => p.kind !== 'settings');
 }
 
 // v1.9: per recon decision (c), settings panes don't count toward MAX_PANES.
@@ -128,6 +140,8 @@ export interface UseWorkspacePanesResult {
   removeChatFromPanes: (chatId: string) => void;
   initializeFirstChatIfEmpty: (chatId: string) => void;
   validatePanes: (validChatIds: Set<string>) => void;
+  /** True while a coder/terminal pane is waiting for its scoped chat row. */
+  isPaneChatPending: (paneId: string) => boolean;
   handlePaneDragStart: (idx: number) => (e: DragEvent<HTMLDivElement>) => void;
   handlePaneDragOver: (idx: number) => (e: DragEvent<HTMLDivElement>) => void;
   handlePaneDragLeave: () => void;
@@ -149,6 +163,54 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
   // Tracks the last value broadcast by another device (or this one's own
   // round-trip). If a PATCH would echo this exact payload, we skip the call.
   const lastRemoteJsonRef = useRef<string>('[]');
+  const pendingPaneChatRef = useRef<Set<string>>(new Set());
+  const [pendingPaneChatIds, setPendingPaneChatIds] = useState<Set<string>>(() => new Set());
+
+  const markPaneChatPending = useCallback((paneId: string, pending: boolean) => {
+    setPendingPaneChatIds((prev) => {
+      const next = new Set(prev);
+      if (pending) next.add(paneId);
+      else next.delete(paneId);
+      pendingPaneChatRef.current = next;
+      return next;
+    });
+  }, []);
+
+  const attachChatToPane = useCallback(
+    (paneId: string, chatId: string, kind: 'coder' | 'terminal') => {
+      setPanes((prev) =>
+        prev.map((p) => (p.id === paneId ? scopedPane(paneId, kind, chatId) : p)),
+      );
+    },
+    [],
+  );
+
+  const seedPaneChat = useCallback(
+    async (paneId: string, kind: 'coder' | 'terminal') => {
+      if (pendingPaneChatRef.current.has(paneId)) return;
+      markPaneChatPending(paneId, true);
+      try {
+        const chat = await api.chats.create(sessionId, { name: chatNameForPaneKind(kind) });
+        attachChatToPane(paneId, chat.id, kind);
+      } catch (err) {
+        toast.error(err instanceof Error ? err.message : 'Failed to create pane chat');
+      } finally {
+        markPaneChatPending(paneId, false);
+      }
+    },
+    [sessionId, attachChatToPane, markPaneChatPending],
+  );
+
+  const seedEmptyScopedPanes = useCallback(
+    (paneList: WorkspacePane[]) => {
+      for (const pane of paneList) {
+        if (pane.kind !== 'coder' && pane.kind !== 'terminal') continue;
+        if ((pane.chatIds?.length ?? 0) > 0 || pane.chatId) continue;
+        void seedPaneChat(pane.id, pane.kind);
+      }
+    },
+    [seedPaneChat],
+  );
 
   // v1.12.1: hydrate from server on mount, then subscribe to remote updates.
   useEffect(() => {
@@ -159,7 +221,7 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
         const session = await api.sessions.get(sessionId);
         if (cancelled) return;
         let initial: WorkspacePane[] = Array.isArray(session.workspace_panes)
-          ? session.workspace_panes
+          ? normalizePanes(session.workspace_panes)
           : [];
         // One-time migration: if server is empty but legacy localStorage has
         // a layout, seed the server and delete the local key.
@@ -180,12 +242,13 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
         lastRemoteJsonRef.current = JSON.stringify(persistablePanes(next));
         setPanes(next);
         setActivePaneIdx(0);
+        seedEmptyScopedPanes(next);
       } finally {
         if (!cancelled) hydratedRef.current = true;
       }
     })();
     return () => { cancelled = true; };
-  }, [sessionId]);
+  }, [sessionId, seedEmptyScopedPanes]);
 
   // v1.12.1: live cross-device sync. Replace local state when another device
   // (or our own write echo) lands a session_workspace_updated frame.
@@ -193,14 +256,17 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
     return sessionEvents.subscribe((ev) => {
       if (ev.type !== 'session_workspace_updated') return;
       if (ev.session_id !== sessionId) return;
-      const incoming = Array.isArray(ev.workspace_panes) ? ev.workspace_panes : [];
+      const incoming = normalizePanes(
+        Array.isArray(ev.workspace_panes) ? ev.workspace_panes : [],
+      );
       const json = JSON.stringify(incoming);
       if (json === lastRemoteJsonRef.current) return;
       lastRemoteJsonRef.current = json;
       setPanes(incoming.length > 0 ? incoming : [emptyPane()]);
       setActivePaneIdx((prev) => Math.min(prev, Math.max(0, incoming.length - 1)));
+      seedEmptyScopedPanes(incoming.length > 0 ? incoming : [emptyPane()]);
     });
-  }, [sessionId]);
+  }, [sessionId, seedEmptyScopedPanes]);
 
   // v1.14.x-html-artifact-panes: ActionRow's "Open in pane" emits one of
   // these per click. If a pane already exists for the same message_id, focus
@@ -388,8 +454,10 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
 
   const showLandingPage = useCallback((paneIdx: number) => {
     setPanes((prev) => {
+      const pane = prev[paneIdx];
+      // Coder/terminal panes are not chat hosts — history button is chat-only.
+      if (!pane || pane.kind === 'coder' || pane.kind === 'terminal') return prev;
       const next = [...prev];
-      const pane = next[paneIdx]!;
       next[paneIdx] = { ...pane, kind: 'empty', chatId: undefined };
       return next;
     });
@@ -408,16 +476,21 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
         return prev;
       }
       const newPane =
-        kind === 'terminal' ? terminalPane(newPaneId) :
-        kind === 'coder' ? coderPane(newPaneId) :
-        emptyPane(newPaneId);
+        kind === 'terminal'
+          ? { id: newPaneId, kind: 'terminal' as const, chatIds: [] as string[], activeChatIdx: -1 }
+          : kind === 'coder'
+            ? { id: newPaneId, kind: 'coder' as const, chatIds: [] as string[], activeChatIdx: -1 }
+            : emptyPane(newPaneId);
       const next = [...prev, newPane];
       setActivePaneIdx(next.length - 1);
       success = true;
+      if (kind === 'terminal' || kind === 'coder') {
+        queueMicrotask(() => void seedPaneChat(newPaneId, kind));
+      }
       return next;
     });
     return success ? newPaneId : null;
-  }, []);
+  }, [seedPaneChat]);
 
   const toggleSettingsPane = useCallback(() => {
     setPanes((prev) => {
@@ -476,19 +549,39 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
   const validatePanes = useCallback((validChatIds: Set<string>) => {
     setPanes((prev) => {
       const cleaned = prev.map((pane) => {
-        if (pane.kind !== 'chat' || pane.chatIds.length === 0) return pane;
+        const usesChat =
+          pane.kind === 'chat' || pane.kind === 'coder' || pane.kind === 'terminal';
+        if (!usesChat || pane.chatIds.length === 0) return pane;
         const nextIds = pane.chatIds.filter((id) => validChatIds.has(id));
         if (nextIds.length === pane.chatIds.length) return pane;
         if (nextIds.length === 0) {
-          return { ...pane, kind: 'empty' as const, chatId: undefined, chatIds: [], activeChatIdx: -1 };
+          if (pane.kind === 'chat') {
+            return { ...pane, kind: 'empty' as const, chatId: undefined, chatIds: [], activeChatIdx: -1 };
+          }
+          return { ...pane, chatId: undefined, chatIds: [], activeChatIdx: -1 };
         }
         const nextActiveIdx = Math.min(pane.activeChatIdx, nextIds.length - 1);
         return { ...pane, chatIds: nextIds, activeChatIdx: nextActiveIdx, chatId: nextIds[nextActiveIdx] };
       });
       const unchanged = cleaned.every((p, i) => p === prev[i]);
-      return unchanged ? prev : cleaned;
+      const next = unchanged ? prev : cleaned;
+      if (!unchanged) {
+        for (const pane of next) {
+          if (pane.kind === 'coder' && !activePaneChatId(pane)) {
+            queueMicrotask(() => void seedPaneChat(pane.id, 'coder'));
+          } else if (pane.kind === 'terminal' && !activePaneChatId(pane)) {
+            queueMicrotask(() => void seedPaneChat(pane.id, 'terminal'));
+          }
+        }
+      }
+      return next;
     });
-  }, []);
+  }, [seedPaneChat]);
+
+  const isPaneChatPending = useCallback(
+    (paneId: string) => pendingPaneChatIds.has(paneId),
+    [pendingPaneChatIds],
+  );
 
   const removeChatFromPanes = useCallback((chatId: string) => {
     setPanes((prev) => prev.map((p) => {
@@ -574,6 +667,7 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
     removeChatFromPanes,
     initializeFirstChatIfEmpty,
     validatePanes,
+    isPaneChatPending,
     handlePaneDragStart,
     handlePaneDragOver,
     handlePaneDragLeave,

apps/web/src/lib/apply-user-delta.ts

@@ -0,0 +1,11 @@
+/** User messages are inserted atomically — never stream-append like assistant deltas. */
+export function applyMessageDelta(
+  role: 'user' | 'assistant' | 'system' | 'tool',
+  existingContent: string,
+  chunk: string,
+): string {
+  if (role === 'user') {
+    return chunk || existingContent;
+  }
+  return existingContent + chunk;
+}

apps/web/src/lib/coder-session.ts

@@ -0,0 +1,18 @@
+/** Sessions created for BooCoder work (sidebar / project list icons). */
+export function isCoderSessionName(name: string | null | undefined): boolean {
+  if (!name) return false;
+  if (name === 'New BooCode') return true;
+  if (name.startsWith('Task [')) return true;
+  if (name.startsWith('Coder:')) return true;
+  return false;
+}
+
+/** Optimistic coder pane shell before scoped chat id arrives from the server. */
+export function defaultCoderWorkspacePane(id: string = crypto.randomUUID()) {
+  return {
+    id,
+    kind: 'coder' as const,
+    chatIds: [] as string[],
+    activeChatIdx: -1,
+  };
+}

apps/web/src/lib/coder-tools.ts

@@ -0,0 +1,68 @@
+import type { ToolCall, ToolResult } from '@/api/types';
+import type { ToolRun } from '@/components/ToolCallLine';
+
+export interface AcpWireMeta {
+  status?: 'running' | 'completed' | 'failed' | 'canceled';
+  kind?: string | null;
+  title?: string;
+  output?: unknown;
+  error?: string;
+}
+
+export interface CoderToolCallWire {
+  id: string;
+  function: { name: string; arguments: string };
+}
+
+function parseArgs(raw: string): Record<string, unknown> {
+  try {
+    const parsed = JSON.parse(raw) as Record<string, unknown>;
+    return parsed && typeof parsed === 'object' ? parsed : {};
+  } catch {
+    return {};
+  }
+}
+
+export function wireToolCallToRun(wire: CoderToolCallWire): ToolRun {
+  const args = parseArgs(wire.function.arguments);
+  const acp = args._acp as AcpWireMeta | undefined;
+  const { _acp: _ignored, ...rest } = args;
+  const lifecycle = acp?.status ?? 'running';
+  const call: ToolCall = {
+    id: wire.id,
+    name: wire.function.name,
+    args: rest,
+  };
+  if (lifecycle === 'running') {
+    return { call, result: null };
+  }
+  const result: ToolResult = {
+    tool_call_id: wire.id,
+    output: acp?.output ?? null,
+    truncated: false,
+    ...(acp?.error ? { error: acp.error } : {}),
+  };
+  return { call, result };
+}
+
+export function mergeWireToolCall(
+  existing: CoderToolCallWire[] | undefined,
+  incoming: { id: string; name: string; args: Record<string, unknown> },
+): CoderToolCallWire[] {
+  const entry: CoderToolCallWire = {
+    id: incoming.id,
+    function: { name: incoming.name, arguments: JSON.stringify(incoming.args) },
+  };
+  const list = existing ?? [];
+  const idx = list.findIndex((tc) => tc.id === incoming.id);
+  if (idx >= 0) {
+    const next = [...list];
+    next[idx] = entry;
+    return next;
+  }
+  return [...list, entry];
+}
+
+export function wireToolCallsToRuns(wires: CoderToolCallWire[] | undefined): ToolRun[] {
+  return (wires ?? []).map(wireToolCallToRun);
+}

apps/web/src/lib/slash-command.ts

@@ -0,0 +1,29 @@
+export interface SlashCommandItem {
+  name: string;
+  description?: string;
+}
+
+/** True while the user is still typing the command name after `/`. */
+export function isSlashCommandToken(value: string): boolean {
+  return /^\/[^\s]*$/.test(value);
+}
+
+export function slashQuery(value: string): string {
+  return value.slice(1);
+}
+
+export function parseSlashInput(text: string): { cmdName: string; args: string } | null {
+  const match = text.match(/^\/(\S+)\s*([\s\S]*)$/);
+  if (!match) return null;
+  return { cmdName: match[1]!, args: (match[2] ?? '').trim() };
+}
+
+export function mergeCommandsByName(...lists: SlashCommandItem[][]): SlashCommandItem[] {
+  const byName = new Map<string, SlashCommandItem>();
+  for (const list of lists) {
+    for (const cmd of list) {
+      byName.set(cmd.name, cmd);
+    }
+  }
+  return [...byName.values()].sort((a, b) => a.name.localeCompare(b.name));
+}

apps/web/src/pages/Project.tsx

@@ -1,12 +1,13 @@
 import { useEffect, useState } from 'react';
 import { Link, useNavigate, useParams } from 'react-router-dom';
-import { Plus, MessageSquare, Trash2, ChevronDown, ChevronRight, RotateCcw, Menu } from 'lucide-react';
+import { Plus, MessageSquare, Trash2, ChevronDown, ChevronRight, RotateCcw, Menu, Code } from 'lucide-react';
 import { toast } from 'sonner';
 import { api } from '@/api/client';
 import type { Project as ProjectType, Session } from '@/api/types';
 import { Button } from '@/components/ui/button';
 import { sessionEvents } from '@/hooks/sessionEvents';
 import { useSessions } from '@/hooks/useSessions';
+import { isCoderSessionName } from '@/lib/coder-session';
 import { useSidebarDrawer } from '@/hooks/useSidebarDrawer';
 import { useViewport } from '@/hooks/useViewport';
 
@@ -124,7 +125,11 @@ export function Project() {
             {sessions.map((s) => (
               <li key={s.id} className="flex items-center justify-between px-3 py-2 hover:bg-muted/50">
                 <Link to={`/session/${s.id}`} className="flex-1 flex items-center gap-2 min-w-0">
-                  <MessageSquare className="size-3.5 opacity-70 shrink-0" />
+                  {isCoderSessionName(s.name) ? (
+                    <Code className="size-3.5 opacity-70 shrink-0" />
+                  ) : (
+                    <MessageSquare className="size-3.5 opacity-70 shrink-0" />
+                  )}
                   <span className="truncate text-sm">{s.name}</span>
                   <span className="text-xs text-muted-foreground font-mono ml-2 shrink-0">
                     {s.model}