fix(core): respect repository git semantics

.changeset/calm-moves-cache.md

@@ -1,5 +0,0 @@
----
-"@opencode-ai/core": patch
----
-
-Preserve prompt cache prefixes when sessions move between locations with unchanged instructions.

.changeset/quiet-forms-replace-questions.md

@@ -1,8 +0,0 @@
----
-"@opencode-ai/core": minor
-"@opencode-ai/schema": minor
-"@opencode-ai/protocol": minor
-"@opencode-ai/client": minor
----
-
-Remove the unused question request API and use session forms for question tool interactions.

.changeset/shell-permission-scan.md

@@ -1,9 +0,0 @@
----
-"@opencode-ai/core": minor
-"@opencode-ai/schema": minor
-"@opencode-ai/protocol": minor
-"@opencode-ai/client": minor
----
-
-Add an opt-in portable shell permission scanner. Opaque commands use normal shell authorization without inferring
-external directories, while the default tree-sitter path remains unchanged.

.github/TEAM_MEMBERS

@@ -10,7 +10,6 @@ kitlangton
 kommander
 ludvigrask
 MrMushrooooom
-neriousy
 nexxeln
 R44VC0RP
 rekram1-node

.github/workflows/publish.yml

@@ -6,6 +6,7 @@ on:
     branches:
       - ci
       - dev
+      - v2
       - beta
       - fix/npm-native-binary-install
       - snapshot-*

.github/workflows/test.yml

@@ -55,12 +55,6 @@ jobs:
           git config --global user.email "bot@opencode.ai"
           git config --global user.name "opencode"
 
-      - name: Install ffmpeg
-        if: runner.os == 'Linux'
-        run: |
-          sudo apt-get update
-          sudo apt-get install --yes ffmpeg
-
       - name: Cache Turbo
         uses: actions/cache@0057852bfaa89a56745cba8c7296529d2fc39830 # v4.3.0
         with:

.opencode/glossary/he.md

@@ -1,48 +0,0 @@
-# he Glossary
-
-## Sources
-
-- Hebrew Academy approved IT terminology: https://terms.hebrew-academy.org.il/Millonim/ShowMillon?KodMillon=192
-- Firefox Hebrew localization corpus: https://github.com/mozilla-l10n/firefox-l10n/tree/main/he
-- KDE Hebrew localization team and corpus: https://l10n.kde.org/team-infos.php?teamcode=he
-- Community-maintained VS Code Hebrew language pack: https://github.com/AMAARETS/vscode-language-pack-he
-- Microsoft Hebrew developer documentation for Git terminology: https://learn.microsoft.com/he-il/power-platform/alm/tutorials/github-actions-deploy
-- W3C guidance for bidirectional text: https://www.w3.org/International/articles/strings-and-bidi/
-
-## Do Not Translate (Locale Additions)
-
-- `OpenCode` (preserve casing in prose and UI copy)
-- `API`, `MCP`, `LSP`, `OAuth`, `Git`, model names, and provider names
-- Commands, flags, keyboard shortcuts, file paths, URLs, identifiers, hashes, and code literals
-- Keep `commit` and `diff` when they name the exact Git artifact or operation
-
-## Preferred Terms
-
-| English / Context | Preferred     | Notes                                                                     |
-| ----------------- | ------------- | ------------------------------------------------------------------------- |
-| session           | `הפעלה`       | Use `שיחה` only when the source specifically means a chat or conversation |
-| workspace         | `סביבת עבודה` |                                                                           |
-| terminal          | `מסוף`        | Prefer the established Hebrew term over transliteration                   |
-| command           | `פקודה`       |                                                                           |
-| provider          | `ספק`         | Use `ספק מודלים` where the bare noun is ambiguous                         |
-| model             | `מודל`        |                                                                           |
-| API key           | `מפתח API`    | Keep the acronym in Latin letters                                         |
-| plugin            | `תוסף`        |                                                                           |
-| repository        | `מאגר`        | Use `מאגר Git` where context is ambiguous                                 |
-| branch            | `ענף`         |                                                                           |
-| context           | `הקשר`        | Use `חלון הקשר` for context window                                        |
-| tokens            | `אסימונים`    |                                                                           |
-
-## Guidance
-
-- Prefer natural modern Israeli Hebrew over word-for-word translation or obscure coined terms.
-- Use short action verbs for controls and translate complete phrases in context.
-- Keep recognized developer acronyms and exact Git vocabulary in Latin script instead of phonetic transliteration.
-- Treat embedded code, paths, commands, shortcuts, hashes, model IDs, and other Latin technical artifacts as LTR content inside the RTL interface.
-- Keep recurring concepts consistent and do not collapse session, chat, run, and launch into one Hebrew term.
-
-## Avoid
-
-- Avoid transliterations such as `טרמינל`, `פלאגין`, and `קומנד` when `מסוף`, `תוסף`, and `פקודה` are clear.
-- Avoid translating `commit` as `התחייבות`.
-- Avoid inventing Hebrew expansions for `API`, `MCP`, or `LSP`.

.opencode/skills/opencode-drive/SKILL.md

@@ -0,0 +1,253 @@
+---
+name: opencode-drive
+description: Use when an agent needs drive OpenCode via a script or interact with an isolated instance
+---
+
+# OpenCode Drive
+
+Use `opencode-drive` to launch an isolated OpenCode instance and control it via commands or a script.
+
+There are two modes. Always default to using a script unless specifically directed to be interactive (connect
+to an existing running instance, or start a new one, and make a few changes to the UI and read it, and iterate
+on changes).
+
+Scripts allow you to run a full walkthrough in one run. When the script is done opencode-drive exits,
+stops all processes, and cleans up all artifacts.
+
+# Prepare The Environment
+
+Use `init` when files must be added to the isolated home or project before OpenCode starts. It prints the artifact directory without launching OpenCode. A later `start` with the same name reuses it.
+
+```bash
+artifacts=$(opencode-drive init --name demo)
+cp -R ./fixtures/home/. "$artifacts/"
+cp -R ./fixtures/project/. "$artifacts/files/"
+opencode-drive start --name demo --dev ~/projects/opencode
+```
+
+The simulated project is under `$artifacts/files`. Running `start` without a prior `init` initializes the artifacts automatically.
+
+# Scripted usage
+
+You can write scripts that walk through entire flows, and gives you full access to controlling
+the backend too. See examples of the script API at the bottom of this file.
+
+After creating or editing a script, always typecheck it before running. Never skip this step:
+
+```bash
+opencode-drive check ./reproduce-stale-exploring-empty.ts
+```
+
+Run it by passing `--script` to start:
+
+```bash
+opencode-drive start --name auto-stop-reproduction --script ./reproduce-stale-exploring-empty.ts
+```
+
+It will output information about the run, including paths to log files which you can read
+to inspect what happened. If you need to dig into failures that aren't clear, read those log
+files. If the script is unsuccessful, automatically fix the script and run it again.
+
+Scripts use one typed definition object. `setup` runs before OpenCode starts,
+and `fs.writeFile` always writes inside the simulated project.
+
+You can read the full typed API here: https://raw.githubusercontent.com/jlongster/opencode-drive/refs/heads/main/src/script/types.ts
+
+```ts
+import { defineScript } from "opencode-drive"
+
+export default defineScript({
+  async setup({ fs, config }) {
+    config.autoupdate = false
+    await fs.writeFile("src/example.ts", "export const value = 1\n")
+  },
+
+  async run({ ui, llm }) {
+    await ui.submit("Open src/example.ts")
+    await llm.send(llm.text("The file exports `value`."))
+    await ui.waitFor("The file exports `value`.")
+  },
+})
+```
+
+`setup` receives the current OpenCode config object, which starts from the
+default drive config unless the prepared instance already has one. When a script
+needs custom config, mutate this `config` parameter instead of generating and
+writing a new config object from scratch, so the script keeps the default
+provider/model settings unless it intentionally changes them.
+
+Note that the simulated model is a GPT model type, and opencode uses the `patch` tool for working with files Do not use a `edit` or `write` tool to edit files.
+
+Use `launch: "manual"` when the script needs to launch the server and every TUI
+itself (this is extremely rare, do not use this unless explicitly asked). In this
+mode `ui` is typed as `null`; call `server.launch()` exactly
+once before launching clients. Each `clients.launch(name)` result provides the
+same UI methods as the automatic client. You can see an example of this API
+here: https://raw.githubusercontent.com/jlongster/opencode-drive/refs/heads/main/examples/multiple-clients.ts
+
+Use the exported `wait(milliseconds)` utility for an unconditional delay.
+
+`await llm.send(...)` waits for the next request and resolves after OpenCode
+acknowledges its complete response. `llm.queue(...)` declares responses in
+advance. Chunks may be built with `text`, `reasoning`, `toolCall`, `raw`,
+`finish`, and `disconnect`. A normal response receives `finish("stop")`
+automatically unless it yields or queues an explicit terminal event.
+
+`llm.text(text, { delay, chunkSize })` defaults to a 2 ms delay and a
+15-character target varied by plus or minus 5 per chunk.
+
+`llm.reasoning` accepts the same options, and `llm.pause(milliseconds)` adds a
+delay between any two outputs.
+
+Use `llm.serve` for an ongoing typed response generator:
+
+```ts
+llm.serve(async function* (request, index) {
+  yield llm.reasoning(`Handling request ${index + 1}`)
+  yield llm.text(`Received ${request.id}`)
+  yield llm.finish("stop")
+})
+```
+
+The backend connection, response cleanup, cancellation, and recording
+completion are automatic.
+
+You can see some example scripts here:
+
+- https://raw.githubusercontent.com/jlongster/opencode-drive/refs/heads/main/examples/simple.ts
+- https://raw.githubusercontent.com/jlongster/opencode-drive/refs/heads/main/examples/serve.ts
+
+## Prune
+
+- `prune` removes artifact directories. These are always cleaned up after running a script
+  successfully, but leftover on failed runs. Always call this if a script fails.
+
+```bash
+opencode-drive prune --name demo
+
+// --force cleans up all artifcat directories
+opencode-dirve prune --force
+```
+
+# Live interaction usage
+
+- Always give headless instances a unique `--name`. Visible instances may omit it.
+- A normal headless `start` detaches automatically and returns after the instance is ready.
+- Do not add `&`; the long-running owner already runs in the background.
+- Configure simulated model responses after startup when needed.
+- Send ordered UI commands with `send`.
+- Always stop the instance when finished.
+
+```bash
+opencode-drive start --name demo
+
+opencode-drive send --name demo \
+  --command.ui.type '{"text":"Explain this project"}' \
+  --command.ui.enter
+
+opencode-drive stop --name demo
+```
+
+## Send UI Commands
+
+- Every `send` opens a connection to the named instance, runs its commands in order, and exits.
+- Combine typing and Enter in one command when submitting a prompt.
+- JSON-valued commands require one JSON argument.
+- Multiple command flags execute from left to right.
+
+Commands:
+
+- `--command.ui.type <json>` types into the focused editor. Arguments: `text` string.
+- `--command.ui.press <json>` presses a key. Arguments: `key` string; optional `modifiers` object with boolean `ctrl`, `shift`, `meta`, `super`, or `hyper`.
+- `--command.ui.enter` presses Enter. Arguments: none.
+- `--command.ui.arrow <json>` presses an arrow key. Arguments: `direction` is `up`, `down`, `left`, or `right`.
+- `--command.ui.focus <json>` focuses an element. Arguments: `target` is the numeric element `num` returned by `ui.state`.
+- `--command.ui.click <json>` clicks an element. Arguments: numeric `target`, `x`, and `y`; use the element `num` returned by `ui.state` as `target`.
+- `--command.ui.state` prints focus and interactive element metadata as JSON. Arguments: none.
+- `--command.ui.matches <json>` prints whether literal, case-sensitive text appears on screen. Arguments: `text` string.
+
+```bash
+opencode-drive send --name demo \
+  --command.ui.type '{"text":"Find the relevant code and explain it"}' \
+  --command.ui.enter
+
+opencode-drive send --name demo \
+  --command.ui.press '{"key":"p","modifiers":{"ctrl":true}}'
+
+opencode-drive send --name demo \
+  --command.ui.arrow '{"direction":"down"}'
+
+opencode-drive send --name demo \
+  --command.ui.focus '{"target":12}'
+
+opencode-drive send --name demo \
+  --command.ui.click '{"target":12,"x":4,"y":1}'
+
+opencode-drive send --name demo \
+  --command.ui.matches '{"text":"OpenCode"}'
+```
+
+To read the UI state and see information about interactable elements, use the `ui.state` command:
+
+```bash
+opencode-drive send --name demo --command.ui.state
+```
+
+## Configure LLM Responses
+
+- `responses` controls what the LLM responds with
+- Only use this if you are wanting to reproduce an exact type of response
+- Defaults are `text,reasoning,diff,tool` with `write,apply_patch`.
+- Supported types are `text`, `reasoning`, `diff`, and `tool`.
+- `--tools` limits generated tool calls to names offered by OpenCode.
+
+```bash
+opencode-drive responses --name demo \
+  --types text,reasoning,diff,tool \
+  --tools write,apply_patch
+
+opencode-drive responses --name demo \
+  --types tool \
+  --tools read,glob,grep
+```
+
+## Inspect The UI
+
+- `ui.state` prints focus and interactive element metadata as JSON.
+- `ui.matches` checks for literal, case-sensitive screen text.
+- `screenshot` prints the generated image path.
+
+```bash
+opencode-drive screenshot --name demo
+```
+
+## Lifecycle
+
+- `stop` waits for recording export and owner cleanup before returning.
+
+```bash
+opencode-drive stop --name demo
+```
+
+# Record The UI
+
+- Start with `--record` to capture a headless instance from its first rendered frame.
+- `stop` finishes the recording, exports an MP4, and prints its path.
+
+```bash
+opencode-drive start --name demo --record
+
+opencode-drive send --name demo \
+  --command.ui.type '{"text":"Show me the current architecture"}' \
+  --command.ui.enter
+
+opencode-drive stop --name demo
+```
+
+# Artifacts dir
+
+- `dir` prints the artifact directory for the instance.
+
+```bash
+opencode-drive dir --name demo
+```

.opencode/tool/github-triage.ts

@@ -4,7 +4,7 @@ import { tool } from "@opencode-ai/plugin"
 const TEAM = {
   tui: ["kommander", "simonklee"],
   desktop_web: ["Hona", "Brendonovich"],
-  core: ["jlongster", "rekram1-node", "neriousy", "nexxeln", "kitlangton"],
+  core: ["jlongster", "rekram1-node", "nexxeln", "kitlangton"],
   inference: ["fwang", "MrMushrooooom", "starptech"],
   windows: ["Hona"],
 } as const

AGENTS.md

@@ -1,9 +1,8 @@
 - After changing the public Protocol or Server `HttpApi`, run `bun run generate` from `packages/client`. Do not edit `src/generated` or `src/generated-effect` directly.
 - Keep runtime dependencies directed from Schema to Core and Protocol, then from Core and Protocol to Server. Client runtime code may depend on Schema and Protocol but never Core or Server; `sdk-next` composes Client, Core, and Server.
 - Do not modify `packages/opencode` unless the user explicitly asks for V1 work. `packages/opencode` is the V1 implementation and is present for reference only. New implementation changes should land in the V2 package set: `packages/core`, `packages/cli`, `packages/server`, `packages/protocol`, `packages/schema`, and related generated client surfaces when required.
-- The default branch in this repo is `v2`.
-- Base all new branches and worktrees on `v2`, or `origin/v2` when the local `v2` ref is unavailable. Do not base them on `dev`.
-- Local `main` ref may not exist; use `v2` or `origin/v2` for diffs.
+- The default branch in this repo is `dev`.
+- Local `main` ref may not exist; use `dev` or `origin/dev` for diffs.
 
 ## Live V2 TUI Testing
 
@@ -12,20 +11,6 @@
 - The script discovers the server with `opencode2 service status`, injects its private local credential from `opencode2 service get password`, and uses the `next` TUI storage channel so tabs and other client-local state match the installed client.
 - Prefer `dev:live` over plain `bun run dev` for this workflow. An implicit managed-service connection may replace the live server when the worktree client version differs; explicit `--server` warns and continues without replacing it.
 
-## V2 TUI Stories
-
-- When a user asks for a TUI story, add a fixture-driven story under `packages/tui/src/feature-plugins/system/storybook` and register it in `index.tsx`.
-- Render the real production component rather than a visual copy. Keep submissions and other side effects local to the story so it is safe to explore repeatedly.
-- Expose the meaningful state dimensions through story keybindings and list them in `StoryFooter`; include a reset command when combinations can leave the fixture in a confusing state.
-- Run a specific story with `OPENCODE_STORY=<story-id> bun run dev:live` from the development worktree, and exercise narrow and wide terminal sizes when layout is relevant.
-
-## TUI Theme Tokens
-
-- Choose theme tokens by semantic role, not by their current color. Do not use raw `theme.hue` values or borrow an unrelated semantic token to achieve a preferred appearance.
-- Use `text.feedback` and `background.feedback` only for outcome or status feedback such as errors, warnings, success messages, and informational messages. Use `formfield` states for form-control text, ordinals, and selection markers, and `action` states for actions.
-- If the theme does not expose a token for the required semantic role, extend the theme schema, defaults, resolution, and types with that role before using it in a component. Do not repurpose the nearest-looking existing token.
-- When changing the public theme token surface, verify the built-in light and dark defaults and the custom-theme fallback path in addition to the affected TUI component.
-
 ## Branch Names
 
 Use a short branch name of at most three words, separated by hyphens. Do not use slashes or type prefixes such as `feat/` or `fix/`.
@@ -185,4 +170,4 @@ const table = sqliteTable("session", {
 - One step is one logical LLM call; its durable record covers only the model-visible span. Do not write "provider turn", and do not use bare "turn" for a single call: "turn" is reserved for the future assistant-turn unit containing all steps from prompt promotion until the session would go idle.
 - Keep EventV2 replay owner claims separate from clustered Session execution ownership.
 - Keep the Instructions algebra and built-ins in `src/instructions`; keep instruction producers with their observed domains, and keep Session History selection plus `InstructionState` and `InstructionEntry` persistence Session-owned. `InstructionDiscovery` observes ambient global and upward-project instructions. The runner composes built-ins, discovery, guidance, and entries explicitly in `loadInstructions`; there is no instruction registry.
-- `session.instructions.updated` stores only changed source keys and content hashes. Blob values live once in `instruction_blob`; `instruction_state` is a rebuildable fold cache, never primary state. Render initial instructions and chronological updates from values during request assembly. Completed compaction moves the instruction epoch; Session movement retains it so destination instruction changes are chronological, while committed revert clears it. Unavailable sources retain the last value and block only the initial complete delta.
+- `session.instructions.updated` stores only changed source keys and content hashes. Blob values live once in `instruction_blob`; `instruction_state` is a rebuildable fold cache, never primary state. Render initial instructions and chronological updates from values during request assembly. Completed compaction moves the instruction epoch; Session movement and committed revert clear it. Unavailable sources retain the last value and block only the initial complete delta.

package.json

@@ -46,9 +46,9 @@
       "@octokit/rest": "22.0.0",
       "@hono/standard-validator": "0.2.0",
       "@hono/zod-validator": "0.4.2",
-      "@opentui/core": "0.5.3",
-      "@opentui/keymap": "0.5.3",
-      "@opentui/solid": "0.5.3",
+      "@opentui/core": "0.0.0-20260808-9ecf7c0a",
+      "@opentui/keymap": "0.0.0-20260808-9ecf7c0a",
+      "@opentui/solid": "0.0.0-20260808-9ecf7c0a",
       "@tanstack/solid-virtual": "3.13.32",
       "@shikijs/stream": "4.2.0",
       "@standard-schema/spec": "1.1.0",
@@ -120,8 +120,7 @@
     "prettier": "3.6.2",
     "semver": "^7.6.0",
     "sst": "catalog:",
-    "turbo": "2.10.2",
-    "vitest": "4.1.10"
+    "turbo": "2.10.2"
   },
   "dependencies": {
     "@aws-sdk/client-s3": "3.933.0",
@@ -151,9 +150,9 @@
     "electron"
   ],
   "overrides": {
-    "@opentui/core": "catalog:",
-    "@opentui/keymap": "catalog:",
-    "@opentui/solid": "catalog:",
+    "@opentui/core": "0.0.0-20260808-9ecf7c0a",
+    "@opentui/keymap": "0.0.0-20260808-9ecf7c0a",
+    "@opentui/solid": "0.0.0-20260808-9ecf7c0a",
     "@types/bun": "catalog:",
     "@types/node": "catalog:",
     "effect": "catalog:"

packages/ai/AGENTS.md

@@ -80,7 +80,7 @@ Route defaults are request-shaping defaults such as `headers`, `limits`, `genera
 
 The four-axis decomposition is the reason DeepSeek, TogetherAI, Cerebras, Baseten, Fireworks, and DeepInfra all reuse `OpenAIChat.protocol` verbatim — each provider deployment is a 5-15 line `Route.make(...)` call instead of a 300-400 line route clone. Bug fixes in one protocol propagate to every consumer of that protocol in a single commit.
 
-When a provider supports multiple physical transports, selection remains execution policy below its semantic route. `OpenResponsesChannel.transport(...)` owns the provider-neutral Responses WebSocket concept: it prepares one final request, executes HTTP by default, strips WebSocket-disallowed fields, and passes a generic channel exchange to a per-call `WebSocketChannelExecutor` when supplied. Provider-specific Responses routes opt in with handshake and connection-age policy. `Route.streamPrepared` owns decoding and acknowledges channel completion only after successful full consumption.
+When a provider ships a non-HTTP transport (OpenAI's WebSocket Responses backend, hypothetical bidirectional streaming APIs), the seam is `Transport` — `WebSocketTransport.jsonTransport.with(...)` constructs an IO template whose `prepare` receives the route endpoint/auth at compile time, builds a WebSocket URL and message, and whose `frames` yields decoded text from the socket. Same protocol and endpoint source, different transport.
 
 ### URL Construction
 
@@ -106,7 +106,7 @@ const proxied = gateway.model("openai/gpt-4o-mini")
 Keep provider facades small and explicit:
 
 - Use branded `ProviderID.make(...)` and `ModelID.make(...)` where ids are constructed directly.
-- Use `model` for the default API path and named methods for provider-native alternatives such as OpenAI `responses` and `chat`.
+- Use `model` for the default API path and named methods for provider-native alternatives such as OpenAI `responses`, `responsesWebSocket`, and `chat`.
 - Put provider-specific setup on `.configure(...)`; do not add `model(id, overrides)` as a duplicate construction path.
 - Export lower-level `routes` arrays separately only when advanced internal wiring needs them.
 - Prefer `apiKey` as provider-specific sugar and `auth` as the explicit override; keep them mutually exclusive in provider option types with `ProviderAuthOption`.
@@ -124,10 +124,11 @@ import { model } from "@opencode-ai/ai/providers/openai/responses"
 
 const selected = model("gpt-5", {
   apiKey,
+  transport: "websocket",
 })
 ```
 
-Keep semantic APIs as separate entrypoints, such as OpenAI `chat` and `responses`. Transport is execution policy: OpenAI Responses uses HTTP by default and may receive a per-call WebSocket channel executor through `StreamOptions` without changing model or route identity.
+Keep semantic APIs as separate entrypoints, such as OpenAI `chat` and `responses`. Keep transport choices inside the semantic entrypoint settings, so OpenAI Responses HTTP and WebSocket share one entrypoint. Provider facades may still expose named selectors such as `responsesWebSocket` for direct typed call sites; the package-like contract maps its settings to those selectors before returning an executable `LanguageModel`.
 
 Do not expose `Route` in provider package settings. Route composition stays an implementation detail behind `model(...)`.
 
@@ -153,16 +154,14 @@ packages/ai/src/
     auth-options.ts         ProviderAuthOption shape, AuthOptions.bearer, AtLeastOne helper
     framing.ts              Framing type + Framing.sse
     transport/              transport implementations
-      index.ts              Transport execution types + HttpTransport / WebSocketTransport namespaces
-      websocket-channel.ts  generic sequential channel executor/driver contract
+      index.ts              Transport type + HttpTransport / WebSocketTransport namespaces
       http.ts               HttpTransport.httpJson — POST + framing
-      websocket.ts          direct one-request channel executor + raw socket adapter
+      websocket.ts          WebSocketTransport.json + WebSocketExecutor service
   protocols/
     shared.ts               ProviderShared toolkit used inside protocol impls
     openai-chat.ts          protocol + route (compose OpenAIChat.protocol)
     open-responses.ts         provider-neutral Responses protocol baseline
-    open-responses-channel.ts provider-neutral Responses WebSocket transport factory
-    openai-responses.ts       OpenAI tools/events and channel policy composed over OpenResponses
+    openai-responses.ts       OpenAI tools/events/transports composed over OpenResponses
     anthropic-messages.ts
     gemini.ts
     bedrock-converse.ts

packages/ai/README.md

@@ -315,6 +315,7 @@ import { model } from "@opencode-ai/ai/providers/openai/responses"
 
 const selected = model("gpt-5", {
   apiKey: process.env.OPENAI_API_KEY,
+  transport: "websocket",
   headers: { "x-application": "opencode" },
   limits: { context: 200_000, output: 64_000 },
 })
@@ -331,7 +332,7 @@ OpenAI Chat and OpenAI Responses are separate semantic entrypoints:
 - `@opencode-ai/ai/providers/google-vertex/responses`
 - `@opencode-ai/ai/providers/google-vertex/messages`
 
-OpenAI Responses has one semantic route and uses HTTP by default. Advanced callers may supply a per-call WebSocket channel executor through `StreamOptions`; transport policy does not change provider settings, model identity, or route identity. The provider-neutral Open Responses implementation owns the reusable WebSocket request and event contract, while each provider opts in with its own handshake and connection policy. Azure follows the same Chat/Responses split at `providers/azure/chat` and `providers/azure/responses`. Generic OpenAI-compatible Chat remains at `providers/openai-compatible`; the Responses adapter at `providers/openai-compatible/responses` uses the provider-neutral Open Responses protocol. OpenAI Responses extends that baseline with OpenAI tools, event variants, metadata, and defaults. Generic Anthropic Messages-compatible providers use `providers/anthropic-compatible`, which the named Anthropic provider composes. Google Gemini and Amazon Bedrock expose their single native API through their existing provider paths.
+Responses HTTP versus WebSocket is a scoped `transport` setting on the OpenAI Responses entrypoint, not another entrypoint. Azure follows the same Chat/Responses split at `providers/azure/chat` and `providers/azure/responses`. Generic OpenAI-compatible Chat remains at `providers/openai-compatible`; the Responses adapter at `providers/openai-compatible/responses` uses the provider-neutral Open Responses protocol. OpenAI Responses extends that baseline with OpenAI tools, event variants, metadata, defaults, and transports. Generic Anthropic Messages-compatible providers use `providers/anthropic-compatible`, which the named Anthropic provider composes. Google Gemini and Amazon Bedrock expose their single native API through their existing provider paths.
 
 Vertex Gemini, Vertex Chat, Vertex Responses, and Vertex Messages are separate API entrypoints. All accept `project`, `location`, and an optional `accessToken`; when no explicit token or auth override is supplied they lazily use Google Application Default Credentials. Vertex Gemini instead selects express mode when `apiKey` or `GOOGLE_VERTEX_API_KEY` is present. Vertex Chat targets MaaS models through the OpenAI-compatible Chat Completions endpoint, while Vertex Responses targets Grok models and defaults `store` to `false` as required by Vertex. `providers/google-vertex` remains the default alias for `providers/google-vertex/gemini`.
 

packages/ai/STATUS.md

@@ -1,6 +1,6 @@
 # LLM Provider Parity Status
 
-Last reviewed: 2026-08-07
+Last reviewed: 2026-07-24
 
 This file tracks the gap between the native `@opencode-ai/ai` package and the AI SDK provider packages that opencode still depends on for many catalog/runtime paths.
 
@@ -16,7 +16,8 @@ This file tracks the gap between the native `@opencode-ai/ai` package and the AI
 | Native slice                       | Source                                                                                                                            | Current state                                                                                                                                                            | Main gaps                                                                                                                                                                                                                                                 |
 | ---------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | OpenAI Chat                        | `src/protocols/openai-chat.ts`, `src/providers/openai.ts`                                                                         | Usable. Streams text, reasoning deltas, tool calls, usage, images, and common generation controls.                                                                       | No typed structured-output / `response_format` path. Limited typed OpenAI option surface compared with SDK escape hatches.                                                                                                                                |
-| OpenAI Responses                   | `src/protocols/open-responses.ts`, `src/protocols/openai-responses.ts`, `src/providers/openai.ts`                                 | Usable over HTTP by default, with optional per-call WebSocket channel execution on the same model and route identity.                                                    | No incremental `previous_response_id` path or persistent Session channel manager yet. Typed options cover only a subset of Responses fields. Structured output is still mostly synthetic-tool based.                                                      |
+| OpenAI Responses HTTP              | `src/protocols/open-responses.ts`, `src/protocols/openai-responses.ts`, `src/providers/openai.ts`                                 | Usable. Extends the Open Responses baseline with hosted-tool event surfacing, reasoning replay metadata, GPT-5 defaults, and cache usage.                                | No explicit `previous_response_id` path. Typed options cover only a subset of Responses fields. Structured output is still mostly synthetic-tool based.                                                                                                   |
+| OpenAI Responses WebSocket         | `src/protocols/openai-responses.ts`, `src/route/transport/websocket.ts`                                                           | Present as `OpenAI.responsesWebSocket(...)`.                                                                                                                             | Runner/catalog support explicitly must not downgrade WebSocket routes; broader runtime selection is not complete.                                                                                                                                         |
 | OpenAI-compatible Chat             | `src/protocols/openai-compatible-chat.ts`, `src/providers/openai-compatible.ts`                                                   | Usable for generic Chat and several profiles: Baseten, Cerebras, DeepInfra, DeepSeek, Fireworks, Groq, TogetherAI.                                                       | Family quirks are mostly endpoint defaults, not full typed behavior.                                                                                                                                                                                      |
 | Open Responses-compatible          | `src/protocols/open-responses.ts`, `src/protocols/openai-compatible-responses.ts`, `src/providers/openai-compatible-responses.ts` | Usable for deployments that implement the provider-neutral Open Responses protocol. The deployment adapter does not inherit OpenAI tools, events, metadata, or defaults. | No named family profiles or recorded deployment coverage yet.                                                                                                                                                                                             |
 | Anthropic-compatible Messages      | `src/protocols/anthropic-messages.ts`, `src/providers/anthropic-compatible.ts`                                                    | Usable for deployments that implement the Anthropic Messages wire protocol. Named Anthropic composes this base; MiniMax M3 has recorded text and tool-loop coverage.     | No named compatible family profiles yet.                                                                                                                                                                                                                  |
@@ -47,19 +48,19 @@ Other `aisdk:` packages, including Google Vertex, Azure, and Bedrock, currently
 
 ## AI SDK Package Parity Matrix
 
-| AI SDK package                    | Intended native target                                    | Status           | Biggest gaps                                                                                                                                                                                                        |
-| --------------------------------- | --------------------------------------------------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `@ai-sdk/openai`                  | `OpenAI.chat`, `OpenAI.responses`                         | Partial / usable | Add complete typed option coverage, structured output strategy, explicit Responses continuation support, and runner execution policy for optional WebSocket channels.                                               |
-| `@ai-sdk/openai-compatible`       | Generic OpenAI-compatible Chat and Responses              | Partial / usable | Decide per-family namespace/profile behavior and runner API selection for providers that support Responses versus Chat only.                                                                                        |
-| `@ai-sdk/anthropic`               | `AnthropicMessages`                                       | Partial / usable | Finish Messages API parity for headers/betas/metadata/newer fields and document hosted-tool continuation expectations.                                                                                              |
-| `@ai-sdk/google`                  | Gemini Developer API                                      | Partial / usable | Add typed options for safety, response schema/modalities, cached content, grounding/search/code execution, and non-text output modes where supported.                                                               |
-| `@ai-sdk/google-vertex`           | Vertex Gemini namespace/facade                            | Partial / usable | Add runner/catalog mapping, recorded coverage, and broader provider-option parity.                                                                                                                                  |
-| `@ai-sdk/google-vertex/anthropic` | Anthropic Messages over Vertex namespace/facade           | Partial / usable | Add runner/catalog mapping, recorded coverage, and Vertex-specific hosted-tool parity.                                                                                                                              |
-| `@ai-sdk/google-vertex/maas`      | Vertex Chat                                               | Partial / usable | Add runner/catalog mapping, recorded coverage, and MaaS family-specific request parity.                                                                                                                             |
-| `@ai-sdk/google-vertex/xai`       | Vertex Chat / Responses                                   | Partial / usable | Decide Chat/Responses selection for catalog models, add runner mapping and recorded coverage, and review xAI-specific request options.                                                                              |
-| `@ai-sdk/azure`                   | Azure OpenAI Chat/Responses facade                        | Partial          | Map runner/catalog metadata to native Azure, handle resourceName/baseURL/apiVersion variants, add AAD/token auth story, and verify Chat vs Responses deployment selection.                                          |
-| `@ai-sdk/amazon-bedrock`          | Bedrock Converse                                          | Partial          | Add default AWS credential chain/profile support, region/inference-profile model ID handling, provider option parity via `additionalModelRequestFields`, guardrails/performance config, and runner/catalog mapping. |
-| `@ai-sdk/amazon-bedrock/mantle`   | Bedrock Mantle OpenAI-compatible Chat/Responses namespace | Partial / usable | Add default AWS credential chain/profile support; native catalog mapping currently requires bearer auth or explicit static credentials.                                                                             |
+| AI SDK package                    | Intended native target                                         | Status           | Biggest gaps                                                                                                                                                                                                        |
+| --------------------------------- | -------------------------------------------------------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `@ai-sdk/openai`                  | `OpenAI.chat`, `OpenAI.responses`, `OpenAI.responsesWebSocket` | Partial / usable | Add complete typed option coverage, structured output strategy, explicit Responses continuation support, and runner route selection between Chat/Responses/WebSocket.                                               |
+| `@ai-sdk/openai-compatible`       | Generic OpenAI-compatible Chat and Responses                   | Partial / usable | Decide per-family namespace/profile behavior and runner API selection for providers that support Responses versus Chat only.                                                                                        |
+| `@ai-sdk/anthropic`               | `AnthropicMessages`                                            | Partial / usable | Finish Messages API parity for headers/betas/metadata/newer fields and document hosted-tool continuation expectations.                                                                                              |
+| `@ai-sdk/google`                  | Gemini Developer API                                           | Partial / usable | Add typed options for safety, response schema/modalities, cached content, grounding/search/code execution, and non-text output modes where supported.                                                               |
+| `@ai-sdk/google-vertex`           | Vertex Gemini namespace/facade                                 | Partial / usable | Add runner/catalog mapping, recorded coverage, and broader provider-option parity.                                                                                                                                  |
+| `@ai-sdk/google-vertex/anthropic` | Anthropic Messages over Vertex namespace/facade                | Partial / usable | Add runner/catalog mapping, recorded coverage, and Vertex-specific hosted-tool parity.                                                                                                                              |
+| `@ai-sdk/google-vertex/maas`      | Vertex Chat                                                    | Partial / usable | Add runner/catalog mapping, recorded coverage, and MaaS family-specific request parity.                                                                                                                             |
+| `@ai-sdk/google-vertex/xai`       | Vertex Chat / Responses                                        | Partial / usable | Decide Chat/Responses selection for catalog models, add runner mapping and recorded coverage, and review xAI-specific request options.                                                                              |
+| `@ai-sdk/azure`                   | Azure OpenAI Chat/Responses facade                             | Partial          | Map runner/catalog metadata to native Azure, handle resourceName/baseURL/apiVersion variants, add AAD/token auth story, and verify Chat vs Responses deployment selection.                                          |
+| `@ai-sdk/amazon-bedrock`          | Bedrock Converse                                               | Partial          | Add default AWS credential chain/profile support, region/inference-profile model ID handling, provider option parity via `additionalModelRequestFields`, guardrails/performance config, and runner/catalog mapping. |
+| `@ai-sdk/amazon-bedrock/mantle`   | Bedrock Mantle OpenAI-compatible Chat/Responses namespace      | Partial / usable | Add default AWS credential chain/profile support; native catalog mapping currently requires bearer auth or explicit static credentials.                                                                             |
 
 ## Highest-Risk Gaps
 
@@ -77,24 +78,24 @@ Other `aisdk:` packages, including Google Vertex, Azure, and Bedrock, currently
 
 These are implementation/API slices, not separate npm packages.
 
-| API slice                     | Package-like entrypoint                                     | Purpose                                                                                    |
-| ----------------------------- | ----------------------------------------------------------- | ------------------------------------------------------------------------------------------ |
-| OpenAI Chat                   | `@opencode-ai/ai/providers/openai/chat`                     | OpenAI `/chat/completions` semantics.                                                      |
-| OpenAI Responses              | `@opencode-ai/ai/providers/openai/responses`                | OpenAI `/responses` semantics with HTTP default and optional per-call WebSocket execution. |
-| OpenAI-compatible Chat        | `@opencode-ai/ai/providers/openai-compatible`               | Generic OpenAI-compatible `/chat/completions`.                                             |
-| Open Responses-compatible     | `@opencode-ai/ai/providers/openai-compatible/responses`     | Generic provider-neutral `/responses`.                                                     |
-| Anthropic-compatible Messages | `@opencode-ai/ai/providers/anthropic-compatible`            | Generic Anthropic-compatible `/messages`.                                                  |
-| Anthropic Messages            | `@opencode-ai/ai/providers/anthropic`                       | Anthropic Messages API.                                                                    |
-| Gemini Developer API          | `@opencode-ai/ai/providers/google`                          | Google AI Studio Gemini API.                                                               |
-| Vertex Gemini                 | `@opencode-ai/ai/providers/google-vertex/gemini`            | Vertex Gemini API; `providers/google-vertex` is the default alias.                         |
-| Vertex Chat                   | `@opencode-ai/ai/providers/google-vertex/chat`              | Vertex OpenAI-compatible Chat Completions for MaaS models.                                 |
-| Vertex Responses              | `@opencode-ai/ai/providers/google-vertex/responses`         | Vertex Open Responses for Grok models.                                                     |
-| Vertex Messages               | `@opencode-ai/ai/providers/google-vertex/messages`          | Vertex-hosted Anthropic Messages API.                                                      |
-| Bedrock Converse              | `@opencode-ai/ai/providers/amazon-bedrock`                  | AWS Bedrock Converse API.                                                                  |
-| Bedrock Mantle Chat           | `@opencode-ai/ai/providers/amazon-bedrock/mantle/chat`      | AWS Bedrock Mantle OpenAI-compatible Chat API.                                             |
-| Bedrock Mantle Responses      | `@opencode-ai/ai/providers/amazon-bedrock/mantle/responses` | AWS Bedrock Mantle OpenAI-compatible Responses API.                                        |
-| Azure OpenAI Chat             | `@opencode-ai/ai/providers/azure/chat`                      | Azure specialization of OpenAI Chat.                                                       |
-| Azure OpenAI Responses        | `@opencode-ai/ai/providers/azure/responses`                 | Azure specialization of OpenAI Responses.                                                  |
+| API slice                     | Package-like entrypoint                                     | Purpose                                                                      |
+| ----------------------------- | ----------------------------------------------------------- | ---------------------------------------------------------------------------- |
+| OpenAI Chat                   | `@opencode-ai/ai/providers/openai/chat`                     | OpenAI `/chat/completions` semantics.                                        |
+| OpenAI Responses              | `@opencode-ai/ai/providers/openai/responses`                | OpenAI `/responses` semantics with HTTP/WebSocket selected through settings. |
+| OpenAI-compatible Chat        | `@opencode-ai/ai/providers/openai-compatible`               | Generic OpenAI-compatible `/chat/completions`.                               |
+| Open Responses-compatible     | `@opencode-ai/ai/providers/openai-compatible/responses`     | Generic provider-neutral `/responses`.                                       |
+| Anthropic-compatible Messages | `@opencode-ai/ai/providers/anthropic-compatible`            | Generic Anthropic-compatible `/messages`.                                    |
+| Anthropic Messages            | `@opencode-ai/ai/providers/anthropic`                       | Anthropic Messages API.                                                      |
+| Gemini Developer API          | `@opencode-ai/ai/providers/google`                          | Google AI Studio Gemini API.                                                 |
+| Vertex Gemini                 | `@opencode-ai/ai/providers/google-vertex/gemini`            | Vertex Gemini API; `providers/google-vertex` is the default alias.           |
+| Vertex Chat                   | `@opencode-ai/ai/providers/google-vertex/chat`              | Vertex OpenAI-compatible Chat Completions for MaaS models.                   |
+| Vertex Responses              | `@opencode-ai/ai/providers/google-vertex/responses`         | Vertex Open Responses for Grok models.                                       |
+| Vertex Messages               | `@opencode-ai/ai/providers/google-vertex/messages`          | Vertex-hosted Anthropic Messages API.                                        |
+| Bedrock Converse              | `@opencode-ai/ai/providers/amazon-bedrock`                  | AWS Bedrock Converse API.                                                    |
+| Bedrock Mantle Chat           | `@opencode-ai/ai/providers/amazon-bedrock/mantle/chat`      | AWS Bedrock Mantle OpenAI-compatible Chat API.                               |
+| Bedrock Mantle Responses      | `@opencode-ai/ai/providers/amazon-bedrock/mantle/responses` | AWS Bedrock Mantle OpenAI-compatible Responses API.                          |
+| Azure OpenAI Chat             | `@opencode-ai/ai/providers/azure/chat`                      | Azure specialization of OpenAI Chat.                                         |
+| Azure OpenAI Responses        | `@opencode-ai/ai/providers/azure/responses`                 | Azure specialization of OpenAI Responses.                                    |
 
 ## Suggested Next Work Slices
 

packages/ai/example/call-sites.md

@@ -67,6 +67,7 @@ Examples:
 ```ts
 OpenAI.responses("gpt-4o")
 OpenAI.chat("gpt-4o")
+OpenAI.responsesWebSocket("gpt-4o")
 
 Azure.configure({ resourceName, apiKey }).responses("my-deployment")
 AmazonBedrock.configure({ region, credentials }).model("anthropic.claude-3-5-sonnet-20241022-v2:0")
@@ -249,6 +250,11 @@ const openAIChat = Route.make({
   auth: Auth.envBearer("OPENAI_API_KEY"),
 })
 
+const openAIResponsesWebSocket = openAIResponses.with({
+  id: "openai-responses-websocket",
+  transport: WebSocketTransport.json,
+})
+
 const openAIConfig = (input: OpenAIConfig) => ({
   endpoint: input.endpoint,
   auth: input.auth ?? (input.apiKey ? Auth.bearer(input.apiKey) : undefined),
@@ -260,11 +266,13 @@ const openAIConfig = (input: OpenAIConfig) => ({
 
 const configureOpenAI = (input: OpenAIConfig = {}) => {
   const responses = openAIResponses.with(openAIConfig(input))
+  const responsesWebSocket = openAIResponsesWebSocket.with(openAIConfig(input))
   const chat = openAIChat.with(openAIConfig(input))
 
   return {
     id: openAIProvider,
     responses: responses.model,
+    responsesWebSocket: responsesWebSocket.model,
     chat: chat.model,
     model: responses.model,
     configure: configureOpenAI,
@@ -334,19 +342,22 @@ const response =
   )
 ```
 
-For direct provider-facade calls, Responses has one semantic model and route:
+For direct provider-facade calls, HTTP versus WebSocket is represented as named
+route selectors, not as model or request overrides. Same protocol, different
+transport, different route:
 
 ```ts
 OpenAI.responses("gpt-4o")
+OpenAI.responsesWebSocket("gpt-4o")
 ```
 
-The package-like OpenAI Responses entrypoint has the same transport-neutral
-`model(...)` contract:
+The package-like OpenAI Responses entrypoint instead keeps transport scoped to
+Responses settings while preserving the same `model(...)` contract:
 
 ```ts
 import { model } from "@opencode-ai/ai/providers/openai/responses"
 
-model("gpt-4o", { apiKey })
+model("gpt-4o", { apiKey, transport: "websocket" })
 ```
 
 Vertex keeps Gemini, Chat, Responses, and Messages as separate package-like entrypoints,
@@ -376,9 +387,11 @@ import { model } from "@opencode-ai/ai/providers/google-vertex/messages"
 model("claude-sonnet-4-6", { project, location: "global" })
 ```
 
-The client does not require a different public layer for WebSocket execution.
-Responses routes use HTTP by default, and callers may pass a channel executor per
-call. Routes without channel support simply ignore that execution capability.
+The client should not require a different public layer just because a selected
+route uses WebSocket. Use one `LLMClient.layer` with HTTP and WebSocket runtime
+capabilities available; routes that do not need WebSocket simply never touch it.
+If a WebSocket route is selected in an environment without WebSocket support,
+fail with a typed transport configuration error.
 
 Azure is a route specialization with auth/path/default changes plus input
 mapping. The public API configures the Azure resource once, then selects
@@ -484,13 +497,18 @@ generic dynamic resolver:
 
 ```ts
 const model =
-  providerID === "azure" ? Azure.configure(resolvedAzureConfig).responses(apiModelID) : OpenAI.responses(apiModelID)
+  providerID === "azure"
+    ? Azure.configure(resolvedAzureConfig).responses(apiModelID)
+    : endpoint.websocket
+      ? OpenAI.responsesWebSocket(apiModelID)
+      : OpenAI.responses(apiModelID)
 ```
 
 That boundary can branch on durable config/catalog metadata and call typed
-provider APIs directly. Transport selection remains execution policy: a Session
-or other caller may pass a WebSocket channel executor per call without changing
-the model constructed by this boundary.
+provider APIs directly. A direct provider-facade boundary maps metadata like
+`endpoint.websocket` to `OpenAI.responsesWebSocket(apiModelID)`. A package-loading
+boundary passes `transport: "websocket"` to the OpenAI Responses entrypoint.
+The client runtime only executes the route carried by the resulting model.
 
 ## Competitive Shape
 
@@ -526,8 +544,9 @@ App boundary = explicit durable-config -> typed-provider call
   id.
 - No `model(id, overrides)` escape hatch. Model selection takes the model id;
   endpoint/auth/deployment customization happens by configuring the route first.
-- No transport setting on a provider or executable model. OpenAI Responses uses
-  HTTP by default and accepts an optional per-call channel executor as execution policy.
+- No transport override on an executable model or request. Direct provider
+  facades use `responses` versus `responsesWebSocket`; the package-like Responses
+  entrypoint maps its scoped `transport` setting before constructing the model.
 - No separate public `LLMClient.layerWithWebSocket`. The runtime should expose one
   client layer with the available transport capabilities.
 - No executable `ModelRef`. The executable handle is `LanguageModel`; durable model
@@ -561,10 +580,12 @@ App boundary = explicit durable-config -> typed-provider call
 - [x] Make unconfigured transports reusable constants such as
       `HttpTransport.sseJson`; keep transport functions only for configured/fresh
       state construction.
-- [x] Collapse the public WebSocket runtime split so one `LLMClient.layer` accepts
-      optional per-call channel execution without changing route identity.
+- [x] Collapse the public WebSocket runtime split so one `LLMClient.layer`
+      exposes available transport capabilities and selected routes fail with typed
+      transport config errors when a required capability is missing.
 - [x] Convert OpenAI provider APIs to provider-facade shape:
-      `OpenAI.configure(config).responses(id)` and `.chat(id)`.
+      `OpenAI.configure(config).responses(id)`, `.chat(id)`, and
+      `.responsesWebSocket(id)`.
 - [x] Convert Azure to a configured facade where resource/base URL/api version
       setup happens before selecting deployment ids.
 - [x] Split Cloudflare products into separate facades such as
@@ -578,8 +599,10 @@ App boundary = explicit durable-config -> typed-provider call
 - [ ] Decide whether a tiny `Provider.define(...)` helper is warranted after two
       or three provider conversions; start with plain objects if duplication is not
       yet painful.
-- [x] Keep executable model construction transport-neutral at the Session boundary;
-      Session-scoped execution policy supplies channel capability separately.
+- [x] Update `packages/opencode/src/session/llm/native-request.ts` to construct
+      executable models at the session boundary with explicit provider facade
+      calls, mapping catalog metadata such as `endpoint.websocket` to the correct
+      named route selector.
 - [ ] Update tests so direct route/provider tests assert route values are carried
       by executable models, and opencode/native tests assert boundary-based route
       selection.

packages/ai/example/tutorial.ts

@@ -1,6 +1,6 @@
 import { Config, Effect, Formatter, Layer, Schema, Stream } from "effect"
 import { LLM, LLMClient, LLMRequest, Message, ProviderID, Tool, ToolRuntime } from "@opencode-ai/ai"
-import { Route, Auth, Endpoint, Framing, Protocol, RequestExecutor } from "@opencode-ai/ai/route"
+import { Route, Auth, Endpoint, Framing, Protocol, RequestExecutor, WebSocketExecutor } from "@opencode-ai/ai/route"
 import { OpenAI } from "@opencode-ai/ai/providers"
 
 /**
@@ -213,7 +213,8 @@ const FakeEcho = {
 // enabled at a time so the tutorial can demonstrate generate, stream, or
 // tool-loop behavior without spending tokens on every example.
 const requestExecutorLayer = RequestExecutor.fetchLayer
-const llmClientLayer = LLMClient.layer.pipe(Layer.provide(requestExecutorLayer))
+const llmDeps = Layer.mergeAll(requestExecutorLayer, WebSocketExecutor.layer)
+const llmClientLayer = LLMClient.layer.pipe(Layer.provide(llmDeps))
 
 const program = Effect.gen(function* () {
   // yield* generateOnce
@@ -221,6 +222,6 @@ const program = Effect.gen(function* () {
   // yield* generateStructuredObject
   // yield* generateDynamicObject.pipe(Effect.andThen((response) => Effect.sync(() => console.log(response.object))))
   yield* streamWithTools
-}).pipe(Effect.provide(Layer.mergeAll(requestExecutorLayer, llmClientLayer)))
+}).pipe(Effect.provide(Layer.mergeAll(llmDeps, llmClientLayer)))
 
 Effect.runPromise(program)

packages/ai/src/protocols/index.ts

@@ -7,4 +7,3 @@ export * as OpenAICompatibleChat from "./openai-compatible-chat.js"
 export * as OpenAICompatibleResponses from "./openai-compatible-responses.js"
 export * as OpenAIResponses from "./openai-responses.js"
 export * as OpenResponses from "./open-responses.js"
-export * as OpenResponsesChannel from "./open-responses-channel.js"

packages/ai/src/protocols/open-responses-channel.ts

@@ -1,191 +0,0 @@
-import { Effect, Schema, Stream } from "effect"
-import { Headers } from "effect/unstable/http"
-import { Framing } from "../route/framing.js"
-import {
-  HttpTransport,
-  WebSocketTransport,
-  type Transport,
-  type WebSocketChannelDriver,
-  type WebSocketChannelExchange,
-} from "../route/transport/index.js"
-import * as ProviderShared from "./shared.js"
-import { OpenResponses } from "./open-responses.js"
-
-const WebSocketResponseCreate = Schema.StructWithRest(Schema.Struct({ type: Schema.tag("response.create") }), [
-  Schema.Record(Schema.String, Schema.Unknown),
-])
-const decodeMessage = ProviderShared.validateWith(Schema.decodeUnknownEffect(WebSocketResponseCreate))
-const encodeMessage = Schema.encodeSync(Schema.fromJsonString(WebSocketResponseCreate))
-const decodeEvent = Schema.decodeUnknownEffect(OpenResponses.protocol.stream.event)
-
-export interface Options {
-  readonly id: string
-  readonly name: string
-  readonly rotateAfterMs?: number
-  readonly headers?: (headers: Headers.Headers) => Headers.Headers
-  readonly driver?: (input: {
-    readonly request: Readonly<Record<string, unknown>>
-    readonly message: string
-    readonly base: WebSocketChannelDriver
-  }) => WebSocketChannelDriver
-}
-
-export interface Prepared {
-  readonly http: HttpTransport.HttpPrepared<string>
-  readonly channel?: {
-    readonly url: string
-    readonly headers: Headers.Headers
-    readonly rotateAfterMs?: number
-    readonly driver: WebSocketChannelDriver
-  }
-}
-
-const message = (body: unknown) =>
-  Effect.gen(function* () {
-    if (!ProviderShared.isRecord(body))
-      return yield* ProviderShared.invalidRequest("Open Responses WebSocket body must be a JSON object")
-    const { stream: _stream, stream_options: _streamOptions, background: _background, ...request } = body
-    const decoded = yield* decodeMessage({ ...request, type: "response.create" })
-    return { request: decoded, message: encodeMessage(decoded) }
-  })
-
-const driver = (options: Options, body: string): WebSocketChannelDriver => {
-  let responseID: string | undefined
-  let terminal = false
-  return {
-    create: () =>
-      Effect.sync(() => {
-        responseID = undefined
-        terminal = false
-        return { message: body, mode: "full" }
-      }),
-    observe: (_create, frame) =>
-      Effect.gen(function* () {
-        const event = yield* decodeEvent(frame).pipe(
-          Effect.mapError(() =>
-            ProviderShared.eventError(options.id, `Invalid ${options.name} WebSocket event`, frame),
-          ),
-        )
-        if (terminal)
-          return yield* ProviderShared.eventError(
-            options.id,
-            `${options.name} emitted ${event.type} after a terminal event`,
-            frame,
-          )
-        if (event.type === "error") {
-          terminal = true
-          yield* OpenResponses.decodeKnownErrorEvent(event).pipe(
-            Effect.mapError(() =>
-              ProviderShared.eventError(options.id, `${options.name} returned a malformed error event`, frame),
-            ),
-          )
-          return {
-            type: "provider-failure",
-            error: OpenResponses.providerFailure(options.id, event, `${options.name} stream error`),
-          }
-        }
-        if (event.type === "response.failed") {
-          terminal = true
-          if (responseID && event.response?.id && event.response.id !== responseID)
-            return yield* ProviderShared.eventError(
-              options.id,
-              `${options.name} response ID changed during execution`,
-              frame,
-            )
-          return {
-            type: "provider-failure",
-            error: OpenResponses.providerFailure(options.id, event, `${options.name} response failed`),
-          }
-        }
-        if (event.type === "response.created") {
-          const created = event.response?.id
-          if (responseID)
-            return yield* ProviderShared.eventError(
-              options.id,
-              `${options.name} emitted duplicate response.created`,
-              frame,
-            )
-          if (!created)
-            return yield* ProviderShared.eventError(
-              options.id,
-              `${options.name} response.created is missing response.id`,
-              frame,
-            )
-          responseID = created
-          return { type: "frame", frame }
-        }
-        if (!responseID)
-          return yield* ProviderShared.eventError(
-            options.id,
-            `${options.name} emitted ${event.type} before response.created`,
-            frame,
-          )
-        if (event.response?.id && event.response.id !== responseID)
-          return yield* ProviderShared.eventError(
-            options.id,
-            `${options.name} response ID changed during execution`,
-            frame,
-          )
-        if (event.type === "response.completed") {
-          terminal = true
-          return { type: "completed", frame }
-        }
-        if (event.type === "response.incomplete") {
-          terminal = true
-          return { type: "incomplete", frame }
-        }
-        return { type: "frame", frame }
-      }),
-  }
-}
-
-export const transport = <Body>(options: Options): Transport<Body, Prepared, string> => {
-  const http = HttpTransport.sseJson.with<Body>()
-  return {
-    id: http.id,
-    prepare: (input) =>
-      Effect.gen(function* () {
-        const parts = yield* HttpTransport.jsonRequestParts(input)
-        const headers = Headers.remove(options.headers?.(parts.headers) ?? parts.headers, "content-length")
-        const channel = input.webSocket
-          ? yield* Effect.gen(function* () {
-              const create = yield* message(parts.jsonBody)
-              const base = driver(options, create.message)
-              return {
-                url: yield* WebSocketTransport.toWebSocketUrl(parts.url),
-                headers,
-                rotateAfterMs: options.rotateAfterMs,
-                driver: options.driver?.({ request: create.request, message: create.message, base }) ?? base,
-              }
-            })
-          : undefined
-        return {
-          http: {
-            request: ProviderShared.jsonPost({ url: parts.url, body: parts.bodyText, headers: parts.headers }),
-            framing: Framing.sse,
-            middleware: input.middleware,
-          },
-          channel,
-        }
-      }),
-    execute: (prepared, request, runtime, executeOptions) => {
-      if (!executeOptions?.webSocket || !prepared.channel) return http.execute(prepared.http, request, runtime)
-      const exchange: WebSocketChannelExchange = {
-        id: request.id ?? "request",
-        connect: {
-          url: prepared.channel.url,
-          headers: prepared.channel.headers,
-          rotateAfterMs: prepared.channel.rotateAfterMs,
-        },
-        fallback: () =>
-          Stream.unwrap(
-            http.execute(prepared.http, request, runtime).pipe(Effect.map((execution) => execution.frames)),
-          ),
-        driver: prepared.channel.driver,
-      }
-      return executeOptions.webSocket.execute(exchange)
-    },
-  }
-}
-
-export const OpenResponsesChannel = { transport } as const

packages/ai/src/protocols/open-responses.ts

@@ -211,43 +211,11 @@ export type StreamItem = Schema.Schema.Type<typeof StreamItem>
 // event-level `error` envelope, so accept all three shapes here.
 // https://www.openresponses.org/specification
 const OpenResponsesErrorPayload = Schema.Struct({
-  type: optionalNull(Schema.String),
   code: optionalNull(Schema.String),
   message: optionalNull(Schema.String),
   param: optionalNull(Schema.String),
 })
 
-const WebSocketErrorHeader = Schema.Union([Schema.String, Schema.Number, Schema.Boolean])
-export const WebSocketErrorEvent = Schema.StructWithRest(
-  Schema.Struct({
-    type: Schema.tag("error"),
-    status: Schema.optional(Schema.Number),
-    status_code: Schema.optional(Schema.Number),
-    code: optionalNull(Schema.String),
-    message: Schema.optional(Schema.String),
-    param: optionalNull(Schema.String),
-    error: optionalNull(OpenResponsesErrorPayload),
-    headers: Schema.optional(Schema.Record(Schema.String, WebSocketErrorHeader)),
-  }),
-  [Schema.Record(Schema.String, Schema.Unknown)],
-)
-const decodeWebSocketErrorEvent = Schema.decodeUnknownEffect(WebSocketErrorEvent)
-
-export const decodeKnownErrorEvent = (event: Event) =>
-  decodeWebSocketErrorEvent({
-    ...event,
-    status: typeof event.status === "number" ? event.status : undefined,
-    status_code: typeof event.status_code === "number" ? event.status_code : undefined,
-    headers: ProviderShared.isRecord(event.headers)
-      ? Object.fromEntries(
-          Object.entries(event.headers).filter(
-            (entry): entry is [string, string | number | boolean] =>
-              typeof entry[1] === "string" || typeof entry[1] === "number" || typeof entry[1] === "boolean",
-          ),
-        )
-      : undefined,
-  })
-
 export const Event = Schema.StructWithRest(
   Schema.Struct({
     type: Schema.String,
@@ -272,9 +240,6 @@ export const Event = Schema.StructWithRest(
     message: Schema.optional(Schema.String),
     param: optionalNull(Schema.String),
     error: optionalNull(OpenResponsesErrorPayload),
-    status: Schema.optional(Schema.Unknown),
-    status_code: Schema.optional(Schema.Unknown),
-    headers: Schema.optional(Schema.Unknown),
   }),
   [Schema.Record(Schema.String, Schema.Unknown)],
 )
@@ -667,9 +632,9 @@ export type StepResult = readonly [ParserState, ReadonlyArray<LLMEvent>]
 const NO_EVENTS: StepResult["1"] = []
 
 // `response.completed` / `response.incomplete` are clean finishes that emit a
-// `finish` event; `response.failed` and `error` are hard failures. All four end
-// the stream, so keep this set aligned with `step` and the protocol's terminal predicate.
-const TERMINAL_TYPES = new Set(["error", "response.completed", "response.incomplete", "response.failed"])
+// `finish` event; `response.failed` is a hard failure. All three end the stream,
+// so keep this set aligned with `step` and the protocol's terminal predicate.
+const TERMINAL_TYPES = new Set(["response.completed", "response.incomplete", "response.failed"])
 export const terminal = (event: Event) => TERMINAL_TYPES.has(event.type)
 
 const onOutputTextDelta = (state: ParserState, event: Event, id: string): StepResult => {
@@ -1001,24 +966,16 @@ const providerErrorMessage = (event: Event, fallback: string): string => {
   return message || code || fallback
 }
 
-export const providerFailure = (id: string, event: Event, fallback: string) => {
+const providerError = (state: ParserState, event: Event, fallback: string) => {
   const code = event.code || event.error?.code || event.response?.error?.code || undefined
   const message = providerErrorMessage(event, fallback)
-  const status =
-    typeof event.status === "number"
-      ? event.status
-      : typeof event.status_code === "number"
-        ? event.status_code
-        : undefined
   return new AIError({
-    module: id,
+    module: state.id,
     method: "stream",
-    reason: classifyProviderFailure({ message, code, status }),
+    reason: classifyProviderFailure({ message, code }),
   })
 }
 
-const providerError = (state: ParserState, event: Event, fallback: string) => providerFailure(state.id, event, fallback)
-
 export const step = (state: ParserState, event: Event) => {
   if (event.type === "response.output_text.delta" || event.type === "response.output_text.done") {
     if (!event.item_id) return ProviderShared.eventError(state.id, `${event.type} is missing item_id`)
@@ -1058,11 +1015,7 @@ export const step = (state: ParserState, event: Event) => {
   if (event.type === "response.completed" || event.type === "response.incomplete")
     return Effect.succeed(onResponseFinish(state, event))
   if (event.type === "response.failed") return providerError(state, event, `${state.name} response failed`)
-  if (event.type === "error")
-    return decodeKnownErrorEvent(event).pipe(
-      Effect.mapError(() => ProviderShared.eventError(state.id, `${state.name} returned a malformed error event`)),
-      Effect.flatMap(() => providerError(state, event, `${state.name} stream error`)),
-    )
+  if (event.type === "error") return providerError(state, event, `${state.name} stream error`)
   return Effect.succeed<StepResult>([state, NO_EVENTS])
 }
 

packages/ai/src/protocols/openai-responses-channel.ts

@@ -1,164 +0,0 @@
-import { AIError, TransportReason } from "../schema/index.js"
-import type { ChannelCheckpoint, ChannelObservation, WebSocketChannelDriver } from "../route/transport/index.js"
-import { Effect, Option, Schema } from "effect"
-import * as ProviderShared from "./shared.js"
-import { OpenResponses } from "./open-responses.js"
-
-const PROTOCOL = "openai-responses.websocket.v1"
-const VERSION = 1
-const decodeEvent = Schema.decodeUnknownEffect(OpenResponses.protocol.stream.event)
-
-interface CheckpointValue {
-  readonly version: typeof VERSION
-  readonly responseID: string
-  readonly request: Readonly<Record<string, unknown>>
-  readonly output: ReadonlyArray<unknown>
-}
-
-export interface DriverInput {
-  readonly id: string
-  readonly name: string
-  readonly request: Readonly<Record<string, unknown>>
-  readonly message: string
-  readonly base: WebSocketChannelDriver
-}
-
-const checkpointValue = (checkpoint: ChannelCheckpoint | undefined): CheckpointValue | undefined => {
-  if (checkpoint?.protocol !== PROTOCOL || !ProviderShared.isRecord(checkpoint.value)) return undefined
-  if (checkpoint.value.version !== VERSION) return undefined
-  if (typeof checkpoint.value.responseID !== "string" || checkpoint.value.responseID.trim().length === 0)
-    return undefined
-  if (!ProviderShared.isRecord(checkpoint.value.request) || !Array.isArray(checkpoint.value.output)) return undefined
-  return {
-    version: VERSION,
-    responseID: checkpoint.value.responseID,
-    request: checkpoint.value.request,
-    output: checkpoint.value.output,
-  }
-}
-
-const canonical = (value: unknown): string => {
-  if (value === undefined) return "undefined"
-  if (Array.isArray(value)) return `[${value.map(canonical).join(",")}]`
-  if (!ProviderShared.isRecord(value)) return ProviderShared.encodeJson(value)
-  return `{${Object.keys(value)
-    .sort()
-    .map((key) => `${ProviderShared.encodeJson(key)}:${canonical(value[key])}`)
-    .join(",")}}`
-}
-
-const json = (value: unknown) => {
-  if (typeof value !== "string") return value
-  return Option.getOrElse(Schema.decodeUnknownOption(ProviderShared.Json)(value), () => value)
-}
-
-const comparable = (value: unknown) => {
-  if (!ProviderShared.isRecord(value)) return value
-  if (value.type === "message" && value.role === "assistant")
-    return {
-      role: "assistant",
-      content: value.content,
-      ...(value.phase === undefined ? {} : { phase: value.phase }),
-    }
-  if (value.type === "function_call")
-    return {
-      type: value.type,
-      call_id: value.call_id,
-      name: value.name,
-      arguments: json(value.arguments),
-    }
-  if (value.type === "reasoning")
-    return {
-      type: value.type,
-      summary: value.summary,
-      encrypted_content: value.encrypted_content,
-    }
-  return value
-}
-
-const invariant = (request: Readonly<Record<string, unknown>>) => {
-  const { type: _type, input: _input, previous_response_id: _previousResponseID, ...rest } = request
-  return rest
-}
-
-const incremental = (
-  request: Readonly<Record<string, unknown>>,
-  checkpoint: CheckpointValue,
-): ReadonlyArray<unknown> | undefined => {
-  const input = request.input
-  const previousInput = checkpoint.request.input
-  if (!Array.isArray(input) || !Array.isArray(previousInput)) return undefined
-  if (canonical(invariant(request)) !== canonical(invariant(checkpoint.request))) return undefined
-  const baseline = [...previousInput, ...checkpoint.output]
-  if (input.length <= baseline.length) return undefined
-  if (!baseline.every((item, index) => canonical(comparable(item)) === canonical(comparable(input[index]))))
-    return undefined
-  return input.slice(baseline.length)
-}
-
-const code = (event: OpenResponses.Event) => event.code || event.error?.code || event.response?.error?.code || undefined
-
-const rejected = (
-  input: DriverInput,
-  observation: Extract<ChannelObservation, { readonly type: "provider-failure" }>,
-  recovery: "retry-full" | "rotate-and-retry-full",
-): ChannelObservation => ({
-  type: "rejected",
-  recovery,
-  error: new AIError({
-    module: input.id,
-    method: "stream",
-    reason: new TransportReason({
-      message: observation.error.message,
-      transport: "websocket",
-      operation: "read",
-      phase: "receive",
-      delivery: "rejected",
-      recovery,
-    }),
-  }),
-})
-
-export const driver = (input: DriverInput): WebSocketChannelDriver => {
-  const { previous_response_id: _previousResponseID, ...request } = input.request
-  let output: unknown[] = []
-  return {
-    create: (checkpoint) =>
-      Effect.sync(() => {
-        output = []
-        const previous = checkpointValue(checkpoint)
-        const delta = previous ? incremental(request, previous) : undefined
-        if (!previous || !delta) return { message: ProviderShared.encodeJson(request), mode: "full" as const }
-        return {
-          message: ProviderShared.encodeJson({ ...request, input: delta, previous_response_id: previous.responseID }),
-          mode: "incremental" as const,
-        }
-      }),
-    observe: (create, frame) =>
-      Effect.gen(function* () {
-        const event = yield* decodeEvent(frame).pipe(
-          Effect.mapError(() => ProviderShared.eventError(input.id, `Invalid ${input.name} WebSocket event`, frame)),
-        )
-        const observation = yield* input.base.observe(create, frame)
-        if (event.type === "response.output_item.done" && event.item) output.push(event.item)
-        if (observation.type === "provider-failure") {
-          const rejection = code(event)
-          if (rejection === "previous_response_not_found") return rejected(input, observation, "retry-full")
-          if (rejection === "websocket_connection_limit_reached")
-            return rejected(input, observation, "rotate-and-retry-full")
-        }
-        if (observation.type !== "completed") return observation
-        const responseID = event.response?.id
-        if (!responseID || responseID.trim().length === 0) return observation
-        return {
-          ...observation,
-          checkpoint: {
-            protocol: PROTOCOL,
-            value: { version: VERSION, responseID, request, output: output.slice() } satisfies CheckpointValue,
-          },
-        }
-      }),
-  }
-}
-
-export const OpenAIResponsesChannel = { driver } as const

packages/ai/src/protocols/openai-responses.ts

@@ -1,23 +1,18 @@
 import { Effect, Encoding, Schema } from "effect"
-import { Headers } from "effect/unstable/http"
 import { Route } from "../route/client.js"
 import { Auth } from "../route/auth.js"
 import { Endpoint } from "../route/endpoint.js"
 import { Protocol } from "../route/protocol.js"
-import { HttpTransport } from "../route/transport/index.js"
+import { HttpTransport, WebSocketTransport } from "../route/transport/index.js"
 import { LLMEvent, LLMRequest, type JsonSchema, type ToolDefinition } from "../schema/index.js"
 import { OpenResponses } from "./open-responses.js"
 import { optionalArray, ProviderShared } from "./shared.js"
 import { Lifecycle } from "./utils/lifecycle.js"
 import { OpenAIImage } from "./utils/openai-image.js"
 import { ToolSchemaProjection } from "./utils/tool-schema.js"
-import { OpenResponsesChannel } from "./open-responses-channel.js"
-import { OpenAIResponsesChannel } from "./openai-responses-channel.js"
 
 const ADAPTER = "openai-responses"
 const NAME = "OpenAI Responses"
-const WEBSOCKET_PROTOCOL_HEADER = "responses_websockets=2026-02-06"
-const WEBSOCKET_ROTATE_AFTER_MS = 55 * 60 * 1000
 export const DEFAULT_BASE_URL = "https://api.openai.com/v1"
 export const PATH = OpenResponses.PATH
 
@@ -62,6 +57,16 @@ const OpenAIResponsesBody = Schema.Struct({
 })
 export type OpenAIResponsesBody = Schema.Schema.Type<typeof OpenAIResponsesBody>
 
+const OpenAIResponsesWebSocketMessage = Schema.StructWithRest(
+  Schema.Struct({
+    type: Schema.tag("response.create"),
+    ...OpenAIResponsesCoreFields,
+  }),
+  [Schema.Record(Schema.String, Schema.Unknown)],
+)
+type OpenAIResponsesWebSocketMessage = Schema.Schema.Type<typeof OpenAIResponsesWebSocketMessage>
+const encodeWebSocketMessage = Schema.encodeSync(Schema.fromJsonString(OpenAIResponsesWebSocketMessage))
+
 const extension = {
   id: ADAPTER,
   name: NAME,
@@ -244,13 +249,6 @@ const endpoint = Endpoint.path<OpenAIResponsesBody>(PATH, { baseURL: DEFAULT_BAS
 const auth = Auth.none
 
 export const httpTransport = HttpTransport.sseJson.with<OpenAIResponsesBody>()
-export const transport = OpenResponsesChannel.transport<OpenAIResponsesBody>({
-  id: ADAPTER,
-  name: NAME,
-  rotateAfterMs: WEBSOCKET_ROTATE_AFTER_MS,
-  headers: (headers) => Headers.set(headers, "openai-beta", headers["openai-beta"] ?? WEBSOCKET_PROTOCOL_HEADER),
-  driver: (input) => OpenAIResponsesChannel.driver({ id: ADAPTER, name: NAME, ...input }),
-})
 
 export const route = Route.make({
   id: ADAPTER,
@@ -259,7 +257,36 @@ export const route = Route.make({
   protocol,
   endpoint,
   auth,
-  transport,
+  transport: httpTransport,
+  defaults: { providerOptions: { openai: { store: false } } },
+})
+
+const decodeWebSocketMessage = ProviderShared.validateWith(Schema.decodeUnknownEffect(OpenAIResponsesWebSocketMessage))
+
+const webSocketMessage = (body: OpenAIResponsesBody | Record<string, unknown>) =>
+  Effect.gen(function* () {
+    if (!ProviderShared.isRecord(body))
+      return yield* ProviderShared.invalidRequest("OpenAI Responses WebSocket body must be a JSON object")
+    const { stream: _stream, ...message } = body
+    return yield* decodeWebSocketMessage({ ...message, type: "response.create" })
+  })
+
+export const webSocketTransport = WebSocketTransport.jsonTransport.with<
+  OpenAIResponsesBody,
+  OpenAIResponsesWebSocketMessage
+>({
+  toMessage: webSocketMessage,
+  encodeMessage: encodeWebSocketMessage,
+})
+
+export const webSocketRoute = Route.make({
+  id: `${ADAPTER}-websocket`,
+  provider: "openai",
+  providerMetadataKey: "openai",
+  protocol,
+  endpoint,
+  auth,
+  transport: webSocketTransport,
   defaults: { providerOptions: { openai: { store: false } } },
 })
 

packages/ai/src/provider-error.ts

@@ -67,7 +67,6 @@ const SERVER_CODES = new Set([
   "overloaded_error",
   "server_error",
   "server_is_overloaded",
-  "slow_down",
   "serviceunavailableexception",
 ])
 const INVALID_REQUEST_CODES = new Set(["invalid_prompt", "invalid_request_error", "validationexception"])

packages/ai/src/providers/openai.ts

@@ -12,7 +12,7 @@ export type { OpenAIImageOptions } from "../protocols/openai-images.js"
 
 export const id = ProviderID.make("openai")
 
-export const routes = [OpenAIResponses.route, OpenAIChat.route]
+export const routes = [OpenAIResponses.route, OpenAIResponses.webSocketRoute, OpenAIChat.route]
 
 // This provider facade wraps the lower-level Responses and Chat model factories
 // with OpenAI-specific conveniences: typed options, API-key sugar, env fallback,
@@ -63,6 +63,7 @@ export interface Settings extends ProviderPackage.Settings {
   readonly organization?: string
   readonly project?: string
   readonly queryParams?: Readonly<Record<string, string>>
+  readonly transport?: "http" | "websocket"
   readonly providerOptions?: OpenAIProviderOptionsInput
 }
 
@@ -81,12 +82,17 @@ const configuredRoute = <Body, Prepared>(route: Route<Body, Prepared>, input: Co
 
 export const configure = (input: Config = {}) => {
   const responsesRoute = configuredRoute(OpenAIResponses.route, input)
+  const responsesWebSocketRoute = configuredRoute(OpenAIResponses.webSocketRoute, input)
   const chatRoute = configuredRoute(OpenAIChat.route, input)
   const modelDefaults = defaults(input)
   const responses = (id: string | ModelID) =>
     responsesRoute
       .with(withOpenAIOptions(id, modelDefaults, { textVerbosity: true }))
       .model<OpenAIProviderOptionsInput>({ id })
+  const responsesWebSocket = (id: string | ModelID) =>
+    responsesWebSocketRoute
+      .with(withOpenAIOptions(id, modelDefaults, { textVerbosity: true }))
+      .model<OpenAIProviderOptionsInput>({ id })
   const chat = (id: string | ModelID) =>
     chatRoute.with(withOpenAIOptions(id, modelDefaults)).model<OpenAIProviderOptionsInput>({ id })
   const image = (modelID: string | ModelID) =>
@@ -105,6 +111,7 @@ export const configure = (input: Config = {}) => {
     id,
     model: responses,
     responses,
+    responsesWebSocket,
     chat,
     image,
     configure,
@@ -131,7 +138,10 @@ const config = (settings: Settings): Config => {
 }
 
 export const model: ProviderPackage.Definition<Settings, OpenAIProviderOptionsInput>["model"] = (modelID, settings) => {
-  return configure(config(settings)).responses(modelID)
+  const configured = configure(config(settings))
+  if (settings.transport === undefined || settings.transport === "http") return configured.responses(modelID)
+  if (settings.transport === "websocket") return configured.responsesWebSocket(modelID)
+  throw new Error(`Unsupported OpenAI Responses transport: ${String(settings.transport)}`)
 }
 
 export const chatModel: ProviderPackage.Definition<Settings, OpenAIProviderOptionsInput>["model"] = (
@@ -139,5 +149,6 @@ export const chatModel: ProviderPackage.Definition<Settings, OpenAIProviderOptio
   settings,
 ) => configure(config(settings)).chat(modelID)
 export const responses = provider.responses
+export const responsesWebSocket = provider.responsesWebSocket
 export const chat = provider.chat
 export const image = provider.image

packages/ai/src/route/client.ts

@@ -1,10 +1,12 @@
 import { Cause, Context, Effect, Layer, Schema, Stream } from "effect"
+import * as Option from "effect/Option"
 import { Auth } from "./auth.js"
 import { Endpoint, type EndpointPatch } from "./endpoint.js"
 import { RequestExecutor } from "./executor.js"
 import { Framing } from "./framing.js"
 import { HttpTransport } from "./transport/index.js"
-import type { HttpMiddleware, Transport, TransportRuntime, WebSocketChannelExecutor } from "./transport/index.js"
+import type { HttpMiddleware, Transport, TransportRuntime } from "./transport/index.js"
+import { WebSocketExecutor } from "./transport/index.js"
 import type { Protocol } from "./protocol.js"
 import { applyCachePolicy } from "../cache-policy.js"
 import * as ProviderShared from "../protocols/shared.js"
@@ -56,7 +58,6 @@ export interface Route<Body, Prepared = unknown> {
     prepared: Prepared,
     request: LLMRequest,
     runtime: TransportRuntime,
-    options?: StreamOptions,
   ) => Stream.Stream<LLMEvent, AIError>
 }
 
@@ -156,7 +157,6 @@ export interface Interface {
 
 export interface StreamOptions {
   readonly http?: HttpMiddleware
-  readonly webSocket?: WebSocketChannelExecutor
 }
 
 export interface StreamMethod {
@@ -314,29 +314,23 @@ function makeFromTransport<Body, Prepared, Frame, Event, State>(
           encodeBody,
           headers: routeInput.headers,
           middleware: options?.http,
-          webSocket: options?.webSocket,
         }),
-      streamPrepared: (prepared: Prepared, request: LLMRequest, runtime: TransportRuntime, options?: StreamOptions) => {
+      streamPrepared: (prepared: Prepared, request: LLMRequest, runtime: TransportRuntime) => {
         const route = `${request.model.provider}/${request.model.route.id}`
-        return Stream.unwrap(
-          routeInput.transport.execute(prepared, request, runtime, options).pipe(
-            Effect.map((execution) => {
-              const events = execution.frames.pipe(
-                Stream.mapEffect(decodeEvent(route)),
-                protocol.stream.terminal ? Stream.takeUntil(protocol.stream.terminal) : (stream) => stream,
-              )
-              const stream = events.pipe(
-                Stream.mapAccumEffect(
-                  () => protocol.stream.initial(request),
-                  protocol.stream.step,
-                  protocol.stream.onHalt ? { onHalt: protocol.stream.onHalt } : undefined,
-                ),
-                Stream.catchCause((cause) => Stream.fail(streamError(route, `Failed to read ${route} stream`, cause))),
-                requireTerminalEvent(route),
-              )
-              return execution.complete ? stream.pipe(Stream.onEnd(execution.complete)) : stream
-            }),
+        const events = routeInput.transport
+          .frames(prepared, request, runtime)
+          .pipe(
+            Stream.mapEffect(decodeEvent(route)),
+            protocol.stream.terminal ? Stream.takeUntil(protocol.stream.terminal) : (stream) => stream,
+          )
+        return events.pipe(
+          Stream.mapAccumEffect(
+            () => protocol.stream.initial(request),
+            protocol.stream.step,
+            protocol.stream.onHalt ? { onHalt: protocol.stream.onHalt } : undefined,
           ),
+          Stream.catchCause((cause) => Stream.fail(streamError(route, `Failed to read ${route} stream`, cause))),
+          requireTerminalEvent(route),
         )
       },
     } satisfies Route<Body, Prepared>
@@ -419,7 +413,7 @@ const streamRequestWith = (runtime: TransportRuntime) => (request: LLMRequest, o
   Stream.unwrap(
     Effect.gen(function* () {
       const compiled = yield* compile(request, options)
-      return compiled.route.streamPrepared(compiled.prepared, compiled.request, runtime, options)
+      return compiled.route.streamPrepared(compiled.prepared, compiled.request, runtime)
     }),
   )
 
@@ -457,6 +451,7 @@ export const layer: Layer.Layer<Service, never, RequestExecutor.Service> = Layer
   Effect.gen(function* () {
     const stream = streamRequestWith({
       http: yield* RequestExecutor.Service,
+      webSocket: Option.getOrUndefined(yield* Effect.serviceOption(WebSocketExecutor.Service)),
     })
     return Service.of({ stream, generate: generateWith(stream) })
   }),

packages/ai/src/route/executor.ts

@@ -34,8 +34,44 @@ export type HttpMiddleware = (
 
 export class Service extends Context.Service<Service, Interface>()("@opencode/AI/RequestExecutor") {}
 
-const headerDetails = (headers: Headers.Headers) =>
-  Object.fromEntries(Object.entries(headers).map(([name, value]) => [name, String(value)]))
+const BODY_LIMIT = 16_384
+const REDACTED = "<redacted>"
+
+// One source of truth for what counts as a sensitive name across headers,
+// URL query keys, and field names embedded inside request/response bodies.
+//
+// `SENSITIVE_NAME` is used as both a substring matcher (for free-form header
+// names like `Authorization` / `X-API-Key`) and as the body-field alternation
+// list. `SHORT_QUERY_NAME` covers anchored short keys like `?key=…` / `?sig=…`
+// that are too generic to redact substring-style without false positives.
+const SENSITIVE_NAME_SOURCE =
+  "authorization|api[-_]?key|access[-_]?token|refresh[-_]?token|id[-_]?token|token|secret|credential|signature|x-amz-signature"
+const SENSITIVE_NAME = new RegExp(SENSITIVE_NAME_SOURCE, "i")
+const SHORT_QUERY_NAME = /^(key|sig)$/i
+const SENSITIVE_BODY_FIELD = new RegExp(`(?:${SENSITIVE_NAME_SOURCE}|key)`, "i")
+const REDACT_JSON_FIELD = new RegExp(`("(?:${SENSITIVE_BODY_FIELD.source})"\\s*:\\s*)"[^"]*"`, "gi")
+const REDACT_QUERY_FIELD = new RegExp(`((?:${SENSITIVE_BODY_FIELD.source})=)[^&\\s"]+`, "gi")
+
+const isSensitiveHeaderName = (name: string) => SENSITIVE_NAME.test(name)
+
+const isSensitiveQueryName = (name: string) => isSensitiveHeaderName(name) || SHORT_QUERY_NAME.test(name)
+
+const redactHeaders = (headers: Headers.Headers, redactedNames: ReadonlyArray<string | RegExp>) =>
+  Object.fromEntries(
+    Object.entries(Headers.redact(headers, [...redactedNames, SENSITIVE_NAME])).map(([name, value]) => [
+      name,
+      String(value),
+    ]),
+  )
+
+const redactUrl = (value: string) => {
+  if (!URL.canParse(value)) return REDACTED
+  const url = new URL(value)
+  url.searchParams.forEach((_, key) => {
+    if (isSensitiveQueryName(key)) url.searchParams.set(key, REDACTED)
+  })
+  return url.toString()
+}
 
 const normalizedHeaders = (headers: Headers.Headers) =>
   Object.fromEntries(Object.entries(headers).map(([key, value]) => [key.toLowerCase(), value]))
@@ -108,22 +144,58 @@ const rateLimitDetails = (headers: Record<string, string>, retryAfter: number |
   })
 }
 
-const requestDetails = (request: HttpClientRequest.HttpClientRequest) =>
+const requestDetails = (request: HttpClientRequest.HttpClientRequest, redactedNames: ReadonlyArray<string | RegExp>) =>
   new HttpRequestDetails({
     method: request.method,
-    url: request.url,
-    headers: headerDetails(request.headers),
+    url: redactUrl(request.url),
+    headers: redactHeaders(request.headers, redactedNames),
   })
 
-const responseDetails = (response: HttpClientResponse.HttpClientResponse) =>
+const responseDetails = (
+  response: HttpClientResponse.HttpClientResponse,
+  redactedNames: ReadonlyArray<string | RegExp>,
+) =>
   new HttpResponseDetails({
     status: response.status,
-    headers: headerDetails(response.headers),
+    headers: redactHeaders(response.headers, redactedNames),
   })
 
-const responseBody = (body: string | void) => {
+const secretValues = (request: HttpClientRequest.HttpClientRequest) => {
+  const values = new Set<string>()
+  const add = (value: string) => {
+    if (value.length < 4) return
+    values.add(value)
+    values.add(encodeURIComponent(value))
+  }
+
+  Object.entries(request.headers).forEach(([name, value]) => {
+    if (!isSensitiveHeaderName(name)) return
+    add(value)
+    const bearer = /^Bearer\s+(.+)$/i.exec(value)?.[1]
+    if (bearer) add(bearer)
+  })
+
+  if (!URL.canParse(request.url)) return values
+  new URL(request.url).searchParams.forEach((value, key) => {
+    if (isSensitiveQueryName(key)) add(value)
+  })
+  return values
+}
+
+// Two passes: structural (redact `"name": "value"` and `name=value` patterns
+// for any field name that looks sensitive) plus literal (replace any actual
+// secret values we sent in the request, in case the response echoes one back).
+const redactBody = (body: string, secrets: ReadonlySet<string>) =>
+  Array.from(secrets).reduce(
+    (text, secret) => text.split(secret).join(REDACTED),
+    body.replace(REDACT_JSON_FIELD, `$1"${REDACTED}"`).replace(REDACT_QUERY_FIELD, `$1${REDACTED}`),
+  )
+
+const responseBody = (body: string | void, secrets: ReadonlySet<string>) => {
   if (body === undefined) return {}
-  return { body }
+  const redacted = redactBody(body, secrets)
+  if (redacted.length <= BODY_LIMIT) return { body: redacted }
+  return { body: redacted.slice(0, BODY_LIMIT), bodyTruncated: true }
 }
 
 const decodeProviderBody = Schema.decodeUnknownOption(
@@ -135,49 +207,52 @@ const decodeProviderBody = Schema.decodeUnknownOption(
   ),
 )
 
-const providerMessage = (status: number, body: string | void) => {
-  const decoded = body === undefined ? undefined : Option.getOrUndefined(decodeProviderBody(body))
-  return (
-    [decoded?.error?.message, decoded?.message].find((message) => message?.trim()) ??
-    `Provider request failed with HTTP ${status}`
-  )
+const providerMessage = (status: number, body: { readonly body?: string }) => {
+  if (body.body && body.body.length <= 500) {
+    const decoded = Option.getOrUndefined(decodeProviderBody(body.body))
+    return `Provider request failed with HTTP ${status}: ${decoded?.error?.message ?? decoded?.message ?? body.body}`
+  }
+  return `Provider request failed with HTTP ${status}`
 }
 
 const responseHttp = (input: {
   readonly request: HttpClientRequest.HttpClientRequest
   readonly response: HttpClientResponse.HttpClientResponse
+  readonly redactedNames: ReadonlyArray<string | RegExp>
   readonly body: ReturnType<typeof responseBody>
   readonly requestId?: string | undefined
   readonly rateLimit?: HttpRateLimitDetails | undefined
 }) =>
   new HttpContext({
-    request: requestDetails(input.request),
-    response: responseDetails(input.response),
+    request: requestDetails(input.request, input.redactedNames),
+    response: responseDetails(input.response, input.redactedNames),
     ...input.body,
     requestId: input.requestId,
     rateLimit: input.rateLimit,
   })
 
 const statusError =
-  (request: HttpClientRequest.HttpClientRequest) => (response: HttpClientResponse.HttpClientResponse) =>
+  (request: HttpClientRequest.HttpClientRequest, redactedNames: ReadonlyArray<string | RegExp>) =>
+  (response: HttpClientResponse.HttpClientResponse) =>
     Effect.gen(function* () {
       if (response.status < 400) return response
       const body = yield* response.text.pipe(Effect.catch(() => Effect.void))
       const headers = normalizedHeaders(response.headers)
       const retryAfter = retryAfterMs(headers)
       const rateLimit = rateLimitDetails(headers, retryAfter)
-      const details = responseBody(body)
+      const details = responseBody(body, secretValues(request))
       return yield* new AIError({
         module: "RequestExecutor",
         method: "execute",
         reason: classifyProviderFailure({
           status: response.status,
-          message: providerMessage(response.status, body),
+          message: providerMessage(response.status, details),
           retryAfterMs: retryAfter,
           rateLimit,
           http: responseHttp({
             request,
             response,
+            redactedNames,
             body: details,
             requestId: requestId(headers),
             rateLimit,
@@ -187,10 +262,10 @@ const statusError =
     })
 
 // Classifies an HTTP failure captured outside the executor (for example by the
-// AI SDK's own fetch) onto the same reason types and HttpContext that
+// AI SDK's own fetch) onto the same reason types and redacted HttpContext that
 // executor-driven requests produce. The originating request is not available on
 // that path, so the method is assumed (language model calls are always POST),
-// request headers are empty.
+// request headers are empty, and only structural body redaction applies.
 export const classifyHttpFailure = (input: {
   readonly message: string
   readonly url: string
@@ -202,7 +277,7 @@ export const classifyHttpFailure = (input: {
   const headers = normalizedHeaders(Headers.fromInput(input.responseHeaders))
   const retryAfter = retryAfterMs(headers)
   const rateLimit = rateLimitDetails(headers, retryAfter)
-  const details = responseBody(input.responseBody)
+  const details = responseBody(input.responseBody ?? undefined, new Set<string>())
   return classifyProviderFailure({
     message: input.message,
     status: input.status,
@@ -210,11 +285,11 @@ export const classifyHttpFailure = (input: {
     retryAfterMs: retryAfter,
     rateLimit,
     http: new HttpContext({
-      request: new HttpRequestDetails({ method: "POST", url: input.url, headers: {} }),
+      request: new HttpRequestDetails({ method: "POST", url: redactUrl(input.url), headers: {} }),
       response:
         input.status === undefined
           ? undefined
-          : new HttpResponseDetails({ status: input.status, headers: headerDetails(Headers.fromInput(headers)) }),
+          : new HttpResponseDetails({ status: input.status, headers: redactHeaders(Headers.fromInput(headers), []) }),
       ...details,
       requestId: requestId(headers),
       rateLimit,
@@ -244,6 +319,7 @@ const httpError = (input: {
   readonly error: unknown
   readonly request: HttpClientRequest.HttpClientRequest
   readonly operation: HttpOperation
+  readonly redactedNames: ReadonlyArray<string | RegExp>
 }) => {
   const request = HttpClientError.isHttpClientError(input.error) ? input.error.request : input.request
   const transportError = (failure: { readonly message: string; readonly code?: string | undefined }) =>
@@ -255,8 +331,8 @@ const httpError = (input: {
         transport: "http",
         operation: input.operation,
         code: failure.code,
-        url: request.url,
-        http: new HttpContext({ request: requestDetails(request) }),
+        url: redactUrl(request.url),
+        http: new HttpContext({ request: requestDetails(request, input.redactedNames) }),
       }),
     })
 
@@ -267,7 +343,7 @@ const httpError = (input: {
   const native = nativeTransportFailure(source)
   const code = native?.code
   const raw = native?.message ?? (input.error instanceof Error ? input.error.message : undefined)
-  const detail = raw
+  const detail = raw ? redactBody(raw, secretValues(request)) : undefined
   const message = code && detail && !detail.includes(code) ? `${code}: ${detail}` : detail
 
   if (Cause.isTimeoutError(input.error) || Cause.isTimeoutError(source))
@@ -293,9 +369,10 @@ export const stream = (
 ): Stream.Stream<Uint8Array, AIError> =>
   Stream.unwrap(
     Effect.gen(function* () {
+      const redactedNames = yield* Headers.CurrentRedactedNames
       const response = yield* executor.execute(request, middleware)
       return response.stream.pipe(
-        Stream.mapError((error) => httpError({ error, request: response.request, operation: "read" })),
+        Stream.mapError((error) => httpError({ error, request: response.request, operation: "read", redactedNames })),
       )
     }),
   )
@@ -306,18 +383,19 @@ export const layer: Layer.Layer<Service, never, HttpClient.HttpClient> = Layer.e
     const http = yield* HttpClient.HttpClient
     const executeOnce = (request: HttpClientRequest.HttpClientRequest, middleware?: HttpMiddleware) =>
       Effect.gen(function* () {
+        const redactedNames = yield* Headers.CurrentRedactedNames
         if (!middleware)
           return yield* http.execute(request).pipe(
-            Effect.mapError((error) => httpError({ error, request, operation: "request" })),
-            Effect.flatMap(statusError(request)),
+            Effect.mapError((error) => httpError({ error, request, operation: "request", redactedNames })),
+            Effect.flatMap(statusError(request, redactedNames)),
           )
 
         const response = yield* middleware(request, (input) =>
           http
             .execute(input)
             .pipe(Effect.mapError((cause) => (cause instanceof Error ? cause : new Error(String(cause))))),
-        ).pipe(Effect.mapError((error) => httpError({ error, request, operation: "request" })))
-        return yield* statusError(response.request)(response)
+        ).pipe(Effect.mapError((error) => httpError({ error, request, operation: "request", redactedNames })))
+        return yield* statusError(response.request, redactedNames)(response)
       })
     return Service.of({
       execute: executeOnce,

packages/ai/src/route/index.ts

@@ -16,28 +16,11 @@ export { AuthOptions } from "./auth-options.js"
 export { Endpoint } from "./endpoint.js"
 export { Framing } from "./framing.js"
 export { Protocol } from "./protocol.js"
-export { HttpTransport, WebSocketTransport } from "./transport/index.js"
+export { HttpTransport, WebSocketExecutor, WebSocketTransport } from "./transport/index.js"
 export * as Transport from "./transport/index.js"
 export type { Definition as AuthShape, AuthInput, Credential, CredentialError } from "./auth.js"
 export type { ApiKeyMode, AuthOverride, ProviderAuthOption } from "./auth-options.js"
 export type { Definition as EndpointFn, EndpointInput } from "./endpoint.js"
 export type { Definition as FramingDef } from "./framing.js"
 export type { Protocol as ProtocolDef } from "./protocol.js"
-export type {
-  ChannelCheckpoint,
-  ChannelCreate,
-  ChannelObservation,
-  HttpHandler,
-  HttpMiddleware,
-  Transport as TransportDef,
-  TransportExecuteOptions,
-  TransportExecution,
-  TransportRuntime,
-  WebSocketConnection,
-  WebSocketChannelDriver,
-  WebSocketChannelExchange,
-  WebSocketChannelExecution,
-  WebSocketChannelExecutor,
-  WebSocketConnector,
-  WebSocketRequest,
-} from "./transport/index.js"
+export type { HttpHandler, HttpMiddleware, Transport as TransportDef, TransportRuntime } from "./transport/index.js"

packages/ai/src/route/transport/http.ts

@@ -87,10 +87,8 @@ export const httpJson = <Body, Frame>(input: HttpJsonInput<Body, Frame>): HttpJs
         middleware: prepareInput.middleware,
       }
     }),
-  execute: (prepared, _request, runtime) =>
-    Effect.succeed({
-      frames: prepared.framing.frame(RequestExecutor.stream(runtime.http, prepared.request, prepared.middleware)),
-    }),
+  frames: (prepared, _request, runtime) =>
+    prepared.framing.frame(RequestExecutor.stream(runtime.http, prepared.request, prepared.middleware)),
 })
 
 export const sseJson = {

packages/ai/src/route/transport/index.ts

@@ -1,33 +1,19 @@
-import type { Effect, Scope, Stream } from "effect"
+import type { Effect, Stream } from "effect"
 import { Endpoint } from "../endpoint.js"
 import { Auth } from "../auth.js"
 import type { HttpMiddleware, Interface as RequestExecutorInterface } from "../executor.js"
-import type { WebSocketChannelExecutor } from "./websocket-channel.js"
+import type { Interface as WebSocketExecutorInterface } from "./websocket.js"
 import type { AIError, LLMRequest } from "../../schema/index.js"
 
 export interface TransportRuntime {
   readonly http: RequestExecutorInterface
-}
-
-export interface TransportExecution<Frame> {
-  readonly frames: Stream.Stream<Frame, AIError>
-  /** Optional successful-consumption acknowledgement. HTTP leaves this absent. */
-  readonly complete?: Effect.Effect<void>
-}
-
-export interface TransportExecuteOptions {
-  readonly webSocket?: WebSocketChannelExecutor
+  readonly webSocket?: WebSocketExecutorInterface
 }
 
 export interface Transport<Body, Prepared, Frame> {
   readonly id: string
   readonly prepare: (input: TransportPrepareInput<Body>) => Effect.Effect<Prepared, AIError>
-  readonly execute: (
-    prepared: Prepared,
-    request: LLMRequest,
-    runtime: TransportRuntime,
-    options?: TransportExecuteOptions,
-  ) => Effect.Effect<TransportExecution<Frame>, AIError, Scope.Scope>
+  readonly frames: (prepared: Prepared, request: LLMRequest, runtime: TransportRuntime) => Stream.Stream<Frame, AIError>
 }
 
 export interface TransportPrepareInput<Body> {
@@ -38,19 +24,8 @@ export interface TransportPrepareInput<Body> {
   readonly encodeBody: (body: Body) => string
   readonly headers?: (input: { readonly request: LLMRequest }) => Record<string, string>
   readonly middleware?: HttpMiddleware
-  readonly webSocket?: WebSocketChannelExecutor
 }
 
 export * as HttpTransport from "./http.js"
 export type { HttpHandler, HttpMiddleware } from "../executor.js"
-export type {
-  ChannelCheckpoint,
-  ChannelCreate,
-  ChannelObservation,
-  WebSocketChannelDriver,
-  WebSocketChannelExchange,
-  WebSocketChannelExecution,
-  WebSocketChannelExecutor,
-} from "./websocket-channel.js"
-export type { WebSocketConnection, WebSocketConnector, WebSocketRequest } from "./websocket.js"
-export { WebSocketTransport } from "./websocket.js"
+export { WebSocketExecutor, WebSocketTransport } from "./websocket.js"

packages/ai/src/route/transport/websocket-channel.ts

@@ -1,50 +0,0 @@
-import type { Effect, Scope, Stream } from "effect"
-import type { Headers } from "effect/unstable/http"
-import type { AIError } from "../../schema/index.js"
-
-export interface WebSocketChannelExecutor {
-  readonly execute: (
-    exchange: WebSocketChannelExchange,
-  ) => Effect.Effect<WebSocketChannelExecution, AIError, Scope.Scope>
-}
-
-export interface WebSocketChannelExecution {
-  readonly frames: Stream.Stream<string, AIError>
-  /** Commits staged state after the decoded Route stream ends successfully. */
-  readonly complete: Effect.Effect<void>
-}
-
-export interface WebSocketChannelExchange {
-  readonly id: string
-  readonly connect: {
-    readonly url: string
-    readonly headers: Headers.Headers
-    /** Provider-safe connection age after which Core should rotate before sending. */
-    readonly rotateAfterMs?: number
-  }
-  readonly fallback: () => Stream.Stream<string, AIError>
-  readonly driver: WebSocketChannelDriver
-}
-
-export interface WebSocketChannelDriver {
-  readonly create: (checkpoint: ChannelCheckpoint | undefined) => Effect.Effect<ChannelCreate, AIError>
-  readonly observe: (create: ChannelCreate, frame: string) => Effect.Effect<ChannelObservation, AIError>
-}
-
-export interface ChannelCreate {
-  readonly message: string
-  readonly mode: "full" | "incremental"
-}
-
-export type ChannelObservation =
-  | { readonly type: "frame"; readonly frame: string }
-  | { readonly type: "completed"; readonly frame: string; readonly checkpoint?: ChannelCheckpoint }
-  | { readonly type: "incomplete"; readonly frame: string }
-  | { readonly type: "provider-failure"; readonly error: AIError }
-  | { readonly type: "rejected"; readonly error: AIError; readonly recovery: "retry-full" }
-  | { readonly type: "rejected"; readonly error: AIError; readonly recovery: "rotate-and-retry-full" }
-
-export interface ChannelCheckpoint {
-  readonly protocol: string
-  readonly value: unknown
-}

packages/ai/src/route/transport/websocket.ts

@@ -1,15 +1,8 @@
-import { Cause, Effect, Queue, Stream } from "effect"
+import { Cause, Context, Effect, Layer, Queue, Stream } from "effect"
 import { Headers } from "effect/unstable/http"
-import { Socket } from "effect/unstable/socket"
 import { AIError, TransportReason, type TransportOperation } from "../../schema/index.js"
 import * as HttpTransport from "./http.js"
 import type { Transport } from "./index.js"
-import type {
-  ChannelObservation,
-  WebSocketChannelDriver,
-  WebSocketChannelExchange,
-  WebSocketChannelExecutor,
-} from "./websocket-channel.js"
 
 export interface WebSocketRequest {
   readonly url: string
@@ -22,29 +15,24 @@ export interface WebSocketConnection {
   readonly close: Effect.Effect<void, never>
 }
 
-export interface WebSocketConnector {
+export interface Interface {
   readonly open: (input: WebSocketRequest) => Effect.Effect<WebSocketConnection, AIError>
 }
 
-type WebSocketConstructorWithHeaders = (
+type WebSocketConstructorWithHeaders = new (
   url: string,
   options?: { readonly headers?: Headers.Headers },
 ) => globalThis.WebSocket
 
-const MAX_FRAME_BYTES = 16 * 1024 * 1024
+export class Service extends Context.Service<Service, Interface>()("@opencode/AI/WebSocketExecutor") {}
+
 const transportError = (
   method: string,
   message: string,
-  input: {
-    readonly operation: TransportOperation
-    readonly url?: string
-    readonly code?: string
-    readonly phase?: TransportReason["phase"]
-    readonly delivery?: TransportReason["delivery"]
-  },
+  input: { readonly operation: TransportOperation; readonly url?: string; readonly code?: string },
 ) =>
   new AIError({
-    module: "WebSocketConnector",
+    module: "WebSocketExecutor",
     method,
     reason: new TransportReason({
       message,
@@ -52,33 +40,9 @@ const transportError = (
       operation: input.operation,
       url: input.url,
       code: input.code,
-      phase: input.phase,
-      delivery: input.delivery,
     }),
   })
 
-const annotateTransportError = (
-  error: AIError,
-  input: { readonly phase: TransportReason["phase"]; readonly delivery: TransportReason["delivery"] },
-) =>
-  error.reason._tag === "Transport"
-    ? new AIError({
-        module: error.module,
-        method: error.method,
-        reason: new TransportReason({
-          message: error.reason.message,
-          transport: error.reason.transport,
-          operation: error.reason.operation,
-          code: error.reason.code,
-          url: error.reason.url,
-          http: error.reason.http,
-          phase: input.phase,
-          delivery: input.delivery,
-          recovery: error.reason.recovery,
-        }),
-      })
-    : error
-
 const eventMessage = (event: Event) => {
   if ("message" in event && typeof event.message === "string") return event.message
   return event.type
@@ -99,8 +63,6 @@ const waitOpen = (ws: globalThis.WebSocket, input: WebSocketRequest) => {
         url: input.url,
         operation: "request",
         code: "closed",
-        phase: "connect",
-        delivery: "not-sent",
       }),
     )
   }
@@ -127,8 +89,6 @@ const waitOpen = (ws: globalThis.WebSocket, input: WebSocketRequest) => {
           transportError("open", `Failed to open WebSocket: ${eventMessage(event)}`, {
             url: input.url,
             operation: "request",
-            phase: "connect",
-            delivery: "not-sent",
           }),
         ),
       )
@@ -141,8 +101,6 @@ const waitOpen = (ws: globalThis.WebSocket, input: WebSocketRequest) => {
             url: input.url,
             operation: "request",
             code: String(event.code),
-            phase: "connect",
-            delivery: "not-sent",
           }),
         ),
       )
@@ -154,7 +112,7 @@ const waitOpen = (ws: globalThis.WebSocket, input: WebSocketRequest) => {
   })
 }
 
-export const toWebSocketUrl = (value: string) =>
+const webSocketUrl = (value: string) =>
   Effect.try({
     try: () => {
       const url = new URL(value)
@@ -173,31 +131,21 @@ export const toWebSocketUrl = (value: string) =>
         url: value,
         operation: "request",
         code: "invalid-url",
-        phase: "prepare",
-        delivery: "not-sent",
       }),
   })
 
 export const open = (input: WebSocketRequest) =>
-  Effect.gen(function* () {
-    const constructor = yield* Socket.WebSocketConstructor
-    const ws = yield* Effect.try({
-      try: () =>
-        // Platform implementations may extend Effect's browser-compatible constructor with handshake options.
-        // oxlint-disable-next-line typescript-eslint/no-unsafe-type-assertion
-        (constructor as unknown as WebSocketConstructorWithHeaders)(input.url, {
-          headers: input.headers,
-        }),
-      catch: (error) =>
-        transportError("open", error instanceof Error ? error.message : "Failed to construct WebSocket", {
-          url: input.url,
-          operation: "request",
-          phase: "connect",
-          delivery: "not-sent",
-        }),
-    })
-    return yield* fromWebSocket(ws, input)
-  })
+  Effect.try({
+    try: () =>
+      new (globalThis.WebSocket as unknown as WebSocketConstructorWithHeaders)(input.url, { headers: input.headers }),
+    catch: (error) =>
+      transportError("open", error instanceof Error ? error.message : "Failed to construct WebSocket", {
+        url: input.url,
+        operation: "request",
+      }),
+  }).pipe(Effect.flatMap((ws) => fromWebSocket(ws, input)))
+
+export const layer: Layer.Layer<Service> = Layer.succeed(Service, Service.of({ open }))
 
 export const fromWebSocket = (
   ws: globalThis.WebSocket,
@@ -207,52 +155,16 @@ export const fromWebSocket = (
     yield* waitOpen(ws, input)
     const messages = yield* Queue.bounded<string | Uint8Array, AIError | Cause.Done<void>>(128)
 
-    const oversized = (message: string | Uint8Array) =>
-      typeof message === "string" ? new Blob([message]).size > MAX_FRAME_BYTES : message.byteLength > MAX_FRAME_BYTES
-    const rejectOversized = (message: string | Uint8Array) => {
-      if (!oversized(message)) return false
-      Queue.failCauseUnsafe(
-        messages,
-        Cause.fail(
-          transportError("message", "WebSocket message exceeds the 16 MiB limit", {
-            url: input.url,
-            operation: "read",
-            code: "message-too-large",
-            phase: "receive",
-          }),
-        ),
-      )
-      if (ws.readyState === globalThis.WebSocket.OPEN) ws.close(1009, "Message too large")
-      return true
-    }
-    const offer = (message: string | Uint8Array) => {
-      if (rejectOversized(message)) return
-      if (Queue.offerUnsafe(messages, message)) return
-      Queue.failCauseUnsafe(
-        messages,
-        Cause.fail(
-          transportError("message", "WebSocket inbound queue overflow", {
-            url: input.url,
-            operation: "read",
-            code: "queue-overflow",
-            phase: "receive",
-          }),
-        ),
-      )
-    }
-
     const onMessage = (event: MessageEvent) => {
-      if (typeof event.data === "string") return offer(event.data)
+      if (typeof event.data === "string") return Queue.offerUnsafe(messages, event.data)
       const binary = binaryMessage(event.data)
-      if (binary) return offer(binary)
+      if (binary) return Queue.offerUnsafe(messages, binary)
       Queue.failCauseUnsafe(
         messages,
         Cause.fail(
           transportError("message", "Unsupported WebSocket message payload", {
             url: input.url,
             operation: "read",
-            code: "message",
-            phase: "receive",
           }),
         ),
       )
@@ -264,13 +176,12 @@ export const fromWebSocket = (
           transportError("message", `WebSocket error: ${eventMessage(event)}`, {
             url: input.url,
             operation: "read",
-            code: "message",
-            phase: "receive",
           }),
         ),
       )
     }
     const onClose = (event: CloseEvent) => {
+      if (event.code === 1000 || event.code === 1005) return Queue.endUnsafe(messages)
       Queue.failCauseUnsafe(
         messages,
         Cause.fail(
@@ -278,7 +189,6 @@ export const fromWebSocket = (
             url: input.url,
             operation: "read",
             code: String(event.code),
-            phase: "close",
           }),
         ),
       )
@@ -295,26 +205,13 @@ export const fromWebSocket = (
 
     return {
       sendText: (message) =>
-        Effect.suspend(() => {
-          if (ws.readyState !== globalThis.WebSocket.OPEN)
-            return Effect.fail(
-              transportError("sendText", `WebSocket is not open (state ${ws.readyState})`, {
-                url: input.url,
-                operation: "write",
-                phase: "send",
-                delivery: "not-sent",
-              }),
-            )
-          return Effect.try({
-            try: () => ws.send(message),
-            catch: (error) =>
-              transportError("sendText", error instanceof Error ? error.message : "Failed to send WebSocket message", {
-                url: input.url,
-                operation: "write",
-                phase: "send",
-                delivery: "not-sent",
-              }),
-          })
+        Effect.try({
+          try: () => ws.send(message),
+          catch: (error) =>
+            transportError("sendText", error instanceof Error ? error.message : "Failed to send WebSocket message", {
+              url: input.url,
+              operation: "write",
+            }),
         }),
       messages: Stream.fromQueue(messages),
       close: cleanup.pipe(
@@ -331,57 +228,6 @@ export const fromWebSocket = (
 export const messageText = (message: string | Uint8Array, decoder: TextDecoder) =>
   typeof message === "string" ? message : decoder.decode(message)
 
-const observationFrame = (observation: ChannelObservation) => {
-  if (observation.type === "frame" || observation.type === "completed" || observation.type === "incomplete")
-    return Effect.succeed(observation.frame)
-  return Effect.fail(observation.error)
-}
-
-const observationTerminal = (observation: ChannelObservation) => observation.type !== "frame"
-
-export const makeDirect = (connector: WebSocketConnector): WebSocketChannelExecutor => ({
-  execute: (exchange) =>
-    Effect.gen(function* () {
-      const connection = yield* Effect.acquireRelease(
-        connector
-          .open(exchange.connect)
-          .pipe(Effect.mapError((error) => annotateTransportError(error, { phase: "connect", delivery: "not-sent" }))),
-        (connection) => connection.close,
-      )
-      const create = yield* exchange.driver.create(undefined)
-      yield* connection.sendText(create.message)
-      const decoder = new TextDecoder()
-      let observed = false
-      return {
-        frames: connection.messages.pipe(
-          Stream.map((message) => {
-            observed = true
-            return messageText(message, decoder)
-          }),
-          Stream.mapError((error) =>
-            annotateTransportError(error, {
-              phase: error.reason._tag === "Transport" && error.reason.phase === "close" ? "close" : "receive",
-              delivery: observed ? "accepted" : "ambiguous",
-            }),
-          ),
-          Stream.mapEffect((frame) => exchange.driver.observe(create, frame)),
-          Stream.takeUntil(observationTerminal),
-          Stream.mapEffect(observationFrame),
-        ),
-        complete: Effect.void,
-      }
-    }),
-})
-
-export const direct: Effect.Effect<WebSocketChannelExecutor, never, Socket.WebSocketConstructor> = Effect.gen(
-  function* () {
-    const constructor = yield* Socket.WebSocketConstructor
-    return makeDirect({
-      open: (input) => open(input).pipe(Effect.provideService(Socket.WebSocketConstructor, constructor)),
-    })
-  },
-)
-
 export interface JsonPrepared {
   readonly url: string
   readonly headers: Headers.Headers
@@ -408,44 +254,33 @@ export const json = <Body, Message>(input: JsonInput<Body, Message>): JsonTransp
         ...prepareInput,
       })
       return {
-        url: yield* toWebSocketUrl(parts.url),
+        url: yield* webSocketUrl(parts.url),
         headers: parts.headers,
         message: input.encodeMessage(yield* input.toMessage(parts.jsonBody)),
       }
     }),
-  execute: (prepared, request, _runtime, options) => {
-    const webSocket = options?.webSocket
+  frames: (prepared, _request, runtime) => {
+    const webSocket = runtime.webSocket
     if (!webSocket) {
-      return Effect.fail(
-        transportError("json", "WebSocket JSON transport requires StreamOptions.webSocket", {
+      return Stream.fail(
+        transportError("json", "WebSocket JSON transport requires WebSocketExecutor.Service", {
           url: prepared.url,
           operation: "request",
           code: "unavailable",
-          phase: "prepare",
-          delivery: "not-sent",
         }),
       )
     }
-    const driver: WebSocketChannelDriver = {
-      create: () => Effect.succeed({ message: prepared.message, mode: "full" }),
-      observe: (_create, frame) => Effect.succeed({ type: "frame", frame }),
-    }
-    const exchange: WebSocketChannelExchange = {
-      id: request.id ?? "request",
-      connect: { url: prepared.url, headers: prepared.headers },
-      fallback: () =>
-        Stream.fail(
-          transportError("fallback", "WebSocket JSON transport does not provide HTTP fallback", {
-            url: prepared.url,
-            operation: "request",
-            code: "websocket",
-            phase: "fallback",
-            delivery: "not-sent",
-          }),
-        ),
-      driver,
-    }
-    return webSocket.execute(exchange)
+    const decoder = new TextDecoder()
+    return Stream.unwrap(
+      Effect.gen(function* () {
+        const connection = yield* Effect.acquireRelease(
+          webSocket.open({ url: prepared.url, headers: prepared.headers }),
+          (connection) => connection.close,
+        )
+        yield* connection.sendText(prepared.message)
+        return connection.messages.pipe(Stream.map((message) => messageText(message, decoder)))
+      }),
+    )
   },
 })
 
@@ -454,13 +289,15 @@ export const jsonTransport = {
   with: json,
 } as const
 
-export const WebSocketTransport = {
-  json,
-  jsonTransport,
-  direct,
-  makeDirect,
+export const WebSocketExecutor = {
+  Service,
+  layer,
   open,
   fromWebSocket,
   messageText,
-  toWebSocketUrl,
+} as const
+
+export const WebSocketTransport = {
+  json,
+  jsonTransport,
 } as const

packages/ai/src/schema/errors.ts

@@ -106,13 +106,6 @@ export class TransportReason extends Schema.Class<TransportReason>("AI.Error.Tra
   code: Schema.optional(Schema.String),
   url: Schema.optional(Schema.String),
   http: Schema.optional(HttpContext),
-  phase: Schema.optional(
-    Schema.Literals(["prepare", "queue", "connect", "send", "receive", "decode", "complete", "fallback", "close"]),
-  ),
-  delivery: Schema.optional(Schema.Literals(["not-sent", "rejected", "ambiguous", "accepted"])),
-  recovery: Schema.optional(
-    Schema.Literals(["retry-connect", "retry-full", "rotate-and-retry-full", "fallback-http", "fail"]),
-  ),
 }) {}
 
 export class InvalidProviderOutputReason extends Schema.Class<InvalidProviderOutputReason>(

packages/ai/test/executor.test.ts

@@ -1,13 +1,12 @@
 import { describe, expect } from "bun:test"
-import { Deferred, Effect, Fiber, Layer, Ref, Stream } from "effect"
+import { Effect, Layer, Ref, Stream } from "effect"
 import { Headers, HttpClient, HttpClientError, HttpClientRequest, HttpClientResponse } from "effect/unstable/http"
 import { LLM, AIError } from "../src/index.js"
-import { LLMClient, RequestExecutor, WebSocketTransport, type WebSocketChannelExecutor } from "../src/route.js"
+import { LLMClient, RequestExecutor } from "../src/route.js"
 import * as OpenAIChat from "../src/protocols/openai-chat.js"
-import * as OpenAI from "../src/providers/openai.js"
-import { dynamicResponse, fixedResponse, systemError } from "./lib/http.js"
+import { dynamicResponse, systemError } from "./lib/http.js"
 import { deltaChunk } from "./lib/openai-chunks.js"
-import { sseEvents, sseRaw } from "./lib/sse.js"
+import { sseRaw } from "./lib/sse.js"
 import { it } from "./lib/effect.js"
 
 const request = HttpClientRequest.post("https://provider.test/v1/chat?api_key=secret&key=secret&debug=1").pipe(
@@ -66,7 +65,6 @@ const expectAIError = (error: unknown) => {
 }
 
 const errorHttp = (error: AIError) => ("http" in error.reason ? error.reason.http : undefined)
-const largeProviderMessage = `Upstream request failed: ${"validation failed; ".repeat(1_000)}`
 
 describe("RequestExecutor", () => {
   it.effect("parses response body failures at the executor seam", () =>
@@ -77,11 +75,11 @@ describe("RequestExecutor", () => {
       expectAIError(error)
       expect(error.reason).toMatchObject({
         _tag: "Transport",
-        message: "ECONNRESET: disconnected query-secret-123 header-secret-456",
+        message: "ECONNRESET: disconnected <redacted> <redacted>",
         transport: "http",
         operation: "read",
         code: "ECONNRESET",
-        url: "https://provider.test/v1/chat?api_key=query-secret-123&debug=1",
+        url: "https://provider.test/v1/chat?api_key=%3Credacted%3E&debug=1",
       })
     }).pipe(
       Effect.provide(
@@ -154,12 +152,12 @@ describe("RequestExecutor", () => {
       expectAIError(error)
       expect(error.reason).toMatchObject({
         _tag: "Transport",
-        message: "ECONNRESET: proxy disconnected proxy-secret",
-        url: "https://proxy.test/v1/chat?api_key=proxy-secret",
+        message: "ECONNRESET: proxy disconnected <redacted>",
+        url: "https://proxy.test/v1/chat?api_key=%3Credacted%3E",
         http: {
           request: {
-            url: "https://proxy.test/v1/chat?api_key=proxy-secret",
-            headers: { authorization: "Bearer proxy-secret" },
+            url: "https://proxy.test/v1/chat?api_key=%3Credacted%3E",
+            headers: { authorization: "<redacted>" },
           },
         },
       })
@@ -219,47 +217,9 @@ describe("RequestExecutor", () => {
       expectAIError(error)
       expect(error.reason).toMatchObject({ _tag: "InvalidRequest" })
       expect("classification" in error.reason ? error.reason.classification : undefined).toBeUndefined()
-      expect(error.reason.message).toBe("Provider request failed with HTTP 400")
     }).pipe(Effect.provide(responsesLayer([new Response("invalid parameter", { status: 400 })]))),
   )
 
-  it.effect("preserves structured provider messages from large error bodies", () =>
-    Effect.gen(function* () {
-      const executor = yield* RequestExecutor.Service
-      const error = yield* executor.execute(request).pipe(Effect.flip)
-
-      expectAIError(error)
-      expect(error.reason).toMatchObject({ _tag: "InvalidRequest", message: largeProviderMessage })
-      expect(errorHttp(error)?.body).toContain(largeProviderMessage)
-      expect(errorHttp(error)?.bodyTruncated).toBeUndefined()
-    }).pipe(
-      Effect.provide(
-        responsesLayer([
-          new Response(
-            JSON.stringify({
-              model: "gpt-5.6-sol",
-              error: { type: "invalid_request", message: largeProviderMessage },
-            }),
-            { status: 400 },
-          ),
-        ]),
-      ),
-    ),
-  )
-
-  it.effect("falls back when structured provider messages are empty", () =>
-    Effect.gen(function* () {
-      const executor = yield* RequestExecutor.Service
-      const error = yield* executor.execute(request).pipe(Effect.flip)
-
-      expectAIError(error)
-      expect(error.reason).toMatchObject({
-        _tag: "InvalidRequest",
-        message: "Provider request failed with HTTP 400",
-      })
-    }).pipe(Effect.provide(responsesLayer([new Response('{"error":{"message":"  "}}', { status: 400 })]))),
-  )
-
   it.effect("classifies provider rate limits hidden behind HTTP 400", () =>
     Effect.gen(function* () {
       const classify = (body: string) =>
@@ -293,7 +253,7 @@ describe("RequestExecutor", () => {
     }),
   )
 
-  it.effect("returns complete diagnostics for rate limits", () =>
+  it.effect("returns redacted diagnostics for rate limits", () =>
     Effect.gen(function* () {
       const executor = yield* RequestExecutor.Service
       const error = yield* executor.execute(request).pipe(Effect.flip)
@@ -308,15 +268,15 @@ describe("RequestExecutor", () => {
             requestId: "req_123",
             request: {
               method: "POST",
-              url: "https://provider.test/v1/chat?api_key=secret&key=secret&debug=1",
-              headers: { authorization: "Bearer secret", "x-safe": "visible" },
+              url: "https://provider.test/v1/chat?api_key=%3Credacted%3E&key=%3Credacted%3E&debug=1",
+              headers: { authorization: "<redacted>", "x-safe": "visible" },
             },
             response: {
               status: 429,
               headers: {
                 "retry-after-ms": "0",
                 "x-request-id": "req_123",
-                "x-api-key": "secret",
+                "x-api-key": "<redacted>",
               },
             },
           },
@@ -335,14 +295,14 @@ describe("RequestExecutor", () => {
     ),
   )
 
-  it.effect("preserves configured header names in diagnostics", () =>
+  it.effect("honors current redacted header names in diagnostics", () =>
     Effect.gen(function* () {
       const executor = yield* RequestExecutor.Service
       const error = yield* executor.execute(request).pipe(Effect.flip)
 
       expectAIError(error)
-      expect(errorHttp(error)?.request.headers["x-safe"]).toBe("visible")
-      expect(errorHttp(error)?.response?.headers["x-safe"]).toBe("response-secret")
+      expect(errorHttp(error)?.request.headers["x-safe"]).toBe("<redacted>")
+      expect(errorHttp(error)?.response?.headers["x-safe"]).toBe("<redacted>")
     }).pipe(
       Effect.provide(responsesLayer([new Response("bad", { status: 400, headers: { "x-safe": "response-secret" } })])),
       Effect.provideService(Headers.CurrentRedactedNames, ["x-safe"]),
@@ -461,15 +421,15 @@ describe("RequestExecutor", () => {
     }),
   )
 
-  it.effect("preserves large authentication error bodies", () =>
+  it.effect("truncates large authentication error bodies", () =>
     Effect.gen(function* () {
       const executor = yield* RequestExecutor.Service
       const error = yield* executor.execute(request).pipe(Effect.flip)
 
       expectAIError(error)
       expect(error.reason).toMatchObject({ _tag: "Authentication" })
-      expect(errorHttp(error)?.bodyTruncated).toBeUndefined()
-      expect(errorHttp(error)?.body).toHaveLength(20_000)
+      expect(errorHttp(error)?.bodyTruncated).toBe(true)
+      expect(errorHttp(error)?.body).toHaveLength(16_384)
     }).pipe(
       Effect.provide(
         responsesLayer([
@@ -480,15 +440,16 @@ describe("RequestExecutor", () => {
     ),
   )
 
-  it.effect("preserves response body fields", () =>
+  it.effect("redacts common secret fields in response bodies", () =>
     Effect.gen(function* () {
       const executor = yield* RequestExecutor.Service
       const error = yield* executor.execute(request).pipe(Effect.flip)
 
       expectAIError(error)
-      expect(errorHttp(error)?.body).toBe(
-        '{"error":{"message":"bad","key":"body-secret","detail":"api_key=query-secret"}}',
-      )
+      expect(errorHttp(error)?.body).toContain('"key":"<redacted>"')
+      expect(errorHttp(error)?.body).toContain("api_key=<redacted>")
+      expect(errorHttp(error)?.body).not.toContain("body-secret")
+      expect(errorHttp(error)?.body).not.toContain("query-secret")
     }).pipe(
       Effect.provide(
         responsesLayer([
@@ -500,13 +461,16 @@ describe("RequestExecutor", () => {
     ),
   )
 
-  it.effect("preserves echoed request values in response bodies", () =>
+  it.effect("redacts echoed request secret values in response bodies", () =>
     Effect.gen(function* () {
       const executor = yield* RequestExecutor.Service
       const error = yield* executor.execute(secretRequest).pipe(Effect.flip)
 
       expectAIError(error)
-      expect(errorHttp(error)?.body).toBe("provider echoed query-secret-123 and authorization header-secret-456")
+      expect(errorHttp(error)?.body).toContain("provider echoed <redacted>")
+      expect(errorHttp(error)?.body).toContain("authorization <redacted>")
+      expect(errorHttp(error)?.body).not.toContain("query-secret-123")
+      expect(errorHttp(error)?.body).not.toContain("header-secret-456")
     }).pipe(
       Effect.provide(
         responsesLayer([
@@ -547,146 +511,3 @@ describe("RequestExecutor", () => {
     }),
   )
 })
-
-describe("WebSocket channel execution", () => {
-  const model = OpenAI.configure({ baseURL: "https://api.openai.test/v1/", apiKey: "test" }).responses("gpt-4.1-mini")
-  const request = LLM.request({ model, prompt: "Say hello." })
-  const frames = [
-    JSON.stringify({ type: "response.output_text.delta", item_id: "msg_1", delta: "Hi" }),
-    JSON.stringify({ type: "response.completed", response: { id: "resp_1" } }),
-  ]
-
-  it.effect("runs a channel driver through the direct executor", () =>
-    Effect.gen(function* () {
-      const sent = yield* Ref.make("")
-      const closed = yield* Ref.make(false)
-      const observed = yield* Ref.make(0)
-      const webSocket = WebSocketTransport.makeDirect({
-        open: () =>
-          Effect.succeed({
-            sendText: (message) => Ref.set(sent, message),
-            messages: Stream.make("one", "done", "late"),
-            close: Ref.set(closed, true),
-          }),
-      })
-      const received = yield* Effect.scoped(
-        Effect.gen(function* () {
-          const execution = yield* webSocket.execute({
-            id: "exchange_1",
-            connect: { url: "wss://api.openai.test/v1/responses", headers: Headers.empty },
-            fallback: () => Stream.empty,
-            driver: {
-              create: () => Effect.succeed({ message: "create", mode: "full" }),
-              observe: (_create, frame) =>
-                Ref.update(observed, (value) => value + 1).pipe(
-                  Effect.as(
-                    frame === "done" ? { type: "completed" as const, frame } : { type: "frame" as const, frame },
-                  ),
-                ),
-            },
-          })
-          return yield* Stream.runCollect(execution.frames)
-        }),
-      )
-
-      expect(Array.from(received)).toEqual(["one", "done"])
-      expect(yield* Ref.get(sent)).toBe("create")
-      expect(yield* Ref.get(observed)).toBe(2)
-      expect(yield* Ref.get(closed)).toBe(true)
-    }),
-  )
-
-  it.effect("rejects a closed socket before attempting to send", () =>
-    Effect.gen(function* () {
-      class ClosedBeforeSend extends EventTarget {
-        readyState = globalThis.WebSocket.OPEN
-        sends = 0
-        send() {
-          this.sends++
-        }
-        close() {}
-      }
-      const socket = new ClosedBeforeSend()
-      const connection = yield* WebSocketTransport.fromWebSocket(
-        // oxlint-disable-next-line typescript-eslint/no-unsafe-type-assertion
-        socket as unknown as globalThis.WebSocket,
-        { url: "wss://api.openai.test/v1/responses", headers: Headers.empty },
-      )
-      socket.readyState = globalThis.WebSocket.CLOSED
-
-      const error = yield* connection.sendText("create").pipe(Effect.flip)
-
-      expect(error.reason).toMatchObject({ _tag: "Transport", phase: "send", delivery: "not-sent" })
-      expect(socket.sends).toBe(0)
-      yield* connection.close
-    }),
-  )
-
-  it.effect("uses HTTP when no per-call WebSocket executor is provided", () =>
-    Effect.gen(function* () {
-      const response = yield* LLMClient.generate(request).pipe(Effect.provide(fixedResponse(sseEvents(...frames))))
-
-      expect(response.text).toBe("Hi")
-    }),
-  )
-
-  it.effect("commits channel execution only after complete consumption", () =>
-    Effect.gen(function* () {
-      const commits = yield* Ref.make(0)
-      const executor = (input: Stream.Stream<string, AIError>): WebSocketChannelExecutor => ({
-        execute: () =>
-          Effect.succeed({
-            frames: input,
-            complete: Ref.update(commits, (value) => value + 1),
-          }),
-      })
-
-      const response = yield* LLMClient.generate(request, {
-        webSocket: executor(Stream.fromArray(frames)),
-      }).pipe(Effect.provide(fixedResponse("")))
-      expect(response.text).toBe("Hi")
-      expect(yield* Ref.get(commits)).toBe(1)
-
-      yield* LLMClient.generate(request, { webSocket: executor(Stream.make("not-json")) }).pipe(
-        Effect.provide(fixedResponse("")),
-        Effect.flip,
-      )
-      expect(yield* Ref.get(commits)).toBe(1)
-
-      yield* LLMClient.stream(request, { webSocket: executor(Stream.fromArray(frames)) }).pipe(
-        Stream.take(1),
-        Stream.runDrain,
-        Effect.provide(fixedResponse("")),
-      )
-      expect(yield* Ref.get(commits)).toBe(1)
-    }),
-  )
-
-  it.effect("does not commit interrupted channel execution", () =>
-    Effect.gen(function* () {
-      const commits = yield* Ref.make(0)
-      const started = yield* Deferred.make<void>()
-      const executor: WebSocketChannelExecutor = {
-        execute: () =>
-          Effect.succeed({
-            frames: Stream.fromEffect(
-              Deferred.succeed(started, undefined).pipe(
-                Effect.as(JSON.stringify({ type: "response.created", response: { id: "resp_1" } })),
-              ),
-            ).pipe(Stream.concat(Stream.never)),
-            complete: Ref.update(commits, (value) => value + 1),
-          }),
-      }
-      const fiber = yield* LLMClient.stream(request, { webSocket: executor }).pipe(
-        Stream.runDrain,
-        Effect.provide(fixedResponse("")),
-        Effect.forkChild({ startImmediately: true }),
-      )
-
-      yield* Deferred.await(started)
-      yield* Fiber.interrupt(fiber)
-
-      expect(yield* Ref.get(commits)).toBe(0)
-    }),
-  )
-})

packages/ai/test/exports.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, test } from "bun:test"
 import { AIError, ImageInput, LanguageModel, LLM, LLMClient, Provider } from "@opencode-ai/ai"
-import { Route, Protocol, WebSocketTransport } from "@opencode-ai/ai/route"
+import { Route, Protocol } from "@opencode-ai/ai/route"
 import { Provider as ProviderSubpath } from "@opencode-ai/ai/provider"
 import {
   CloudflareAIGateway,
@@ -16,7 +16,6 @@ import {
   OpenAICompatibleResponses,
   OpenAIResponses,
   OpenResponses,
-  OpenResponsesChannel,
 } from "@opencode-ai/ai/protocols"
 import * as AnthropicMessages from "@opencode-ai/ai/protocols/anthropic-messages"
 import { TestLLM } from "@opencode-ai/ai/testing"
@@ -37,7 +36,6 @@ describe("public exports", () => {
   test("route barrel exposes route-authoring APIs", () => {
     expect(Route.make).toBeFunction()
     expect(Protocol.make).toBeFunction()
-    expect(WebSocketTransport.makeDirect).toBeFunction()
   })
 
   test("provider barrels expose user-facing facades", async () => {
@@ -45,6 +43,7 @@ describe("public exports", () => {
 
     expect(OpenAI.model).toBeFunction()
     expect(OpenAI.provider.responses).toBe(OpenAI.responses)
+    expect(OpenAI.provider.responsesWebSocket).toBe(OpenAI.responsesWebSocket)
     expect(OpenAI.configure({ apiKey: "fixture" }).responses).toBeFunction()
     expect(OpenAICompatible.deepseek.model).toBeFunction()
     expect(
@@ -66,10 +65,10 @@ describe("public exports", () => {
     expect(OpenAIChat.route.id).toBe("openai-chat")
     expect(OpenAICompatibleChat.route.id).toBe("openai-compatible-chat")
     expect(OpenResponses.protocol.id).toBe("open-responses")
-    expect(OpenResponsesChannel.transport).toBeFunction()
     expect(OpenAICompatibleResponses.route.id).toBe("openai-compatible-responses")
     expect(OpenAICompatibleResponses.route.protocol).toBe("open-responses")
     expect(OpenAIResponses.route.id).toBe("openai-responses")
+    expect(OpenAIResponses.webSocketRoute.id).toBe("openai-responses-websocket")
     expect(AnthropicMessages.route.id).toBe("anthropic-messages")
   })
 })

packages/ai/test/lib/http.ts

@@ -1,8 +1,9 @@
 import { Effect, Layer, Ref } from "effect"
 import { HttpClient, HttpClientError, HttpClientRequest, HttpClientResponse } from "effect/unstable/http"
-import { LLMClient, RequestExecutor } from "../../src/route.js"
+import { LLMClient, RequestExecutor, WebSocketExecutor } from "../../src/route.js"
 import type { Service as LLMClientService } from "../../src/route/client.js"
 import type { Service as RequestExecutorService } from "../../src/route/executor.js"
+import type { Service as WebSocketExecutorService } from "../../src/route/transport/websocket.js"
 
 export type HandlerInput = {
   readonly request: HttpClientRequest.HttpClientRequest
@@ -33,7 +34,7 @@ const handlerLayer = (handler: Handler): Layer.Layer<HttpClient.HttpClient> =>
     ),
   )
 
-export type RuntimeEnv = RequestExecutorService | LLMClientService
+export type RuntimeEnv = RequestExecutorService | WebSocketExecutorService | LLMClientService
 
 export interface SystemError extends Error {
   readonly code: string
@@ -43,8 +44,9 @@ export const systemError = (code: string, message: string): SystemError => Objec
 
 export const runtimeLayer = (layer: Layer.Layer<HttpClient.HttpClient>): Layer.Layer<RuntimeEnv> => {
   const requestExecutorLayer = RequestExecutor.layer.pipe(Layer.provide(layer))
-  const llmClientLayer = LLMClient.layer.pipe(Layer.provide(requestExecutorLayer))
-  return Layer.mergeAll(requestExecutorLayer, llmClientLayer)
+  const deps = Layer.mergeAll(requestExecutorLayer, WebSocketExecutor.layer)
+  const llmClientLayer = LLMClient.layer.pipe(Layer.provide(deps))
+  return Layer.mergeAll(deps, llmClientLayer)
 }
 
 const SSE_HEADERS = { "content-type": "text/event-stream" } as const

packages/ai/test/provider-error.test.ts

@@ -69,10 +69,10 @@ describe("provider error classification", () => {
 
   test("classifies V1 overloaded provider codes", () => {
     expect(
-      ['{"code":"resource_exhausted"}', '{"code":"service_unavailable"}', '{"code":"slow_down"}'].map(
+      ['{"code":"resource_exhausted"}', '{"code":"service_unavailable"}'].map(
         (message) => classifyProviderFailure({ message })._tag,
       ),
-    ).toEqual(["ProviderInternal", "ProviderInternal", "ProviderInternal"])
+    ).toEqual(["ProviderInternal", "ProviderInternal"])
   })
 
   test("classifies transient client statuses as provider internal", () => {

packages/ai/test/provider-options/openai.types.ts

@@ -1,18 +1,13 @@
 import { LLM } from "../../src/index.js"
 import { OpenAI } from "../../src/providers.js"
 
-const selected = OpenAI.responses("gpt-5")
+const model = OpenAI.responses("gpt-5")
 
-LLM.request({ model: selected, prompt: "Hello", providerOptions: { openai: { reasoningEffort: "high" } } })
+LLM.request({ model, prompt: "Hello", providerOptions: { openai: { reasoningEffort: "high" } } })
 
 LLM.request({
-  model: selected,
+  model,
   prompt: "Hello",
   // @ts-expect-error OpenAI reasoning effort must be a string.
   providerOptions: { openai: { reasoningEffort: 1 } },
 })
-
-OpenAI.configure({
-  // @ts-expect-error Transport is execution policy, not provider configuration.
-  transport: "websocket",
-})

packages/ai/test/provider-package.test.ts

@@ -80,6 +80,11 @@ describe("provider package entrypoints", () => {
     expect(selected.route.defaults.limits).toEqual({ context: 200_000, output: 64_000 })
   })
 
+  test("selects transport without changing the semantic API", () => {
+    expect(model("gpt-5", { apiKey: "fixture" }).route.id).toBe("openai-responses")
+    expect(model("gpt-5", { apiKey: "fixture", transport: "websocket" }).route.id).toBe("openai-responses-websocket")
+  })
+
   test("maps OpenAI-compatible Responses settings onto the executable model", async () => {
     const OpenAICompatibleResponses = await import("@opencode-ai/ai/providers/openai-compatible/responses")
     const selected = OpenAICompatibleResponses.model("custom-model", {

packages/ai/test/provider/anthropic-messages.recorded.test.ts

@@ -39,7 +39,7 @@ describe("Anthropic Messages sad-path recorded", () => {
 
       expect(error).toBeInstanceOf(AIError)
       expect(error.reason).toMatchObject({ _tag: "InvalidRequest" })
-      expect(error.reason.message).toContain("`tool_use` ids were found without `tool_result` blocks")
+      expect(error.message).toContain("HTTP 400")
     }),
   )
 })

packages/ai/test/provider/anthropic-messages.test.ts

@@ -1098,7 +1098,8 @@ describe("Anthropic Messages route", () => {
       )
 
       expect(error).toBeInstanceOf(AIError)
-      expect(error.reason).toMatchObject({ _tag: "InvalidRequest", message: "Bad request" })
+      expect(error.reason).toMatchObject({ _tag: "InvalidRequest" })
+      expect(error.message).toContain("HTTP 400")
     }),
   )
 

packages/ai/test/provider/openai-chat.test.ts

@@ -1275,7 +1275,8 @@ describe("OpenAI Chat route", () => {
       )
 
       expect(error).toBeInstanceOf(AIError)
-      expect(error.reason).toMatchObject({ _tag: "InvalidRequest", message: "Bad request" })
+      expect(error.reason).toMatchObject({ _tag: "InvalidRequest" })
+      expect(error.message).toContain("HTTP 400")
     }),
   )
 

packages/ai/test/provider/openai-responses.test.ts

@@ -1,10 +1,9 @@
 import { describe, expect } from "bun:test"
-import { ConfigProvider, Effect, Layer, Ref, Stream } from "effect"
+import { ConfigProvider, Effect, Layer, Stream } from "effect"
 import { Headers, HttpClientRequest } from "effect/unstable/http"
 import {
   LLM,
   AIError,
-  HttpOptions,
   LLMEvent,
   LLMRequest,
   Message,
@@ -12,23 +11,14 @@ import {
   ToolCallPart,
   ToolDefinition,
   ToolResultPart,
-  TransportReason,
   Usage,
 } from "../../src/index.js"
-import {
-  Auth,
-  LLMClient,
-  RequestExecutor,
-  WebSocketTransport,
-  type ChannelObservation,
-  type WebSocketChannelDriver,
-} from "../../src/route.js"
+import { Auth, LLMClient, RequestExecutor, WebSocketExecutor } from "../../src/route.js"
 import { compileRequest } from "../../src/route/client.js"
 import * as Azure from "../../src/providers/azure.js"
 import * as OpenAI from "../../src/providers/openai.js"
 import * as XAI from "../../src/providers/xai.js"
 import * as OpenAIResponses from "../../src/protocols/openai-responses.js"
-import { OpenAIResponsesChannel } from "../../src/protocols/openai-responses-channel.js"
 import * as ProviderShared from "../../src/protocols/shared.js"
 import { continuationRequest, nativeOpenAIResponsesContinuation } from "../continuation-scenarios.js"
 import { it } from "../lib/effect.js"
@@ -41,47 +31,6 @@ const model = OpenAIResponses.route
 
 const xaiModel = XAI.configure({ apiKey: "test", baseURL: "https://api.x.ai/v1" }).responses("grok-4.5")
 
-const baseChannelDriver = (message: string): WebSocketChannelDriver => ({
-  create: () => Effect.succeed({ message, mode: "full" }),
-  observe: (_create, frame): Effect.Effect<ChannelObservation, AIError> => {
-    const event = ProviderShared.decodeJson(frame)
-    if (!ProviderShared.isRecord(event)) return Effect.die("Expected event")
-    if (event.type === "response.completed") return Effect.succeed({ type: "completed", frame })
-    if (event.type === "response.incomplete") return Effect.succeed({ type: "incomplete", frame })
-    if (event.type === "error" || event.type === "response.failed")
-      return Effect.succeed({
-        type: "provider-failure",
-        error: new AIError({
-          module: "test",
-          method: "stream",
-          reason: new TransportReason({
-            message: "provider rejected request",
-            transport: "websocket",
-            operation: "read",
-            phase: "receive",
-          }),
-        }),
-      })
-    return Effect.succeed({ type: "frame", frame })
-  },
-})
-
-const continuationDriver = (request: Readonly<Record<string, unknown>>) => {
-  const message = ProviderShared.encodeJson(request)
-  return OpenAIResponsesChannel.driver({
-    id: "openai-responses",
-    name: "OpenAI Responses",
-    request,
-    message,
-    base: baseChannelDriver(message),
-  })
-}
-
-const checkpoint = (observation: ChannelObservation) => {
-  if (observation.type !== "completed" || !observation.checkpoint) throw new Error("Expected checkpoint")
-  return observation.checkpoint
-}
-
 const request = LLM.request({
   id: "req_1",
   model,
@@ -267,19 +216,19 @@ describe("OpenAI Responses route", () => {
     }),
   )
 
-  it.effect("prepares one OpenAI Responses route for either transport", () =>
+  it.effect("prepares OpenAI Responses WebSocket target", () =>
     Effect.gen(function* () {
       const prepared = yield* compileRequest(
         LLMRequest.update(request, {
-          model: OpenAIResponses.route
+          model: OpenAIResponses.webSocketRoute
             .with({ endpoint: { baseURL: "https://api.openai.test/v1/" }, auth: Auth.bearer("test") })
             .model({ id: "gpt-4.1-mini" }),
         }),
       )
 
-      expect(prepared.route).toBe("openai-responses")
+      expect(prepared.route).toBe("openai-responses-websocket")
       expect(prepared.protocol).toBe("openai-responses")
-      expect(prepared.metadata).toEqual({ transport: "http-json" })
+      expect(prepared.metadata).toEqual({ transport: "websocket-json" })
       expect(prepared.body).toMatchObject({ model: "gpt-4.1-mini", store: false, stream: true })
     }),
   )
@@ -287,60 +236,47 @@ describe("OpenAI Responses route", () => {
   it.effect("streams OpenAI Responses over WebSocket", () =>
     Effect.gen(function* () {
       const sent: string[] = []
-      const opened: Array<{
-        readonly url: string
-        readonly authorization: string | undefined
-        readonly protocol: string | undefined
-      }> = []
+      const opened: Array<{ readonly url: string; readonly authorization: string | undefined }> = []
       let closed = false
-      const deps = Layer.succeed(
-        RequestExecutor.Service,
-        RequestExecutor.Service.of({
-          execute: () => Effect.die("unexpected HTTP request"),
-        }),
-      )
-      const webSocket = WebSocketTransport.makeDirect({
-        open: (input) =>
-          Effect.succeed({
-            sendText: (message) =>
-              Effect.sync(() => {
-                opened.push({
-                  url: input.url,
-                  authorization: input.headers.authorization,
-                  protocol: input.headers["openai-beta"],
-                })
-                sent.push(message)
-              }),
-            messages: Stream.fromArray([
-              ProviderShared.encodeJson({ type: "response.created", response: { id: "resp_ws" } }),
-              ProviderShared.encodeJson({ type: "response.output_text.delta", item_id: "msg_1", delta: "Hi" }),
-              ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_ws" } }),
-            ]),
-            close: Effect.sync(() => {
-              closed = true
-            }),
+      const deps = Layer.mergeAll(
+        Layer.succeed(
+          RequestExecutor.Service,
+          RequestExecutor.Service.of({
+            execute: () => Effect.die("unexpected HTTP request"),
           }),
-      })
+        ),
+        Layer.succeed(
+          WebSocketExecutor.Service,
+          WebSocketExecutor.Service.of({
+            open: (input) =>
+              Effect.succeed({
+                sendText: (message) =>
+                  Effect.sync(() => {
+                    opened.push({ url: input.url, authorization: input.headers.authorization })
+                    sent.push(message)
+                  }),
+                messages: Stream.fromArray([
+                  ProviderShared.encodeJson({ type: "response.output_text.delta", item_id: "msg_1", delta: "Hi" }),
+                  ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_ws" } }),
+                ]),
+                close: Effect.sync(() => {
+                  closed = true
+                }),
+              }),
+          }),
+        ),
+      )
       const response = yield* LLMClient.generate(
         LLM.request({
-          model: OpenAI.configure({
-            baseURL: "https://api.openai.test/v1/",
-            apiKey: "test",
-            headers: { "openai-beta": "custom-protocol" },
-          }).responses("gpt-4.1-mini"),
+          model: OpenAI.configure({ baseURL: "https://api.openai.test/v1/", apiKey: "test" }).responsesWebSocket(
+            "gpt-4.1-mini",
+          ),
           prompt: "Say hello.",
         }),
-        { webSocket },
       ).pipe(Effect.provide(LLMClient.layer.pipe(Layer.provide(deps))))
 
       expect(response.text).toBe("Hi")
-      expect(opened).toEqual([
-        {
-          url: "wss://api.openai.test/v1/responses",
-          authorization: "Bearer test",
-          protocol: "custom-protocol",
-        },
-      ])
+      expect(opened).toEqual([{ url: "wss://api.openai.test/v1/responses", authorization: "Bearer test" }])
       expect(closed).toBe(true)
       expect(sent).toHaveLength(1)
       expect(JSON.parse(sent[0])).toEqual({
@@ -352,524 +288,15 @@ describe("OpenAI Responses route", () => {
     }),
   )
 
-  it.effect("rejects out-of-order and mismatched WebSocket response events", () =>
-    Effect.gen(function* () {
-      const streams = [
-        Stream.fromArray([
-          ProviderShared.encodeJson({ type: "response.output_text.delta", item_id: "late", delta: "Late" }),
-          ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_old" } }),
-        ]),
-        Stream.fromArray([
-          ProviderShared.encodeJson({ type: "response.created", response: { id: "resp_new" } }),
-          ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_old" } }),
-        ]),
-      ]
-      const webSocket = WebSocketTransport.makeDirect({
-        open: () =>
-          Effect.succeed({
-            sendText: () => Effect.void,
-            messages: streams.shift() ?? Stream.die("unexpected WebSocket open"),
-            close: Effect.void,
-          }),
-      })
-      const deps = Layer.succeed(
-        RequestExecutor.Service,
-        RequestExecutor.Service.of({ execute: () => Effect.die("unexpected HTTP request") }),
-      )
-      const model = OpenAI.configure({ baseURL: "https://api.openai.test/v1/", apiKey: "test" }).responses(
-        "gpt-4.1-mini",
-      )
-
-      const errors = yield* Effect.forEach(["late", "mismatch"], (prompt) =>
-        LLMClient.generate(LLM.request({ model, prompt }), { webSocket }).pipe(
-          Effect.provide(LLMClient.layer.pipe(Layer.provide(deps))),
-          Effect.flip,
-        ),
-      )
-
-      expect(errors.map((error) => error.reason._tag)).toEqual(["InvalidProviderOutput", "InvalidProviderOutput"])
-      expect(errors[0]?.message).toContain("before response.created")
-      expect(errors[1]?.message).toContain("response ID changed")
-    }),
-  )
-
-  it.effect("continues a tool call with only the new tool output", () =>
-    Effect.gen(function* () {
-      const firstRequest = {
-        type: "response.create",
-        model: "gpt-5.2",
-        store: false,
-        input: [{ role: "user", content: [{ type: "input_text", text: "Weather?" }] }],
-      }
-      const first = continuationDriver(firstRequest)
-      const firstCreate = yield* first.create(undefined)
-      yield* first.observe(
-        firstCreate,
-        ProviderShared.encodeJson({
-          type: "response.output_item.done",
-          item: {
-            type: "function_call",
-            id: "fc_1",
-            status: "completed",
-            call_id: "call_1",
-            name: "weather",
-            arguments: '{ "city": "Paris" }',
-          },
-        }),
-      )
-      const saved = checkpoint(
-        yield* first.observe(
-          firstCreate,
-          ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_1" } }),
-        ),
-      )
-      const second = continuationDriver({
-        ...firstRequest,
-        input: [
-          ...firstRequest.input,
-          { type: "function_call", call_id: "call_1", name: "weather", arguments: '{"city":"Paris"}' },
-          { type: "function_call_output", call_id: "call_1", output: '{"temperature":22}' },
-        ],
-      })
-
-      const create = yield* second.create(saved)
-
-      expect(create.mode).toBe("incremental")
-      expect(ProviderShared.decodeJson(create.message)).toMatchObject({
-        previous_response_id: "resp_1",
-        input: [{ type: "function_call_output", call_id: "call_1", output: '{"temperature":22}' }],
-      })
-    }),
-  )
-
-  it.effect("continues a promoted steer after the completed assistant output", () =>
-    Effect.gen(function* () {
-      const firstInput = [{ role: "user", content: [{ type: "input_text", text: "First" }] }]
-      const first = continuationDriver({ type: "response.create", model: "gpt-5.2", store: false, input: firstInput })
-      const create = yield* first.create(undefined)
-      yield* first.observe(
-        create,
-        ProviderShared.encodeJson({
-          type: "response.output_item.done",
-          item: {
-            type: "message",
-            id: "msg_1",
-            status: "completed",
-            role: "assistant",
-            content: [{ type: "output_text", text: "Hello" }],
-          },
-        }),
-      )
-      const saved = checkpoint(
-        yield* first.observe(
-          create,
-          ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_1" } }),
-        ),
-      )
-      const steer = { role: "user", content: [{ type: "input_text", text: "Actually, be brief" }] }
-      const next = continuationDriver({
-        type: "response.create",
-        model: "gpt-5.2",
-        store: false,
-        input: [...firstInput, { role: "assistant", content: [{ type: "output_text", text: "Hello" }] }, steer],
-      })
-
-      const continued = yield* next.create(saved)
-
-      expect(continued.mode).toBe("incremental")
-      expect(ProviderShared.decodeJson(continued.message)).toMatchObject({
-        previous_response_id: "resp_1",
-        input: [steer],
-      })
-    }),
-  )
-
-  it.effect("continues store-false reasoning without replaying the output-only item ID", () =>
-    Effect.gen(function* () {
-      const firstInput = [{ role: "user", content: [{ type: "input_text", text: "Think" }] }]
-      const request = { type: "response.create", model: "gpt-5.2", store: false, input: firstInput }
-      const first = continuationDriver(request)
-      const create = yield* first.create(undefined)
-      yield* first.observe(
-        create,
-        ProviderShared.encodeJson({
-          type: "response.output_item.done",
-          item: {
-            type: "reasoning",
-            id: "rs_1",
-            summary: [{ type: "summary_text", text: "Thought" }],
-            encrypted_content: "encrypted",
-          },
-        }),
-      )
-      const saved = checkpoint(
-        yield* first.observe(
-          create,
-          ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_1" } }),
-        ),
-      )
-      const next = continuationDriver({
-        ...request,
-        input: [
-          ...firstInput,
-          {
-            type: "reasoning",
-            summary: [{ type: "summary_text", text: "Thought" }],
-            encrypted_content: "encrypted",
-          },
-          { role: "user", content: [{ type: "input_text", text: "Continue" }] },
-        ],
-      })
-
-      const continued = yield* next.create(saved)
-
-      expect(continued.mode).toBe("incremental")
-      expect(ProviderShared.decodeJson(continued.message)).toMatchObject({
-        previous_response_id: "resp_1",
-        input: [{ role: "user", content: [{ type: "input_text", text: "Continue" }] }],
-      })
-    }),
-  )
-
-  it.effect("uses a full request when any non-input invariant changes", () =>
-    Effect.gen(function* () {
-      const request = {
-        type: "response.create",
-        model: "gpt-5.2",
-        store: false,
-        metadata: { source: "one" },
-        input: [{ role: "user", content: [{ type: "input_text", text: "First" }] }],
-      }
-      const first = continuationDriver(request)
-      const create = yield* first.create(undefined)
-      const saved = checkpoint(
-        yield* first.observe(
-          create,
-          ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_1" } }),
-        ),
-      )
-      const appended = [...request.input, { role: "user", content: [{ type: "input_text", text: "Second" }] }]
-      const changes = [
-        { ...request, model: "gpt-5.3", input: appended },
-        { ...request, instructions: "Changed", input: appended },
-        { ...request, tools: [{ type: "function", name: "other" }], input: appended },
-        { ...request, temperature: 0.5, input: appended },
-        { ...request, metadata: { source: "two" }, input: appended },
-        {
-          ...request,
-          input: [{ role: "user", content: [{ type: "input_text", text: "Rewritten history" }] }, appended[1]],
-        },
-      ]
-
-      const creates = yield* Effect.forEach(changes, (changed) => continuationDriver(changed).create(saved))
-
-      expect(creates.map((item) => item.mode)).toEqual(changes.map(() => "full"))
-      expect(
-        creates
-          .map((item) => ProviderShared.decodeJson(item.message))
-          .every((item) => ProviderShared.isRecord(item) && !("previous_response_id" in item)),
-      ).toBe(true)
-    }),
-  )
-
-  it.effect("stages no checkpoint for incomplete or ID-less completion", () =>
-    Effect.gen(function* () {
-      const driver = continuationDriver({ type: "response.create", model: "gpt-5.2", input: [] })
-      const create = yield* driver.create(undefined)
-
-      const completed = yield* driver.observe(
-        create,
-        ProviderShared.encodeJson({ type: "response.completed", response: {} }),
-      )
-      expect(completed).toMatchObject({ type: "completed" })
-      expect(completed).not.toHaveProperty("checkpoint")
-      expect(
-        yield* driver.observe(create, ProviderShared.encodeJson({ type: "response.incomplete", response: {} })),
-      ).toMatchObject({ type: "incomplete" })
-    }),
-  )
-
-  it.effect("classifies explicit continuation rejection for runner-owned recovery", () =>
-    Effect.gen(function* () {
-      const driver = continuationDriver({ type: "response.create", model: "gpt-5.2", input: [] })
-      const create = yield* driver.create(undefined)
-      const missing = yield* driver.observe(
-        create,
-        ProviderShared.encodeJson({
-          type: "error",
-          error: { code: "previous_response_not_found", message: "Missing response" },
-        }),
-      )
-      const limit = yield* driver.observe(
-        create,
-        ProviderShared.encodeJson({
-          type: "error",
-          error: { code: "websocket_connection_limit_reached", message: "Rotate" },
-        }),
-      )
-
-      expect(missing).toMatchObject({
-        type: "rejected",
-        recovery: "retry-full",
-        error: { reason: { _tag: "Transport", delivery: "rejected", recovery: "retry-full" } },
-      })
-      expect(limit).toMatchObject({
-        type: "rejected",
-        recovery: "rotate-and-retry-full",
-        error: {
-          reason: { _tag: "Transport", delivery: "rejected", recovery: "rotate-and-retry-full" },
-        },
-      })
-    }),
-  )
-
-  it.effect("builds WebSocket and HTTP fallback from the same final request", () =>
-    Effect.gen(function* () {
-      const attempts = yield* Ref.make(0)
-      const message = yield* Ref.make("")
-      const body = yield* Ref.make("")
-      const response = yield* LLMClient.generate(
-        LLM.request({
-          model: OpenAI.configure({ baseURL: "https://api.openai.test/v1/", apiKey: "test" }).responses("gpt-4.1-mini"),
-          prompt: "Say hello.",
-          http: {
-            body: {
-              model: "overlaid-model",
-              metadata: { source: "overlay" },
-              stream_options: { include_usage: true },
-              background: true,
-            },
-            headers: { "x-request": "request" },
-            query: { mode: "test" },
-          },
-        }),
-        {
-          webSocket: {
-            execute: (exchange) =>
-              Effect.gen(function* () {
-                expect(exchange.connect.rotateAfterMs).toBe(55 * 60 * 1000)
-                expect(exchange.connect.headers["openai-beta"]).toBe("responses_websockets=2026-02-06")
-                expect(exchange.connect.headers["content-length"]).toBeUndefined()
-                yield* exchange.driver
-                  .create(undefined)
-                  .pipe(Effect.flatMap((create) => Ref.set(message, create.message)))
-                return { frames: exchange.fallback(), complete: Effect.void }
-              }),
-          },
-        },
-      ).pipe(
-        Effect.provide(
-          dynamicResponse((input) =>
-            Effect.gen(function* () {
-              yield* Ref.update(attempts, (value) => value + 1)
-              yield* Ref.set(body, input.text)
-              expect(input.request.url).toBe("https://api.openai.test/v1/responses?mode=test")
-              expect(input.request.headers.authorization).toBe("Bearer test")
-              expect(input.request.headers["x-request"]).toBe("request")
-              return input.respond(sseEvents({ type: "response.completed", response: {} }), {
-                headers: { "content-type": "text/event-stream" },
-              })
-            }),
-          ),
-        ),
-      )
-
-      const httpBody = JSON.parse(yield* Ref.get(body))
-      const { stream: _stream, stream_options: _streamOptions, background: _background, ...shared } = httpBody
-      expect(response.finishReason?.normalized).toBe("stop")
-      expect(yield* Ref.get(attempts)).toBe(1)
-      expect(JSON.parse(yield* Ref.get(message))).toEqual({ type: "response.create", ...shared })
-      expect(httpBody).toMatchObject({
-        model: "overlaid-model",
-        metadata: { source: "overlay" },
-        stream: true,
-        stream_options: { include_usage: true },
-        background: true,
-      })
-    }),
-  )
-
-  it.effect("uses exactly one HTTP request when no WebSocket executor is supplied", () =>
-    Effect.gen(function* () {
-      const attempts = yield* Ref.make(0)
-      yield* LLMClient.generate(
-        LLMRequest.update(request, { http: new HttpOptions({ body: { input: "raw-http-input" } }) }),
-      ).pipe(
-        Effect.provide(
-          dynamicResponse((input) =>
-            Effect.gen(function* () {
-              yield* Ref.update(attempts, (value) => value + 1)
-              expect(JSON.parse(input.text).input).toBe("raw-http-input")
-              return input.respond(sseEvents({ type: "response.completed", response: {} }), {
-                headers: { "content-type": "text/event-stream" },
-              })
-            }),
-          ),
-        ),
-      )
-
-      expect(yield* Ref.get(attempts)).toBe(1)
-    }),
-  )
-
-  it.effect("closes a direct WebSocket execution after partial consumption", () =>
-    Effect.gen(function* () {
-      const closed = yield* Ref.make(false)
-      const webSocket = WebSocketTransport.makeDirect({
-        open: () =>
-          Effect.succeed({
-            sendText: () => Effect.void,
-            messages: Stream.fromArray([
-              ProviderShared.encodeJson({ type: "response.created", response: { id: "resp_ws" } }),
-              ProviderShared.encodeJson({ type: "response.output_text.delta", item_id: "msg_1", delta: "Hi" }),
-              ProviderShared.encodeJson({ type: "response.completed", response: { id: "resp_ws" } }),
-            ]),
-            close: Ref.set(closed, true),
-          }),
-      })
-
-      yield* LLMClient.stream(
-        LLM.request({
-          model: OpenAI.configure({ baseURL: "https://api.openai.test/v1/", apiKey: "test" }).responses("gpt-4.1-mini"),
-          prompt: "Say hello.",
-        }),
-        { webSocket },
-      ).pipe(
-        Stream.take(1),
-        Stream.runDrain,
-        Effect.provide(
-          LLMClient.layer.pipe(
-            Layer.provide(
-              Layer.succeed(
-                RequestExecutor.Service,
-                RequestExecutor.Service.of({ execute: () => Effect.die("unexpected HTTP request") }),
-              ),
-            ),
-          ),
-        ),
-      )
-
-      expect(yield* Ref.get(closed)).toBe(true)
-    }),
-  )
-
-  it.effect("terminates WebSocket control events without waiting for the socket to close", () =>
-    Effect.gen(function* () {
-      const events = [
-        { type: "error", error: { code: "slow_down", message: "Try later" } },
-        {
-          type: "error",
-          status_code: 429,
-          message: "Rate limited",
-          headers: { "retry-after": 1, "x-request-id": "request", cached: false, invalid: [] },
-        },
-        {
-          type: "response.failed",
-          response: { error: { code: "server_error", message: "Unavailable" } },
-        },
-        { type: "error", status: "not-a-status", message: "Malformed status" },
-      ]
-
-      const errors = yield* Effect.forEach(events, (event) =>
-        LLMClient.generate(
-          LLM.request({
-            model: OpenAI.configure({ baseURL: "https://api.openai.test/v1/", apiKey: "test" }).responses(
-              "gpt-4.1-mini",
-            ),
-            prompt: "Say hello.",
-          }),
-          {
-            webSocket: WebSocketTransport.makeDirect({
-              open: () =>
-                Effect.succeed({
-                  sendText: () => Effect.void,
-                  messages: Stream.make(ProviderShared.encodeJson(event)).pipe(Stream.concat(Stream.never)),
-                  close: Effect.void,
-                }),
-            }),
-          },
-        ).pipe(
-          Effect.provide(
-            LLMClient.layer.pipe(
-              Layer.provide(
-                Layer.succeed(
-                  RequestExecutor.Service,
-                  RequestExecutor.Service.of({ execute: () => Effect.die("unexpected HTTP request") }),
-                ),
-              ),
-            ),
-          ),
-          Effect.flip,
-        ),
-      )
-
-      expect(errors.map((error) => error.reason._tag)).toEqual([
-        "ProviderInternal",
-        "RateLimit",
-        "ProviderInternal",
-        "UnknownProvider",
-      ])
-    }),
-  )
-
-  it.effect("marks post-send WebSocket failures with delivery state", () =>
-    Effect.gen(function* () {
-      const failure = new AIError({
-        module: "test",
-        method: "receive",
-        reason: new TransportReason({
-          message: "socket closed",
-          transport: "websocket",
-          operation: "read",
-          phase: "close",
-        }),
-      })
-      const streams = [
-        Stream.fail(failure),
-        Stream.make(ProviderShared.encodeJson({ type: "response.created", response: { id: "resp_observed" } })).pipe(
-          Stream.concat(Stream.fail(failure)),
-        ),
-      ]
-      const deps = Layer.succeed(
-        RequestExecutor.Service,
-        RequestExecutor.Service.of({ execute: () => Effect.die("unexpected HTTP request") }),
-      )
-      const webSocket = WebSocketTransport.makeDirect({
-        open: () =>
-          Effect.succeed({
-            sendText: () => Effect.void,
-            messages: streams.shift() ?? Stream.die("unexpected WebSocket open"),
-            close: Effect.void,
-          }),
-      })
-      const model = OpenAI.configure({ baseURL: "https://api.openai.test/v1/", apiKey: "test" }).responses(
-        "gpt-4.1-mini",
-      )
-
-      const errors = yield* Effect.forEach(["first", "second"], (prompt) =>
-        LLMClient.generate(LLM.request({ model, prompt }), { webSocket }).pipe(
-          Effect.provide(LLMClient.layer.pipe(Layer.provide(deps))),
-          Effect.flip,
-        ),
-      )
-
-      expect(errors.map((error) => error.reason)).toEqual([
-        expect.objectContaining({ _tag: "Transport", phase: "close", delivery: "ambiguous" }),
-        expect.objectContaining({ _tag: "Transport", phase: "close", delivery: "accepted" }),
-      ])
-    }),
-  )
-
   it.effect("fails immediately when WebSocket is already closed", () =>
     Effect.gen(function* () {
-      const error = yield* WebSocketTransport.fromWebSocket(
+      const error = yield* WebSocketExecutor.fromWebSocket(
         // oxlint-disable-next-line typescript-eslint/no-unsafe-type-assertion -- fromWebSocket reads readyState before touching WebSocket methods on this branch.
         { readyState: globalThis.WebSocket.CLOSED } as globalThis.WebSocket,
         { url: "wss://api.openai.test/v1/responses", headers: Headers.empty },
       ).pipe(Effect.flip)
 
       expect(error.message).toContain("closed before opening")
-      expect(error.reason).toMatchObject({ _tag: "Transport", phase: "connect", delivery: "not-sent" })
     }),
   )
 
@@ -902,7 +329,7 @@ describe("OpenAI Responses route", () => {
       yield* LLMClient.generate(
         LLMRequest.update(request, {
           model: Azure.configure({
-            baseURL: "https://opencode-test.openai.azure.com/openai/",
+            baseURL: "https://opencode-test.openai.azure.com/openai/v1/",
             apiKey: "azure-key",
             headers: { authorization: "Bearer stale" },
           }).responses("gpt-4.1-mini"),
@@ -2610,7 +2037,8 @@ describe("OpenAI Responses route", () => {
       )
 
       expect(error).toBeInstanceOf(AIError)
-      expect(error.reason).toMatchObject({ _tag: "InvalidRequest", message: "Bad request" })
+      expect(error.reason).toMatchObject({ _tag: "InvalidRequest" })
+      expect(error.message).toContain("HTTP 400")
     }),
   )
 })

packages/ai/test/recorded-test.ts

@@ -2,11 +2,12 @@ import { HttpRecorder } from "@opencode-ai/http-recorder"
 import { Layer } from "effect"
 import * as path from "node:path"
 import { fileURLToPath } from "node:url"
-import { LLMClient, RequestExecutor } from "../src/route.js"
+import { LLMClient, RequestExecutor, WebSocketExecutor } from "../src/route.js"
 import { ImageClient } from "../src/image-client.js"
 import type { Service as ImageClientService } from "../src/image-client.js"
 import type { Service as LLMClientService } from "../src/route/client.js"
 import type { Service as RequestExecutorService } from "../src/route/executor.js"
+import type { Service as WebSocketExecutorService } from "../src/route/transport/websocket.js"
 import {
   recordedEffectGroup,
   type RecordedCaseOptions as RunnerCaseOptions,
@@ -16,7 +17,7 @@ import {
 const __dirname = path.dirname(fileURLToPath(import.meta.url))
 const FIXTURES_DIR = path.resolve(__dirname, "fixtures", "recordings")
 
-type RecordedEnv = RequestExecutorService | LLMClientService | ImageClientService
+type RecordedEnv = RequestExecutorService | WebSocketExecutorService | LLMClientService | ImageClientService
 
 type RecordedTestsOptions = RecordedGroupOptions & {
   readonly options?: HttpRecorder.RecorderOptions
@@ -81,10 +82,11 @@ export const recordedTests = (options: RecordedTestsOptions) =>
           }),
         ),
       )
+      const deps = Layer.mergeAll(requestExecutor, WebSocketExecutor.layer)
       return Layer.mergeAll(
-        requestExecutor,
-        LLMClient.layer.pipe(Layer.provide(requestExecutor)),
-        ImageClient.layer.pipe(Layer.provide(requestExecutor)),
+        deps,
+        LLMClient.layer.pipe(Layer.provide(deps)),
+        ImageClient.layer.pipe(Layer.provide(deps)),
       )
     },
   })

packages/ai/test/schema.test.ts

@@ -11,7 +11,6 @@ import {
   LanguageModel,
   ModelID,
   ProviderID,
-  TransportReason,
   Usage,
 } from "../src/schema/index.js"
 import { ProviderShared } from "../src/protocols/shared.js"
@@ -109,25 +108,3 @@ test("AI errors expose the shared runtime tag", async () => {
     await Effect.runPromise(Effect.fail(error).pipe(Effect.catchTag("AI.Error", () => Effect.succeed("caught")))),
   ).toBe("caught")
 })
-
-test("transport errors serialize execution facts", () => {
-  const reason = new TransportReason({
-    message: "connection closed",
-    transport: "websocket",
-    operation: "read",
-    phase: "receive",
-    delivery: "ambiguous",
-    recovery: "fail",
-  })
-
-  expect(Schema.encodeSync(TransportReason)(reason)).toEqual({
-    _tag: "Transport",
-    message: "connection closed",
-    transport: "websocket",
-    operation: "read",
-    phase: "receive",
-    delivery: "ambiguous",
-    recovery: "fail",
-  })
-  expect(Schema.decodeUnknownSync(TransportReason)(Schema.encodeSync(TransportReason)(reason))).toEqual(reason)
-})

packages/app/AGENTS.md

@@ -22,8 +22,6 @@
 ## Localization
 
 - NEVER hardcode user-visible English strings in production code. ALWAYS use an i18n key for visible copy, placeholders, accessible labels, tooltips, menus, dialogs, toasts, empty states, and displayed errors.
-- Feature work adds English source strings only. Leave non-English keys absent so the runtime English fallback applies; translations land separately after language review.
-- Render count-sensitive copy only through `language.plural(baseKey, count, params)`. Never select or pass `.zero`, `.one`, `.two`, `.few`, `.many`, or `.other` variants to `language.t(...)`.
 - When migrating existing copy to i18n, preserve the English text byte-for-byte unless the task explicitly requests a copy change.
 - NEVER change existing English text or English keys to facilitate translation. English is intentional, designer-written source copy; adapt locale-specific translations and i18n mechanics around it.
 - Keep locale complexity behind the shared typed i18n APIs. Feature and component code should use `language.t(...)` for ordinary copy and `language.plural(baseKey, count, params)` for count-sensitive copy. It must not inspect the locale, call `Intl.PluralRules`, construct or select plural-category keys such as `.one` or `.other`, or branch on locale-specific grammar.

packages/app/e2e/performance/timeline-stability/fixture.ts

@@ -2,7 +2,7 @@ import { base64Encode } from "@opencode-ai/core/util/encode"
 import { Event } from "@opencode-ai/schema/event"
 import { SessionStatusEvent } from "@opencode-ai/schema/session-status-event"
 import { SessionV1 } from "@opencode-ai/schema/session-v1"
-import type { SessionInfo, SessionMessageInfo, SessionStatus } from "@opencode-ai/client/promise"
+import type { SessionInfo, SessionStatus } from "@opencode-ai/client/promise"
 import type { AssistantMessage, Message, Part, ToolPart, ToolState, UserMessage } from "../../../src/types"
 import { expect, type Page } from "@playwright/test"
 import { Schema } from "effect"
@@ -90,8 +90,6 @@ export async function setupTimeline(
   page: Page,
   input: {
     messages?: TimelineMessage[]
-    currentMessages?: SessionMessageInfo[]
-    sessionStatus?: Record<string, SessionStatus>
     settings?: Record<string, boolean>
     sessions?: Session[]
     cpuRate?: number
@@ -104,22 +102,13 @@ export async function setupTimeline(
   } = {},
 ) {
   const sessions = input.sessions ?? [session()]
-  const messages =
-    input.currentMessages ??
-    validateTimelineMessages([
-      ...(input.seedHistory ? historyMessages(18) : []),
-      ...(input.messages ?? [userMessage(), assistantMessage()]),
-    ])
-  const active = messages.findLast((message) =>
-    "info" in message ? message.info.role === "assistant" : message.type === "assistant",
-  )
+  const messages = validateTimelineMessages([
+    ...(input.seedHistory ? historyMessages(18) : []),
+    ...(input.messages ?? [userMessage(), assistantMessage()]),
+  ])
+  const active = messages.findLast((message) => message.info.role === "assistant")
   const initialStatus = decodeStatus(
-    active &&
-      ("info" in active
-        ? active.info.role === "assistant" && active.info.time.completed === undefined
-        : active.type === "assistant" && active.time.completed === undefined)
-      ? { type: "busy" }
-      : { type: "idle" },
+    active?.info.role === "assistant" && active.info.time.completed === undefined ? { type: "busy" } : { type: "idle" },
     decodeOptions,
   )
   const server = `http://${process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"}:${process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"}`
@@ -133,7 +122,7 @@ export async function setupTimeline(
     project: project(),
     provider: provider(),
     sessions,
-    sessionStatus: input.sessionStatus ?? { [sessionID]: initialStatus },
+    sessionStatus: { [sessionID]: initialStatus },
     pageMessages: () => ({
       items: messages,
     }),

packages/app/e2e/performance/unit/mock-server.test.ts

@@ -122,7 +122,6 @@ test("applies message latency after a list response gate is released", async ()
   const gate = Promise.withResolvers<void>()
   let handler: ((route: Route) => Promise<void>) | undefined
   const page = {
-    addInitScript: () => Promise.resolve(),
     route: (_url: string, callback: (route: Route) => Promise<void>) => {
       handler = callback
       return Promise.resolve()

packages/app/e2e/regression/cross-server-tab-close.spec.ts

@@ -1,7 +1,6 @@
 import { expect, test, type Page, type Route } from "@playwright/test"
 import { base64Encode } from "@opencode-ai/core/util/encode"
 import { currentSession } from "../utils/mock-server"
-import { installSseTransport } from "../utils/sse-transport"
 
 const serverA = "http://127.0.0.1:4096"
 const serverB = "http://127.0.0.1:4097"
@@ -79,8 +78,6 @@ function session(id: string, directory: string, title: string) {
 }
 
 async function mockServers(page: Page, requests: string[]) {
-  await installSseTransport(page, { server: serverA })
-  await installSseTransport(page, { server: serverB })
   await page.route("**/*", async (route) => {
     const url = new URL(route.request().url())
     if (url.origin !== serverA && url.origin !== serverB) return route.fallback()
@@ -88,6 +85,7 @@ async function mockServers(page: Page, requests: string[]) {
     const current = url.origin === serverA ? sessionA : sessionB
     const directory = url.searchParams.get("directory")
     if (directory && directory !== current.directory) return json(route, { name: "InvalidDirectory" }, 500)
+    if (url.pathname === "/api/event") return sse(route)
     if (url.pathname === "/api/health") return json(route, { pid: 1 })
     if (url.pathname === "/api/session") return json(route, { data: [currentSession(current)], cursor: {} })
     if (url.pathname === "/api/session/active") return json(route, { data: {} })
@@ -144,3 +142,7 @@ function json(route: Route, body: unknown, status = 200) {
     body: JSON.stringify(body),
   })
 }
+
+function sse(route: Route) {
+  return route.fulfill({ status: 200, contentType: "text/event-stream", body: ": ok\n\n" })
+}

packages/app/e2e/regression/remote-session-settings.spec.ts

@@ -13,8 +13,6 @@ const sessionB = session("ses_server_b", directoryB, "Server B session")
 
 test("session settings use the remote server context", async ({ page }) => {
   const permissionRequests: string[] = []
-  await installSseTransport(page, { server: serverA })
-  await installSseTransport(page, { server: serverB })
   await mockServers(page, permissionRequests)
   await configureServers(page)
 
@@ -48,7 +46,6 @@ test("session settings use the remote server context", async ({ page }) => {
 test("auto-accept responds for an unfocused server session", async ({ page }) => {
   const permissionRequests: string[] = []
   const permissionResponses: PermissionResponse[] = []
-  await installSseTransport(page, { server: serverB })
   const transport = await installSseTransport<{ directory: string; payload: Record<string, unknown> }>(page, {
     server: serverA,
     retry: 20,
@@ -184,6 +181,7 @@ async function mockServers(page: Page, permissionRequests: string[], permissionR
       return json(route, true)
     }
     if (requestDirectory && requestDirectory !== directory) return json(route, { name: "InvalidDirectory" }, 500)
+    if (url.pathname === "/api/event") return sse(route)
     if (url.pathname === "/api/provider")
       return json(route, {
         location: { directory },
@@ -327,3 +325,7 @@ function json(route: Route, body: unknown, status = 200) {
     body: JSON.stringify(body),
   })
 }
+
+function sse(route: Route) {
+  return route.fulfill({ status: 200, contentType: "text/event-stream", body: ": ok\n\n" })
+}

packages/app/e2e/regression/review-open-file.spec.ts

@@ -95,22 +95,22 @@ test("opens and searches project files inline", async ({ page }) => {
   const sidebarToggle = panel.getByRole("button", { name: "Toggle file tree" })
   const contextButton = page.getByRole("button", { name: "View context usage" })
   await contextButton.click()
-  await expect(panel.getByRole("tab", { name: "Context", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "Context" })).toHaveAttribute("data-selected", "")
   await panel.getByRole("button", { name: "Open file" }).click()
-  await expect(panel.getByRole("tab", { name: "Open file", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "Open file" })).toHaveAttribute("data-selected", "")
   await expect(sidebarToggle).toBeDisabled()
   await expect(sidebar).toBeVisible()
   await contextButton.click()
-  await expect(panel.getByRole("tab", { name: "Context", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "Context" })).toHaveAttribute("data-selected", "")
   await expect(sidebar).toBeHidden()
   await panel.getByRole("button", { name: "Open file" }).click()
   const filter = panel.getByRole("combobox", { name: "Filter files" })
   await expect(filter).toBeFocused()
-  await expect(panel.getByRole("tab", { name: "Open file", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "Open file" })).toHaveAttribute("data-selected", "")
   await expect(panel.getByText("open-file-project", { exact: true })).toBeVisible()
 
   await panel.getByRole("button", { name: "README.md" }).click()
-  await expect(panel.getByRole("tab", { name: "README.md", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "README.md" })).toHaveAttribute("data-selected", "")
   await expect(sidebarToggle).toBeEnabled()
   await expect(panel.getByText("contents:README.md", { exact: true })).toBeVisible()
   await expect(sidebar).toHaveCount(0)
@@ -125,21 +125,21 @@ test("opens and searches project files inline", async ({ page }) => {
   expect(resultID).toBeTruthy()
   await expect(filter).toHaveAttribute("aria-activedescendant", resultID!)
   await filter.press("Enter")
-  await expect(panel.getByRole("tab", { name: "nested.ts", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "nested.ts" })).toHaveAttribute("data-selected", "")
   await expect(sidebarToggle).toBeEnabled()
   await expect(panel.getByText("contents:src/nested.ts", { exact: true })).toBeVisible()
   expect(searches).toContainEqual({ query: "nested", dirs: "file", limit: 200 })
 
   await panel.getByRole("button", { name: "Open file" }).click()
   await expect(panel.getByRole("tab", { name: "nested.ts" })).toHaveCount(1)
-  await expect(panel.getByRole("tab", { name: "Open file", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "Open file" })).toHaveAttribute("data-selected", "")
   await expect(sidebarToggle).toBeDisabled()
   await panel.locator("#session-side-panel-review-tab").click()
   await expect(sidebarToggle).toBeEnabled()
   await panel.getByRole("tab", { name: "Open file" }).click()
   await page.keyboard.press("Control+w")
   await expect(panel.getByRole("tab", { name: "Open file" })).toHaveCount(0)
-  await expect(panel.getByRole("tab", { name: "nested.ts", selected: true })).toBeVisible()
+  await expect(panel.getByRole("tab", { name: "nested.ts" })).toHaveAttribute("data-selected", "")
 })
 
 function fileNode(path: string) {

packages/app/e2e/regression/session-request-docks.spec.ts

@@ -11,23 +11,18 @@ const title = "Request dock regression"
 
 test("shows a pending question dock", async ({ page }) => {
   await mockServer(page, {
-    forms: [
+    questions: [
       {
-        id: "frm_question_request",
+        id: "question-request",
         sessionID,
-        title: "Questions",
-        metadata: { kind: "question" },
-        fields: [
+        questions: [
           {
-            key: "q0",
-            type: "string",
-            title: "Implementation",
-            description: "Which implementation should be used?",
+            header: "Implementation",
+            question: "Which implementation should be used?",
             options: [
-              { value: "minimal", label: "Minimal", description: "Use the smallest correct change" },
-              { value: "extended", label: "Extended", description: "Include additional behavior" },
+              { label: "Minimal", description: "Use the smallest correct change" },
+              { label: "Extended", description: "Include additional behavior" },
             ],
-            custom: true,
           },
         ],
       },
@@ -47,7 +42,7 @@ test("shows a pending question dock", async ({ page }) => {
   const rejectRequests: string[] = []
   page.on("request", (request) => {
     if (request.method() !== "POST") return
-    if (new URL(request.url()).pathname === `/api/session/${sessionID}/form/frm_question_request/cancel`)
+    if (new URL(request.url()).pathname === `/api/session/${sessionID}/question/question-request/reject`)
       rejectRequests.push(request.url())
   })
 
@@ -72,10 +67,10 @@ test("shows a pending question dock", async ({ page }) => {
   const reply = page.waitForRequest(
     (request) =>
       request.method() === "POST" &&
-      new URL(request.url()).pathname === `/api/session/${sessionID}/form/frm_question_request/reply`,
+      new URL(request.url()).pathname === `/api/session/${sessionID}/question/question-request/reply`,
   )
   await question.getByRole("button", { name: "Submit" }).click()
-  expect((await reply).postDataJSON()).toEqual({ answer: { q0: "minimal" } })
+  expect((await reply).postDataJSON()).toEqual({ answers: [["Minimal"]] })
 })
 
 test("shows a pending permission dock", async ({ page }) => {
@@ -114,7 +109,7 @@ test("restores the draft caret before typing after a request dock closes", async
     server: `http://${process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"}:${process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"}`,
     retry: 20,
   })
-  await mockServer(page, { forms: [] })
+  await mockServer(page, { questions: [] })
   await page.goto(`/${base64Encode(directory)}/session/${sessionID}`)
   await transport.waitForConnection()
   await expectSessionTitle(page, title)
@@ -140,24 +135,18 @@ test("restores the draft caret before typing after a request dock closes", async
   await transport.send({
     directory,
     payload: {
-      type: "form.created",
+      type: "question.asked",
       properties: {
-        form: {
-          id: "frm_question_caret",
-          sessionID,
-          title: "Questions",
-          metadata: { kind: "question", tool: { messageID: "message-caret", id: "call-caret" } },
-          fields: [
-            {
-              key: "q0",
-              type: "string",
-              title: "Continue",
-              description: "Continue?",
-              options: [{ value: "yes", label: "Yes", description: "Continue the session" }],
-              custom: true,
-            },
-          ],
-        },
+        id: "question-caret",
+        sessionID,
+        questions: [
+          {
+            header: "Continue",
+            question: "Continue?",
+            options: [{ label: "Yes", description: "Continue the session" }],
+          },
+        ],
+        tool: { messageID: "message-caret", callID: "call-caret" },
       },
     },
   })
@@ -167,10 +156,7 @@ test("restores the draft caret before typing after a request dock closes", async
 
   await transport.send({
     directory,
-    payload: {
-      type: "form.cancelled",
-      properties: { sessionID, id: "frm_question_caret" },
-    },
+    payload: { type: "question.rejected", properties: { sessionID, requestID: "question-caret" } },
   })
   await expect(question).toHaveCount(0)
   await expect(editor).toBeVisible()
@@ -184,8 +170,6 @@ async function mockServer(
   requests: {
     permissions?: unknown[] | (() => unknown[])
     questions?: unknown[] | (() => unknown[])
-    forms?: unknown[] | (() => unknown[])
-    sessionStatus?: Record<string, unknown>
   },
 ) {
   await mockOpenCodeServer(page, {
@@ -230,8 +214,6 @@ async function mockServer(
     pageMessages: () => ({ items: [] }),
     permissions: requests.permissions,
     questions: requests.questions,
-    forms: requests.forms,
-    sessionStatus: requests.sessionStatus,
   })
   await page.addInitScript(() => {
     localStorage.setItem("settings.v3", JSON.stringify({ general: { newLayoutDesigns: true } }))

packages/app/e2e/regression/session-timeline-notices.spec.ts

@@ -1,184 +0,0 @@
-import { expect, test } from "@playwright/test"
-import type { SessionMessageInfo } from "@opencode-ai/client/promise"
-import { session, sessionID, setupTimeline } from "../performance/timeline-stability/fixture"
-
-const user = { id: "msg_user", type: "user", text: "Run it", time: { created: 1 } } satisfies SessionMessageInfo
-
-const assistant = (completed: boolean, tool = false, childID?: string) =>
-  ({
-    id: "msg_assistant",
-    type: "assistant",
-    agent: "build",
-    model: { id: "model", providerID: "provider" },
-    content: tool
-      ? [
-          {
-            type: "tool",
-            id: "call_subagent",
-            name: "subagent",
-            state: { status: "running", input: {}, metadata: childID ? { sessionID: childID } : {} },
-            time: { created: 2 },
-          },
-        ]
-      : [{ type: "text", text: "Working" }],
-    time: { created: 2, ...(completed ? { completed: 3 } : {}) },
-  }) satisfies SessionMessageInfo
-
-test("renders current protocol notices in CLI order", async ({ page }) => {
-  const ownerWarnings: string[] = []
-  page.on("console", (message) => {
-    if (message.text().includes("computations created outside a `createRoot` or `render`"))
-      ownerWarnings.push(message.text())
-  })
-  await setupTimeline(page, {
-    currentMessages: [
-      user,
-      { id: "msg_agent", type: "agent-switched", agent: "explore", time: { created: 2 } },
-      assistant(true),
-      {
-        id: "msg_subagent",
-        type: "synthetic",
-        text: "done",
-        description: "Search code",
-        metadata: { source: "subagent", agent: "explore", state: "completed" },
-        time: { created: 4 },
-      },
-      {
-        id: "msg_restart",
-        type: "synthetic",
-        text: "continue",
-        description: "Continuing after restart",
-        time: { created: 5 },
-      },
-      { id: "msg_skill", type: "skill", skill: "review", name: "Review", text: "instructions", time: { created: 6 } },
-    ],
-  })
-
-  const notices = page.locator('[data-slot="session-timeline-notice"]')
-  await expect(notices).toHaveCount(4)
-  await expect(notices.nth(0)).toContainText("Agent · explore")
-  await expect(notices.nth(1)).toContainText("explore finished · Search code")
-  await expect(notices.nth(2)).toContainText("Continuing after restart")
-  await expect(notices.nth(3)).toContainText("Skill · Review")
-  expect(ownerWarnings).toEqual([])
-})
-
-test("moves blocking work to the background with Ctrl+B", async ({ page }) => {
-  await setupTimeline(page, { currentMessages: [user, assistant(false, true)] })
-  await expect(page.locator('[data-component="task-tool-card"]')).toBeVisible()
-  await expect(page.getByText("Called `subagent`", { exact: false })).toHaveCount(0)
-  await expect(page.locator('[data-component="background-tool-control"]')).toHaveCount(0)
-  await expect(page.locator('[data-action="session-background-toggle"]')).toContainText("Move 1 subagent to background")
-
-  const request = page.waitForRequest(
-    (request) =>
-      request.method() === "POST" && new URL(request.url()).pathname === `/api/session/${sessionID}/background`,
-  )
-  await page.keyboard.press("Control+b")
-  await request
-})
-
-test("navigates from a running subagent card and hides background controls in the child", async ({ page }) => {
-  const childID = "ses_running_child"
-  await setupTimeline(page, {
-    currentMessages: [user, assistant(false, true, childID)],
-    sessions: [session(), session({ id: childID, parentID: sessionID, title: "Sleep for 5 minutes" })],
-    sessionStatus: { [sessionID]: { type: "busy" }, [childID]: { type: "busy" } },
-  })
-
-  await expect(page.locator('[data-action="session-background-toggle"]')).toContainText("Move 1 subagent to background")
-  await page.locator('[data-component="task-tool-card"]').click()
-  await expect(page).toHaveURL(new RegExp(`/session/${childID}$`))
-  await expect(page.locator('[data-component="session-background-dock"]')).toHaveCount(0)
-})
-
-test("shows a badge for active background work", async ({ page }) => {
-  const childID = "ses_background_child"
-  await setupTimeline(page, {
-    currentMessages: [user, assistant(true)],
-    sessions: [session(), session({ id: childID, parentID: sessionID })],
-    sessionStatus: { [childID]: { type: "busy" } },
-  })
-
-  await expect(page.locator('[data-component="session-background-dock"]')).toContainText("1 subagent in background")
-})
-
-test("separates blocking and already-backgrounded work into two rows", async ({ page }) => {
-  const backgroundID = "ses_background_existing"
-  const blockingID = "ses_background_blocking"
-  await setupTimeline(page, {
-    currentMessages: [
-      user,
-      {
-        id: "msg_backgrounded",
-        type: "assistant",
-        agent: "build",
-        model: { id: "model", providerID: "provider" },
-        content: [
-          {
-            type: "tool",
-            id: "call_backgrounded",
-            name: "subagent",
-            state: {
-              status: "completed",
-              input: { description: "Background task" },
-              content: [{ type: "text", text: "working" }],
-              metadata: { sessionID: backgroundID, status: "running" },
-            },
-            time: { created: 2, completed: 3 },
-          },
-          {
-            type: "tool",
-            id: "call_shell_backgrounded",
-            name: "shell",
-            state: {
-              status: "completed",
-              input: { command: "sleep 120" },
-              content: [{ type: "text", text: "working" }],
-              metadata: { shellID: "shell_backgrounded", status: "running" },
-            },
-            time: { created: 2, completed: 3 },
-          },
-        ],
-        time: { created: 2, completed: 3 },
-      },
-      {
-        id: "msg_blocking",
-        type: "assistant",
-        agent: "build",
-        model: { id: "model", providerID: "provider" },
-        content: [
-          {
-            type: "tool",
-            id: "call_blocking",
-            name: "subagent",
-            state: {
-              status: "running",
-              input: { description: "Foreground task" },
-              metadata: { sessionID: blockingID },
-            },
-            time: { created: 4 },
-          },
-        ],
-        time: { created: 4 },
-      },
-    ],
-    sessions: [
-      session(),
-      session({ id: backgroundID, parentID: sessionID, title: "Background task" }),
-      session({ id: blockingID, parentID: sessionID, title: "Foreground task" }),
-    ],
-    sessionStatus: {
-      [sessionID]: { type: "busy" },
-      [backgroundID]: { type: "busy" },
-      [blockingID]: { type: "busy" },
-    },
-  })
-
-  const dock = page.locator('[data-component="session-background-dock"]')
-  await expect(dock).toContainText("Move 1 subagent to background")
-  await expect(dock.getByText("Running 1 shell and 1 subagent in background", { exact: true })).toBeVisible()
-  await expect(
-    page.locator('[data-timeline-part-id="call_shell_backgrounded"] [data-component="text-shimmer"]'),
-  ).toHaveAttribute("data-active", "true")
-})

packages/app/e2e/regression/subagent-child-navigation.spec.ts

@@ -27,30 +27,6 @@ test("navigates to a subagent child session missing from the session list", asyn
   await expect(titlebarRight.getByRole("button", { name: "Toggle review" })).toHaveCount(1)
 })
 
-test("keeps the parent visible while child lineage resolves", async ({ page }) => {
-  await setup(page)
-  const requested = Promise.withResolvers<void>()
-  const release = Promise.withResolvers<void>()
-  await page.route(
-    (url) => url.pathname === `/api/session/${childID}` && url.port === (process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"),
-    async (route) => {
-      requested.resolve()
-      await release.promise
-      await route.fallback()
-    },
-  )
-  await page.goto(sessionHref(parentID))
-  await expectSessionTitle(page, parentTitle)
-
-  await page.locator(`a[href="${sessionHref(childID)}"]`).click()
-  await requested.promise
-  await Promise.all([expect(page).toHaveURL(sessionHref(parentID)), expectSessionTitle(page, parentTitle)]).finally(
-    () => release.resolve(),
-  )
-
-  await expectSessionTitle(page, taskDescription)
-})
-
 test("shows the not found fallback when the viewed session is deleted", async ({ page }) => {
   const events: EventPayload[] = []
   await setup(page, () => events.splice(0, 1))

packages/app/e2e/smoke/session-timeline.spec.ts

@@ -189,12 +189,7 @@ test.describe("smoke: session timeline", () => {
                 .querySelector<HTMLElement>('[data-timeline-row="bottom-spacer"]')
                 ?.getBoundingClientRect()
               samples.push({ ids: visible, last: visible.includes(last), bottomError: bottom?.bottom - view.bottom })
-              if (
-                !firstPaint &&
-                visible.includes(last) &&
-                Math.abs((bottom?.bottom ?? Infinity) - view.bottom) <= 1 &&
-                !root.querySelector('[data-markdown-key="initial"]')
-              ) {
+              if (!firstPaint && visible.includes(last) && Math.abs((bottom?.bottom ?? Infinity) - view.bottom) <= 1) {
                 firstPaint = true
                 root.querySelectorAll<HTMLElement>("[data-timeline-key]").forEach((row) => {
                   const rect = row.getBoundingClientRect()
@@ -209,16 +204,10 @@ test.describe("smoke: session timeline", () => {
         }
         ;(
           window as Window & {
-            __sessionTabPaint?: {
-              samples: typeof samples
-              painted: () => boolean
-              removed: () => number
-              stop: () => void
-            }
+            __sessionTabPaint?: { samples: typeof samples; removed: () => number; stop: () => void }
           }
         ).__sessionTabPaint = {
           samples,
-          painted: () => firstPaint,
           removed: () => removedFirstPaintNodes,
           stop: () => {
             running = false
@@ -230,19 +219,17 @@ test.describe("smoke: session timeline", () => {
     )
 
     await switchTitlebarSession(page, fixture.targetID, fixture.expected.targetTitle)
-    await page.waitForFunction(() => {
-      const probe = (
-        window as Window & { __sessionTabPaint?: { samples: Array<{ ids: string[] }>; painted: () => boolean } }
-      ).__sessionTabPaint
-      return probe?.painted() && probe.samples.some((sample) => sample.ids.length > 0)
-    })
+    await page.waitForFunction(() =>
+      (
+        window as Window & { __sessionTabPaint?: { samples: Array<{ ids: string[] }> } }
+      ).__sessionTabPaint?.samples.some((sample) => sample.ids.length > 0),
+    )
     await page.waitForTimeout(200)
     const first = await page.evaluate(() => {
       const probe = (
         window as Window & {
           __sessionTabPaint?: {
             samples: Array<{ ids: string[]; last: boolean; bottomError?: number }>
-            painted: () => boolean
             removed: () => number
             stop: () => void
           }

packages/app/e2e/utils/mock-server.ts

@@ -32,110 +32,15 @@ export interface MockServerConfig {
   todos?: (sessionID: string) => unknown[]
   permissions?: unknown[] | (() => unknown[])
   questions?: unknown[] | (() => unknown[])
-  forms?: unknown[] | (() => unknown[])
   fileList?: (path: string) => unknown | Promise<unknown>
   fileContent?: (path: string) => unknown | Promise<unknown>
   findFiles?: (input: { query: string; dirs?: string; limit?: number }) => unknown
   sessionStatus?: Record<string, unknown> | (() => Record<string, unknown>)
 }
 
-type MockStreamWindow = Window & {
-  __testSseTransport?: unknown
-  __mockServerStream?: { push: (payloads: unknown[]) => void }
-}
-
 export async function mockOpenCodeServer(page: Page, config: MockServerConfig) {
   const cursors = new Map<string, string>()
   let nextCursor = 0
-
-  await page.addInitScript(
-    ({ port, retry }) => {
-      const host = window as MockStreamWindow
-      if (host.__testSseTransport || host.__mockServerStream) return
-      const originalFetch = window.fetch.bind(window)
-      const encoder = new TextEncoder()
-      const state: {
-        controller?: ReadableStreamDefaultController<Uint8Array>
-        buffer: string[]
-        connections: number
-      } = { buffer: [], connections: 0 }
-      const frame = (payload: unknown) => `data: ${JSON.stringify(payload)}\n\n`
-      host.__mockServerStream = {
-        push(payloads: unknown[]) {
-          const frames = payloads.map(frame)
-          const controller = state.controller
-          if (!controller) {
-            state.buffer.push(...frames)
-            return
-          }
-          frames.forEach((item) => controller.enqueue(encoder.encode(item)))
-        },
-      }
-      const fetch = (input: RequestInfo | URL, init?: RequestInit) => {
-        const request = new Request(input, init)
-        const url = new URL(request.url)
-        if (url.port !== port || url.pathname !== "/api/event") return originalFetch(request)
-        state.connections += 1
-        const id = state.connections
-        let ended = false
-        let own: ReadableStreamDefaultController<Uint8Array> | undefined
-        const stream = new ReadableStream<Uint8Array>({
-          start(controller) {
-            own = controller
-            state.controller = controller
-            if (retry !== undefined) controller.enqueue(encoder.encode(`retry: ${retry}\n\n`))
-            controller.enqueue(
-              encoder.encode(frame({ id: `evt_mock_connected_${id}`, type: "server.connected", data: {} })),
-            )
-            state.buffer.splice(0).forEach((item) => controller.enqueue(encoder.encode(item)))
-            request.signal.addEventListener(
-              "abort",
-              () => {
-                if (ended) return
-                ended = true
-                if (state.controller === controller) state.controller = undefined
-                controller.error(request.signal.reason ?? new DOMException("The operation was aborted", "AbortError"))
-              },
-              { once: true },
-            )
-          },
-          cancel() {
-            if (ended) return
-            ended = true
-            if (state.controller === own) state.controller = undefined
-          },
-        })
-        return Promise.resolve(
-          new Response(stream, {
-            status: 200,
-            headers: { "cache-control": "no-cache", "content-type": "text/event-stream" },
-          }),
-        )
-      }
-      Object.defineProperty(window, "fetch", { configurable: true, writable: true, value: fetch })
-    },
-    { port: process.env.PLAYWRIGHT_SERVER_PORT ?? "4096", retry: config.eventRetry },
-  )
-
-  if (config.events) {
-    const pump = { busy: false }
-    const timer = setInterval(() => {
-      if (pump.busy) return
-      const batch = config.events?.() ?? []
-      if (batch.length === 0) return
-      pump.busy = true
-      void page
-        .evaluate(
-          (payloads) => (window as MockStreamWindow).__mockServerStream?.push(payloads),
-          batch.map(currentEvent),
-        )
-        .catch(() => {})
-        .finally(() => {
-          pump.busy = false
-        })
-    }, 50)
-    page.on("close", () => clearInterval(timer))
-  }
   const staticRoutes: Record<string, unknown> = {
     "/path": {
       state: config.directory,
@@ -267,34 +172,16 @@ export async function mockOpenCodeServer(page: Page, config: MockServerConfig) {
     }
     if (/^\/api\/credential\/[^/]+$/.test(path) && route.request().method() === "DELETE")
       return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
-    if (path === "/api/project") {
-      const project = config.project as typeof config.project & { canonical?: string; worktree?: string }
-      return json(route, [
-        {
-          ...project,
-          canonical: project.canonical ?? project.worktree ?? config.directory,
-        },
-      ])
-    }
+    if (path === "/api/project") return json(route, [config.project])
     if (path === "/api/project/current")
       return json(route, { id: (config.project as { id?: string }).id, directory: config.directory })
-    const worktree = path.match(/^\/api\/experimental\/project\/([^/]+)\/worktree$/)?.[1]
-    if (worktree && route.request().method() === "GET")
-      return json(route, [
-        { directory: config.directory },
-        ...((config.project as { sandboxes?: string[] }).sandboxes ?? []).map((directory) => ({
-          directory,
-          strategy: "git",
-        })),
-      ])
     if (path === "/api/location") return json(route, location(config))
-    if (worktree && route.request().method() === "POST") {
+    const projectCopy = path.match(/^\/experimental\/project\/([^/]+)\/copy$/)?.[1]
+    if (projectCopy && route.request().method() === "POST") {
       const input = route.request().postDataJSON() as { directory: string; name?: string }
       return json(route, { directory: `${input.directory}/${input.name ?? "copy"}` })
     }
-    if (worktree && route.request().method() === "DELETE")
-      return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
-    if (/^\/api\/experimental\/project\/[^/]+\/worktree\/refresh$/.test(path))
+    if (projectCopy && route.request().method() === "DELETE")
       return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
     if (path === "/api/permission/request")
       return json(route, {
@@ -308,11 +195,6 @@ export async function mockOpenCodeServer(page: Page, config: MockServerConfig) {
         location: location(config),
         data: typeof config.questions === "function" ? config.questions() : (config.questions ?? []),
       })
-    if (path === "/api/form/request")
-      return json(route, {
-        location: location(config),
-        data: typeof config.forms === "function" ? config.forms() : (config.forms ?? []),
-      })
     if (path === "/api/vcs")
       return json(route, { location: location(config), data: { branch: "main", defaultBranch: "main" } })
     if (path === "/api/vcs/status") return json(route, { location: location(config), data: [] })
@@ -361,10 +243,7 @@ export async function mockOpenCodeServer(page: Page, config: MockServerConfig) {
       const limit = Number(url.searchParams.get("limit") ?? 50)
       const offset = Number(url.searchParams.get("cursor") ?? 0)
       const sessions = config.sessions
-        .filter((session) => {
-          const location = session.location as { directory?: string } | undefined
-          return !directory || location?.directory === directory || session.directory === directory
-        })
+        .filter((session) => !directory || session.directory === directory)
         .filter((session) => parentID !== "null" || session.parentID === undefined)
         .filter((session) => {
           const search = url.searchParams.get("search")?.toLowerCase()
@@ -401,18 +280,6 @@ export async function mockOpenCodeServer(page: Page, config: MockServerConfig) {
     if (/^\/api\/session\/[^/]+\/question\/[^/]+\/(reply|reject)$/.test(path) && route.request().method() === "POST") {
       return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
     }
-    const sessionForm = path.match(/^\/api\/session\/([^/]+)\/form$/)?.[1]
-    if (sessionForm && route.request().method() === "GET") {
-      const forms = typeof config.forms === "function" ? config.forms() : (config.forms ?? [])
-      return json(route, { data: forms.filter((form) => (form as { sessionID?: string }).sessionID === sessionForm) })
-    }
-    if (/^\/api\/session\/[^/]+\/form\/[^/]+\/(reply|cancel)$/.test(path) && route.request().method() === "POST") {
-      return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
-    }
-    if (/^\/api\/session\/[^/]+\/background$/.test(path) && route.request().method() === "POST")
-      return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
-    if (/^\/api\/session\/[^/]+\/inbox$/.test(path) && route.request().method() === "GET")
-      return json(route, { data: [] })
     if (/^\/api\/session\/[^/]+\/permission\/[^/]+\/reply$/.test(path) && route.request().method() === "POST") {
       return route.fulfill({ status: 204, headers: { "access-control-allow-origin": "*" } })
     }
@@ -599,7 +466,6 @@ function currentPermission(value: unknown) {
 
 export function currentSession(session: { id: string } & Record<string, unknown>, fallbackDirectory?: string) {
   const time = session.time && typeof session.time === "object" ? session.time : {}
-  const location = session.location && typeof session.location === "object" ? session.location : {}
   return {
     id: session.id,
     parentID: session.parentID,
@@ -617,19 +483,10 @@ export function currentSession(session: { id: string } & Record<string, unknown>
     },
     title: session.title ?? session.id,
     location: {
-      directory:
-        "directory" in location && typeof location.directory === "string"
-          ? location.directory
-          : typeof session.directory === "string"
-            ? session.directory
-            : fallbackDirectory,
-      ...(typeof session.workspaceID === "string"
-        ? { workspaceID: session.workspaceID }
-        : "workspaceID" in location && typeof location.workspaceID === "string"
-          ? { workspaceID: location.workspaceID }
-          : {}),
+      directory: typeof session.directory === "string" ? session.directory : fallbackDirectory,
+      ...(typeof session.workspaceID === "string" ? { workspaceID: session.workspaceID } : {}),
     },
-    subpath: session.subpath ?? session.path,
+    subpath: session.path,
     revert: session.revert,
   }
 }

packages/app/package.json

@@ -63,13 +63,19 @@
     "@opencode-ai/util": "workspace:*",
     "@pierre/trees": "1.0.0-beta.4",
     "@sentry/solid": "catalog:",
+    "@shikijs/transformers": "3.9.2",
+    "@solid-primitives/active-element": "2.1.3",
+    "@solid-primitives/audio": "1.4.2",
     "@solid-primitives/event-bus": "1.1.2",
     "@solid-primitives/event-listener": "2.4.5",
     "@solid-primitives/i18n": "2.2.1",
     "@solid-primitives/media": "2.3.3",
     "@solid-primitives/resize-observer": "2.1.5",
     "@solid-primitives/scheduled": "1.5.3",
+    "@solid-primitives/scroll": "2.1.3",
     "@solid-primitives/storage": "catalog:",
+    "@solid-primitives/timer": "1.4.4",
+    "@solid-primitives/websocket": "1.3.1",
     "@solidjs/meta": "catalog:",
     "@solidjs/router": "catalog:",
     "@tanstack/solid-query": "5.91.4",

packages/app/src/app.tsx

@@ -1,38 +1,48 @@
 import "@/index.css"
 import * as Sentry from "@sentry/solid"
 import { I18nProvider } from "@opencode-ai/ui/context"
-import type { UiI18n } from "@opencode-ai/ui/context/i18n"
 import { DialogProvider } from "@opencode-ai/ui/context/dialog"
 import { FileComponentProvider } from "@opencode-ai/ui/context/file"
 import { File } from "@opencode-ai/session-ui/file"
 import { Font } from "@opencode-ai/ui/font"
+import { Splash } from "@opencode-ai/ui/logo"
 import { ThemeProvider } from "@opencode-ai/ui/theme/context"
 import { MetaProvider } from "@solidjs/meta"
 import { type BaseRouterProps, Navigate, Route, Router, useParams, useSearchParams } from "@solidjs/router"
 import { QueryClient, QueryClientProvider } from "@tanstack/solid-query"
+import { Effect } from "effect"
 import {
   type Component,
   createEffect,
   createMemo,
   createRenderEffect,
+  createResource,
+  createSignal,
   ErrorBoundary,
+  For,
   type JSX,
   lazy,
+  onCleanup,
   type ParentProps,
   Show,
 } from "solid-js"
 import { Dynamic } from "solid-js/web"
+import { makeEventListener } from "@solid-primitives/event-listener"
 import { CommandProvider, useCommand, type CommandOption } from "@/context/command"
 import { CommentsProvider } from "@/context/comments"
 import { FileProvider } from "@/context/file"
+import { ServerSDKProvider } from "@/context/server-sdk"
+import { ServerSyncProvider } from "@/context/server-sync"
 import { GlobalProvider, useGlobal } from "@/context/global"
 import { HighlightsProvider } from "@/context/highlights"
 import { LanguageProvider, type Locale, useLanguage } from "@/context/language"
 import { LayoutProvider } from "@/context/layout"
 import { ModelsProvider } from "@/context/models"
+import { NotificationProvider } from "@/context/notification"
+import { PermissionProvider } from "@/context/permission"
 import { usePlatform } from "@/context/platform"
 import { PromptProvider } from "@/context/prompt"
-import { ServerConnection, ServersProvider, useServers } from "@/context/servers"
+import { ServerConnection, ServerProvider, serverName, useServer } from "@/context/server"
 import { SettingsProvider } from "@/context/settings"
 import { TabsProvider, useTabs, type DraftTab } from "@/context/tabs"
 import { SDKProvider } from "@/context/sdk"
@@ -40,26 +50,26 @@ import { WslServersProvider } from "@/wsl/context"
 import { DirectoryDataProvider } from "@/pages/directory-layout"
 import Layout from "@/pages/layout"
 import { ErrorPage } from "./pages/error"
+import { useCheckServerHealth } from "./utils/server-health"
 import { legacySessionServer, requireServerKey, sessionHref } from "./utils/session-route"
 import { decode64 } from "@/utils/base64"
 
 import { TargetSessionRouteContent } from "@/pages/session"
 import { Home } from "@/pages/home"
-import { ServerProvider } from "./context/server"
 
 const NewSession = lazy(() => import("@/pages/new-session"))
 
 const DirectoryDraftRedirect = () => {
   const params = useParams()
   const [search] = useSearchParams<{ draftId?: string; prompt?: string }>()
-  const server = useServers()
+  const server = useServer()
   const tabs = useTabs()
 
   createEffect(() => {
     if (search.draftId || !tabs.ready()) return
     const directory = decode64(params.dir)
     if (!directory) return
-    tabs.newDraft({ server: ServerConnection.key(server.list[0])!, directory }, search.prompt)
+    tabs.newDraft({ server: server.key, directory }, search.prompt)
   })
 
   return null
@@ -76,13 +86,31 @@ function TargetServerRoute(props: ParentProps) {
   return (
     // Owns the server-identity remount. Session changes must not remount this subtree.
     <Show when={requireServerKey(params.serverKey)} keyed>
-      <Show when={conn()} keyed>
-        {(conn) => <ServerProvider conn={conn}>{props.children}</ServerProvider>}
-      </Show>
+      <ServerSDKProvider server={conn}>
+        <ServerSyncProvider server={conn}>{props.children}</ServerSyncProvider>
+      </ServerSDKProvider>
     </Show>
   )
 }
 
+const TargetSessionRoute = () => (
+  <TargetServerRoute>
+    <TargetSessionRouteContent />
+  </TargetServerRoute>
+)
+
+// Wraps the non-draft routes. They are gated on (and keyed to) the globally selected
+// server via ServerKey, then provide the server-scoped shell for that server.
+function SelectedServerProviders(props: ParentProps) {
+  return (
+    <ServerKey>
+      <ServerSDKProvider>
+        <ServerSyncProvider>{props.children}</ServerSyncProvider>
+      </ServerSDKProvider>
+    </ServerKey>
+  )
+}
+
 function DraftRoute() {
   const [search] = useSearchParams<{ draftId?: string }>()
   const tabs = useTabs()
@@ -102,24 +130,24 @@ function DraftRoute() {
 function ResolvedDraftRoute(props: { draft: DraftTab }) {
   const global = useGlobal()
   const conn = createMemo(() => global.servers.list().find((item) => ServerConnection.key(item) === props.draft.server))
+  const directory = () => props.draft.directory
+  const serverKey = () => props.draft.server
 
   return (
     <Show when={`${props.draft.server}\0${props.draft.directory}`} keyed>
-      <Show when={conn()} keyed>
-        {(conn) => (
-          <ServerProvider conn={conn}>
-            <ModelsProvider directory={props.draft.directory}>
-              <SDKProvider directory={props.draft.directory}>
-                <DirectoryDataProvider directory={props.draft.directory} server={props.draft.server}>
-                  <DraftProviders>
-                    <NewSession draftId={props.draft.draftID} />
-                  </DraftProviders>
-                </DirectoryDataProvider>
-              </SDKProvider>
-            </ModelsProvider>
-          </ServerProvider>
-        )}
-      </Show>
+      <ServerSDKProvider server={conn}>
+        <ServerSyncProvider server={conn}>
+          <ModelsProvider directory={directory}>
+            <SDKProvider directory={directory}>
+              <DirectoryDataProvider directory={directory} server={serverKey}>
+                <DraftProviders>
+                  <NewSession />
+                </DraftProviders>
+              </DirectoryDataProvider>
+            </SDKProvider>
+          </ModelsProvider>
+        </ServerSyncProvider>
+      </ServerSDKProvider>
     </Show>
   )
 }
@@ -128,13 +156,7 @@ function UiI18nBridge(props: ParentProps) {
   const language = useLanguage()
   return (
     <I18nProvider
-      value={{
-        locale: language.intl,
-        layoutLocale: language.layoutLocale,
-        t: language.t as UiI18n["t"],
-        plural: language.plural,
-        pluralForm: language.pluralForm,
-      }}
+      value={{ locale: language.intl, layoutLocale: language.layoutLocale, t: language.t, plural: language.plural }}
     >
       {props.children}
     </I18nProvider>
@@ -158,8 +180,8 @@ function QueryProvider(props: ParentProps) {
     defaultOptions: {
       queries: {
         refetchOnReconnect: false,
-        refetchOnWindowFocus: false,
         refetchOnMount: false,
+        refetchOnWindowFocus: false,
       },
     },
   })
@@ -179,6 +201,18 @@ function BodyDesignClass() {
 
 // Server-agnostic providers shared across every route. These live in the shared
 // shell (router root) so they stay mounted regardless of the active server/route.
+function SharedProviders(props: ParentProps) {
+  return (
+    <>
+      <BodyDesignClass />
+      <CommandProvider>
+        <DesktopCommands />
+        <HighlightsProvider>{props.children}</HighlightsProvider>
+      </CommandProvider>
+    </>
+  )
+}
+
 function DesktopCommands() {
   const command = useCommand()
   const language = useLanguage()
@@ -202,14 +236,30 @@ function DesktopCommands() {
   return null
 }
 
-function AppLayout(props: ParentProps) {
+type ServerScopedShellProps = ParentProps<{
+  directory?: () => string | undefined
+  serverScoped?: JSX.Element
+}>
+
+function ServerScopedProviders(props: ServerScopedShellProps) {
   return (
     <LayoutProvider>
-      <Layout>{props.children}</Layout>
+      {props.serverScoped}
+      <ModelsProvider directory={props.directory}>{props.children}</ModelsProvider>
     </LayoutProvider>
   )
 }
 
+function AppLayout(props: ParentProps<{ serverScoped?: JSX.Element }>) {
+  return (
+    <SelectedServerProviders>
+      <ServerScopedProviders serverScoped={props.serverScoped}>
+        <Layout>{props.children}</Layout>
+      </ServerScopedProviders>
+    </SelectedServerProviders>
+  )
+}
+
 // The draft page only renders the prompt composer, so it drops TerminalProvider.
 // FileProvider and CommentsProvider stay because PromptInput uses file search and comment context.
 function DraftProviders(props: ParentProps) {
@@ -259,6 +309,133 @@ export function AppBaseProviders(
   )
 }
 
+function ConnectionGate(props: ParentProps<{ disableHealthCheck?: boolean; startup?: Promise<void> }>) {
+  const server = useServer()
+  const checkServerHealth = useCheckServerHealth()
+
+  const [checkMode, setCheckMode] = createSignal<"blocking" | "background">("blocking")
+
+  // performs repeated health check with a grace period for
+  // non-http connections, otherwise fails instantly
+  const [startupHealthCheck, healthCheckActions] = createResource(() =>
+    props.disableHealthCheck
+      ? true
+      : Effect.gen(function* () {
+          if (!server.current) return true
+          const { http, type } = server.current
+
+          while (true) {
+            const res = yield* Effect.promise(() => checkServerHealth(http))
+            if (res.healthy) return true
+            if (checkMode() === "background" || type === "http") return false
+          }
+        }).pipe(
+          Effect.timeoutOrElse({ duration: "10 seconds", orElse: () => Effect.succeed(false) }),
+          Effect.ensuring(Effect.sync(() => setCheckMode("background"))),
+          Effect.runPromise,
+        ),
+  )
+  const checking = createMemo(
+    () => checkMode() === "blocking" && ["unresolved", "pending"].includes(startupHealthCheck.state),
+  )
+  const [startup] = createResource(async () => {
+    if (!props.startup) return true
+    await props.startup.catch((error) => {
+      console.error("[startup] startup gate failed", error)
+    })
+    return true
+  })
+  const startupChecking = createMemo(
+    () => startupHealthCheck.latest === true && ["unresolved", "pending"].includes(startup.state),
+  )
+  const loading = createMemo(() => checking() || startupChecking())
+
+  return (
+    <>
+      <Show when={!checking()}>
+        <Show
+          when={startupHealthCheck.latest}
+          fallback={
+            <ConnectionError
+              onRetry={() => {
+                if (checkMode() === "background") void healthCheckActions.refetch()
+              }}
+              onServerSelected={(key) => {
+                setCheckMode("blocking")
+                server.setActive(key)
+                void healthCheckActions.refetch()
+              }}
+            />
+          }
+        >
+          {props.children}
+        </Show>
+      </Show>
+      <Show when={loading()}>
+        <div class="fixed inset-0 z-[9999] flex flex-col items-center justify-center bg-background-base">
+          <Splash class="w-16 h-20 opacity-50 animate-pulse" />
+        </div>
+      </Show>
+    </>
+  )
+}
+
+function ConnectionError(props: { onRetry?: () => void; onServerSelected?: (key: ServerConnection.Key) => void }) {
+  const language = useLanguage()
+  const server = useServer()
+  const others = () => server.list.filter((s) => ServerConnection.key(s) !== server.key)
+  const name = createMemo(() => server.name || server.key)
+  const serverToken = "\u0000server\u0000"
+  const unreachable = createMemo(() => language.t("app.server.unreachable", { server: serverToken }).split(serverToken))
+
+  const timer = setInterval(() => props.onRetry?.(), 1000)
+  onCleanup(() => clearInterval(timer))
+
+  return (
+    <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base gap-6 p-6">
+      <div class="flex flex-col items-center max-w-md text-center">
+        <Splash class="w-12 h-15 mb-4" />
+        <p class="text-14-regular text-text-base">
+          {unreachable()[0]}
+          <span class="text-text-strong font-medium">{name()}</span>
+          {unreachable()[1]}
+        </p>
+        <p class="mt-1 text-12-regular text-text-weak">{language.t("app.server.retrying")}</p>
+      </div>
+      <Show when={others().length > 0}>
+        <div class="flex flex-col gap-2 w-full max-w-sm">
+          <span class="text-12-regular text-text-base text-center">{language.t("app.server.otherServers")}</span>
+          <div class="flex flex-col gap-1 bg-surface-base rounded-lg p-2">
+            <For each={others()}>
+              {(conn) => {
+                const key = ServerConnection.key(conn)
+                return (
+                  <button
+                    type="button"
+                    class="flex items-center gap-3 w-full px-3 py-2 rounded-md hover:bg-surface-raised-base-hover transition-colors text-left"
+                    onClick={() => props.onServerSelected?.(key)}
+                  >
+                    <span class="text-14-regular text-text-strong truncate">{serverName(conn)}</span>
+                  </button>
+                )
+              }}
+            </For>
+          </div>
+        </div>
+      </Show>
+    </div>
+  )
+}
+
+function ServerKey(props: ParentProps) {
+  const server = useServer()
+  return (
+    <Show when={server.key} keyed>
+      {props.children}
+    </Show>
+  )
+}
+
 export function AppInterface(props: {
   children?: JSX.Element
   defaultServer: ServerConnection.Key
@@ -267,60 +444,67 @@ export function AppInterface(props: {
   router?: Component<BaseRouterProps>
   disableHealthCheck?: boolean
   startup?: Promise<void>
+  serverScoped?: JSX.Element
 }) {
   // The visual layout lives in the router root so it remains mounted across
   // route changes. Draft and session routes override only their server-bound data
   // providers beneath it.
-  const Root = (rootProps: ParentProps) => (
-    <TabsProvider>
-      <BodyDesignClass />
-      <CommandProvider>
-        <DesktopCommands />
-        <HighlightsProvider>
-          {props.children}
-          {rootProps.children}
-        </HighlightsProvider>
-      </CommandProvider>
-    </TabsProvider>
+  const ServerShell = (shellProps: ParentProps) => (
+    <QueryProvider>
+      <SharedProviders>
+        {props.children}
+        {shellProps.children}
+      </SharedProviders>
+    </QueryProvider>
   )
 
   return (
-    <ServersProvider
+    <ServerProvider
       defaultServer={props.defaultServer}
       canonicalLocalServer={props.canonicalLocalServer}
       servers={props.servers}
     >
-      <SettingsProvider>
-        <GlobalProvider>
-          <Dynamic component={props.router ?? Router} root={Root}>
-            {/* Proper Routes */}
-            <Route component={AppLayout}>
-              <Route path="/" component={Home} />
-              <Route
-                path="/server/:serverKey/session/:id"
-                component={() => (
-                  <TargetServerRoute>
-                    <TargetSessionRouteContent />
-                  </TargetServerRoute>
-                )}
-              />
-              <Route path="/new-session" component={DraftRoute} />
-            </Route>
-            {/* Legacy Routes */}
-            <Route>
-              <Route path="/:dir" component={DirectoryDraftRedirect} />
-              <Route path="/:dir/session" component={DirectoryDraftRedirect} />
-              <Route path="/:dir/session/:id" component={LegacySessionRedirect} />
-            </Route>
-          </Dynamic>
-        </GlobalProvider>
-      </SettingsProvider>
-    </ServersProvider>
+      <GlobalProvider>
+        <SettingsProvider>
+          <ConnectionGate disableHealthCheck={props.disableHealthCheck} startup={props.startup}>
+            <Dynamic
+              component={props.router ?? Router}
+              root={(routerProps) => (
+                <TabsProvider>
+                  <PermissionProvider>
+                    <NotificationProvider>
+                      <ServerShell>
+                        <AppLayout serverScoped={props.serverScoped}>{routerProps.children}</AppLayout>
+                      </ServerShell>
+                    </NotificationProvider>
+                  </PermissionProvider>
+                </TabsProvider>
+              )}
+            >
+              <Routes />
+            </Dynamic>
+          </ConnectionGate>
+        </SettingsProvider>
+      </GlobalProvider>
+    </ServerProvider>
+  )
+}
+
+function Routes() {
+  return (
+    <>
+      <Route path="/" component={Home} />
+      <Route path="/:dir" component={DirectoryDraftRedirect} />
+      <Route path="/:dir/session" component={DirectoryDraftRedirect} />
+      <Route path="/:dir/session/:id" component={LegacySessionRedirect} />
+      <Route path="/server/:serverKey/session/:id" component={TargetSessionRoute} />
+      <Route path="/new-session" component={DraftRoute} />
+    </>
   )
 }
 
 function LegacySessionRedirect() {
-  const server = useServers()
+  const server = useServer()
   const tabs = useTabs()
   const params = useParams<{ id: string }>()
 
@@ -331,7 +515,7 @@ function LegacySessionRedirect() {
           legacySessionServer(
             tabs.store.filter((item) => item.type === "session"),
             params.id,
-            ServerConnection.key(server.list[0]!),
+            server.key,
           ),
           params.id,
         )}

packages/app/src/components/command-palette.ts

@@ -8,13 +8,12 @@ import { useFile } from "@/context/file"
 import { useGlobal } from "@/context/global"
 import { useLanguage } from "@/context/language"
 import { useLayout, type LocalProject } from "@/context/layout"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 import { useServerSDK } from "@/context/server-sdk"
 import { useTabs } from "@/context/tabs"
 import { displayName, projectForSession } from "@/pages/layout/helpers"
 import { createSessionTabs } from "@/pages/session/helpers"
 import { useSessionLayout } from "@/pages/session/session-layout"
-import { useServer } from "@/context/server"
 
 export type CommandPaletteEntry = {
   id: string
@@ -84,7 +83,7 @@ export function createCommandPaletteModel(props: { filesOnly?: () => boolean; on
   const language = useLanguage()
   const file = useFile()
   const dialog = useDialog()
-  const serverSDK = useServerSDK()
+  const serverSDK = useServerSDK()()
   const serverCtx = global.ensureServerCtx(serverSDK.server)
   const appTabs = useTabs()
   const { tabs: sessionTabs } = useSessionLayout()

packages/app/src/components/debug-bar.tsx

@@ -1,5 +1,5 @@
 import { useIsRouting, useLocation } from "@solidjs/router"
-import { batch, createEffect, onCleanup, onMount, Show } from "solid-js"
+import { batch, createEffect, onCleanup, onMount } from "solid-js"
 import { createStore } from "solid-js/store"
 import { makeEventListener } from "@solid-primitives/event-listener"
 import { Tooltip } from "@opencode-ai/ui/tooltip"
@@ -571,7 +571,7 @@ export function DebugBar(props: { inline?: boolean } = {}) {
           value={language.t(`debugBar.direction.${language.direction()}`)}
           onClick={() => language.setDirection(language.direction() === "rtl" ? "ltr" : "rtl")}
         />
-        <Show when={platform.setForceFocus}>
+        {platform.setForceFocus && (
           <ToggleCell
             active={state.focus}
             inline={props.inline}
@@ -580,7 +580,7 @@ export function DebugBar(props: { inline?: boolean } = {}) {
             value={language.t(state.focus ? "debugBar.focus.on" : "debugBar.focus.off")}
             onClick={() => void toggleFocus()}
           />
-        </Show>
+        )}
       </div>
     </aside>
   )

packages/app/src/components/dialog-command-palette-v2.tsx

@@ -10,7 +10,7 @@ import { createEffect, createMemo, createResource, createSignal, For, Match, onC
 import { commandPaletteOptions, formatKeybindParts, useCommand } from "@/context/command"
 import { useGlobal } from "@/context/global"
 import { useLanguage } from "@/context/language"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 import { useTabs } from "@/context/tabs"
 import { SessionTabAvatar } from "@/pages/layout/session-tab-avatar"
 import { getRelativeTime } from "@/utils/time"

packages/app/src/components/dialog-connect-provider.tsx

@@ -12,7 +12,7 @@ import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
 import { DialogBody, DialogHeader, DialogTitle, DialogV2 } from "@opencode-ai/ui/v2/dialog-v2"
 import { TextInputV2 } from "@opencode-ai/ui/v2/text-input-v2"
 import { showToast } from "@/utils/toast"
-import { type Component, createMemo, createUniqueId, For, Match, onMount, Show, Switch } from "solid-js"
+import { type Accessor, type Component, createMemo, createUniqueId, For, Match, onMount, Show, Switch } from "solid-js"
 import { createStore } from "solid-js/store"
 import { useParams } from "@solidjs/router"
 import { ExternalLink } from "@/components/external-link"
@@ -20,7 +20,6 @@ import { useServerSync } from "@/context/server-sync"
 import { useLanguage } from "@/context/language"
 import { useSettings } from "@/context/settings"
 import { popularProviders, useProviders } from "@/hooks/use-providers"
-import { useIntegrations } from "@/hooks/use-integrations"
 import { CustomProviderForm } from "./dialog-custom-provider"
 import { decode64 } from "@/utils/base64"
 import { createProviderConnectionController, type ProviderConnectMethod } from "./provider-connection-controller"
@@ -41,7 +40,7 @@ export function useProviderConnectController(options: { onBack?: () => void } =
 }
 
 export const DialogConnectProvider: Component<{
-  directory?: string
+  directory?: Accessor<string | undefined>
   controller?: ReturnType<typeof useProviderConnectController>
 }> = (props) => {
   const fallback = useProviderConnectController()
@@ -137,11 +136,15 @@ export const DialogConnectProvider: Component<{
   )
 }
 
-function ProviderPicker(props: { directory?: string; onSelect: (provider: string) => void; onPrepare?: () => void }) {
+function ProviderPicker(props: {
+  directory?: Accessor<string | undefined>
+  onSelect: (provider: string) => void
+  onPrepare?: () => void
+}) {
   const settings = useSettings()
   if (settings.general.newLayoutDesigns())
     return <ProviderPickerV2 directory={props.directory} onSelect={props.onSelect} onPrepare={props.onPrepare} />
-  const integrations = useIntegrations(() => props.directory)
+  const providers = useProviders(() => props.directory?.())
   const language = useLanguage()
   const popularGroup = () => language.t("dialog.provider.group.popular")
   const otherGroup = () => language.t("dialog.provider.group.other")
@@ -163,7 +166,7 @@ function ProviderPicker(props: { directory?: string; onSelect: (provider: string
       key={(x) => x?.id}
       items={() => {
         language.locale()
-        return [{ id: CUSTOM_ID, name: customLabel() }, ...integrations.list()]
+        return [{ id: CUSTOM_ID, name: customLabel() }, ...providers.all().values()]
       }}
       filterKeys={["id", "name"]}
       groupBy={(x) => (popularProviders.includes(x.id) ? popularGroup() : otherGroup())}
@@ -208,8 +211,12 @@ function ProviderPicker(props: { directory?: string; onSelect: (provider: string
   )
 }
 
-function ProviderPickerV2(props: { directory?: string; onSelect: (provider: string) => void; onPrepare?: () => void }) {
-  const integrations = useIntegrations(() => props.directory)
+function ProviderPickerV2(props: {
+  directory?: Accessor<string | undefined>
+  onSelect: (provider: string) => void
+  onPrepare?: () => void
+}) {
+  const providers = useProviders(() => props.directory?.())
   const language = useLanguage()
   const [store, setStore] = createStore({
     filter: "",
@@ -221,7 +228,7 @@ function ProviderPickerV2(props: { directory?: string; onSelect: (provider: stri
   const all = createMemo(() => {
     language.locale()
     const query = store.filter.trim().toLowerCase()
-    const values = [custom(), ...integrations.list()]
+    const values = [custom(), ...providers.all().values()]
     if (!query) return values
     return values.filter((provider) => `${provider.id} ${provider.name}`.toLowerCase().includes(query))
   })
@@ -357,7 +364,7 @@ function ProviderPickerV2(props: { directory?: string; onSelect: (provider: stri
 
 function ProviderConnection(props: {
   provider: string
-  directory?: string
+  directory?: Accessor<string | undefined>
   onBack: () => void
   setBack: (handler: () => void) => void
 }) {
@@ -367,9 +374,12 @@ function ProviderConnection(props: {
   const language = useLanguage()
   const settings = useSettings()
   const newLayout = settings.general.newLayoutDesigns
-  const providers = useProviders(() => props.directory)
-  const directory = () => props.directory ?? decode64(params.dir)
+  const providers = useProviders(() => props.directory?.())
+  const directory = () => props.directory?.() ?? decode64(params.dir)
 
+  const provider = createMemo(
+    () => providers.all().get(props.provider) ?? serverSync().data.provider.all.get(props.provider)!,
+  )
   const controller = createProviderConnectionController({
     provider: () => props.provider,
     directory,
@@ -383,14 +393,6 @@ function ProviderConnection(props: {
       })
     },
   })
-  const provider = createMemo(() => ({
-    id: props.provider,
-    name:
-      providers.all().get(props.provider)?.name ??
-      serverSync.data.provider.all.get(props.provider)?.name ??
-      controller.integration()?.name ??
-      props.provider,
-  }))
   const methodLabel = (value?: { type?: string; label?: string }) => {
     if (!value) return ""
     if (value.type === "key") return language.t("provider.connect.method.apiKey")

packages/app/src/components/dialog-custom-provider.tsx

@@ -116,8 +116,8 @@ export function CustomProviderForm(props: { autofocus?: boolean } = {}) {
     const output = validateCustomProvider({
       form,
       t: language.t,
-      disabledProviders: serverSync.data.config.disabled_providers ?? [],
-      existingProviderIDs: new Set(serverSync.data.provider.all.keys()),
+      disabledProviders: serverSync().data.config.disabled_providers ?? [],
+      existingProviderIDs: new Set(serverSync().data.provider.all.keys()),
     })
     batch(() => {
       setForm("err", output.err)

packages/app/src/components/dialog-edit-project-v2.css

@@ -1,238 +0,0 @@
-.project-settings-v2-dialog [data-slot="dialog-container"] {
-  background: var(--v2-background-bg-base);
-}
-
-.project-settings-v2-dialog [data-slot="dialog-body"] {
-  padding: 0;
-  overflow: hidden;
-}
-
-.project-settings-v2 {
-  height: 100%;
-}
-
-.project-settings-v2-nav {
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  width: 100%;
-}
-
-.project-settings-v2-panel {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  min-width: 0;
-  overflow: hidden !important;
-  user-select: none;
-}
-
-.project-settings-v2-panel :is(input, textarea, [contenteditable="true"]) {
-  user-select: text;
-}
-
-.project-settings-v2-form {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  min-height: 0;
-}
-
-.project-settings-v2-scroll {
-  display: flex;
-  flex: 1;
-  flex-direction: column;
-  gap: 24px;
-  min-height: 0;
-  padding: 40px;
-  overflow-y: auto;
-}
-
-.project-settings-page-header {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-.project-settings-page-header h2 {
-  color: var(--v2-text-text-base);
-  font-size: 15px;
-  font-weight: 640;
-  line-height: 1;
-}
-
-.project-settings-page-header > span {
-  color: var(--v2-text-text-muted);
-  font-size: 11px;
-  font-weight: 440;
-  line-height: 1;
-}
-
-.project-settings-extensions {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  min-height: 0;
-  padding: 40px;
-}
-
-.project-settings-extension-tabs {
-  flex: 1;
-  height: auto;
-  min-height: 0;
-  margin-top: 24px;
-  overflow: visible;
-}
-
-.project-settings-extension-tabs[data-component="tabs-v2"][data-variant="pill"] > [data-slot="tabs-v2-list"] {
-  width: auto;
-  padding-inline: 0 !important;
-}
-
-.project-settings-extension-tabs[data-component="tabs-v2"][data-variant="pill"] > [data-slot="tabs-v2-list"]::before {
-  display: none;
-}
-
-.project-settings-extension-tabs[data-component="tabs-v2"][data-variant="pill"]
-  > [data-slot="tabs-v2-list"]
-  [data-slot="tabs-v2-trigger-wrapper"] {
-  border-radius: 6px;
-}
-
-.project-settings-extension-tabs[data-component="tabs-v2"][data-variant="pill"]
-  > [data-slot="tabs-v2-list"]
-  [data-slot="tabs-v2-trigger"] {
-  padding-inline: 8px;
-}
-
-.project-settings-extension-tabs [data-slot="tabs-v2-content"] {
-  overflow-y: auto;
-}
-
-.project-settings-extension-section {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-  padding-top: 20px;
-}
-
-.project-settings-extension-section-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 16px;
-  color: var(--v2-text-text-base);
-  font-size: 13px;
-  font-weight: 530;
-  line-height: 1;
-}
-
-.project-settings-extension-section-header > :last-child {
-  color: var(--v2-text-text-faint);
-  font-size: 11px;
-  font-weight: 440;
-}
-
-.project-settings-extension-link {
-  color: var(--v2-text-text-accent) !important;
-  text-decoration: none;
-}
-
-.project-settings-extension-link:hover {
-  text-decoration: underline;
-}
-
-.project-settings-extension-card {
-  padding-inline: 12px;
-  overflow: hidden;
-  border: 0.5px solid var(--v2-border-border-base);
-  border-radius: 8px;
-  background: var(--v2-background-bg-base);
-}
-
-.project-settings-extension-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-  min-height: 48px;
-  border-bottom: 0.5px solid var(--v2-border-border-base);
-}
-
-.project-settings-extension-row:last-child {
-  border-bottom: 0;
-}
-
-.project-settings-extension-row-main {
-  display: flex;
-  flex: 1;
-  align-items: center;
-  gap: 10px;
-  min-width: 0;
-}
-
-.project-settings-extension-row-icon {
-  flex-shrink: 0;
-  color: var(--v2-icon-icon-muted);
-}
-
-.project-settings-extension-row-name {
-  min-width: 0;
-  overflow: hidden;
-  color: var(--v2-text-text-base);
-  font-size: 13px;
-  font-weight: 530;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.project-settings-extension-row-status {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  flex-shrink: 0;
-  color: var(--v2-text-text-muted);
-  font-size: 11px;
-}
-
-.project-settings-extension-row-status-dot {
-  width: 5px;
-  height: 5px;
-  border-radius: 50%;
-  background: var(--v2-state-fg-warning);
-}
-
-.project-settings-shared {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-
-.project-settings-shared-trigger {
-  display: flex;
-  align-items: center;
-  align-self: flex-start;
-  gap: 6px;
-  color: var(--v2-text-text-base);
-  font-size: 11px;
-  font-weight: 530;
-}
-
-.project-settings-shared-chevron {
-  width: 12px;
-  height: 12px;
-  color: var(--v2-icon-icon-muted);
-  transition: transform 120ms ease;
-}
-
-.project-settings-shared-chevron.open {
-  transform: rotate(90deg);
-}
-
-.project-settings-shared-count {
-  padding: 1px 4px;
-  border-radius: 3px;
-  background: var(--v2-background-bg-layer-02);
-  color: var(--v2-text-text-muted);
-  font-size: 9px;
-}

packages/app/src/components/dialog-edit-project-v2.tsx

@@ -1,223 +1,156 @@
 import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
-import { Dialog, DialogFooter } from "@opencode-ai/ui/v2/dialog-v2"
+import { Dialog, DialogBody, DialogFooter, DialogHeader, DialogTitle } from "@opencode-ai/ui/v2/dialog-v2"
+import { DividerV2 } from "@opencode-ai/ui/v2/divider-v2"
 import { Field } from "@opencode-ai/ui/v2/field-v2"
-import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
-import { Icon } from "@opencode-ai/ui/icon"
+import { Icon } from "@opencode-ai/ui/v2/icon"
 import { ProjectAvatar, PROJECT_AVATAR_VARIANTS } from "@opencode-ai/ui/v2/project-avatar-v2"
-import { TabsV2 } from "@opencode-ai/ui/v2/tabs-v2"
 import { TextareaV2 } from "@opencode-ai/ui/v2/textarea-v2"
 import { TextInputV2 } from "@opencode-ai/ui/v2/text-input-v2"
-import { For, Show, createSignal, startTransition } from "solid-js"
+import { For, Show } from "solid-js"
 import { useLanguage } from "@/context/language"
 import { getProjectAvatarVariant, type LocalProject } from "@/context/layout"
-import { ServerConnection } from "@/context/servers"
-import { SDKProvider } from "@/context/sdk"
-import { displayName, getProjectAvatarSource } from "@/pages/layout/helpers"
+import { ServerConnection } from "@/context/server"
+import { getProjectAvatarSource } from "@/pages/layout/helpers"
 import { createEditProjectModel } from "./edit-project"
-import { ProjectSettingsExtensions } from "./project-settings-extensions"
-import { SettingsServerDataScope } from "./settings-server-picker"
-import "./settings-v2/settings-v2.css"
-import "./dialog-edit-project-v2.css"
 
 export function DialogEditProjectV2(props: { project: LocalProject; server: ServerConnection.Any }) {
-  return (
-    <SettingsServerDataScope server={props.server}>
-      <SDKProvider directory={props.project.worktree}>
-        <ProjectSettingsDialog project={props.project} server={props.server} />
-      </SDKProvider>
-    </SettingsServerDataScope>
-  )
-}
-
-function ProjectSettingsDialog(props: { project: LocalProject; server: ServerConnection.Any }) {
   const language = useLanguage()
   const model = createEditProjectModel(props)
-  const projectName = () => displayName(props.project)
-  const [tab, setTab] = createSignal("general")
-
-  const Footer = () => (
-    <DialogFooter>
-      <ButtonV2 type="button" variant="neutral" disabled={model.save.isPending} onClick={model.close}>
-        {language.t("common.cancel")}
-      </ButtonV2>
-      <ButtonV2 type="submit" variant="contrast" disabled={!model.supported || model.save.isPending}>
-        {model.save.isPending ? language.t("common.saving") : language.t("common.save")}
-      </ButtonV2>
-    </DialogFooter>
-  )
 
   return (
-    <Dialog size="x-large" variant="settings" class="project-settings-v2-dialog">
-      <TabsV2
-        orientation="vertical"
-        variant="settings"
-        value={tab()}
-        onChange={(value) => void startTransition(() => setTab(value))}
-        class="project-settings-v2"
-      >
-        <TabsV2.List>
-          <div class="project-settings-v2-nav">
-            <TabsV2.Trigger value="general">
-              <ProjectAvatar
-                fallback={projectName()}
-                variant={getProjectAvatarVariant(props.project.icon?.color)}
-                class="!size-4 shrink-0"
-              />
-              <span class="truncate">{projectName()}</span>
-            </TabsV2.Trigger>
-            <TabsV2.Trigger value="scripts">
-              <Icon name="code" size="small" />
-              {language.t("project.settings.scripts")}
-            </TabsV2.Trigger>
-            <TabsV2.Trigger value="extensions">
-              <Icon name="extensions" size="small" />
-              {language.t("settings.tab.extensions")}
-            </TabsV2.Trigger>
-          </div>
-        </TabsV2.List>
+    <Dialog fit>
+      <form onSubmit={model.submit} class="contents">
+        <DialogHeader>
+          <DialogTitle>{language.t("dialog.project.edit.title")}</DialogTitle>
+        </DialogHeader>
+        <DividerV2 />
+        <DialogBody class="flex max-h-[min(560px,calc(100vh-160px))] w-full flex-col gap-6 overflow-y-auto px-4 pt-4 pb-1">
+          <Field>
+            <Field.Label>{language.t("dialog.project.edit.name")}</Field.Label>
+            <TextInputV2
+              autofocus
+              appearance="large"
+              class="!w-full"
+              value={model.store.name}
+              placeholder={model.folderName()}
+              onInput={(event) => model.setStore("name", event.currentTarget.value)}
+            />
+          </Field>
 
-        <TabsV2.Content value="general" class="project-settings-v2-panel">
-          <form onSubmit={model.submit} class="project-settings-v2-form">
-            <div class="project-settings-v2-scroll">
-              <div class="project-settings-page-header">
-                <h2>{language.t("dialog.project.edit.title")}</h2>
-                <span>{language.t("project.settings.general.description")}</span>
-              </div>
-
-              <Field>
-                <Field.Label>{language.t("dialog.project.edit.name")}</Field.Label>
-                <TextInputV2
-                  autofocus
-                  appearance="large"
-                  class="!w-full"
-                  value={model.store.name}
-                  placeholder={model.folderName()}
-                  onInput={(event) => model.setStore("name", event.currentTarget.value)}
+          <div class="flex w-full flex-col gap-2">
+            <div class="select-none text-[13px] font-[530] leading-none tracking-[-0.04px] text-v2-text-text-base">
+              {language.t("dialog.project.edit.icon")}
+            </div>
+            <div class="flex items-center gap-3">
+              <button
+                type="button"
+                aria-label={language.t("dialog.project.edit.icon.alt")}
+                class="relative size-16 shrink-0 cursor-pointer overflow-hidden rounded-[6px] outline outline-1 outline-transparent transition-[background-color,outline-color] focus-visible:outline-v2-border-border-focus"
+                classList={{
+                  "bg-v2-overlay-simple-overlay-hover outline-v2-border-border-focus": model.store.dragOver,
+                }}
+                onMouseEnter={() => model.setStore("iconHover", true)}
+                onMouseLeave={() => model.setStore("iconHover", false)}
+                onDrop={model.drop}
+                onDragOver={model.dragOver}
+                onDragLeave={model.dragLeave}
+                onClick={model.iconClick}
+              >
+                <ProjectAvatar
+                  fallback={model.store.name || model.defaultName()}
+                  src={getProjectAvatarSource(props.project.id, {
+                    color: model.store.color,
+                    url: props.project.icon?.url,
+                    override: model.store.iconOverride,
+                  })}
+                  variant={getProjectAvatarVariant(model.store.color)}
+                  class="!size-16 [&_[data-slot=project-avatar-surface]]:!rounded-[6px] [&_[data-slot=project-avatar-surface]]:!text-[32px]"
                 />
-              </Field>
+                <span
+                  class="pointer-events-none absolute inset-0 flex items-center justify-center rounded-[6px] bg-v2-background-bg-contrast/80 text-v2-icon-icon-contrast backdrop-blur-[2px] transition-opacity"
+                  classList={{
+                    "opacity-100": model.store.iconHover,
+                    "opacity-0": !model.store.iconHover,
+                  }}
+                >
+                  <Icon name={model.store.iconOverride ? "close" : "outline-share"} />
+                </span>
+              </button>
+              <input
+                ref={(element) => {
+                  model.setIconInput(element)
+                }}
+                type="file"
+                accept="image/*"
+                class="hidden"
+                onChange={model.inputChange}
+              />
+              <div class="flex select-none flex-col gap-[6px] text-[11px] font-[440] leading-none tracking-[0.05px] text-v2-text-text-muted">
+                <span>{language.t("dialog.project.edit.icon.hint")}</span>
+                <span>{language.t("dialog.project.edit.icon.recommended")}</span>
+              </div>
+            </div>
+          </div>
 
-              <div class="flex w-full flex-col gap-2">
-                <div class="select-none text-[13px] font-[530] leading-none tracking-[-0.04px] text-v2-text-text-base">
-                  {language.t("dialog.project.edit.icon")}
-                </div>
-                <div class="flex items-center gap-3">
-                  <button
-                    type="button"
-                    aria-label={language.t("dialog.project.edit.icon.alt")}
-                    class="relative size-16 shrink-0 cursor-pointer overflow-hidden rounded-[6px] outline outline-1 outline-transparent transition-[background-color,outline-color] focus-visible:outline-v2-border-border-focus"
-                    classList={{
-                      "bg-v2-overlay-simple-overlay-hover outline-v2-border-border-focus": model.store.dragOver,
-                    }}
-                    onMouseEnter={() => model.setStore("iconHover", true)}
-                    onMouseLeave={() => model.setStore("iconHover", false)}
-                    onDrop={model.drop}
-                    onDragOver={model.dragOver}
-                    onDragLeave={model.dragLeave}
-                    onClick={model.iconClick}
-                  >
-                    <ProjectAvatar
-                      fallback={model.store.name || model.defaultName()}
-                      src={getProjectAvatarSource(props.project.id, {
-                        color: model.store.color,
-                        url: props.project.icon?.url,
-                        override: model.store.iconOverride,
-                      })}
-                      variant={getProjectAvatarVariant(model.store.color)}
-                      class="!size-16 [&_[data-slot=project-avatar-surface]]:!rounded-[6px] [&_[data-slot=project-avatar-surface]]:!text-[32px]"
-                    />
-                    <span
-                      class="pointer-events-none absolute inset-0 flex items-center justify-center rounded-[6px] bg-v2-background-bg-contrast/80 text-v2-icon-icon-contrast backdrop-blur-[2px] transition-opacity"
+          <Show when={!model.store.iconOverride}>
+            <div class="flex w-full flex-col gap-2">
+              <div class="select-none text-[13px] font-[530] leading-none tracking-[-0.04px] text-v2-text-text-base">
+                {language.t("dialog.project.edit.color")}
+              </div>
+              <div class="-ml-1 flex gap-1.5">
+                <For each={PROJECT_AVATAR_VARIANTS}>
+                  {(color) => (
+                    <button
+                      type="button"
+                      aria-label={language.t("dialog.project.edit.color.select", { color })}
+                      aria-pressed={getProjectAvatarVariant(model.store.color) === color}
+                      class="flex size-8 items-center justify-center rounded-[10px] p-1 outline outline-1 outline-transparent transition-[background-color,outline-color] hover:bg-v2-overlay-simple-overlay-hover focus-visible:outline-v2-border-border-focus"
                       classList={{
-                        "opacity-100": model.store.iconHover,
-                        "opacity-0": !model.store.iconHover,
+                        "bg-v2-overlay-simple-overlay-hover [box-shadow:inset_0_0_0_2px_var(--v2-border-border-focus)]":
+                          getProjectAvatarVariant(model.store.color) === color,
+                      }}
+                      onClick={() => {
+                        if (getProjectAvatarVariant(model.store.color) === color && !props.project.icon?.url) return
+                        model.setStore(
+                          "color",
+                          getProjectAvatarVariant(model.store.color) === color ? undefined : color,
+                        )
                       }}
                     >
-                      <IconV2 name={model.store.iconOverride ? "close" : "share"} />
-                    </span>
-                  </button>
-                  <input
-                    ref={(element) => model.setIconInput(element)}
-                    type="file"
-                    accept="image/*"
-                    class="hidden"
-                    onChange={model.inputChange}
-                  />
-                  <div class="flex select-none flex-col gap-[6px] text-[11px] font-[440] leading-none tracking-[0.05px] text-v2-text-text-muted">
-                    <span>{language.t("dialog.project.edit.icon.hint")}</span>
-                    <span>{language.t("dialog.project.edit.icon.recommended")}</span>
-                  </div>
-                </div>
+                      <ProjectAvatar
+                        fallback={model.store.name || model.defaultName()}
+                        variant={getProjectAvatarVariant(color)}
+                        class="!size-6 [&_[data-slot=project-avatar-surface]]:!rounded-[6px]"
+                      />
+                    </button>
+                  )}
+                </For>
               </div>
-
-              <Show when={!model.store.iconOverride}>
-                <div class="flex w-full flex-col gap-2">
-                  <div class="select-none text-[13px] font-[530] leading-none tracking-[-0.04px] text-v2-text-text-base">
-                    {language.t("dialog.project.edit.color")}
-                  </div>
-                  <div class="-ml-1 flex gap-1.5">
-                    <For each={PROJECT_AVATAR_VARIANTS}>
-                      {(color) => (
-                        <button
-                          type="button"
-                          aria-label={language.t("dialog.project.edit.color.select", { color })}
-                          aria-pressed={getProjectAvatarVariant(model.store.color) === color}
-                          class="flex size-8 items-center justify-center rounded-[10px] p-1 outline outline-1 outline-transparent transition-[background-color,outline-color] hover:bg-v2-overlay-simple-overlay-hover focus-visible:outline-v2-border-border-focus"
-                          classList={{
-                            "bg-v2-overlay-simple-overlay-hover [box-shadow:inset_0_0_0_2px_var(--v2-border-border-focus)]":
-                              getProjectAvatarVariant(model.store.color) === color,
-                          }}
-                          onClick={() => {
-                            if (getProjectAvatarVariant(model.store.color) === color && !props.project.icon?.url) return
-                            model.setStore(
-                              "color",
-                              getProjectAvatarVariant(model.store.color) === color ? undefined : color,
-                            )
-                          }}
-                        >
-                          <ProjectAvatar
-                            fallback={model.store.name || model.defaultName()}
-                            variant={getProjectAvatarVariant(color)}
-                            class="!size-6 [&_[data-slot=project-avatar-surface]]:!rounded-[6px]"
-                          />
-                        </button>
-                      )}
-                    </For>
-                  </div>
-                </div>
-              </Show>
             </div>
-            <Footer />
-          </form>
-        </TabsV2.Content>
+          </Show>
 
-        <TabsV2.Content value="scripts" class="project-settings-v2-panel">
-          <form onSubmit={model.submit} class="project-settings-v2-form">
-            <div class="project-settings-v2-scroll">
-              <div class="project-settings-page-header">
-                <h2>{language.t("project.settings.scripts")}</h2>
-                <span>{language.t("project.settings.scripts.description")}</span>
-              </div>
-              <Field>
-                <Field.Label>{language.t("dialog.project.edit.worktree.startup")}</Field.Label>
-                <Field.Prefix>{language.t("dialog.project.edit.worktree.startup.description")}</Field.Prefix>
-                <TextareaV2
-                  class="!w-full [&_[data-slot=textarea-v2-textarea]]:font-mono"
-                  rows={5}
-                  value={model.store.startup}
-                  placeholder={language.t("dialog.project.edit.worktree.startup.placeholder")}
-                  spellcheck={false}
-                  onInput={(event) => model.setStore("startup", event.currentTarget.value)}
-                />
-              </Field>
-            </div>
-            <Footer />
-          </form>
-        </TabsV2.Content>
-
-        <TabsV2.Content value="extensions" class="project-settings-v2-panel">
-          <ProjectSettingsExtensions />
-        </TabsV2.Content>
-      </TabsV2>
+          <Field>
+            <Field.Label>{language.t("dialog.project.edit.worktree.startup")}</Field.Label>
+            <Field.Prefix>{language.t("dialog.project.edit.worktree.startup.description")}</Field.Prefix>
+            <TextareaV2
+              class="!w-full [&_[data-slot=textarea-v2-textarea]]:font-mono"
+              rows={3}
+              value={model.store.startup}
+              placeholder={language.t("dialog.project.edit.worktree.startup.placeholder")}
+              spellcheck={false}
+              onInput={(event) => model.setStore("startup", event.currentTarget.value)}
+            />
+          </Field>
+        </DialogBody>
+        <DialogFooter>
+          <ButtonV2 type="button" variant="neutral" disabled={model.save.isPending} onClick={model.close}>
+            {language.t("common.cancel")}
+          </ButtonV2>
+          <ButtonV2 type="submit" variant="contrast" disabled={!model.supported || model.save.isPending}>
+            {model.save.isPending ? language.t("common.saving") : language.t("common.save")}
+          </ButtonV2>
+        </DialogFooter>
+      </form>
     </Dialog>
   )
 }

packages/app/src/components/dialog-manage-models.tsx

@@ -31,7 +31,7 @@ export const DialogManageModels: Component = () => {
   const directory = () => decode64(local.slug())
 
   const handleConnectProvider = () => {
-    void dialog.show(() => <DialogConnectProvider directory={directory()} />)
+    void dialog.show(() => <DialogConnectProvider directory={directory} />)
   }
   const providerRank = (id: string) => popularProviders.indexOf(id)
   const providerList = (providerID: string) => local.model.list().filter((x) => x.provider.id === providerID)
@@ -123,7 +123,7 @@ export const DialogManageModelsV2: Component = () => {
   const directory = () => decode64(local.slug())
 
   const handleConnectProvider = () => {
-    void dialog.show(() => <DialogConnectProvider directory={directory()} />)
+    void dialog.show(() => <DialogConnectProvider directory={directory} />)
   }
   const providerList = (providerID: string) => local.model.list().filter((x) => x.provider.id === providerID)
   const providerVisible = (providerID: string) =>

packages/app/src/components/dialog-release-notes.tsx

@@ -1,4 +1,4 @@
-import { createSignal, Index, Show } from "solid-js"
+import { createSignal } from "solid-js"
 import { Dialog } from "@opencode-ai/ui/dialog"
 import { Button } from "@opencode-ai/ui/button"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
@@ -83,71 +83,61 @@ export function DialogReleaseNotes(props: { highlights: Highlight[] }) {
           {/* Bottom section - buttons and indicators (fixed position) */}
           <div class="flex flex-col gap-12">
             <div class="flex flex-col items-start gap-3">
-              <Show
-                when={isLast()}
-                fallback={
-                  <Button variant="secondary" size="large" onClick={handleNext}>
-                    {language.t("dialog.releaseNotes.action.next")}
-                  </Button>
-                }
-              >
+              {isLast() ? (
                 <Button variant="primary" size="large" onClick={handleClose}>
                   {language.t("dialog.releaseNotes.action.getStarted")}
                 </Button>
-              </Show>
+              ) : (
+                <Button variant="secondary" size="large" onClick={handleNext}>
+                  {language.t("dialog.releaseNotes.action.next")}
+                </Button>
+              )}
 
               <Button variant="ghost" size="small" onClick={handleDisable}>
                 {language.t("dialog.releaseNotes.action.hideFuture")}
               </Button>
             </div>
 
-            <Show when={paged()}>
+            {paged() && (
               <div class="flex items-center gap-1.5 -my-2.5">
-                <Index each={props.highlights}>
-                  {(_, i) => (
-                    <button
-                      type="button"
-                      class="h-6 flex items-center cursor-pointer bg-transparent border-none p-0 transition-all duration-200"
+                {props.highlights.map((_, i) => (
+                  <button
+                    type="button"
+                    class="h-6 flex items-center cursor-pointer bg-transparent border-none p-0 transition-all duration-200"
+                    classList={{
+                      "w-8": i === index(),
+                      "w-3": i !== index(),
+                    }}
+                    onClick={() => setIndex(i)}
+                  >
+                    <div
+                      class="w-full h-0.5 rounded-[1px] transition-colors duration-200"
                       classList={{
-                        "w-8": i === index(),
-                        "w-3": i !== index(),
+                        "bg-icon-strong-base": i === index(),
+                        "bg-icon-weak-base": i !== index(),
                       }}
-                      onClick={() => setIndex(i)}
-                    >
-                      <div
-                        class="w-full h-0.5 rounded-[1px] transition-colors duration-200"
-                        classList={{
-                          "bg-icon-strong-base": i === index(),
-                          "bg-icon-weak-base": i !== index(),
-                        }}
-                      />
-                    </button>
-                  )}
-                </Index>
+                    />
+                  </button>
+                ))}
               </div>
-            </Show>
+            )}
           </div>
         </div>
 
         {/* Right side - Media content (edge to edge) */}
-        <Show when={feature()?.media}>
-          {(media) => (
-            <div class="flex-1 min-w-0 bg-surface-base overflow-hidden rounded-r-xl">
-              <Show
-                when={media().type === "image"}
-                fallback={
-                  <video src={media().src} autoplay loop muted playsinline class="w-full h-full object-cover" />
-                }
-              >
-                <img
-                  src={media().src}
-                  alt={media().alt ?? feature()?.title ?? language.t("dialog.releaseNotes.media.alt")}
-                  class="w-full h-full object-cover"
-                />
-              </Show>
-            </div>
-          )}
-        </Show>
+        {feature()?.media && (
+          <div class="flex-1 min-w-0 bg-surface-base overflow-hidden rounded-r-xl">
+            {feature()!.media!.type === "image" ? (
+              <img
+                src={feature()!.media!.src}
+                alt={feature()!.media!.alt ?? feature()?.title ?? language.t("dialog.releaseNotes.media.alt")}
+                class="w-full h-full object-cover"
+              />
+            ) : (
+              <video src={feature()!.media!.src} autoplay loop muted playsinline class="w-full h-full object-cover" />
+            )}
+          </div>
+        )}
       </div>
     </Dialog>
   )

packages/app/src/components/dialog-select-directory-v2.tsx

@@ -7,7 +7,7 @@ import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { createEffect, createMemo, createResource, createSignal, For, onCleanup, onMount, Show } from "solid-js"
 import { useGlobal } from "@/context/global"
 import { useLanguage } from "@/context/language"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 import type { Path } from "@/types"
 import {
   absoluteTreePath,

packages/app/src/components/dialog-select-directory.tsx

@@ -6,7 +6,7 @@ import type { ListRef } from "@opencode-ai/ui/list"
 import { getDirectory, getFilename } from "@opencode-ai/core/util/path"
 import { createMemo, createResource, createSignal } from "solid-js"
 import { useLanguage } from "@/context/language"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 import { useGlobal } from "@/context/global"
 import { cleanPickerInput, createDirectorySearch, displayPickerPath } from "./directory-picker-domain"
 import type { Path } from "@/types"

packages/app/src/components/dialog-select-file.tsx

@@ -9,6 +9,7 @@ import { formatKeybind } from "@/context/command"
 import { useServerSDK } from "@/context/server-sdk"
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
+import { useSettings } from "@/context/settings"
 import { useSessionLayout } from "@/pages/session/session-layout"
 import { decode64 } from "@/utils/base64"
 import { getRelativeTime } from "@/utils/time"
@@ -28,13 +29,14 @@ type DialogSelectFileMode = "all" | "files"
 
 export function DialogSelectFile(props: { mode?: DialogSelectFileMode; onOpenFile?: (path: string) => void }) {
   const platform = usePlatform()
+  const settings = useSettings()
   const filesOnly = () => props.mode === "files"
 
-  if (!filesOnly()) {
+  if (!filesOnly() && settings.general.newLayoutDesigns()) {
     return <DialogCommandPaletteV2 onOpenFile={props.onOpenFile} />
   }
 
-  if (filesOnly() && platform.platform === "desktop") {
+  if (filesOnly() && platform.platform === "desktop" && settings.general.newLayoutDesigns()) {
     return <DialogSelectFileDesktopV2 onOpenFile={props.onOpenFile} />
   }
 
@@ -50,7 +52,7 @@ function DialogSelectFileDesktopV2(props: { onOpenFile?: (path: string) => void
 
   return (
     <DialogSelectFileV2
-      server={serverSDK.server}
+      server={serverSDK().server}
       mode="file"
       start={projectDirectory()}
       title={language.t("session.header.searchFiles")}

packages/app/src/components/dialog-select-model-unpaid-v2.tsx

@@ -7,7 +7,7 @@ import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { useTheme } from "@opencode-ai/ui/theme"
 import { createMemo, onCleanup, onMount, type Component, For, Show } from "solid-js"
 import { useLocal } from "@/context/local"
-import { useIntegrations } from "@/hooks/use-integrations"
+import { useProviders } from "@/hooks/use-providers"
 import { decode64 } from "@/utils/base64"
 import { useLanguage } from "@/context/language"
 import { ModelTooltip } from "./model-tooltip"
@@ -22,7 +22,7 @@ export const DialogSelectModelUnpaidV2: Component<{ model?: ModelState }> = (pro
   const dialog = useDialog()
   const theme = useTheme()
   const directory = () => decode64(local.slug())
-  const integrations = useIntegrations(directory)
+  const providers = useProviders(directory)
   const language = useLanguage()
   const modelKey = (item: ReturnType<ModelState["list"]>[number]) => `${item.provider.id}:${item.id}`
   const currentKey = createMemo(() => {
@@ -37,7 +37,7 @@ export const DialogSelectModelUnpaidV2: Component<{ model?: ModelState }> = (pro
     void import("./dialog-connect-provider").then((x) => {
       const controller = x.useProviderConnectController()
       controller.select(provider)
-      void dialog.show(() => <x.DialogConnectProvider controller={controller} directory={directory()} />)
+      void dialog.show(() => <x.DialogConnectProvider controller={controller} directory={directory} />)
     })
   }
 
@@ -127,8 +127,7 @@ export const DialogSelectModelUnpaidV2: Component<{ model?: ModelState }> = (pro
               </div>
               <div class="grid w-full grid-cols-1 gap-y-1.5 gap-x-2 sm:grid-cols-2">
                 <For
-                  each={integrations
-                    .list()
+                  each={[...providers.popular()]
                     .filter((provider) => featuredProviders.includes(provider.id))
                     .sort((a, b) => featuredProviders.indexOf(a.id) - featuredProviders.indexOf(b.id))}
                 >

packages/app/src/components/dialog-select-model-unpaid.tsx

@@ -26,7 +26,7 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
     void import("./dialog-connect-provider").then((x) => {
       const controller = x.useProviderConnectController()
       controller.select(provider)
-      void dialog.show(() => <x.DialogConnectProvider controller={controller} directory={directory()} />)
+      void dialog.show(() => <x.DialogConnectProvider controller={controller} directory={directory} />)
     })
   }
 

packages/app/src/components/dialog-select-model.tsx

@@ -148,7 +148,7 @@ export function ModelSelectorPopover(props: {
   const handleConnectProvider = () => {
     close("provider")
     void import("./dialog-connect-provider").then((x) => {
-      void dialog.show(() => <x.DialogConnectProvider directory={directory()} />)
+      void dialog.show(() => <x.DialogConnectProvider directory={directory} />)
     })
   }
   const language = useLanguage()
@@ -240,7 +240,7 @@ export function ModelSelectorPopoverV2(props: {
       trigger={props.trigger}
       models={controller.models}
       groups={controller.groups}
-      current={controller.current()}
+      current={controller.current}
       select={controller.select}
       onManage={() => {
         void import("./dialog-manage-models").then((module) => {
@@ -295,7 +295,7 @@ function ModelSelectorPopoverV2View(props: {
   trigger: ModelSelectorTrigger
   models: (search: string) => ModelItem[]
   groups: (models: ModelItem[]) => { category: string; items: ModelItem[] }[]
-  current: string | undefined
+  current: () => string | undefined
   select: (item: ModelItem) => void
   onManage: () => void
   onClose: () => void
@@ -310,7 +310,7 @@ function ModelSelectorPopoverV2View(props: {
   const groups = createMemo(() => props.groups(models()))
   const keys = () => [...models().map(modelKey), manageKey]
   const initialActive = () => {
-    const selected = props.current
+    const selected = props.current()
     const options = keys()
     if (selected && options.includes(selected)) return selected
     return options[0] ?? ""
@@ -453,7 +453,7 @@ function ModelSelectorPopoverV2View(props: {
                       <MenuV2.GroupLabel class="gap-2 px-3">
                         <span class="min-w-0 truncate">{group.items[0].provider.name}</span>
                       </MenuV2.GroupLabel>
-                      <MenuV2.RadioGroup value={props.current}>
+                      <MenuV2.RadioGroup value={props.current()}>
                         <For each={group.items}>
                           {(item) => (
                             <TooltipV2
@@ -473,7 +473,7 @@ function ModelSelectorPopoverV2View(props: {
                               <MenuV2.RadioItem
                                 value={modelKey(item)}
                                 data-option-key={modelKey(item)}
-                                data-selected-model={props.current === modelKey(item) ? true : undefined}
+                                data-selected-model={props.current() === modelKey(item) ? true : undefined}
                                 class="scroll-my-6 w-full"
                                 classList={{ "!bg-v2-overlay-simple-overlay-hover": store.active === modelKey(item) }}
                                 onMouseEnter={() => {
@@ -529,7 +529,7 @@ export const DialogSelectModel: Component<{ provider?: string; model?: ModelStat
 
   const provider = () => {
     void import("./dialog-connect-provider").then((x) => {
-      void dialog.show(() => <x.DialogConnectProvider directory={directory()} />)
+      void dialog.show(() => <x.DialogConnectProvider directory={directory} />)
     })
   }
 

packages/app/src/components/dialog-select-server.tsx

@@ -1,13 +1,17 @@
 import { Button } from "@opencode-ai/ui/button"
+import { useDialog } from "@opencode-ai/ui/context/dialog"
+import { Dialog } from "@opencode-ai/ui/dialog"
 import { DropdownMenu } from "@opencode-ai/ui/dropdown-menu"
+import { Icon } from "@opencode-ai/ui/icon"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { List } from "@opencode-ai/ui/list"
 import { TextField } from "@opencode-ai/ui/text-field"
 import { Show } from "solid-js"
 import { ServerHealthIndicator, ServerRow } from "@/components/server/server-row"
 import { useLanguage } from "@/context/language"
-import { ServerConnection } from "@/context/servers"
-import { ServerCollectionController } from "@/components/server/server-management-controller"
+import { ServerConnection } from "@/context/server"
+import { useSettings } from "@/context/settings"
+import { type ServerDomainController } from "@/components/server/server-management-controller"
 
 type ServerConnectionFormController = {
   state: {
@@ -113,11 +117,12 @@ function ServerForm(props: ServerFormProps) {
 }
 
 export function ServerConnectionList(props: {
-  domain: ServerCollectionController
+  domain: ServerDomainController
   onAdd: () => void
   onEdit: (server: ServerConnection.Http) => void
 }) {
   const language = useLanguage()
+  const settings = useSettings()
 
   return (
     <div class="flex flex-1 min-h-0 flex-col gap-4">
@@ -131,6 +136,9 @@ export function ServerConnectionList(props: {
         emptyMessage={language.t("dialog.server.empty")}
         items={props.domain.collection.items}
         key={(x) => x.http.url}
+        onSelect={(x) => {
+          if (x && !settings.general.newLayoutDesigns()) void props.domain.selection.select(x)
+        }}
         divider={true}
       >
         {(i) => {
@@ -155,6 +163,15 @@ export function ServerConnectionList(props: {
                 showCredentials
               />
               <div class="flex items-center justify-center gap-4 pl-4">
+                <Show
+                  when={
+                    props.domain.collection.current() &&
+                    ServerConnection.key(props.domain.collection.current()!) === key
+                  }
+                >
+                  <Icon name="check" class="h-6" />
+                </Show>
+
                 <Show when={i.type === "http"}>
                   <DropdownMenu>
                     <DropdownMenu.Trigger

packages/app/src/components/directory-picker-policy.ts

@@ -1,4 +1,4 @@
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 import type { Platform } from "@/context/platform"
 
 export function directoryPickerKind(platform: Platform["platform"], server: ServerConnection.Any) {

packages/app/src/components/directory-picker.tsx

@@ -1,5 +1,5 @@
 import { useDialog } from "@opencode-ai/ui/context/dialog"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 import { usePlatform } from "@/context/platform"
 import { useSettings } from "@/context/settings"
 import { lazy } from "solid-js"

packages/app/src/components/edit-project.ts

@@ -6,7 +6,7 @@ import { createMemo } from "solid-js"
 import { createStore } from "solid-js/store"
 import { useGlobal } from "@/context/global"
 import { type LocalProject } from "@/context/layout"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 
 export function createEditProjectModel(props: { project: LocalProject; server: ServerConnection.Any }) {
   const supported = !props.project.id || props.project.id === "global"

packages/app/src/components/project-settings-extensions.tsx

@@ -1,238 +0,0 @@
-import { Icon } from "@opencode-ai/ui/icon"
-import { Switch } from "@opencode-ai/ui/v2/switch-v2"
-import { TabsV2 } from "@opencode-ai/ui/v2/tabs-v2"
-import { type Component, For, Show, createMemo, createResource, createSignal } from "solid-js"
-import { useLanguage } from "@/context/language"
-import { useMcpToggle } from "@/context/mcp"
-import { useSDK } from "@/context/sdk"
-import { useServerSDK } from "@/context/server-sdk"
-import { useServerSync } from "@/context/server-sync"
-import { useSync } from "@/context/sync"
-import { ExternalLink } from "./external-link"
-
-type SkillItem = {
-  name: string
-  location: string
-}
-
-const pluginName = (item: string | [string, Record<string, unknown>]) => (typeof item === "string" ? item : item[0])
-const skillKey = (item: SkillItem) => `${item.name}\n${item.location}`
-
-const ExtensionCard: Component<{ children: unknown }> = (props) => (
-  <div class="project-settings-extension-card">{props.children as any}</div>
-)
-
-const ExtensionRow: Component<{
-  icon: "mcp" | "cube" | "post-skill" | "code"
-  name: string
-  status?: string
-  children?: unknown
-}> = (props) => (
-  <div class="project-settings-extension-row">
-    <div class="project-settings-extension-row-main">
-      <Icon name={props.icon} class="project-settings-extension-row-icon" />
-      <span class="project-settings-extension-row-name">{props.name}</span>
-    </div>
-    <Show when={props.status}>
-      {(status) => (
-        <span class="project-settings-extension-row-status">
-          <span class="project-settings-extension-row-status-dot" />
-          {status()}
-        </span>
-      )}
-    </Show>
-    {props.children as any}
-  </div>
-)
-
-const SharedSection: Component<{
-  count: number
-  children: unknown
-}> = (props) => {
-  const language = useLanguage()
-  const [open, setOpen] = createSignal(false)
-  return (
-    <Show when={props.count > 0}>
-      <div class="project-settings-shared">
-        <button
-          type="button"
-          class="project-settings-shared-trigger"
-          aria-expanded={open()}
-          onClick={() => setOpen((value) => !value)}
-        >
-          <Icon name="chevron-right" classList={{ "project-settings-shared-chevron": true, open: open() }} />
-          <span>{language.t("project.settings.extensions.shared")}</span>
-          <span class="project-settings-shared-count">{props.count}</span>
-        </button>
-        <Show when={open()}>
-          <ExtensionCard>{props.children}</ExtensionCard>
-        </Show>
-      </div>
-    </Show>
-  )
-}
-
-export const ProjectSettingsExtensions: Component = () => {
-  const language = useLanguage()
-  const serverSDK = useServerSDK()
-  const directorySDK = useSDK()
-  const serverSync = useServerSync()
-  const sync = useSync()
-  const toggleMcp = useMcpToggle()
-
-  const [serverMcp] = createResource(
-    serverSDK,
-    (sdk) =>
-      sdk.api.mcp
-        .list()
-        .then((result) => Object.fromEntries(result.data.map((server) => [server.name, server.status])))
-        .catch(() => ({})),
-    { initialValue: {} },
-  )
-  const globalMcpNames = createMemo(() =>
-    [...new Set([...Object.keys(serverSync.data.config.mcp ?? {}), ...Object.keys(serverMcp.latest)])].sort(),
-  )
-  const projectMcpNames = createMemo(() => {
-    const shared = new Set(globalMcpNames())
-    const configured = Object.keys(sync().data.config.mcp ?? {}).filter((name) => !shared.has(name))
-    if (configured.length > 0) return configured.sort()
-    return Object.keys(sync().data.mcp ?? {})
-      .filter((name) => !shared.has(name))
-      .sort()
-  })
-  const mcpEnabled = (name: string) => sync().data.mcp?.[name]?.status === "connected"
-
-  const globalPlugins = createMemo(() => (serverSync.data.config.plugin ?? []).map(pluginName))
-  const projectPlugins = createMemo(() => {
-    const shared = new Set(globalPlugins())
-    return (sync().data.config.plugin ?? []).map(pluginName).filter((name) => !shared.has(name))
-  })
-
-  const [serverSkills] = createResource(
-    serverSDK,
-    (sdk): Promise<SkillItem[]> =>
-      sdk.api.skill.list().then((result) => result.data.map((item) => ({ name: item.name, location: item.location }))),
-    { initialValue: [] },
-  )
-  const [directorySkills] = createResource(
-    directorySDK,
-    (sdk): Promise<SkillItem[]> =>
-      sdk.api.skill
-        .list({ location: { directory: sdk.directory } })
-        .then((result) => result.data.map((item) => ({ name: item.name, location: item.location }))),
-    { initialValue: [] },
-  )
-  const projectSkills = createMemo(() => {
-    const shared = new Set(serverSkills.latest.map(skillKey))
-    return directorySkills.latest.filter((item) => !shared.has(skillKey(item)))
-  })
-
-  const mcpRows = (items: string[]) => (
-    <For each={items}>
-      {(name) => (
-        <ExtensionRow icon="mcp" name={name}>
-          <Switch
-            checked={mcpEnabled(name)}
-            disabled={toggleMcp.isPending && toggleMcp.variables === name}
-            hideLabel
-            onChange={() => {
-              if (toggleMcp.isPending) return
-              toggleMcp.mutate(name)
-            }}
-          >
-            {name}
-          </Switch>
-        </ExtensionRow>
-      )}
-    </For>
-  )
-
-  const pluginRows = (items: string[]) => <For each={items}>{(name) => <ExtensionRow icon="cube" name={name} />}</For>
-
-  const skillRows = (items: SkillItem[]) => (
-    <For each={items}>{(item) => <ExtensionRow icon="post-skill" name={item.name} />}</For>
-  )
-
-  return (
-    <div class="project-settings-extensions">
-      <div class="project-settings-page-header">
-        <h2>{language.t("settings.tab.extensions")}</h2>
-        <span>{language.t("project.settings.extensions.description")}</span>
-      </div>
-
-      <TabsV2 variant="pill" defaultValue="mcps" class="project-settings-extension-tabs">
-        <TabsV2.List>
-          <TabsV2.Trigger value="mcps">{language.t("settings.extensions.tab.mcps")}</TabsV2.Trigger>
-          <TabsV2.Trigger value="plugins">{language.t("status.popover.tab.plugins")}</TabsV2.Trigger>
-          <TabsV2.Trigger value="skills">{language.t("settings.extensions.tab.skills")}</TabsV2.Trigger>
-          <TabsV2.Trigger value="lsps">{language.t("project.settings.extensions.tab.lsps")}</TabsV2.Trigger>
-        </TabsV2.List>
-
-        <TabsV2.Content value="mcps">
-          <div class="project-settings-extension-section">
-            <div class="project-settings-extension-section-header">
-              <span>{language.t("project.settings.extensions.added")}</span>
-              <span>{language.t("settings.extensions.manageConfig")}</span>
-            </div>
-            <Show when={projectMcpNames().length > 0}>
-              <ExtensionCard>{mcpRows(projectMcpNames())}</ExtensionCard>
-            </Show>
-            <SharedSection count={globalMcpNames().length}>{mcpRows(globalMcpNames())}</SharedSection>
-          </div>
-        </TabsV2.Content>
-
-        <TabsV2.Content value="plugins">
-          <div class="project-settings-extension-section">
-            <div class="project-settings-extension-section-header">
-              <span>{language.t("project.settings.extensions.added")}</span>
-              <span>{language.t("settings.extensions.manageConfig")}</span>
-            </div>
-            <Show when={projectPlugins().length > 0}>
-              <ExtensionCard>{pluginRows(projectPlugins())}</ExtensionCard>
-            </Show>
-            <SharedSection count={globalPlugins().length}>{pluginRows(globalPlugins())}</SharedSection>
-          </div>
-        </TabsV2.Content>
-
-        <TabsV2.Content value="skills">
-          <div class="project-settings-extension-section">
-            <div class="project-settings-extension-section-header">
-              <span>{language.t("project.settings.extensions.added")}</span>
-              <ExternalLink class="project-settings-extension-link" href="https://opencode.ai/docs/skills/">
-                {language.t("settings.extensions.addSkills")}
-              </ExternalLink>
-            </div>
-            <Show when={projectSkills().length > 0}>
-              <ExtensionCard>{skillRows(projectSkills())}</ExtensionCard>
-            </Show>
-            <SharedSection count={serverSkills.latest.length}>{skillRows(serverSkills.latest)}</SharedSection>
-          </div>
-        </TabsV2.Content>
-
-        <TabsV2.Content value="lsps">
-          <div class="project-settings-extension-section">
-            <div class="project-settings-extension-section-header">
-              <span>{language.t("project.settings.extensions.lsp.detected")}</span>
-              <span>{language.t("project.settings.extensions.lsp.description")}</span>
-            </div>
-            <Show when={sync().data.lsp.length > 0}>
-              <ExtensionCard>
-                <For each={sync().data.lsp}>
-                  {(item) => (
-                    <ExtensionRow
-                      icon="code"
-                      name={item.name || item.id}
-                      status={
-                        item.status === "error" ? language.t("project.settings.extensions.setupRequired") : undefined
-                      }
-                    />
-                  )}
-                </For>
-              </ExtensionCard>
-            </Show>
-          </div>
-        </TabsV2.Content>
-      </TabsV2>
-    </div>
-  )
-}

packages/app/src/components/prompt-input-v2.tsx

@@ -37,7 +37,6 @@ export type PromptInputV2ComposerProps = {
   class?: string
   controller: PromptInputV2ComposerController
   borderUnderlay?: boolean
-  accentSubmit?: boolean
 }
 
 export type PromptInputV2ControllerProps = Omit<PromptInputProps, "class" | "submission">
@@ -54,7 +53,6 @@ export function PromptInputV2Composer(props: PromptInputV2ComposerProps) {
     <div class="flex flex-col gap-3">
       <PromptInputV2
         controller={props.controller}
-        accentSubmit={props.accentSubmit}
         borderUnderlay={props.borderUnderlay}
         class={props.class}
         variantControlVisible={!props.controller.model.loading}

packages/app/src/components/prompt-input.tsx

@@ -45,6 +45,7 @@ import { Select } from "@opencode-ai/ui/select"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { ModelSelectorPopover, ModelSelectorPopoverV2 } from "@/components/dialog-select-model"
 import { DialogSelectModelUnpaid } from "@/components/dialog-select-model-unpaid"
+import { DialogSelectModelUnpaidV2 } from "@/components/dialog-select-model-unpaid-v2"
 import { useCommand } from "@/context/command"
 import { usePermission } from "@/context/permission"
 import { useLanguage } from "@/context/language"
@@ -1517,7 +1518,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
               role="textbox"
               aria-multiline="true"
               aria-label={placeholder()}
-              dir={store.mode === "normal" ? "auto" : "ltr"}
               contenteditable="true"
               autocapitalize={store.mode === "normal" ? "sentences" : "off"}
               autocorrect={store.mode === "normal" ? "on" : "off"}
@@ -1539,11 +1539,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                 "[&_[data-type=agent]]:text-syntax-type": true,
                 "font-mono!": store.mode === "shell",
               }}
-              style={{
-                "padding-bottom": space,
-                "unicode-bidi": store.mode === "normal" ? "plaintext" : undefined,
-                "text-align": "start",
-              }}
+              style={{ "padding-bottom": space }}
             />
             <div
               class="absolute top-0 inset-x-0 pl-3 pr-2 pt-2 text-14-regular text-text-weak pointer-events-none whitespace-nowrap truncate"

packages/app/src/components/prompt-input/submit.test.ts

@@ -1,16 +1,18 @@
 import { beforeAll, beforeEach, describe, expect, mock, test } from "bun:test"
 import { createStore } from "solid-js/store"
 import type { Prompt, PromptStore } from "@/context/prompt"
-import { ServerScope } from "@/utils/server-scope"
+import type { ModelSelection } from "@/context/local"
 
 let createPromptSubmit: typeof import("./submit").createPromptSubmit
 
+const createdClients: string[] = []
 const createdSessions: string[] = []
-type SessionCreateInput = {
+const sessionCreateInputs: Array<{
   agent?: string
   model?: { id: string; providerID: string; variant?: string }
   location?: { directory: string }
-}
+}> = []
+const enabledAutoAccept: Array<{ server: string; sessionID: string; directory: string }> = []
 const optimistic: Array<{
   directory?: string
   sessionID?: string
@@ -20,9 +22,11 @@ const optimistic: Array<{
     variant?: string
   }
 }> = []
+const optimisticSeeded: boolean[] = []
 const storedSessions: Record<string, Array<{ id: string; title?: string }>> = {}
+const promoted: Array<{ directory: string; sessionID: string }> = []
 const sentShell: Array<{ sessionID: string; id?: string; command: string }> = []
-const sentShellDirectories: string[] = []
+const syncedDirectories: string[] = []
 const promotedDrafts: Array<{ draftID: string; server: string; sessionId: string }> = []
 const sentPrompts: string[] = []
 const promptInputs: unknown[] = []
@@ -33,29 +37,15 @@ const switchedModels: Array<{
   model: { id: string; providerID: string; variant?: string }
 }> = []
 const sessionRequestOrder: string[] = []
-const updatedDrafts: Array<{ draftID: string; worktree?: string }> = []
-const syncedServers: string[] = []
-const optimisticServers: string[] = []
-const promptCaptures: Array<{ scope?: unknown; target?: unknown }> = []
+const commands: Array<{ name: string }> = []
 let serverSessionSyncs = 0
 
 let params: { id?: string } = {}
 let search: { draftId?: string } = {}
 let selected = "/repo/worktree-a"
 let variant: string | undefined
+let permissionServer = "server-a"
 let createSessionGate: Promise<void> | undefined
-let createWorktreeGate: Promise<void> | undefined
-let worktreeFailure: Error | undefined
-let locationFailure: Error | undefined
-let worktreeCreates = 0
-let activeSDK = "server-a"
-let activeServerSync = "server-a"
-let activeDirectorySync = "server-a"
-let commands: Array<{ name: string }> = []
-let worktreeDirectory = "/repo/new-0"
-let worktreeID = 0
-const draftServers: Record<string, string> = {}
-const sessionDirectories: Record<string, string> = {}
 
 let promptValue: Prompt = [{ type: "text", content: "ls", start: 0, end: 2 }]
 const [promptStore, setPromptStore] = createStore<PromptStore>({
@@ -83,25 +73,21 @@ const prompt = {
     replaceComments: () => undefined,
     items: () => [],
   },
-  capture: (scope?: unknown, target?: unknown) => {
-    promptCaptures.push({ scope, target })
-    return prompt
-  },
+  capture: () => prompt,
 }
-const settle = () => new Promise((resolve) => setTimeout(resolve, 0))
 
 const clientFor = (directory: string) => {
+  createdClients.push(directory)
   return {
     api: {
       session: {
-        create: async (input: SessionCreateInput) => {
+        create: async (input: (typeof sessionCreateInputs)[number]) => {
           await createSessionGate
           const location = input.location?.directory ?? directory
           createdSessions.push(location)
-          const id = `session-${createdSessions.length}`
-          sessionDirectories[id] = location
+          sessionCreateInputs.push(input)
           return {
-            id,
+            id: `session-${createdSessions.length}`,
             projectID: "project",
             agent: input.agent,
             model: input.model,
@@ -114,7 +100,7 @@ const clientFor = (directory: string) => {
         },
         prompt: async (input: unknown) => {
           sessionRequestOrder.push("prompt")
-          sentPrompts.push(sessionDirectories[(input as { sessionID: string }).sessionID] ?? directory)
+          sentPrompts.push(directory)
           promptInputs.push(input)
           return { data: undefined }
         },
@@ -134,21 +120,6 @@ const clientFor = (directory: string) => {
         },
         shell: async (input: { sessionID: string; id?: string; command: string }) => {
           sentShell.push(input)
-          sentShellDirectories.push(sessionDirectories[input.sessionID] ?? directory)
-        },
-      },
-      worktree: {
-        create: async (_input: unknown) => {
-          worktreeCreates++
-          await createWorktreeGate
-          if (worktreeFailure) throw worktreeFailure
-          return { directory: worktreeDirectory }
-        },
-      },
-      location: {
-        get: async () => {
-          if (locationFailure) throw locationFailure
-          return { directory: worktreeDirectory }
         },
       },
     },
@@ -156,6 +127,9 @@ const clientFor = (directory: string) => {
       command: async () => ({ data: undefined }),
       abort: async () => ({ data: undefined }),
     },
+    worktree: {
+      create: async () => ({ data: { directory: `${directory}/new` } }),
+    },
   }
 }
 
@@ -171,7 +145,6 @@ beforeAll(async () => {
 
   mock.module("@opencode-ai/ui/toast", () => ({
     Toast: { Region: () => null },
-    toaster: { create: () => undefined, show: () => undefined, dismiss: () => undefined },
     showToast: () => 0,
   }))
 
@@ -189,13 +162,20 @@ beforeAll(async () => {
         current: () => ({ name: "agent" }),
       },
       session: {
-        promote: () => undefined,
+        promote(directory: string, sessionID: string) {
+          promoted.push({ directory, sessionID })
+        },
       },
     }),
   }))
 
   mock.module("@/context/permission", () => {
-    return { usePermission: () => ({ currentServerState: () => ({ enableAutoAccept: () => undefined }) }) }
+    const state = (server: string) => ({
+      enableAutoAccept(sessionID: string, directory: string) {
+        enabledAutoAccept.push({ server, sessionID, directory })
+      },
+    })
+    return { usePermission: () => ({ currentServerState: () => state(permissionServer) }) }
   })
 
   mock.module("@/context/server", () => ({
@@ -204,10 +184,7 @@ beforeAll(async () => {
 
   mock.module("@/context/tabs", () => ({
     useTabs: () => ({
-      draft: (draftID: string) => ({ server: draftServers[draftID] ?? "project-server" }),
-      updateDraft: (draftID: string, draft: { worktree?: string }) => {
-        updatedDrafts.push({ draftID, ...draft })
-      },
+      draft: () => ({ server: "project-server" }),
       promoteDraft: (draftID: string, session: { server: string; sessionId: string }) => {
         promotedDrafts.push({ draftID, ...session })
       },
@@ -218,72 +195,78 @@ beforeAll(async () => {
     usePrompt: () => prompt,
   }))
 
+  mock.module("@/context/layout", () => ({
+    useLayout: () => ({
+      handoff: {
+        setTabs: () => undefined,
+      },
+    }),
+  }))
+
   mock.module("@/context/sdk", () => ({
     useSDK: () => {
-      return () => ({
-        scope: activeSDK === "server-a" ? ServerScope.local : "server-b",
-        directory: activeSDK === "server-a" ? "/repo/main" : "/repo/other",
+      const sdk = {
+        scope: "local",
+        directory: "/repo/main",
         api: rootClient.api,
         url: "http://localhost:4096",
-      })
+      }
+      return () => sdk
     },
   }))
 
   mock.module("@/context/sync", () => ({
-    useSync: () => () => {
-      const server = activeDirectorySync
-      return {
-        data: { command: commands, project: "project" },
-        session: {
-          optimistic: {
-            add: (value: {
-              directory?: string
-              sessionID?: string
-              message: { agent: string; model: { providerID: string; modelID: string; variant?: string } }
-            }) => {
-              optimisticServers.push(server)
-              optimistic.push(value)
-            },
-            remove: () => undefined,
+    useSync: () => () => ({
+      data: { command: commands },
+      session: {
+        optimistic: {
+          add: (value: {
+            directory?: string
+            sessionID?: string
+            message: { agent: string; model: { providerID: string; modelID: string; variant?: string } }
+          }) => {
+            optimistic.push(value)
+            optimisticSeeded.push(
+              !!value.directory &&
+                !!value.sessionID &&
+                !!storedSessions[value.directory]?.find((item) => item.id === value.sessionID)?.title,
+            )
           },
+          remove: () => undefined,
         },
-        set: () => undefined,
-        project: { worktree: server === "server-a" ? "/repo/main" : "/repo/other" },
-      }
-    },
+      },
+      set: () => undefined,
+    }),
   }))
 
   mock.module("@/context/server-sync", () => ({
-    useServerSync: () => {
-      const server = activeServerSync
-      return {
-        session: {
-          remember: () => undefined,
-          set: () => undefined,
-          sync: async () => {
-            serverSessionSyncs++
+    useServerSync: () => () => ({
+      session: {
+        remember: () => undefined,
+        set: () => undefined,
+        sync: async () => {
+          serverSessionSyncs++
+        },
+      },
+      child: (directory: string) => {
+        syncedDirectories.push(directory)
+        storedSessions[directory] ??= []
+        return [
+          { session: storedSessions[directory] },
+          (...args: unknown[]) => {
+            if (args[0] !== "session") return
+            const next = args[1]
+            if (typeof next === "function") {
+              storedSessions[directory] = next(storedSessions[directory]) as Array<{ id: string; title?: string }>
+              return
+            }
+            if (Array.isArray(next)) {
+              storedSessions[directory] = next as Array<{ id: string; title?: string }>
+            }
           },
-        },
-        child: (directory: string) => {
-          syncedServers.push(server)
-          storedSessions[directory] ??= []
-          return [
-            { session: storedSessions[directory] },
-            (...args: unknown[]) => {
-              if (args[0] !== "session") return
-              const next = args[1]
-              if (typeof next === "function") {
-                storedSessions[directory] = next(storedSessions[directory]) as Array<{ id: string; title?: string }>
-                return
-              }
-              if (Array.isArray(next)) {
-                storedSessions[directory] = next as Array<{ id: string; title?: string }>
-              }
-            },
-          ]
-        },
-      }
-    },
+        ]
+      },
+    }),
   }))
 
   mock.module("@/context/platform", () => ({
@@ -303,141 +286,205 @@ beforeAll(async () => {
 })
 
 beforeEach(() => {
+  createdClients.length = 0
   createdSessions.length = 0
+  sessionCreateInputs.length = 0
+  enabledAutoAccept.length = 0
   optimistic.length = 0
+  optimisticSeeded.length = 0
+  promoted.length = 0
   promotedDrafts.length = 0
-  updatedDrafts.length = 0
-  sentCommands.length = 0
   sentPrompts.length = 0
   promptInputs.length = 0
+  sentCommands.length = 0
   switchedAgents.length = 0
   switchedModels.length = 0
   sessionRequestOrder.length = 0
-  syncedServers.length = 0
-  optimisticServers.length = 0
-  promptCaptures.length = 0
+  commands.length = 0
+  promptValue = [{ type: "text", content: "ls", start: 0, end: 2 }]
   params = {}
   search = {}
   sentShell.length = 0
-  sentShellDirectories.length = 0
+  syncedDirectories.length = 0
   selected = "/repo/worktree-a"
   variant = undefined
-  activeSDK = "server-a"
-  activeServerSync = "server-a"
-  activeDirectorySync = "server-a"
-  commands = []
-  promptValue = [{ type: "text", content: "ls", start: 0, end: 2 }]
-  worktreeDirectory = `/repo/new-${++worktreeID}`
+  permissionServer = "server-a"
   createSessionGate = undefined
   serverSessionSyncs = 0
-  createWorktreeGate = undefined
-  worktreeFailure = undefined
-  locationFailure = undefined
-  worktreeCreates = 0
-  for (const key of Object.keys(draftServers)) delete draftServers[key]
-  for (const key of Object.keys(sessionDirectories)) delete sessionDirectories[key]
   for (const key of Object.keys(storedSessions)) delete storedSessions[key]
 })
 
-const event = { preventDefault: () => undefined } as unknown as Event
-const makeSubmit = (overrides: Partial<Parameters<typeof createPromptSubmit>[0]> = {}) =>
-  createPromptSubmit({
-    prompt,
-    info: () => undefined,
-    imageAttachments: () => [],
-    commentCount: () => 0,
-    autoAccept: () => false,
-    mode: () => "normal",
-    working: () => false,
-    editor: () => undefined,
-    queueScroll: () => undefined,
-    promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
-    addToHistory: () => undefined,
-    resetHistoryNavigation: () => undefined,
-    setMode: () => undefined,
-    setPopover: () => undefined,
-    newSessionWorktree: () => selected,
-    onNewSessionWorktreeReset: () => undefined,
-    onSubmit: () => undefined,
-    ...overrides,
-  })
-
 describe("prompt submit worktree selection", () => {
-  test("admits only one concurrent new-workspace submission", async () => {
-    selected = "create"
-    let release = () => {}
-    createWorktreeGate = new Promise<void>((resolve) => {
-      release = resolve
+  test("reads the latest worktree accessor value per submit", async () => {
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => undefined,
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "shell",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      newSessionWorktree: () => selected,
+      onNewSessionWorktreeReset: () => undefined,
+      onSubmit: () => undefined,
     })
-    const submit = makeSubmit()
 
-    const first = submit.handleSubmit(event)
-    const duplicate = submit.handleSubmit(event)
-    expect(worktreeCreates).toBe(1)
+    const event = { preventDefault: () => undefined } as unknown as Event
 
-    release()
-    await Promise.all([first, duplicate])
-    expect(createdSessions).toEqual([worktreeDirectory])
-    await settle()
+    await submit.handleSubmit(event)
+    selected = "/repo/worktree-b"
+    await submit.handleSubmit(event)
 
-    expect(worktreeCreates).toBe(1)
-    expect(createdSessions).toHaveLength(1)
-    expect(sentPrompts).toEqual([worktreeDirectory])
+    expect(createdClients).toEqual([])
+    expect(createdSessions).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
+    expect(sessionCreateInputs).toEqual([
+      {
+        agent: "agent",
+        model: { id: "model", providerID: "provider", variant: undefined },
+        location: { directory: "/repo/worktree-a" },
+      },
+      {
+        agent: "agent",
+        model: { id: "model", providerID: "provider", variant: undefined },
+        location: { directory: "/repo/worktree-b" },
+      },
+    ])
+    expect(sentShell).toEqual([
+      expect.objectContaining({ sessionID: "session-1", id: expect.stringMatching(/^evt_/), command: "ls" }),
+      expect.objectContaining({ sessionID: "session-2", id: expect.stringMatching(/^evt_/), command: "ls" }),
+    ])
+    expect(syncedDirectories).toEqual(["/repo/worktree-a", "/repo/worktree-a", "/repo/worktree-b", "/repo/worktree-b"])
+    expect(serverSessionSyncs).toBe(0)
+    expect(promoted).toEqual([
+      { directory: "/repo/worktree-a", sessionID: "session-1" },
+      { directory: "/repo/worktree-b", sessionID: "session-2" },
+    ])
+    expect(syncedDirectories).toEqual(["/repo/worktree-a", "/repo/worktree-a", "/repo/worktree-b", "/repo/worktree-b"])
   })
 
-  test("stops when the created workspace cannot initialize", async () => {
-    selected = "create"
-    locationFailure = new Error("initialization failed")
+  test("applies auto-accept to newly created sessions", async () => {
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => undefined,
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => true,
+      mode: () => "shell",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      newSessionWorktree: () => selected,
+      onNewSessionWorktreeReset: () => undefined,
+      onSubmit: () => undefined,
+    })
 
-    await makeSubmit().handleSubmit(event)
+    const event = { preventDefault: () => undefined } as unknown as Event
 
-    expect(worktreeCreates).toBe(1)
-    expect(createdSessions).toEqual([])
-    expect(sentPrompts).toEqual([])
+    await submit.handleSubmit(event)
+
+    expect(enabledAutoAccept).toEqual([{ server: "server-a", sessionID: "session-1", directory: "/repo/worktree-a" }])
   })
 
-  test("keeps async submission effects bound to the initiating context", async () => {
-    search = { draftId: "draft-1" }
-    draftServers["draft-1"] = "project-server-a"
-    draftServers["draft-2"] = "project-server-b"
+  test("keeps auto-accept bound to the submission server", async () => {
     let release = () => {}
     createSessionGate = new Promise<void>((resolve) => {
       release = resolve
     })
-    let submitted = 0
-    const submit = makeSubmit({
-      onSubmit: () => submitted++,
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => undefined,
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => true,
+      mode: () => "shell",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      newSessionWorktree: () => selected,
+      onNewSessionWorktreeReset: () => undefined,
+      onSubmit: () => undefined,
     })
 
-    const result = submit.handleSubmit(event)
-    activeSDK = "server-b"
-    activeServerSync = "server-b"
-    activeDirectorySync = "server-b"
-    search.draftId = "draft-2"
+    const result = submit.handleSubmit({ preventDefault: () => undefined } as unknown as Event)
+    permissionServer = "server-b"
     release()
     await result
-    await settle()
 
-    expect(updatedDrafts).toEqual([{ draftID: "draft-1", worktree: undefined }])
-    expect(promotedDrafts).toEqual([{ draftID: "draft-1", server: "project-server-a", sessionId: "session-1" }])
-    expect(syncedServers.every((server) => server === "server-a")).toBe(true)
-    expect(optimisticServers).toEqual(["server-a"])
-    expect(promptCaptures.at(-1)?.target).toEqual({ server: "project-server-a", scope: ServerScope.local })
-    expect(submitted).toBe(0)
+    expect(enabledAutoAccept).toEqual([{ server: "server-a", sessionID: "session-1", directory: "/repo/worktree-a" }])
+  })
+
+  test("promotes drafts using the selected project's server", async () => {
+    search = { draftId: "draft-1" }
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => undefined,
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "normal",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      newSessionWorktree: () => selected,
+      onNewSessionWorktreeReset: () => undefined,
+      onSubmit: () => undefined,
+    })
+
+    await submit.handleSubmit({ preventDefault: () => undefined } as unknown as Event)
+
+    expect(promotedDrafts).toEqual([{ draftID: "draft-1", server: "project-server", sessionId: "session-1" }])
   })
 
   test("switches the selected agent and model before prompting", async () => {
     params = { id: "session-1" }
     variant = "high"
 
-    const submit = makeSubmit({
+    const submit = createPromptSubmit({
+      prompt,
       info: () => ({
         id: "session-1",
         agent: "old-agent",
         model: { id: "old-model", providerID: "old-provider" },
       }),
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "normal",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      onSubmit: () => undefined,
     })
 
+    const event = { preventDefault: () => undefined } as unknown as Event
+
     await submit.handleSubmit(event)
     await Bun.sleep(0)
 
@@ -472,12 +519,24 @@ describe("prompt submit worktree selection", () => {
     commands.push({ name: "review" })
     promptValue = [{ type: "text", content: "/review staged changes", start: 0, end: 22 }]
 
-    const submit = makeSubmit({
+    const submit = createPromptSubmit({
+      prompt,
       info: () => ({ id: "session-1" }),
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "normal",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
     })
 
-    await submit.handleSubmit(event)
-    await settle()
+    await submit.handleSubmit({ preventDefault: () => undefined } as unknown as Event)
 
     expect(sentCommands).toEqual([
       {
@@ -493,19 +552,66 @@ describe("prompt submit worktree selection", () => {
     expect(serverSessionSyncs).toBe(0)
   })
 
-  test("sends an initial shell after synchronous workspace creation", async () => {
-    selected = "create"
-    const submit = makeSubmit({
-      mode: () => "shell",
+  test("uses an injected model selection", async () => {
+    params = { id: "session-1" }
+    const model = {
+      current: () => ({ id: "draft-model", provider: { id: "draft-provider" } }),
+      variant: { current: () => "draft-variant" },
+    } as unknown as ModelSelection
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => ({ id: "session-1" }),
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "normal",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      model,
     })
 
-    await submit.handleSubmit(event)
-    await settle()
+    await submit.handleSubmit({ preventDefault: () => undefined } as unknown as Event)
 
-    expect(sentShellDirectories).toEqual([worktreeDirectory])
-    expect(sentShell[0]).toMatchObject({
-      sessionID: "session-1",
-      command: "ls",
+    expect(optimistic[0]).toMatchObject({
+      message: {
+        model: { providerID: "draft-provider", modelID: "draft-model", variant: "draft-variant" },
+      },
     })
   })
+
+  test("seeds new sessions before optimistic prompts are added", async () => {
+    const submit = createPromptSubmit({
+      prompt,
+      info: () => undefined,
+      imageAttachments: () => [],
+      commentCount: () => 0,
+      autoAccept: () => false,
+      mode: () => "normal",
+      working: () => false,
+      editor: () => undefined,
+      queueScroll: () => undefined,
+      promptLength: (value) => value.reduce((sum, part) => sum + ("content" in part ? part.content.length : 0), 0),
+      addToHistory: () => undefined,
+      resetHistoryNavigation: () => undefined,
+      setMode: () => undefined,
+      setPopover: () => undefined,
+      newSessionWorktree: () => selected,
+      onNewSessionWorktreeReset: () => undefined,
+      onSubmit: () => undefined,
+    })
+
+    const event = { preventDefault: () => undefined } as unknown as Event
+
+    await submit.handleSubmit(event)
+
+    expect(storedSessions["/repo/worktree-a"]).toHaveLength(1)
+    expect(storedSessions["/repo/worktree-a"]?.[0]).toMatchObject({ id: "session-1", title: "New session 1" })
+    expect(optimisticSeeded).toEqual([true])
+  })
 })

packages/app/src/components/prompt-input/submit.ts

@@ -8,12 +8,14 @@ import { batch, startTransition, type Accessor } from "solid-js"
 import { useTabs } from "@/context/tabs"
 import { useServerSync, type ServerSync } from "@/context/server-sync"
 import { useLanguage } from "@/context/language"
+import { useLayout } from "@/context/layout"
 import { useLocal, type ModelSelection } from "@/context/local"
 import { usePermission } from "@/context/permission"
 import { type ContextItem, type ImageAttachmentPart, type Prompt, type usePrompt } from "@/context/prompt"
 import { useSDK, type DirectorySDK } from "@/context/sdk"
 import { useSync, type DirectorySync } from "@/context/sync"
 import { Identifier } from "@/utils/id"
+import { Worktree as WorktreeState } from "@/utils/worktree"
 import { getDirectory } from "@opencode-ai/core/util/path"
 import { buildRequestParts } from "./build-request-parts"
 import { setCursorPosition } from "./editor-dom"
@@ -23,7 +25,12 @@ import { createPromptSubmissionState } from "./submission-state"
 import { Event } from "@opencode-ai/schema/event"
 import { blobDataUrl } from "@/utils/draft-store"
 
-const submitting = new Set<string>()
+type PendingPrompt = {
+  abort: AbortController
+  cleanup: VoidFunction
+}
+
+const pending = new Map<string, PendingPrompt>()
 
 export type FollowupDraft = {
   sessionID: string
@@ -43,6 +50,7 @@ type FollowupSendInput = {
   draft: FollowupDraft
   messageID?: string
   optimisticBusy?: boolean
+  before?: () => Promise<boolean> | boolean
 }
 
 const draftText = (prompt: Prompt) => prompt.map((part) => ("content" in part ? part.content : "")).join("")
@@ -62,11 +70,22 @@ export async function sendFollowupDraft(input: FollowupSendInput) {
     input.serverSync.session.set("session_status", input.draft.sessionID, { type: "idle" })
   }
 
+  const wait = async () => {
+    const ok = await input.before?.()
+    if (ok === false) return false
+    return true
+  }
+
   const [head, ...tail] = text.split(" ")
   const cmd = head?.startsWith("/") ? head.slice(1) : undefined
   if (cmd && input.sync.data.command.find((item) => item.name === cmd)) {
     setBusy()
     try {
+      if (!(await wait())) {
+        setIdle()
+        return false
+      }
+
       const messageID = Identifier.ascending("message")
       await input.api.command({
         sessionID: input.draft.sessionID,
@@ -140,6 +159,14 @@ export async function sendFollowupDraft(input: FollowupSendInput) {
   })
 
   try {
+    if (!(await wait())) {
+      batch(() => {
+        setIdle()
+        remove()
+      })
+      return false
+    }
+
     const session = input.session()
     if (session?.agent !== input.draft.agent) {
       await input.api.switchAgent({ sessionID: input.draft.sessionID, agent: input.draft.agent })
@@ -231,10 +258,13 @@ export function createPromptSubmit(input: PromptSubmitInput) {
   const local = useLocal()
   const permission = usePermission()
   const prompt = input.prompt
+  const layout = useLayout()
   const language = useLanguage()
   const params = useParams()
   const [search] = useSearchParams<{ draftId?: string }>()
   const tabs = useTabs()
+  const pendingKey = (sessionID: string) => ScopedKey.from(sdk().scope, sessionID)
+
   const errorMessage = (err: unknown) => {
     if (err && typeof err === "object" && "message" in err && typeof err.message === "string") return err.message
     if (err && typeof err === "object" && "data" in err) {
@@ -248,10 +278,19 @@ export function createPromptSubmit(input: PromptSubmitInput) {
   const abort = async () => {
     const sessionID = params.id
     if (!sessionID) return Promise.resolve()
-    serverSync.session.set("todo", sessionID, [])
+
+    serverSync().session.set("todo", sessionID, [])
 
     input.onAbort?.()
 
+    const key = pendingKey(sessionID)
+    const queued = pending.get(key)
+    if (queued) {
+      queued.abort.abort()
+      queued.cleanup()
+      pending.delete(key)
+      return Promise.resolve()
+    }
     return sdk()
       .api.session.interrupt({ sessionID })
       .catch(() => {})
@@ -280,9 +319,9 @@ export function createPromptSubmit(input: PromptSubmitInput) {
     }
   }
 
-  const seed = (target: ServerSync, dir: string, info: SessionInfo) => {
-    target.session.remember(info)
-    const [, setStore] = target.child(dir)
+  const seed = (dir: string, info: SessionInfo) => {
+    serverSync().session.remember(info)
+    const [, setStore] = serverSync().child(dir)
     setStore("session", (list: SessionInfo[]) => {
       const result = Binary.search(list, info.id, (item) => item.id)
       const next = [...list]
@@ -314,6 +353,7 @@ export function createPromptSubmit(input: PromptSubmitInput) {
       if (input.working()) void abort()
       return
     }
+
     const modelSelection = input.model ?? local.model
     const currentModel = modelSelection.current()
     const currentAgent = local.agent.current()
@@ -326,251 +366,284 @@ export function createPromptSubmit(input: PromptSubmitInput) {
       return
     }
 
-    const submissionSDK = sdk()
-    const submissionSync = sync()
-    const submissionServerSync = serverSync
-    const submissionScope = submissionSDK.scope
-    const projectDirectory = submissionSDK.directory
-    const sessionID = params.id
-    const isNewSession = !sessionID
-    const currentSession = input.info()
-    const draftID = search.draftId
-    const draftServer = draftID ? tabs.draft(draftID).server : undefined
-    const capturePrompt = prompt.capture
-    const localSession = local.session
-    const resetWorktree = input.onNewSessionWorktreeReset
-    const onSubmit = input.onSubmit
-    const permissionState = permission
+    input.addToHistory(currentPrompt, mode)
+    input.resetHistoryNavigation()
+
+    const projectDirectory = sdk().directory
+    const permissionState = permission.currentServerState()
+    const isNewSession = !params.id
     const shouldAutoAccept = isNewSession && input.autoAccept()
     const worktreeSelection = input.newSessionWorktree?.() || "main"
-    const submissionKey = ScopedKey.from(
-      submissionScope,
-      draftID ? `draft:${draftID}` : sessionID ? `session:${sessionID}` : `directory:${projectDirectory}`,
-    )
-    if (submitting.has(submissionKey)) return
-    submitting.add(submissionKey)
 
-    try {
-      input.addToHistory(currentPrompt, mode)
-      input.resetHistoryNavigation()
-
-      let sessionDirectory = projectDirectory
-      if (isNewSession) {
-        if (worktreeSelection === "create") {
-          const createdWorktree = await submissionSDK.api.worktree
-            .create({
-              projectID: submissionSync.data.project,
-              strategy: "git",
-              directory: getDirectory(submissionSync.project?.worktree ?? projectDirectory),
-            })
-            .then(async (created) => {
-              await submissionSDK.api.location.get({ location: { directory: created.directory } })
-              return created
-            })
-            .catch((err) => {
-              showToast({
-                title: language.t("prompt.toast.worktreeCreateFailed.title"),
-                description: errorMessage(err),
-              })
-            })
-
-          if (!createdWorktree) return
-          sessionDirectory = createdWorktree.directory
-        }
-
-        if (worktreeSelection !== "main" && worktreeSelection !== "create") {
-          sessionDirectory = worktreeSelection
-        }
-
-        if (sessionDirectory !== projectDirectory) {
-          submissionServerSync.child(sessionDirectory)
-        }
-      }
-
-      let session = currentSession
-      if (!session && isNewSession) {
-        const created = await submissionSDK.api.session
-          .create({
-            agent: currentAgent.name,
-            model: { id: currentModel.id, providerID: currentModel.provider.id, variant },
-            location: { directory: sessionDirectory },
+    let sessionDirectory = projectDirectory
+    if (isNewSession) {
+      if (worktreeSelection === "create") {
+        const createdWorktree = await sdk()
+          .api.projectCopy.create({
+            projectID: sync().data.project,
+            strategy: "git_worktree",
+            directory: getDirectory(projectDirectory),
+            location: { directory: projectDirectory },
           })
           .catch((err) => {
             showToast({
-              title: language.t("prompt.toast.sessionCreateFailed.title"),
+              title: language.t("prompt.toast.worktreeCreateFailed.title"),
               description: errorMessage(err),
             })
             return undefined
           })
-        if (created) {
-          seed(submissionServerSync, sessionDirectory, created)
-          session = created
-          await startTransition(() => {
-            if (!session) return
-            if (draftID) tabs.updateDraft(draftID, { worktree: undefined })
-            if (!draftID) resetWorktree?.()
-            if (shouldAutoAccept) permissionState.enableAutoAccept(session.id, sessionDirectory)
-            localSession.promote(sessionDirectory, session.id, {
-              agent: currentAgent.name,
-              model: { providerID: currentModel.provider.id, modelID: currentModel.id },
-              variant: variant ?? null,
-            })
-            if (draftID && draftServer) tabs.promoteDraft(draftID, { server: draftServer, sessionId: session.id })
-            else navigate(`/${base64Encode(sessionDirectory)}/session/${session.id}`)
-            submission.retarget(
-              capturePrompt(
-                { dir: base64Encode(sessionDirectory), id: session.id },
-                { server: draftServer, scope: submissionScope },
-              ),
-            )
+        if (!createdWorktree) return
+        WorktreeState.pending(sdk().scope, createdWorktree.directory)
+        sessionDirectory = createdWorktree.directory
+      }
+
+      if (worktreeSelection !== "main" && worktreeSelection !== "create") {
+        sessionDirectory = worktreeSelection
+      }
+
+      if (sessionDirectory !== projectDirectory) {
+        serverSync().child(sessionDirectory)
+      }
+
+      input.onNewSessionWorktreeReset?.()
+    }
+
+    let session = input.info()
+    if (!session && isNewSession) {
+      const created = await sdk()
+        .api.session.create({
+          agent: currentAgent.name,
+          model: { id: currentModel.id, providerID: currentModel.provider.id, variant },
+          location: { directory: sessionDirectory },
+        })
+        .catch((err) => {
+          showToast({
+            title: language.t("prompt.toast.sessionCreateFailed.title"),
+            description: errorMessage(err),
           })
-        }
-      }
-      if (!session) {
-        showToast({
-          title: language.t("prompt.toast.promptSendFailed.title"),
-          description: language.t("prompt.toast.promptSendFailed.description"),
+          return undefined
         })
-        return
-      }
-
-      const model = {
-        modelID: currentModel.id,
-        providerID: currentModel.provider.id,
-      }
-      const agent = currentAgent.name
-      const draft: FollowupDraft = {
-        sessionID: session.id,
-        sessionDirectory,
-        prompt: currentPrompt,
-        context,
-        agent,
-        model,
-        variant,
-      }
-
-      const clearInput = () => {
-        submission.clear()
-        input.setMode("normal")
-        input.setPopover(null)
-      }
-
-      const restoreInput = () => {
-        const restored = submission.restore()
-        if (!restored) return false
-        restored.target.set(restored.prompt, input.promptLength(restored.prompt))
-        if (!submission.current(prompt.capture())) return true
-        input.setMode(mode)
-        input.setPopover(null)
-        requestAnimationFrame(() => {
-          const editor = input.editor()
-          if (!editor) return
-          editor.focus()
-          setCursorPosition(editor, input.promptLength(currentPrompt))
-          input.queueScroll()
+      if (created) {
+        seed(sessionDirectory, created)
+        session = created
+        await startTransition(() => {
+          if (!session) return
+          if (shouldAutoAccept) permissionState.enableAutoAccept(session.id, sessionDirectory)
+          local.session.promote(sessionDirectory, session.id, {
+            agent: currentAgent.name,
+            model: { providerID: currentModel.provider.id, modelID: currentModel.id },
+            variant: variant ?? null,
+          })
+          layout.handoff.setTabs(base64Encode(sessionDirectory), session.id)
+          const draftID = search.draftId
+          if (draftID) tabs.promoteDraft(draftID, { server: tabs.draft(draftID).server, sessionId: session.id })
+          else navigate(`/${base64Encode(sessionDirectory)}/session/${session.id}`)
+          submission.retarget(prompt.capture({ dir: base64Encode(sessionDirectory), id: session.id }))
         })
-        return true
       }
+    }
+    if (!session) {
+      showToast({
+        title: language.t("prompt.toast.promptSendFailed.title"),
+        description: language.t("prompt.toast.promptSendFailed.description"),
+      })
+      return
+    }
 
-      if (!isNewSession && mode === "normal" && input.shouldQueue?.()) {
-        input.onQueue?.(draft)
-        clearContext(submission.target())
+    const model = {
+      modelID: currentModel.id,
+      providerID: currentModel.provider.id,
+    }
+    const agent = currentAgent.name
+    const draft: FollowupDraft = {
+      sessionID: session.id,
+      sessionDirectory,
+      prompt: currentPrompt,
+      context,
+      agent,
+      model,
+      variant,
+    }
+
+    const clearInput = () => {
+      submission.clear()
+      input.setMode("normal")
+      input.setPopover(null)
+    }
+
+    const restoreInput = () => {
+      const restored = submission.restore()
+      if (!restored) return false
+      restored.target.set(restored.prompt, input.promptLength(restored.prompt))
+      if (!submission.current(prompt.capture())) return true
+      input.setMode(mode)
+      input.setPopover(null)
+      requestAnimationFrame(() => {
+        const editor = input.editor()
+        if (!editor) return
+        editor.focus()
+        setCursorPosition(editor, input.promptLength(currentPrompt))
+        input.queueScroll()
+      })
+      return true
+    }
+
+    if (!isNewSession && mode === "normal" && input.shouldQueue?.()) {
+      input.onQueue?.(draft)
+      clearContext(submission.target())
+      clearInput()
+      return
+    }
+
+    input.onSubmit?.()
+
+    if (mode === "shell") {
+      clearInput()
+      const eventID = Event.ID.create()
+      sdk()
+        .api.session.shell({
+          sessionID: session.id,
+          id: eventID,
+          command: text,
+        })
+        .catch((err) => {
+          showToast({
+            title: language.t("prompt.toast.shellSendFailed.title"),
+            description: errorMessage(err),
+          })
+          restoreInput()
+        })
+      return
+    }
+
+    if (text.startsWith("/")) {
+      const [cmdName, ...args] = text.split(" ")
+      const commandName = cmdName.slice(1)
+      const customCommand = sync().data.command.find((c) => c.name === commandName)
+      if (customCommand) {
         clearInput()
-        return
-      }
-
-      if (!draftID || search.draftId === draftID) onSubmit?.()
-
-      if (mode === "shell") {
-        clearInput()
-        const eventID = Event.ID.create()
-        void submissionSDK.api.session
-          .shell({
+        const messageID = Identifier.ascending("message")
+        serverSync().session.set("session_status", session.id, { type: "busy" })
+        sdk()
+          .api.session.command({
             sessionID: session.id,
-            id: eventID,
-            command: text,
+            id: messageID,
+            command: commandName,
+            arguments: args.join(" "),
+            agent,
+            model: { id: model.modelID, providerID: model.providerID, variant },
+            files: await Promise.all(
+              images.map(async (attachment) => ({
+                uri: await blobDataUrl(attachment.blob, attachment.mime),
+                name: attachment.filename,
+              })),
+            ),
           })
           .catch((err) => {
+            serverSync().session.set("session_status", session.id, { type: "idle" })
             showToast({
-              title: language.t("prompt.toast.shellSendFailed.title"),
-              description: errorMessage(err),
+              title: language.t("prompt.toast.commandSendFailed.title"),
+              description: formatServerError(err, language.t, language.t("common.requestFailed")),
             })
             restoreInput()
           })
         return
       }
+    }
 
-      if (text.startsWith("/")) {
-        const [cmdName, ...args] = text.split(" ")
-        const commandName = cmdName.slice(1)
-        const customCommand = submissionSync.data.command.find((c) => c.name === commandName)
-        if (customCommand) {
-          clearInput()
-          const messageID = Identifier.ascending("message")
-          submissionServerSync.session.set("session_status", session.id, { type: "busy" })
-          void submissionSDK.api.session
-            .command({
-              sessionID: session.id,
-              id: messageID,
-              command: commandName,
-              arguments: args.join(" "),
-              agent,
-              model: { id: model.modelID, providerID: model.providerID, variant },
-              files: await Promise.all(
-                images.map(async (attachment) => ({
-                  uri: await blobDataUrl(attachment.blob, attachment.mime),
-                  name: attachment.filename,
-                })),
-              ),
-            })
-            .catch((err) => {
-              submissionServerSync.session.set("session_status", session.id, { type: "idle" })
-              showToast({
-                title: language.t("prompt.toast.commandSendFailed.title"),
-                description: formatServerError(err, language.t, language.t("common.requestFailed")),
-              })
-              restoreInput()
-            })
-          return
-        }
-      }
+    const commentItems = context.filter((item) => item.type === "file" && !!item.comment?.trim())
+    const messageID = Identifier.ascending("message")
 
-      const commentItems = context.filter((item) => item.type === "file" && !!item.comment?.trim())
-      const messageID = Identifier.ascending("message")
-
-      const removeOptimisticMessage = () => {
-        submissionSync.session.optimistic.remove({
-          directory: sessionDirectory,
-          sessionID: session.id,
-          messageID,
-        })
-      }
-
-      for (const item of commentItems) submission.target().context.remove(item.key)
-      clearInput()
-
-      void sendFollowupDraft({
-        api: submissionSDK.api.session,
-        sync: submissionSync,
-        serverSync: submissionServerSync,
-        session: () => session,
-        draft,
+    const removeOptimisticMessage = () => {
+      sync().session.optimistic.remove({
+        directory: sessionDirectory,
+        sessionID: session.id,
         messageID,
-        optimisticBusy: sessionDirectory === projectDirectory,
-      }).catch((err) => {
+      })
+    }
+
+    for (const item of commentItems) submission.target().context.remove(item.key)
+    clearInput()
+
+    const waitForWorktree = async () => {
+      const worktree = WorktreeState.get(sdk().scope, sessionDirectory)
+      if (!worktree || worktree.status !== "pending") return true
+
+      if (sessionDirectory === projectDirectory) {
+        sync().set("session_status", session.id, { type: "busy" })
+      }
+
+      const controller = new AbortController()
+      const cleanup = () => {
         if (sessionDirectory === projectDirectory) {
-          submissionSync.set("session_status", session.id, { type: "idle" })
+          sync().set("session_status", session.id, { type: "idle" })
         }
-        showToast({
-          title: language.t("prompt.toast.promptSendFailed.title"),
-          description: errorMessage(err),
-        })
         removeOptimisticMessage()
         if (restoreInput()) restoreCommentItems(submission.target(), commentItems)
+      }
+
+      pending.set(pendingKey(session.id), { abort: controller, cleanup })
+
+      const abortWait = new Promise<Awaited<ReturnType<typeof WorktreeState.wait>>>((resolve) => {
+        if (controller.signal.aborted) {
+          resolve({ status: "failed", message: "aborted" })
+          return
+        }
+        controller.signal.addEventListener(
+          "abort",
+          () => {
+            resolve({ status: "failed", message: "aborted" })
+          },
+          { once: true },
+        )
       })
-    } finally {
-      submitting.delete(submissionKey)
+
+      const timeoutMs = 5 * 60 * 1000
+      const timer = { id: undefined as number | undefined }
+      const timeout = new Promise<Awaited<ReturnType<typeof WorktreeState.wait>>>((resolve) => {
+        timer.id = window.setTimeout(() => {
+          resolve({
+            status: "failed",
+            message: language.t("workspace.error.stillPreparing"),
+          })
+        }, timeoutMs)
+      })
+
+      const result = await Promise.race([
+        WorktreeState.wait(sdk().scope, sessionDirectory),
+        abortWait,
+        timeout,
+      ]).finally(() => {
+        if (timer.id === undefined) return
+        clearTimeout(timer.id)
+      })
+      pending.delete(pendingKey(session.id))
+      if (controller.signal.aborted) return false
+      if (result.status === "failed") throw new Error(result.message)
+      return true
     }
+
+    void sendFollowupDraft({
+      api: sdk().api.session,
+      sync: sync(),
+      serverSync: serverSync(),
+      session: () => input.info() ?? session,
+      draft,
+      messageID,
+      optimisticBusy: sessionDirectory === projectDirectory,
+      before: waitForWorktree,
+    }).catch((err) => {
+      pending.delete(pendingKey(session.id))
+      if (sessionDirectory === projectDirectory) {
+        sync().set("session_status", session.id, { type: "idle" })
+      }
+      showToast({
+        title: language.t("prompt.toast.promptSendFailed.title"),
+        description: errorMessage(err),
+      })
+      removeOptimisticMessage()
+      if (restoreInput()) restoreCommentItems(submission.target(), commentItems)
+    })
   }
 
   return {

packages/app/src/components/prompt-workspace-selector.tsx

@@ -1,52 +1,35 @@
-import { createMemo, createSignal, For, Show } from "solid-js"
+import { For, Show } from "solid-js"
 import { MenuV2 } from "@opencode-ai/ui/v2/menu-v2"
 import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
-import { Icon } from "@opencode-ai/ui/v2/icon"
+import { Icon } from "@opencode-ai/ui/icon"
+import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
 import { getFilename } from "@opencode-ai/core/util/path"
 import { useLanguage } from "@/context/language"
-import { sameDirectory } from "@/utils/workspace"
 
 export function PromptWorkspaceSelector(props: {
   value: string
   projectRoot: string
   workspaces: string[]
   branch?: string
-  onboarding?: boolean
   onChange: (value: string) => void
   onDone: () => void
-  onViewAll: () => void
 }) {
   const language = useLanguage()
-  const [search, setSearch] = createSignal("")
-  let searchInput: HTMLInputElement | undefined
-  let focusSearch = false
-  let pending: { type: "select"; value: string } | { type: "viewAll" } | undefined
-  const selected = () => (sameDirectory(props.value, props.projectRoot) ? "main" : props.value)
-  const workspaces = createMemo(() => {
-    const query = search().trim().toLowerCase()
-    if (!query) return props.workspaces
-    return props.workspaces.filter((workspace) => getFilename(workspace).toLowerCase().includes(query))
-  })
+  let pending: string | undefined
+  const selected = () => (props.value === props.projectRoot ? "main" : props.value)
   const icon = () => {
     if (selected() === "main") return "monitor"
     if (selected() === "create") return "workspace-new"
-    return "workspace-isolated"
+    return "workspace"
   }
   const select = (value: string) => {
-    pending = { type: "select", value }
+    pending = value
   }
   const onOpenChange = (open: boolean) => {
-    if (open) {
-      setSearch("")
-      return
-    }
-    const action = pending
+    if (open) return
+    const value = pending
     pending = undefined
-    if (action?.type === "select") props.onChange(action.value)
-    if (action?.type === "viewAll") {
-      props.onViewAll()
-      return
-    }
+    if (value) props.onChange(value)
     props.onDone()
   }
   const label = () => {
@@ -58,214 +41,87 @@ export function PromptWorkspaceSelector(props: {
   return (
     <>
       <span class="hidden select-none opacity-50 sm:inline mx-1">/</span>
-      <TooltipV2
-        placement="top"
-        openDelay={800}
-        value={
-          props.onboarding ? (
-            <div class="flex flex-col gap-1 text-start">
-              <div class="flex items-center gap-1.5 font-[530] text-v2-text-text-base">
-                <Icon name="workspace-isolated" size="small" class="shrink-0 text-v2-text-text-accent" />
-                <span>{language.t("workspace.onboarding.title")}</span>
-              </div>
-              <span class="font-[440] text-v2-text-text-muted">{language.t("workspace.onboarding.description")}</span>
-            </div>
-          ) : (
-            language.t("session.new.workspace.trigger.tooltip")
-          )
-        }
-        contentClass={props.onboarding ? "max-w-[280px]" : undefined}
-        class="min-w-0"
-      >
-        <MenuV2 placement="bottom" gutter={4} onOpenChange={onOpenChange}>
-          <MenuV2.Trigger
-            aria-description={language.t("session.new.workspace.trigger.tooltip")}
-            class="flex h-6 min-w-0 max-w-[203px] items-center gap-1.5 rounded-sm px-1.5 hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none data-[expanded]:bg-v2-overlay-simple-overlay-pressed data-[expanded]:text-v2-text-text-muted"
-          >
-            <Icon name={icon()} class="shrink-0 text-v2-icon-icon-muted" />
-            <span class="min-w-0 truncate">{label()}</span>
-            <Show when={props.onboarding}>
-              <span
-                data-slot="workspace-onboarding-dot"
-                aria-hidden="true"
-                class="size-1.5 shrink-0 rounded-full bg-v2-text-text-accent"
-              />
+      <MenuV2 placement="bottom" gutter={4} onOpenChange={onOpenChange}>
+        <MenuV2.Trigger class="flex h-7 min-w-0 max-w-[203px] items-center gap-1.5 rounded-sm px-1.5 hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none data-[expanded]:bg-v2-overlay-simple-overlay-pressed data-[expanded]:text-v2-text-text-muted">
+          <IconV2 name={icon()} class="shrink-0 text-v2-icon-icon-muted" />
+          <span class="min-w-0 truncate">{label()}</span>
+          <Icon name="chevron-down" size="small" class="shrink-0 text-v2-icon-icon-muted" />
+        </MenuV2.Trigger>
+        <MenuV2.Portal>
+          <MenuV2.Content class="w-[180px]">
+            <MenuV2.Group>
+              <MenuV2.GroupLabel>{language.t("session.new.workspace.runIn")}</MenuV2.GroupLabel>
+              <MenuV2.Item onSelect={() => select("main")}>
+                <IconV2 name="monitor" />
+                <span class="min-w-0 flex-1 truncate">{language.t("session.new.workspace.local")}</span>
+                <Show when={selected() === "main"}>
+                  <Icon name="check" size="small" class="shrink-0" />
+                </Show>
+              </MenuV2.Item>
+              <MenuV2.Item onSelect={() => select("create")}>
+                <IconV2 name="workspace-new" />
+                <span class="min-w-0 flex-1 truncate">{language.t("workspace.new")}</span>
+                <Show when={selected() === "create"}>
+                  <Icon name="check" size="small" class="shrink-0" />
+                </Show>
+              </MenuV2.Item>
+            </MenuV2.Group>
+            <Show when={props.workspaces.length > 0}>
+              <MenuV2.Separator />
+              <MenuV2.Sub gutter={0} overlap overflowPadding={8}>
+                <MenuV2.SubTrigger>
+                  <IconV2 name="workspace" />
+                  {language.t("session.new.workspace.existing")}
+                </MenuV2.SubTrigger>
+                <MenuV2.Portal>
+                  <MenuV2.SubContent class="max-w-[200px]">
+                    <For each={props.workspaces}>
+                      {(workspace) => (
+                        <MenuV2.Item onSelect={() => select(workspace)}>
+                          <IconV2 name="workspace-isolated" />
+                          <span class="min-w-0 flex-1 truncate">{getFilename(workspace)}</span>
+                          <Show when={selected() === workspace}>
+                            <Icon name="check" size="small" class="shrink-0" />
+                          </Show>
+                        </MenuV2.Item>
+                      )}
+                    </For>
+                  </MenuV2.SubContent>
+                </MenuV2.Portal>
+              </MenuV2.Sub>
             </Show>
-            <Icon name="chevron-down" size="small" class="shrink-0 text-v2-icon-icon-muted" />
-          </MenuV2.Trigger>
-          <MenuV2.Portal>
-            <MenuV2.Content class="w-[200px]">
-              <MenuV2.Group>
-                <MenuV2.GroupLabel>{language.t("session.new.workspace.runIn")}</MenuV2.GroupLabel>
-                <MenuV2.Item onSelect={() => select("main")}>
-                  <Icon name="monitor" />
-                  <TooltipV2
-                    placement="right"
-                    openDelay={800}
-                    value={
-                      <span class="flex flex-col gap-0.5">
-                        <span>{language.t("session.new.workspace.local")}</span>
-                        <span class="font-[440] text-v2-text-text-muted">
-                          {language.t("session.new.workspace.local.tooltip")}
-                        </span>
-                      </span>
-                    }
-                    class="min-w-0 flex-1"
-                  >
-                    <span class="min-w-0 truncate">{language.t("session.new.workspace.local")}</span>
-                  </TooltipV2>
-                  <Show when={selected() === "main"}>
-                    <Icon name="check" size="small" class="shrink-0" />
-                  </Show>
-                </MenuV2.Item>
-                <MenuV2.Item onSelect={() => select("create")}>
-                  <Icon name="workspace-new" />
-                  <TooltipV2
-                    placement="right"
-                    openDelay={800}
-                    value={
-                      <span class="flex flex-col gap-0.5">
-                        <span>{language.t("workspace.new")}</span>
-                        <span class="font-[440] text-v2-text-text-muted">
-                          {language.t("session.new.workspace.new.tooltip")}
-                        </span>
-                      </span>
-                    }
-                    class="min-w-0 flex-1"
-                  >
-                    <span class="min-w-0 truncate">{language.t("workspace.new")}</span>
-                  </TooltipV2>
-                  <Show when={selected() === "create"}>
-                    <Icon name="check" size="small" class="shrink-0" />
-                  </Show>
-                </MenuV2.Item>
-              </MenuV2.Group>
-              <Show
-                when={props.workspaces.length > 0}
-                fallback={
-                  <>
-                    <MenuV2.Separator class="h-[0.5px]" />
-                    <MenuV2.Item onSelect={() => (pending = { type: "viewAll" })}>
-                      <span class="min-w-0 flex-1 truncate">{language.t("common.viewAll")}</span>
-                    </MenuV2.Item>
-                  </>
-                }
-              >
-                <MenuV2.Separator class="h-[0.5px]" />
-                <MenuV2.Sub
-                  gutter={0}
-                  overlap
-                  overflowPadding={8}
-                  onOpenChange={(open) => {
-                    if (!open) {
-                      focusSearch = false
-                      return
-                    }
-                    if (!focusSearch || props.workspaces.length < 10) return
-                    focusSearch = false
-                    requestAnimationFrame(() => searchInput?.focus())
-                  }}
-                >
-                  <MenuV2.SubTrigger
-                    onKeyDown={(event) => {
-                      if (
-                        event.key === "ArrowRight" ||
-                        event.key === "ArrowLeft" ||
-                        event.key === "Enter" ||
-                        event.key === " "
-                      )
-                        focusSearch = true
-                    }}
-                  >
-                    <Icon name="workspace-isolated" />
-                    <span class="min-w-0 flex-1 truncate">
-                      {language.t("session.new.workspace.existing").replace(/(…|\.{3})$/, "")}
-                    </span>
-                  </MenuV2.SubTrigger>
-                  <MenuV2.Portal>
-                    <MenuV2.SubContent class="max-h-[calc(100dvh-16px)] w-[200px] overflow-y-auto">
-                      <Show when={props.workspaces.length >= 10}>
-                        <div class="flex h-7 items-center gap-2 rounded-sm ps-3 pe-2 text-v2-icon-icon-muted">
-                          <Icon name="magnifying-glass" size="small" class="shrink-0" />
-                          <input
-                            ref={(element) => {
-                              searchInput = element
-                            }}
-                            value={search()}
-                            placeholder={language.t("session.new.workspace.search.placeholder")}
-                            aria-label={language.t("session.new.workspace.search.placeholder")}
-                            class="h-7 min-w-0 flex-1 border-0 bg-transparent text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-base outline-none placeholder:text-v2-text-text-faint"
-                            onInput={(event) => setSearch(event.currentTarget.value)}
-                            onKeyDown={(event) => {
-                              if (
-                                event.key === "Escape" ||
-                                event.key === "ArrowDown" ||
-                                event.key === "ArrowUp" ||
-                                event.key === "Enter"
-                              )
-                                return
-                              event.stopPropagation()
-                            }}
-                          />
-                        </div>
-                      </Show>
-                      <For each={workspaces()}>
-                        {(workspace) => (
-                          <MenuV2.Item onSelect={() => select(workspace)}>
-                            <Icon name="workspace-isolated" />
-                            <span class="min-w-0 flex-1 truncate">{getFilename(workspace)}</span>
-                            <Show when={selected() === workspace}>
-                              <Icon name="check" size="small" class="shrink-0" />
-                            </Show>
-                          </MenuV2.Item>
-                        )}
-                      </For>
-                      <MenuV2.Separator class="h-[0.5px]" />
-                      <MenuV2.Item onSelect={() => (pending = { type: "viewAll" })}>
-                        <span class="min-w-0 flex-1 truncate">{language.t("common.viewAll")}</span>
-                      </MenuV2.Item>
-                    </MenuV2.SubContent>
-                  </MenuV2.Portal>
-                </MenuV2.Sub>
-              </Show>
-            </MenuV2.Content>
-          </MenuV2.Portal>
-        </MenuV2>
-      </TooltipV2>
-      <PromptGitStatus branch={props.branch} from={selected() === "create"} class="ms-1" />
+          </MenuV2.Content>
+        </MenuV2.Portal>
+      </MenuV2>
+      <PromptGitStatus branch={props.branch} />
     </>
   )
 }
 
-export function PromptGitStatus(props: { branch?: string; noGit?: boolean; from?: boolean; class?: string }) {
+export function PromptGitStatus(props: { branch?: string; noGit?: boolean }) {
   const language = useLanguage()
   const label = () => {
     if (props.noGit) return language.t("session.new.git.none")
-    if (!props.branch) return undefined
-    if (props.from) return language.t("session.new.workspace.fromBranch", { branch: props.branch })
     return props.branch
   }
 
-  const icon = () => {
-    if (props.noGit) return "monitor"
-    if (props.from) return "branch-out"
-    return "branch"
-  }
-
   return (
     <Show when={label()}>
       {(value) => (
-        <TooltipV2
-          placement="top"
-          value={value()}
-          class={`min-w-0 max-w-[220px] ${props.class ?? ""}`}
-          contentClass="max-w-[calc(100vw-32px)] break-all"
-        >
-          <div class="flex h-6 min-w-0 max-w-[220px] items-center gap-1.5 rounded-full bg-v2-background-bg-layer-02 px-2.5 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-faint">
-            <Icon name={icon()} size="small" class="shrink-0 text-v2-icon-icon-muted" />
-            <span class="min-w-0 truncate">{value()}</span>
-          </div>
-        </TooltipV2>
+        <>
+          <span class="hidden select-none opacity-50 sm:inline mx-1">/</span>
+          <TooltipV2
+            placement="top"
+            value={value()}
+            class="min-w-0 max-w-[220px]"
+            contentClass="max-w-[calc(100vw-32px)] break-all"
+          >
+            <div class="flex h-7 min-w-0 max-w-[220px] items-center gap-1.5 px-2 text-[13px] font-[440] leading-5 tracking-[-0.04px]">
+              <Icon name="branch" size="small" class="shrink-0 text-v2-icon-icon-muted" />
+              <span class="min-w-0 truncate">{value()}</span>
+            </div>
+          </TooltipV2>
+        </>
       )}
     </Show>
   )

packages/app/src/components/provider-connection-controller.ts

@@ -27,8 +27,8 @@ export function createProviderConnectionController(options: {
   const [integration] = createResource(
     () => ({ provider: options.provider(), directory: options.directory() }),
     (input) =>
-      serverSDK.api.integration
-        .get({ integrationID: input.provider, location: location() })
+      serverSDK()
+        .api.integration.get({ integrationID: input.provider, location: location() })
         .then((result) => result.data),
   )
   const methods = createMemo<ProviderConnectMethod[]>(() => {
@@ -120,14 +120,14 @@ export function createProviderConnectionController(options: {
     cancelPolling()
     const directory = options.directory()
     await queryClient
-      .refetchQueries(serverSync.queryOptions.providers(directory ? pathKey(directory) : null))
+      .refetchQueries(serverSync().queryOptions.providers(directory ? pathKey(directory) : null))
       .catch(() => undefined)
     if (polling.disposed) return
     options.onComplete()
   }
   const poll = async (authorization: Authorization, generation: number) => {
-    const result = await serverSDK.api.integration.oauth
-      .status({
+    const result = await serverSDK()
+      .api.integration.oauth.status({
         integrationID: options.provider(),
         attemptID: authorization.attemptID,
         location: location(),
@@ -175,8 +175,8 @@ export function createProviderConnectionController(options: {
       return
     }
     dispatch({ type: "auth.pending" })
-    const result = await serverSDK.api.integration.oauth
-      .connect({
+    const result = await serverSDK()
+      .api.integration.oauth.connect({
         integrationID: options.provider(),
         methodID: selected.id,
         ...(answer ? { answer } : {}),
@@ -197,7 +197,7 @@ export function createProviderConnectionController(options: {
     dispatch({ type: "method.reset" })
   }
   const connectKey = async (key: string) => {
-    await serverSDK.api.integration.connect.key({
+    await serverSDK().api.integration.connect.key({
       integrationID: options.provider(),
       location: location(),
       key,
@@ -208,8 +208,8 @@ export function createProviderConnectionController(options: {
   const completeCode = async (code: string) => {
     const authorization = store.authorization
     if (!authorization) return language.t("provider.connect.oauth.code.invalid")
-    const result = await serverSDK.api.integration.oauth
-      .complete({
+    const result = await serverSDK()
+      .api.integration.oauth.complete({
         integrationID: options.provider(),
         attemptID: authorization.attemptID,
         location: location(),
@@ -238,7 +238,6 @@ export function createProviderConnectionController(options: {
 
   return {
     loading: () => integration.loading,
-    integration: () => integration.latest,
     methods,
     currentMethod,
     methodIndex: () => store.methodIndex,

packages/app/src/components/server/server-management-controller.ts

@@ -3,7 +3,7 @@ import { createMemo, createResource } from "solid-js"
 import { useGlobal } from "@/context/global"
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
-import { ServerConnection, useServers } from "@/context/servers"
+import { ServerConnection, useServer } from "@/context/server"
 import { useSettings } from "@/context/settings"
 import { useTabs } from "@/context/tabs"
 import { type ServerHealth } from "@/utils/server-health"
@@ -49,7 +49,7 @@ function useDefaultServer() {
 }
 
 export function useServerActionsController() {
-  const server = useServers()
+  const server = useServer()
   const tabs = useTabs()
   const platform = usePlatform()
   const language = useLanguage()
@@ -72,16 +72,28 @@ export function useServerActionsController() {
 export type ServerActionsController = ReturnType<typeof useServerActionsController>
 
 export function useServerCollectionController() {
-  const server = useServers()
+  const server = useServer()
   const global = useGlobal()
   const settings = useSettings()
   const actions = useServerActionsController()
 
-  const items = createMemo(() => server.list)
+  const items = createMemo(() => {
+    const current = server.current
+    const list = server.list
+    if (!current) return list
+    if (!list.includes(current)) return [current, ...list]
+    return [current, ...list.filter((item) => item !== current)]
+  })
+  const current = createMemo<ServerConnection.Any | undefined>(() =>
+    settings.general.newLayoutDesigns()
+      ? undefined
+      : (items().find((item) => ServerConnection.key(item) === server.key) ?? items()[0]),
+  )
   const sorted = createMemo(() => {
     const raw = items()
     const list = raw
     if (!list.length) return list
+    const active = current()
     const order = new Map(list.map((item, index) => [item, index] as const))
     const rank = (value?: ServerHealth) => {
       if (value?.healthy === true) return 0
@@ -89,6 +101,8 @@ export function useServerCollectionController() {
       return 1
     }
     return list.slice().sort((a, b) => {
+      if (a === active) return -1
+      if (b === active) return 1
       const diff =
         rank(global.servers.health[ServerConnection.key(a)]) - rank(global.servers.health[ServerConnection.key(b)])
       if (diff !== 0) return diff
@@ -99,6 +113,7 @@ export function useServerCollectionController() {
   return {
     collection: {
       items: sorted,
+      current,
       health: () => global.servers.health,
     },
     ...actions,
@@ -106,3 +121,21 @@ export function useServerCollectionController() {
 }
 
 export type ServerCollectionController = ReturnType<typeof useServerCollectionController>
+
+export function useServerDomainController(options: { onSelect?: () => void } = {}) {
+  const navigate = useNavigate()
+  const server = useServer()
+  const global = useGlobal()
+  const collection = useServerCollectionController()
+
+  const select = async (connection: ServerConnection.Any) => {
+    if (global.servers.health[ServerConnection.key(connection)]?.healthy === false) return
+    options.onSelect?.()
+    navigate("/")
+    queueMicrotask(() => server.setActive(ServerConnection.key(connection)))
+  }
+
+  return { ...collection, selection: { select } }
+}
+
+export type ServerDomainController = ReturnType<typeof useServerDomainController>

packages/app/src/components/server/server-management.test.ts

@@ -1,5 +1,5 @@
 import { describe, expect, test } from "bun:test"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 import { createServerHealthPreview, replaceServerConnection, type ServerFormValues } from "./server-management"
 
 function deferred<T>() {
@@ -65,17 +65,20 @@ describe("replaceServerConnection", () => {
     const calls: string[] = []
 
     replaceServerConnection(ServerConnection.key(original), next, {
+      active: () => ServerConnection.key(original),
       removeTabs: (key) => calls.push(`tabs:${key}`),
       add: (server) => {
         calls.push(`add:${ServerConnection.key(server)}`)
         return server
       },
+      setActive: (key) => calls.push(`active:${key}`),
       remove: (key) => calls.push(`remove:${key}`),
     })
 
     expect(calls).toEqual([
       "tabs:https://old.example.com",
       "add:https://new.example.com",
+      "active:https://new.example.com",
       "remove:https://old.example.com",
     ])
   })
@@ -84,8 +87,10 @@ describe("replaceServerConnection", () => {
     const removed: ServerConnection.Key[] = []
 
     replaceServerConnection(ServerConnection.key(original), next, {
+      active: () => ServerConnection.key(original),
       removeTabs: () => {},
       add: () => undefined,
+      setActive: () => {},
       remove: (key) => removed.push(key),
     })
 

packages/app/src/components/server/server-management.ts

@@ -1,4 +1,4 @@
-import { normalizeServerUrl, ServerConnection } from "@/context/servers"
+import { normalizeServerUrl, ServerConnection } from "@/context/server"
 import type { ServerHealth } from "@/utils/server-health"
 
 export type ServerFormValues = {
@@ -42,13 +42,18 @@ export function replaceServerConnection(
   originalKey: ServerConnection.Key,
   next: ServerConnection.Http,
   operations: {
+    active: () => ServerConnection.Key | undefined
     removeTabs: (key: ServerConnection.Key) => void
     add: (server: ServerConnection.Http) => ServerConnection.Any | undefined
+    setActive: (key: ServerConnection.Key) => void
     remove: (key: ServerConnection.Key) => void
   },
 ) {
+  const active = operations.active()
   operations.removeTabs(originalKey)
   const added = operations.add(next)
   if (!added) return
+  const nextActive = active === originalKey ? ServerConnection.key(added) : active
+  if (nextActive) operations.setActive(nextActive)
   operations.remove(originalKey)
 }

packages/app/src/components/server/server-row-menu.tsx

@@ -4,7 +4,7 @@ import { MenuV2 } from "@opencode-ai/ui/v2/menu-v2"
 import { type Component, Show } from "solid-js"
 import type { ServerActionsController } from "@/components/server/server-management-controller"
 import { useLanguage } from "@/context/language"
-import { ServerConnection } from "@/context/servers"
+import { ServerConnection } from "@/context/server"
 
 export const ServerRowMenu: Component<{
   server: ServerConnection.Any

packages/app/src/components/server/server-row.tsx

@@ -11,7 +11,7 @@ import {
   Show,
 } from "solid-js"
 import { useLanguage } from "@/context/language"
-import { type ServerConnection, serverName } from "@/context/servers"
+import { type ServerConnection, serverName } from "@/context/server"
 import type { ServerHealth } from "@/utils/server-health"
 
 interface ServerRowProps extends ParentProps {
@@ -96,16 +96,13 @@ export function ServerRow(props: ServerRowProps) {
             {(conn) => (
               <div class="flex flex-row gap-3">
                 <span>
-                  <Show
-                    when={conn().http.username}
-                    fallback={<span class="text-text-weaker">{language.t("server.row.noUsername")}</span>}
-                  >
+                  {conn().http.username ? (
                     <span class="text-text-weak">{conn().http.username}</span>
-                  </Show>
+                  ) : (
+                    <span class="text-text-weaker">{language.t("server.row.noUsername")}</span>
+                  )}
                 </span>
-                <Show when={conn().http.password}>
-                  <span class="text-text-weak">••••••••</span>
-                </Show>
+                {conn().http.password && <span class="text-text-weak">••••••••</span>}
               </div>
             )}
           </Show>

packages/app/src/components/session-context-usage.tsx

@@ -39,7 +39,8 @@ function openSessionContext(args: {
 }) {
   args.view.reviewPanel.open(args.view.reviewPanel.opened() ? "other" : "context-button")
   if (args.layout.fileTree.opened() && args.layout.fileTree.tab() !== "all") args.layout.fileTree.setTab("all")
-  void args.tabs.open("context").then(() => args.tabs.setActive("context"))
+  void args.tabs.open("context")
+  args.tabs.setActive("context")
 }
 
 export function SessionContextUsage(props: SessionContextUsageProps) {

packages/app/src/components/session-workspace-menu.tsx

@@ -1,136 +0,0 @@
-import { MenuV2 } from "@opencode-ai/ui/v2/menu-v2"
-import { Icon } from "@opencode-ai/ui/v2/icon"
-import { getDirectory, getFilename } from "@opencode-ai/core/util/path"
-import { createStore } from "solid-js/store"
-import { createSignal, For, Show, type ComponentProps, type JSX } from "solid-js"
-import type { Project } from "@/types"
-import { useLanguage } from "@/context/language"
-import { useServerSDK } from "@/context/server-sdk"
-import { useServerSync } from "@/context/server-sync"
-import { useSettingsDialog } from "@/components/settings-dialog"
-import { pathKey } from "@/utils/path-key"
-import { showToast } from "@/utils/toast"
-import { containsDirectory, sameDirectory, workspaceDirectories } from "@/utils/workspace"
-
-export function SessionWorkspaceMenu(props: {
-  eligible?: boolean
-  sessionID: string
-  project: Project
-  directory: string
-  placement?: ComponentProps<typeof MenuV2>["placement"]
-  gutter?: number
-  class?: string
-  contentClass?: string
-  children: JSX.Element
-  onOpenChange?: (open: boolean) => void
-}) {
-  const language = useLanguage()
-  const serverSDK = useServerSDK()
-  const serverSync = useServerSync()
-  const openWorkspaces = useSettingsDialog("workspaces")
-  const [store, setStore] = createStore({ selected: undefined as string | undefined })
-  const [directories, setDirectories] = createSignal(workspaceDirectories(props.project))
-  const blocked = () => props.eligible === false || serverSync.session.data.session_working(props.sessionID)
-  const currentWorkspace = () => directories().find((workspace) => containsDirectory(workspace, props.directory))
-  const workspaces = () =>
-    directories().filter((workspace) => pathKey(workspace) !== pathKey(currentWorkspace() ?? props.directory))
-  const onOpenChange = (open: boolean) => {
-    props.onOpenChange?.(open)
-    if (!open) return
-    const sdk = serverSDK
-    void sdk.api.worktree
-      .refresh({ projectID: props.project.id })
-      .then(() => sdk.api.worktree.list({ projectID: props.project.id }))
-      .then((items) =>
-        setDirectories(
-          items.map((item) => item.directory).filter((directory) => !sameDirectory(props.project.worktree, directory)),
-        ),
-      )
-      .catch(() => undefined)
-  }
-  const move = async (selection: "create" | string) => {
-    if (store.selected || blocked()) return
-    const sdk = serverSDK
-    const sessionID = props.sessionID
-    setStore("selected", selection)
-
-    try {
-      const destination = selection === "create" ? await createWorkspace(props.project, sdk) : selection
-      if (!destination) return
-
-      await sdk.api.session.move({ sessionID, directory: destination })
-    } catch (error) {
-      showToast({
-        variant: "error",
-        title: language.t("workspace.move.failed"),
-        description: error instanceof Error ? error.message : language.t("common.requestFailed"),
-      })
-    } finally {
-      setStore("selected", undefined)
-    }
-  }
-
-  return (
-    <MenuV2
-      placement={props.placement ?? "bottom-end"}
-      gutter={props.gutter ?? 4}
-      modal={false}
-      onOpenChange={onOpenChange}
-    >
-      <MenuV2.Trigger class={props.class} disabled={blocked()}>
-        {props.children}
-      </MenuV2.Trigger>
-      <MenuV2.Portal>
-        <MenuV2.Content class={`w-[200px] ${props.contentClass ?? ""}`}>
-          <MenuV2.Group>
-            <MenuV2.GroupLabel>{language.t("workspace.move.menu.title")}</MenuV2.GroupLabel>
-            <Show when={pathKey(props.directory) !== pathKey(props.project.worktree)}>
-              <MenuV2.Item disabled={!!store.selected || blocked()} onSelect={() => void move(props.project.worktree)}>
-                <Icon name="monitor" />
-                {language.t("session.new.workspace.local")}
-              </MenuV2.Item>
-            </Show>
-            <MenuV2.Item disabled={!!store.selected || blocked()} onSelect={() => void move("create")}>
-              <Icon name="workspace-new" />
-              {language.t("workspace.new")}
-            </MenuV2.Item>
-            <Show when={workspaces().length > 0}>
-              <MenuV2.Sub gutter={0} overlap overflowPadding={8}>
-                <MenuV2.SubTrigger>
-                  <Icon name="workspace-isolated" />
-                  {language.t("session.new.workspace.existing").replace(/(…|\.{3})$/, "")}
-                </MenuV2.SubTrigger>
-                <MenuV2.Portal>
-                  <MenuV2.SubContent class="max-h-[calc(100dvh-16px)] w-[200px] overflow-y-auto">
-                    <For each={workspaces()}>
-                      {(workspace) => (
-                        <MenuV2.Item disabled={!!store.selected || blocked()} onSelect={() => void move(workspace)}>
-                          <Icon name="workspace-isolated" />
-                          <span class="min-w-0 flex-1 truncate">{getFilename(workspace)}</span>
-                        </MenuV2.Item>
-                      )}
-                    </For>
-                  </MenuV2.SubContent>
-                </MenuV2.Portal>
-              </MenuV2.Sub>
-            </Show>
-          </MenuV2.Group>
-          <MenuV2.Separator class="h-[0.5px] bg-v2-border-border-base" />
-          <MenuV2.Item onSelect={() => openWorkspaces()}>
-            <span class="min-w-0 flex-1 truncate">{language.t("common.viewAll")}</span>
-          </MenuV2.Item>
-        </MenuV2.Content>
-      </MenuV2.Portal>
-    </MenuV2>
-  )
-}
-
-async function createWorkspace(project: Project, serverSDK: ReturnType<typeof useServerSDK>) {
-  const created = await serverSDK.api.worktree.create({
-    projectID: project.id,
-    strategy: "git",
-    directory: getDirectory(project.worktree),
-  })
-  await serverSDK.api.location.get({ location: { directory: created.directory } })
-  return created.directory
-}

packages/app/src/components/session/open-in-app.tsx

@@ -2,9 +2,9 @@ import { createEffect, createMemo } from "solid-js"
 import { createStore } from "solid-js/store"
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
+import { useServer } from "@/context/server"
 import { Persist, persisted } from "@/utils/persist"
 import { showToast } from "@/utils/toast"
-import { useServer } from "@/context/server"
 
 export const OPEN_APPS = [
   "vscode",
@@ -169,7 +169,7 @@ export function useOpenInApp(input: { directory: () => string }) {
     app: undefined as OpenApp | undefined,
   })
 
-  const canOpen = createMemo(() => platform.platform === "desktop" && !!platform.openPath && server.isLocal)
+  const canOpen = createMemo(() => platform.platform === "desktop" && !!platform.openPath && server.isLocal())
   const current = createMemo(
     () =>
       options().find((o) => o.id === prefs.app) ??

packages/app/src/components/session/session-header.tsx

@@ -1,12 +1,32 @@
-import { Tooltip } from "@opencode-ai/ui/tooltip"
-import { createMemo, Show } from "solid-js"
+import { AppIcon } from "@opencode-ai/ui/app-icon"
+import { Button } from "@opencode-ai/ui/button"
+import { DropdownMenu } from "@opencode-ai/ui/dropdown-menu"
+import { Icon } from "@opencode-ai/ui/icon"
+import { IconButton } from "@opencode-ai/ui/icon-button"
+import { Keybind } from "@opencode-ai/ui/keybind"
+import { Spinner } from "@opencode-ai/ui/spinner"
+import { showToast } from "@/utils/toast"
+import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
+import { getFilename } from "@opencode-ai/core/util/path"
+import { createEffect, createMemo, createSignal, For, onMount, Show } from "solid-js"
+import { createStore } from "solid-js/store"
 import { createMediaQuery } from "@solid-primitives/media"
 import { Portal } from "solid-js/web"
 import { useCommand } from "@/context/command"
 import { useLanguage } from "@/context/language"
+import { useLayout } from "@/context/layout"
+import { usePlatform } from "@/context/platform"
+import { useServer } from "@/context/server"
 import { useSettings } from "@/context/settings"
+import { useSync } from "@/context/sync"
+import { useTerminal } from "@/context/terminal"
+import { focusTerminalById } from "@/pages/session/helpers"
 import { useSessionLayout } from "@/pages/session/session-layout"
-import { StatusPopoverV2 } from "../status-popover"
+import { messageAgentColor } from "@/utils/agent"
+import { decode64 } from "@/utils/base64"
+import { fileManagerApp } from "@/utils/file-manager"
+import { Persist, persisted } from "@/utils/persist"
+import { StatusPopover, StatusPopoverV2 } from "../status-popover"
 import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
 import { Icon as IconV2 } from "@opencode-ai/ui/v2/icon"
 import { KeybindV2 } from "@opencode-ai/ui/v2/keybind-v2"
@@ -14,15 +34,206 @@ import { TooltipV2 } from "@opencode-ai/ui/v2/tooltip-v2"
 import { reviewTooltipKeybind } from "../command-tooltip-keybind"
 import { useTitlebarRightMount } from "../titlebar"
 
+const OPEN_APPS = [
+  "vscode",
+  "cursor",
+  "zed",
+  "textmate",
+  "antigravity",
+  "finder",
+  "terminal",
+  "iterm2",
+  "ghostty",
+  "warp",
+  "xcode",
+  "android-studio",
+  "powershell",
+  "sublime-text",
+] as const
+
+type OpenApp = (typeof OPEN_APPS)[number]
+type OS = "macos" | "windows" | "linux" | "unknown"
+
+const MAC_APPS = [
+  {
+    id: "vscode",
+    label: "session.header.open.app.vscode",
+    icon: "vscode",
+    openWith: "Visual Studio Code",
+  },
+  { id: "cursor", label: "session.header.open.app.cursor", icon: "cursor", openWith: "Cursor" },
+  { id: "zed", label: "session.header.open.app.zed", icon: "zed", openWith: "Zed" },
+  { id: "textmate", label: "session.header.open.app.textmate", icon: "textmate", openWith: "TextMate" },
+  {
+    id: "antigravity",
+    label: "session.header.open.app.antigravity",
+    icon: "antigravity",
+    openWith: "Antigravity",
+  },
+  { id: "terminal", label: "session.header.open.app.terminal", icon: "terminal", openWith: "Terminal" },
+  { id: "iterm2", label: "session.header.open.app.iterm2", icon: "iterm2", openWith: "iTerm" },
+  { id: "ghostty", label: "session.header.open.app.ghostty", icon: "ghostty", openWith: "Ghostty" },
+  { id: "warp", label: "session.header.open.app.warp", icon: "warp", openWith: "Warp" },
+  { id: "xcode", label: "session.header.open.app.xcode", icon: "xcode", openWith: "Xcode" },
+  {
+    id: "android-studio",
+    label: "session.header.open.app.androidStudio",
+    icon: "android-studio",
+    openWith: "Android Studio",
+  },
+  {
+    id: "sublime-text",
+    label: "session.header.open.app.sublimeText",
+    icon: "sublime-text",
+    openWith: "Sublime Text",
+  },
+] as const
+
+const WINDOWS_APPS = [
+  { id: "vscode", label: "session.header.open.app.vscode", icon: "vscode", openWith: "code" },
+  { id: "cursor", label: "session.header.open.app.cursor", icon: "cursor", openWith: "cursor" },
+  { id: "zed", label: "session.header.open.app.zed", icon: "zed", openWith: "zed" },
+  {
+    id: "powershell",
+    label: "session.header.open.app.powershell",
+    icon: "powershell",
+    openWith: "powershell",
+  },
+  {
+    id: "sublime-text",
+    label: "session.header.open.app.sublimeText",
+    icon: "sublime-text",
+    openWith: "Sublime Text",
+  },
+] as const
+
+const LINUX_APPS = [
+  { id: "vscode", label: "session.header.open.app.vscode", icon: "vscode", openWith: "code" },
+  { id: "cursor", label: "session.header.open.app.cursor", icon: "cursor", openWith: "cursor" },
+  { id: "zed", label: "session.header.open.app.zed", icon: "zed", openWith: "zed" },
+  {
+    id: "sublime-text",
+    label: "session.header.open.app.sublimeText",
+    icon: "sublime-text",
+    openWith: "Sublime Text",
+  },
+] as const
+
+const detectOS = (platform: ReturnType<typeof usePlatform>): OS => {
+  if (platform.platform === "desktop" && platform.os) return platform.os
+  if (typeof navigator !== "object") return "unknown"
+  const value = navigator.platform || navigator.userAgent
+  if (/Mac/i.test(value)) return "macos"
+  if (/Win/i.test(value)) return "windows"
+  if (/Linux/i.test(value)) return "linux"
+  return "unknown"
+}
+
+const showRequestError = (language: ReturnType<typeof useLanguage>, err: unknown) => {
+  showToast({
+    variant: "error",
+    title: language.t("common.requestFailed"),
+    description: err instanceof Error ? err.message : String(err),
+  })
+}
+
 export function SessionHeader() {
+  const layout = useLayout()
   const command = useCommand()
+  const server = useServer()
+  const platform = usePlatform()
   const language = useLanguage()
   const settings = useSettings()
-  const { view } = useSessionLayout()
+  const sync = useSync()
+  const terminal = useTerminal()
+  const { params, view } = useSessionLayout()
 
+  const projectDirectory = createMemo(() => decode64(params.dir) ?? "")
+  const project = createMemo(() => {
+    const directory = projectDirectory()
+    if (!directory) return
+    return layout.projects.list().find((p) => p.worktree === directory || p.sandboxes?.includes(directory))
+  })
+  const name = createMemo(() => {
+    const current = project()
+    if (current) return current.name || getFilename(current.worktree)
+    return getFilename(projectDirectory())
+  })
+  const hotkey = createMemo(() => command.keybind("file.open"))
+  const os = createMemo(() => detectOS(platform))
+  const isV2 = settings.general.newLayoutDesigns
+  const search = settings.visibility.search
   const status = settings.visibility.status
   const isDesktop = createMediaQuery("(min-width: 768px)")
 
+  const [exists, setExists] = createStore<Partial<Record<OpenApp, boolean>>>({
+    finder: true,
+  })
+
+  const apps = createMemo(() => {
+    if (os() === "macos") return MAC_APPS
+    if (os() === "windows") return WINDOWS_APPS
+    return LINUX_APPS
+  })
+
+  const fileManager = createMemo(() => fileManagerApp(os()))
+
+  createEffect(() => {
+    if (platform.platform !== "desktop") return
+    if (!platform.checkAppExists) return
+
+    const list = apps()
+
+    setExists(Object.fromEntries(list.map((app) => [app.id, undefined])) as Partial<Record<OpenApp, boolean>>)
+
+    void Promise.all(
+      list.map((app) =>
+        Promise.resolve(platform.checkAppExists?.(app.openWith))
+          .then((value) => Boolean(value))
+          .catch(() => false)
+          .then((ok) => [app.id, ok] as const),
+      ),
+    ).then((entries) => {
+      setExists(Object.fromEntries(entries) as Partial<Record<OpenApp, boolean>>)
+    })
+  })
+
+  const options = createMemo(() => {
+    return [
+      { id: "finder", label: language.t(fileManager().label), icon: fileManager().icon },
+      ...apps()
+        .filter((app) => exists[app.id])
+        .map((app) => ({ ...app, label: language.t(app.label) })),
+    ] as const
+  })
+
+  const toggleTerminal = () => {
+    const next = !view().terminal.opened()
+    view().terminal.toggle()
+    if (!next) return
+
+    const id = terminal.active()
+    if (!id) return
+    focusTerminalById(id)
+  }
+
+  const [prefs, setPrefs] = persisted(Persist.global("open.app"), createStore({ app: "finder" as OpenApp }))
+  const [menu, setMenu] = createStore({ open: false })
+  const [openRequest, setOpenRequest] = createStore({
+    app: undefined as OpenApp | undefined,
+  })
+
+  const canOpen = createMemo(() => platform.platform === "desktop" && !!platform.openPath && server.isLocal())
+  const current = createMemo(
+    () =>
+      options().find((o) => o.id === prefs.app) ??
+      options()[0] ??
+      ({ id: "finder", label: fileManager().label, icon: fileManager().icon } as const),
+  )
+  const opening = createMemo(() => openRequest.app !== undefined)
+  const tint = createMemo(() =>
+    messageAgentColor(params.id ? sync().data.message[params.id] : undefined, sync().data.agent),
+  )
   const v2ActionsState = createMemo<SessionHeaderV2ActionsState>(() => ({
     statusVisible: status(),
     statusLabel: language.t("status.popover.trigger"),
@@ -33,16 +244,275 @@ export function SessionHeader() {
     onReviewToggle: () => view().reviewPanel.toggle(),
   }))
 
+  const selectApp = (app: OpenApp) => {
+    if (!options().some((item) => item.id === app)) return
+    setPrefs("app", app)
+  }
+
+  const openDir = (app: OpenApp) => {
+    if (opening() || !canOpen() || !platform.openPath) return
+    const directory = projectDirectory()
+    if (!directory) return
+
+    const item = options().find((o) => o.id === app)
+    const openWith = item && "openWith" in item ? item.openWith : undefined
+    setOpenRequest("app", app)
+    platform
+      .openPath(directory, openWith)
+      .catch((err: unknown) => showRequestError(language, err))
+      .finally(() => {
+        setOpenRequest("app", undefined)
+      })
+  }
+
+  const copyPath = () => {
+    const directory = projectDirectory()
+    if (!directory) return
+    navigator.clipboard
+      .writeText(directory)
+      .then(() => {
+        showToast({
+          variant: "success",
+          icon: "circle-check",
+          title: language.t("session.share.copy.copied"),
+          description: directory,
+        })
+      })
+      .catch((err: unknown) => showRequestError(language, err))
+  }
+
+  const [centerMount, setCenterMount] = createSignal<HTMLElement | null>(null)
   const rightMount = useTitlebarRightMount()
+  onMount(() => {
+    setCenterMount(document.getElementById("opencode-titlebar-center"))
+  })
 
   return (
-    <Show when={rightMount()} keyed>
-      {(mount) => (
-        <Portal mount={mount}>
-          <SessionHeaderV2Actions state={v2ActionsState()} />
-        </Portal>
-      )}
-    </Show>
+    <>
+      <Show when={search() && centerMount()} keyed>
+        {(mount) => (
+          <Portal mount={mount}>
+            <Button
+              type="button"
+              variant="ghost"
+              size="small"
+              class="hidden md:flex w-[240px] max-w-full min-w-0 items-center gap-2 justify-between rounded-md border border-border-weak-base bg-surface-panel shadow-none cursor-default"
+              onClick={() => command.trigger("file.open")}
+              aria-label={language.t("session.header.searchFiles")}
+            >
+              <div class="flex min-w-0 flex-1 items-center overflow-visible">
+                <span class="flex-1 min-w-0 text-12-regular text-text-weak truncate text-left">
+                  {language.t("session.header.search.placeholder", {
+                    project: name(),
+                  })}
+                </span>
+              </div>
+
+              <Show when={hotkey()} keyed>
+                {(keybind) => (
+                  <Keybind class="shrink-0 !border-0 !bg-transparent !shadow-none px-0 text-text-weaker">
+                    {keybind}
+                  </Keybind>
+                )}
+              </Show>
+            </Button>
+          </Portal>
+        )}
+      </Show>
+      <Show when={rightMount()} keyed>
+        {(mount) => (
+          <Portal mount={mount}>
+            <Show
+              when={isV2}
+              fallback={
+                <div class="flex items-center gap-2">
+                  <Show when={projectDirectory()}>
+                    <div class="hidden xl:flex items-center">
+                      <Show
+                        when={canOpen()}
+                        fallback={
+                          <div class="flex h-[24px] box-border items-center rounded-md border border-border-weak-base bg-surface-panel overflow-hidden">
+                            <Button
+                              variant="ghost"
+                              class="rounded-none h-full py-0 pr-3 pl-0.5 gap-1.5 border-none shadow-none"
+                              onClick={copyPath}
+                              aria-label={language.t("session.header.open.copyPath")}
+                            >
+                              <Icon name="copy" size="small" class="text-icon-base" />
+                              <span class="text-12-regular text-text-strong">
+                                {language.t("session.header.open.copyPath")}
+                              </span>
+                            </Button>
+                          </div>
+                        }
+                      >
+                        <div class="flex items-center">
+                          <div class="flex h-[24px] box-border items-center rounded-md border border-border-weak-base bg-surface-panel overflow-hidden">
+                            <Button
+                              variant="ghost"
+                              class="rounded-none h-full px-0.5 border-none shadow-none disabled:!cursor-default"
+                              classList={{
+                                "bg-surface-raised-base-active": opening(),
+                              }}
+                              onClick={() => openDir(current().id)}
+                              disabled={opening()}
+                              aria-label={language.t("session.header.open.ariaLabel", { app: current().label })}
+                            >
+                              <div class="flex size-5 shrink-0 items-center justify-center [&_[data-component=app-icon]]:size-5">
+                                <Show when={opening()} fallback={<AppIcon id={current().icon} />}>
+                                  <Spinner class="size-3.5" style={{ color: tint() ?? "var(--icon-base)" }} />
+                                </Show>
+                              </div>
+                            </Button>
+                            <DropdownMenu
+                              gutter={4}
+                              placement="bottom-end"
+                              open={menu.open}
+                              onOpenChange={(open) => setMenu("open", open)}
+                            >
+                              <DropdownMenu.Trigger
+                                as={IconButton}
+                                icon="chevron-down"
+                                variant="ghost"
+                                disabled={opening()}
+                                class="rounded-none h-full w-[20px] p-0 border-none shadow-none data-[expanded]:bg-surface-raised-base-active disabled:!cursor-default"
+                                classList={{
+                                  "bg-surface-raised-base-active": opening(),
+                                }}
+                                aria-label={language.t("session.header.open.menu")}
+                              />
+                              <DropdownMenu.Portal>
+                                <DropdownMenu.Content class="[&_[data-slot=dropdown-menu-item]]:pl-1 [&_[data-slot=dropdown-menu-radio-item]]:pl-1 [&_[data-slot=dropdown-menu-radio-item]+[data-slot=dropdown-menu-radio-item]]:mt-1">
+                                  <DropdownMenu.Group>
+                                    <DropdownMenu.GroupLabel class="!px-1 !py-1">
+                                      {language.t("session.header.openIn")}
+                                    </DropdownMenu.GroupLabel>
+                                    <DropdownMenu.RadioGroup
+                                      class="mt-1"
+                                      value={current().id}
+                                      onChange={(value) => {
+                                        if (!OPEN_APPS.includes(value as OpenApp)) return
+                                        selectApp(value as OpenApp)
+                                      }}
+                                    >
+                                      <For each={options()}>
+                                        {(o) => (
+                                          <DropdownMenu.RadioItem
+                                            value={o.id}
+                                            disabled={opening()}
+                                            onSelect={() => {
+                                              setMenu("open", false)
+                                              openDir(o.id)
+                                            }}
+                                          >
+                                            <div class="flex size-5 shrink-0 items-center justify-center [&_[data-component=app-icon]]:size-5">
+                                              <AppIcon id={o.icon} />
+                                            </div>
+                                            <DropdownMenu.ItemLabel>{o.label}</DropdownMenu.ItemLabel>
+                                            <DropdownMenu.ItemIndicator>
+                                              <Icon name="check-small" size="small" class="text-icon-weak" />
+                                            </DropdownMenu.ItemIndicator>
+                                          </DropdownMenu.RadioItem>
+                                        )}
+                                      </For>
+                                    </DropdownMenu.RadioGroup>
+                                  </DropdownMenu.Group>
+                                  <DropdownMenu.Separator />
+                                  <DropdownMenu.Item
+                                    onSelect={() => {
+                                      setMenu("open", false)
+                                      copyPath()
+                                    }}
+                                  >
+                                    <div class="flex size-5 shrink-0 items-center justify-center">
+                                      <Icon name="copy" size="small" class="text-icon-weak" />
+                                    </div>
+                                    <DropdownMenu.ItemLabel>
+                                      {language.t("session.header.open.copyPath")}
+                                    </DropdownMenu.ItemLabel>
+                                  </DropdownMenu.Item>
+                                </DropdownMenu.Content>
+                              </DropdownMenu.Portal>
+                            </DropdownMenu>
+                          </div>
+                        </div>
+                      </Show>
+                    </div>
+                  </Show>
+                  <div class="flex items-center gap-1">
+                    <Show when={status()}>
+                      <Tooltip placement="bottom" value={language.t("status.popover.trigger")}>
+                        <StatusPopover />
+                      </Tooltip>
+                    </Show>
+                    <TooltipKeybind
+                      title={language.t("command.terminal.toggle")}
+                      keybind={command.keybind("terminal.toggle")}
+                    >
+                      <Button
+                        variant="ghost"
+                        class="group/terminal-toggle titlebar-icon w-8 h-6 p-0 box-border shrink-0"
+                        onClick={toggleTerminal}
+                        aria-label={language.t("command.terminal.toggle")}
+                        aria-expanded={view().terminal.opened()}
+                        aria-controls="terminal-panel"
+                      >
+                        <Icon size="small" name={view().terminal.opened() ? "terminal-active" : "terminal"} />
+                      </Button>
+                    </TooltipKeybind>
+
+                    <div class="hidden md:flex items-center gap-1 shrink-0">
+                      <TooltipKeybind
+                        title={language.t("command.review.toggle")}
+                        keybind={command.keybind("review.toggle")}
+                      >
+                        <Button
+                          variant="ghost"
+                          class="group/review-toggle titlebar-icon w-8 h-6 p-0 box-border"
+                          onClick={() => view().reviewPanel.toggle()}
+                          aria-label={language.t("command.review.toggle")}
+                          aria-expanded={view().reviewPanel.opened()}
+                          aria-controls="review-panel"
+                        >
+                          <Icon size="small" name={view().reviewPanel.opened() ? "review-active" : "review"} />
+                        </Button>
+                      </TooltipKeybind>
+
+                      <TooltipKeybind
+                        title={language.t("command.fileTree.toggle")}
+                        keybind={command.keybind("fileTree.toggle")}
+                      >
+                        <Button
+                          variant="ghost"
+                          class="titlebar-icon w-8 h-6 p-0 box-border"
+                          onClick={() => layout.fileTree.toggle()}
+                          aria-label={language.t("command.fileTree.toggle")}
+                          aria-expanded={layout.fileTree.opened()}
+                          aria-controls="file-tree-panel"
+                        >
+                          <div class="relative flex items-center justify-center size-4">
+                            <Icon
+                              size="small"
+                              name={layout.fileTree.opened() ? "file-tree-active" : "file-tree"}
+                              classList={{
+                                "text-icon-strong": layout.fileTree.opened(),
+                                "text-icon-weak": !layout.fileTree.opened(),
+                              }}
+                            />
+                          </div>
+                        </Button>
+                      </TooltipKeybind>
+                    </div>
+                  </div>
+                </div>
+              }
+            >
+              <SessionHeaderV2Actions state={v2ActionsState()} />
+            </Show>
+          </Portal>
+        )}
+      </Show>
+    </>
   )
 }
 
@@ -57,6 +527,8 @@ type SessionHeaderV2ActionsState = {
 }
 
 function SessionHeaderV2Actions(props: { state: SessionHeaderV2ActionsState }) {
+  const language = useLanguage()
+
   return (
     <div class="flex items-center gap-2">
       <Show when={props.state.statusVisible}>

packages/app/src/components/session/session-sortable-tab-v2.tsx

@@ -12,7 +12,7 @@ import { FileVisual } from "./session-sortable-tab"
 
 export function SortableTabV2(props: {
   tab: string
-  index: number
+  index: () => number
   temporary?: boolean
   onTabClose: (tab: string) => void
   onTabDoubleClick?: (tab: string) => void
@@ -26,7 +26,7 @@ export function SortableTabV2(props: {
       return props.tab
     },
     get index() {
-      return props.index
+      return props.index()
     },
   })
   const path = createMemo(() => file.pathFromTab(props.tab))

packages/app/src/components/session/session-sortable-terminal-tab-v2.tsx

@@ -14,7 +14,7 @@ import { focusTerminalById } from "@/pages/session/helpers"
 
 export function SortableTerminalTabV2(props: {
   terminal: LocalPTY
-  index: number
+  index: () => number
   newLayout: boolean
   onClose?: () => void
 }): JSX.Element {
@@ -25,7 +25,7 @@ export function SortableTerminalTabV2(props: {
       return props.terminal.id
     },
     get index() {
-      return props.index
+      return props.index()
     },
   })
   const [store, setStore] = createStore({

packages/app/src/components/settings-keybinds.tsx

@@ -1,6 +1,10 @@
-import { For, Show, createMemo, lazy, onCleanup } from "solid-js"
+import { Component, For, Show, createMemo, lazy, onCleanup, onMount } from "solid-js"
 import { createStore } from "solid-js/store"
 import { makeEventListener } from "@solid-primitives/event-listener"
+import { Button } from "@opencode-ai/ui/button"
+import { Icon } from "@opencode-ai/ui/icon"
+import { IconButton } from "@opencode-ai/ui/icon-button"
+import { TextField } from "@opencode-ai/ui/text-field"
 import { ButtonV2 } from "@opencode-ai/ui/v2/button-v2"
 import { IconButtonV2 } from "@opencode-ai/ui/v2/icon-button-v2"
 import { TextInputV2 } from "@opencode-ai/ui/v2/text-input-v2"
@@ -9,6 +13,7 @@ import fuzzysort from "fuzzysort"
 import { DEFAULT_PALETTE_KEYBIND, formatKeybind, parseKeybind, useCommand } from "@/context/command"
 import { useLanguage } from "@/context/language"
 import { useSettings } from "@/context/settings"
+import { SettingsList } from "./settings-list"
 import { SettingsListV2 } from "./settings-v2/parts/list"
 
 const IconV2 = lazy(() => import("@opencode-ai/ui/v2/icon").then((module) => ({ default: module.Icon })))
@@ -196,6 +201,69 @@ function filteredFor(
   return out
 }
 
+function useKeyCapture(input: {
+  active: () => string | null
+  stop: () => void
+  set: (id: string, keybind: string) => void
+  used: () => Map<string, { id: string; title: string }[]>
+  language: ReturnType<typeof useLanguage>
+}) {
+  onMount(() => {
+    const handle = (event: KeyboardEvent) => {
+      const id = input.active()
+      if (!id) return
+
+      event.preventDefault()
+      event.stopPropagation()
+      event.stopImmediatePropagation()
+
+      if (event.key === "Escape") {
+        input.stop()
+        return
+      }
+
+      const clear =
+        (event.key === "Backspace" || event.key === "Delete") &&
+        !event.ctrlKey &&
+        !event.metaKey &&
+        !event.altKey &&
+        !event.shiftKey
+      if (clear) {
+        input.set(id, "none")
+        input.stop()
+        return
+      }
+
+      const next = recordKeybind(event)
+      if (!next) return
+
+      const conflicts = new Map<string, string>()
+      for (const sig of signatures(next)) {
+        for (const item of input.used().get(sig) ?? []) {
+          if (item.id === id) continue
+          conflicts.set(item.id, item.title)
+        }
+      }
+
+      if (conflicts.size > 0) {
+        showToast({
+          title: input.language.t("settings.shortcuts.conflict.title"),
+          description: input.language.t("settings.shortcuts.conflict.description", {
+            keybind: formatKeybind(next, input.language.t),
+            titles: [...conflicts.values()].join(", "),
+          }),
+        })
+        return
+      }
+
+      input.set(id, next)
+      input.stop()
+    }
+
+    makeEventListener(document, "keydown", handle, { capture: true })
+  })
+}
+
 export function createKeybindSettingsController(
   input: {
     command: Pick<CommandContext, "catalog" | "options" | "keybinds">
@@ -342,7 +410,7 @@ export function createKeybindSettingsController(
   }
 }
 
-export function SettingsKeybinds() {
+function SettingsKeybindsV2() {
   const command = useCommand()
   const settings = useSettings()
   const controller = createKeybindSettingsController({
@@ -356,9 +424,9 @@ export function SettingsKeybinds() {
       filtered={controller.catalog.filtered}
       title={controller.catalog.title}
       keybind={controller.catalog.keybind}
-      active={controller.capture.active()}
+      active={controller.capture.active}
       onCapture={controller.capture.toggle}
-      hasOverrides={controller.settings.hasOverrides()}
+      hasOverrides={controller.settings.hasOverrides}
       onReset={controller.settings.reset}
     />
   )
@@ -369,9 +437,9 @@ function SettingsKeybindsV2View(props: {
   filtered: (query: string) => Map<KeybindGroup, string[]>
   title: (id: string) => string
   keybind: (id: string) => string
-  active: string | null
+  active: () => string | null
   onCapture: (id: string) => void
-  hasOverrides: boolean
+  hasOverrides: () => boolean
   onReset: () => void
 }) {
   const language = useLanguage()
@@ -383,11 +451,8 @@ function SettingsKeybindsV2View(props: {
     <>
       <div class="settings-v2-tab-header settings-v2-tab-header--stacked">
         <div class="settings-v2-tab-header-row">
-          <div class="flex flex-col gap-1">
-            <h2 class="settings-v2-tab-title">{language.t("settings.shortcuts.title")}</h2>
-            <span class="text-11-regular text-v2-text-text-muted">{language.t("settings.shortcuts.description")}</span>
-          </div>
-          <ButtonV2 variant="ghost" onClick={props.onReset} disabled={!props.hasOverrides}>
+          <h2 class="settings-v2-tab-title">{language.t("settings.shortcuts.title")}</h2>
+          <ButtonV2 variant="ghost" onClick={props.onReset} disabled={!props.hasOverrides()}>
             {language.t("settings.shortcuts.reset.button")}
           </ButtonV2>
         </div>
@@ -433,12 +498,12 @@ function SettingsKeybindsV2View(props: {
                             data-keybind-id={id}
                             classList={{
                               "settings-v2-keybind-button": true,
-                              "settings-v2-keybind-button--active": props.active === id,
+                              "settings-v2-keybind-button--active": props.active() === id,
                             }}
                             onClick={() => props.onCapture(id)}
                           >
                             <Show
-                              when={props.active === id}
+                              when={props.active() === id}
                               fallback={props.keybind(id) || language.t("settings.shortcuts.unassigned")}
                             >
                               {language.t("settings.shortcuts.pressKeys")}
@@ -463,3 +528,254 @@ function SettingsKeybindsV2View(props: {
     </>
   )
 }
+
+export const SettingsKeybinds: Component<{ v2?: boolean }> = (props) => {
+  if (props.v2) return <SettingsKeybindsV2 />
+
+  const command = useCommand()
+  const language = useLanguage()
+  const settings = useSettings()
+
+  const [store, setStore] = createStore({
+    active: null as string | null,
+    filter: "",
+  })
+
+  const stop = () => {
+    if (!store.active) return
+    setStore("active", null)
+    command.keybinds(true)
+  }
+
+  const start = (id: string) => {
+    if (store.active === id) {
+      stop()
+      return
+    }
+
+    if (store.active) stop()
+
+    setStore("active", id)
+    command.keybinds(false)
+  }
+
+  const map = createMemo(() => keybinds(settings.current.keybinds))
+
+  const hasOverrides = createMemo(() => Object.values(map()).some((x) => typeof x === "string"))
+
+  const resetAll = () => {
+    stop()
+    settings.keybinds.resetAll()
+    showToast({
+      title: language.t("settings.shortcuts.reset.toast.title"),
+      description: language.t("settings.shortcuts.reset.toast.description"),
+    })
+  }
+
+  const list = createMemo(() => {
+    language.locale()
+    return listFor(command, map(), language.t("command.palette"))
+  })
+
+  const title = (id: string) => list().get(id)?.title ?? ""
+
+  const grouped = createMemo(() => groupedFor(list()))
+
+  const filtered = createMemo(() => {
+    return filteredFor(store.filter, list(), grouped(), (id) => command.keybind(id) || "")
+  })
+
+  const hasResults = createMemo(() => {
+    for (const group of GROUPS) {
+      const ids = filtered().get(group) ?? []
+      if (ids.length > 0) return true
+    }
+    return false
+  })
+
+  const used = createMemo(() => {
+    const map = new Map<string, { id: string; title: string }[]>()
+
+    const add = (key: string, value: { id: string; title: string }) => {
+      const list = map.get(key)
+      if (!list) {
+        map.set(key, [value])
+        return
+      }
+      list.push(value)
+    }
+
+    const palette = settings.keybinds.get(PALETTE_ID) ?? DEFAULT_PALETTE_KEYBIND
+    for (const sig of signatures(palette)) {
+      add(sig, { id: PALETTE_ID, title: title(PALETTE_ID) })
+    }
+
+    const valueFor = (id: string) => {
+      const custom = settings.keybinds.get(id)
+      if (typeof custom === "string") return custom
+
+      const live = command.options.find((x) => x.id === id)
+      if (live?.keybind) return live.keybind
+
+      const meta = command.catalog.find((x) => x.id === id)
+      return meta?.keybind
+    }
+
+    for (const id of list().keys()) {
+      if (id === PALETTE_ID) continue
+      for (const sig of signatures(valueFor(id))) {
+        add(sig, { id, title: title(id) })
+      }
+    }
+
+    return map
+  })
+
+  const setKeybind = (id: string, keybind: string) => settings.keybinds.set(id, keybind)
+
+  useKeyCapture({
+    active: () => store.active,
+    stop,
+    set: setKeybind,
+    used,
+    language,
+  })
+
+  onCleanup(() => {
+    if (store.active) command.keybinds(true)
+  })
+
+  const emptyResults = (
+    <Show when={store.filter && !hasResults()}>
+      <div
+        classList={{
+          "flex flex-col items-center justify-center py-12 text-center": !props.v2,
+          "settings-v2-shortcuts-status": props.v2,
+        }}
+      >
+        <span
+          classList={{
+            "text-14-regular text-text-weak": !props.v2,
+          }}
+        >
+          {language.t("settings.shortcuts.search.empty")}
+        </span>
+        <Show when={store.filter}>
+          <span
+            classList={{
+              "text-14-regular text-text-strong mt-1": !props.v2,
+              "settings-v2-shortcuts-status-filter": props.v2,
+            }}
+          >
+            &quot;{store.filter}&quot;
+          </span>
+        </Show>
+      </div>
+    </Show>
+  )
+
+  const List = props.v2 ? SettingsListV2 : SettingsList
+
+  const groups = (
+    <div
+      classList={{
+        "settings-v2-shortcuts flex flex-col gap-8": props.v2,
+        "flex flex-col gap-8 max-w-[720px]": !props.v2,
+      }}
+    >
+      <For each={GROUPS}>
+        {(group) => (
+          <Show when={(filtered().get(group) ?? []).length > 0}>
+            <div
+              classList={{
+                "settings-v2-section": props.v2,
+                "flex flex-col gap-1": !props.v2,
+              }}
+            >
+              <h3
+                classList={{
+                  "settings-v2-section-title": props.v2,
+                  "text-14-medium text-text-strong pb-2": !props.v2,
+                }}
+              >
+                {language.t(groupKey[group])}
+              </h3>
+              <List>
+                <For each={filtered().get(group) ?? []}>
+                  {(id) => (
+                    <div class="flex items-center justify-between gap-4 py-3 border-b border-border-weak-base last:border-none">
+                      <span
+                        classList={{
+                          "text-14-regular text-text-strong": !props.v2,
+                        }}
+                      >
+                        {title(id)}
+                      </span>
+                      <button
+                        type="button"
+                        data-keybind-id={id}
+                        classList={{
+                          "settings-v2-keybind-button": props.v2,
+                          "settings-v2-keybind-button--active": props.v2 && store.active === id,
+                          "h-8 px-3 rounded-md text-12-regular": !props.v2,
+                          "bg-surface-base text-text-subtle hover:bg-surface-raised-base-hover active:bg-surface-raised-base-active":
+                            !props.v2 && store.active !== id,
+                          "border border-border-weak-base bg-surface-inset-base text-text-weak":
+                            !props.v2 && store.active === id,
+                        }}
+                        onClick={() => start(id)}
+                      >
+                        <Show
+                          when={store.active === id}
+                          fallback={command.keybind(id) || language.t("settings.shortcuts.unassigned")}
+                        >
+                          {language.t("settings.shortcuts.pressKeys")}
+                        </Show>
+                      </button>
+                    </div>
+                  )}
+                </For>
+              </List>
+            </div>
+          </Show>
+        )}
+      </For>
+      {emptyResults}
+    </div>
+  )
+
+  return (
+    <div class="flex flex-col h-full overflow-y-auto no-scrollbar px-4 pb-10 sm:px-10 sm:pb-10">
+      <div class="sticky top-0 z-10 bg-[linear-gradient(to_bottom,var(--surface-stronger-non-alpha)_calc(100%_-_24px),transparent)]">
+        <div class="flex flex-col gap-4 pt-6 pb-6 max-w-[720px]">
+          <div class="flex items-center justify-between gap-4">
+            <h2 class="text-16-medium text-text-strong">{language.t("settings.shortcuts.title")}</h2>
+            <Button size="small" variant="secondary" onClick={resetAll} disabled={!hasOverrides()}>
+              {language.t("settings.shortcuts.reset.button")}
+            </Button>
+          </div>
+
+          <div class="flex items-center gap-2 px-3 h-9 rounded-lg bg-surface-base">
+            <Icon name="magnifying-glass" class="text-icon-weak-base flex-shrink-0" />
+            <TextField
+              variant="ghost"
+              type="text"
+              value={store.filter}
+              onChange={(v) => setStore("filter", v)}
+              placeholder={language.t("settings.shortcuts.search.placeholder")}
+              spellcheck={false}
+              autocorrect="off"
+              autocomplete="off"
+              autocapitalize="off"
+              class="flex-1"
+            />
+            <Show when={store.filter}>
+              <IconButton icon="circle-x" variant="ghost" onClick={() => setStore("filter", "")} />
+            </Show>
+          </div>
+        </div>
+      </div>
+      {groups}
+    </div>
+  )
+}

packages/app/src/components/settings-server-picker.tsx

@@ -1,26 +0,0 @@
-import { type ParentProps, Show } from "solid-js"
-import { useGlobal } from "@/context/global"
-import { ModelsProvider } from "@/context/models"
-import { ServerProvider } from "@/context/server"
-import { ServerConnection } from "@/context/servers"
-
-export function SettingsServerScope(props: ParentProps<{ directory?: string }>) {
-  const global = useGlobal()
-  return (
-    <Show when={global.settings.server.selected()} keyed fallback={props.children}>
-      {(server) => (
-        <SettingsServerDataScope server={server} directory={props.directory}>
-          {props.children}
-        </SettingsServerDataScope>
-      )}
-    </Show>
-  )
-}
-
-export function SettingsServerDataScope(props: ParentProps<{ server: ServerConnection.Any; directory?: string }>) {
-  return (
-    <ServerProvider conn={props.server}>
-      <ModelsProvider directory={props.directory}>{props.children}</ModelsProvider>
-    </ServerProvider>
-  )
-}

packages/app/src/components/settings-v2/appearance.tsx

@@ -1,134 +0,0 @@
-import { Component, createMemo } from "solid-js"
-import { SelectV2 } from "@opencode-ai/ui/v2/select-v2"
-import { TextInputV2 } from "@opencode-ai/ui/v2/text-input-v2"
-import { useLanguage } from "@/context/language"
-import { ExternalLink } from "../external-link"
-import { SettingsListV2 } from "./parts/list"
-import { SettingsRowV2 } from "./parts/row"
-import { createAppearanceSettingsController, type AppearanceSettingsController } from "./general-controllers"
-import "./settings-v2.css"
-
-const schemeOptions: ("system" | "light" | "dark")[] = ["system", "light", "dark"]
-const fontSettings = {
-  ui: {
-    action: "settings-ui-font",
-    title: "settings.general.row.uiFont.title",
-    description: "settings.general.row.uiFont.description",
-    font: "ui",
-    input: "setUI",
-  },
-  code: {
-    action: "settings-code-font",
-    title: "settings.general.row.font.title",
-    description: "settings.general.row.font.description",
-    font: "code",
-    input: "setCode",
-  },
-  terminal: {
-    action: "settings-terminal-font",
-    title: "settings.general.row.terminalFont.title",
-    description: "settings.general.row.terminalFont.description",
-    font: "terminal",
-    input: "setTerminal",
-  },
-} as const
-
-const FontSetting: Component<{
-  kind: "ui" | "code" | "terminal"
-  fonts: AppearanceSettingsController["fonts"]
-}> = (props) => {
-  const language = useLanguage()
-  const config = () => fontSettings[props.kind]
-  return (
-    <SettingsRowV2 title={language.t(config().title)} description={language.t(config().description)}>
-      <div class="w-full sm:w-[220px]">
-        <TextInputV2
-          data-action={config().action}
-          type="text"
-          appearance="base"
-          value={props.fonts[config().font]().value}
-          onInput={(event) => props.fonts[config().input](event.currentTarget.value)}
-          placeholder={props.fonts[config().font]().placeholder}
-          spellcheck={false}
-          autocorrect="off"
-          autocomplete="off"
-          autocapitalize="off"
-          aria-label={language.t(config().title)}
-          style={{ "font-family": props.fonts[config().font]().family }}
-        />
-      </div>
-    </SettingsRowV2>
-  )
-}
-
-export const SettingsAppearanceV2: Component = () => {
-  const language = useLanguage()
-  const appearance = createAppearanceSettingsController()
-
-  return (
-    <>
-      <div class="settings-v2-tab-header">
-        <div class="settings-v2-tab-header-row">
-          <div class="flex flex-col gap-1">
-            <h2 class="settings-v2-tab-title">{language.t("settings.general.section.appearance")}</h2>
-            <span class="text-11-regular text-v2-text-text-muted">{language.t("settings.appearance.description")}</span>
-          </div>
-        </div>
-      </div>
-
-      <div class="settings-v2-tab-body">
-        <div class="settings-v2-section">
-          <SettingsListV2>
-            <SettingsRowV2
-              title={language.t("settings.general.row.colorScheme.title")}
-              description={language.t("settings.general.row.colorScheme.description")}
-            >
-              <SelectV2
-                appearance="inline"
-                data-action="settings-color-scheme"
-                options={schemeOptions}
-                current={schemeOptions.find((option) => option === appearance.scheme.current())}
-                placement="bottom-end"
-                gutter={6}
-                label={(option) => {
-                  if (option === "system") return language.t("theme.scheme.system")
-                  if (option === "light") return language.t("theme.scheme.light")
-                  return language.t("theme.scheme.dark")
-                }}
-                onSelect={(option) => option && appearance.scheme.select(option)}
-              />
-            </SettingsRowV2>
-
-            <SettingsRowV2
-              title={language.t("settings.general.row.theme.title")}
-              description={
-                <>
-                  {language.t("settings.general.row.theme.description")}{" "}
-                  <ExternalLink class="settings-v2-link" href="https://opencode.ai/docs/themes/">
-                    {language.t("common.learnMore")}
-                  </ExternalLink>
-                </>
-              }
-            >
-              <SelectV2
-                appearance="inline"
-                data-action="settings-theme"
-                options={appearance.theme.options()}
-                current={appearance.theme.current()}
-                placement="bottom-end"
-                gutter={6}
-                value={(option) => option.id}
-                label={(option) => option.name}
-                onSelect={appearance.theme.select}
-              />
-            </SettingsRowV2>
-
-            <FontSetting kind="ui" fonts={appearance.fonts} />
-            <FontSetting kind="code" fonts={appearance.fonts} />
-            <FontSetting kind="terminal" fonts={appearance.fonts} />
-          </SettingsListV2>
-        </div>
-      </div>
-    </>
-  )
-}

packages/app/src/components/settings-v2/dialog-server-v2.tsx

@@ -13,7 +13,7 @@ import {
 } from "@/components/server/server-management"
 import { useGlobal } from "@/context/global"
 import { useLanguage } from "@/context/language"
-import { normalizeServerUrl, ServerConnection, useServers } from "@/context/servers"
+import { normalizeServerUrl, ServerConnection, useServer } from "@/context/server"
 import { useTabs } from "@/context/tabs"
 import { useCheckServerHealth } from "@/utils/server-health"
 import "./settings-v2.css"
@@ -146,7 +146,7 @@ export const DialogServerV2: Component<{
 }
 
 function createFormController(options: { onSelect?: () => void } = {}) {
-  const server = useServers()
+  const server = useServer()
   const tabs = useTabs()
   const global = useGlobal()
   const language = useLanguage()
@@ -173,7 +173,8 @@ function createFormController(options: { onSelect?: () => void } = {}) {
     })
   }
   const allServers = () => {
-    return server.list
+    if (!server.current || server.list.includes(server.current)) return server.list
+    return [server.current, ...server.list]
   }
   const editing = createMemo(() =>
     allServers().find((item) => item.type === "http" && item.http.url === store.originalUrl),
@@ -181,8 +182,10 @@ function createFormController(options: { onSelect?: () => void } = {}) {
   const add = (connection: ServerConnection.Http) => server.add(connection)
   const replace = (originalKey: ServerConnection.Key, next: ServerConnection.Http) =>
     replaceServerConnection(originalKey, next, {
+      active: () => server.key,
       removeTabs: (key) => tabs.removeServer(key),
       add,
+      setActive: (key) => server.setActive(key),
       remove: (key) => server.remove(key),
     })
 

packages/app/src/components/settings-v2/dialog-settings-v2.tsx

@@ -1,26 +1,19 @@
-import { Component, createEffect, createMemo, createSignal, startTransition } from "solid-js"
+import { Component, createMemo, createSignal, startTransition } from "solid-js"
 import { Dialog } from "@opencode-ai/ui/v2/dialog-v2"
 import { TabsV2 } from "@opencode-ai/ui/v2/tabs-v2"
 import { Icon } from "@opencode-ai/ui/icon"
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
-import { SettingsGeneral } from "./general"
-import { SettingsAppearanceV2 } from "./appearance"
+import { SettingsGeneralV2 } from "./general"
 import { SettingsKeybinds } from "../settings-keybinds"
-import { SettingsNotificationsV2 } from "./notifications"
 import { SettingsProvidersV2 } from "./providers"
 import { SettingsModelsV2 } from "./models"
+import "./settings-v2.css"
 import { SettingsServersV2 } from "./servers"
-import { SettingsWorkspacesV2 } from "./workspaces"
-import { SettingsProjectsV2 } from "./projects"
-import { SettingsExtensionsV2 } from "./extensions"
-import { SettingsServerScope } from "../settings-server-picker"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { useLayout } from "@/context/layout"
 import { useTabs } from "@/context/tabs"
-import { useGlobal, useServerCtx } from "@/context/global"
-import { ServerConnection, useServers } from "@/context/servers"
-import "./settings-v2.css"
+import { useServerSync } from "@/context/server-sync"
 
 export const DialogSettings: Component<{
   sessionID?: string
@@ -30,40 +23,17 @@ export const DialogSettings: Component<{
   const platform = usePlatform()
   const dialog = useDialog()
   const layout = useLayout()
-  const servers = useServers()
   const tabs = useTabs()
-  const global = useGlobal()
+  const serverSync = useServerSync()
   const [tab, setTab] = createSignal(props.defaultValue ?? "general")
-  const server = createMemo(() => {
-    const route = layout.route()
-    switch (route.type) {
-      case "draft": {
-        const draft = tabs.store.find((item) => item.type === "draft" && item.draftID === route.draftID)
-        return servers.list.find((item) => ServerConnection.key(item) === draft?.server)
-      }
-      case "session":
-        return servers.list.find((item) => ServerConnection.key(item) === route.server)
-      case "home":
-        return servers.list.find((item) => ServerConnection.key(item) === layout.home.selection().server)
-    }
-  })
-  const serverCtx = useServerCtx(server)
-
-  createEffect(() => {
-    const current = server()
-    if (current) global.settings.server.set(ServerConnection.key(current))
-  })
-
   const directory = createMemo(() => {
-    const selected = global.settings.server.selected()
-    const current = server()
-    if (!selected || !current || ServerConnection.key(selected) !== ServerConnection.key(current)) return
     const route = layout.route()
+    if (route.type === "dir-new-sesssion") return route.dir
     if (route.type === "draft") {
       const draft = tabs.store.find((item) => item.type === "draft" && item.draftID === route.draftID)
       return draft?.type === "draft" ? draft.directory : undefined
     }
-    if (route.type === "session") return serverCtx()?.sync.session.get(route.sessionId)?.location.directory
+    if (route.type === "session") return serverSync().session.get(route.sessionId)?.location.directory
     return undefined
   })
 
@@ -82,99 +52,62 @@ export const DialogSettings: Component<{
       >
         <TabsV2.List>
           <div class="flex flex-col justify-between h-full w-full">
-            <div class="flex flex-col gap-4 w-full">
-              {/* Group 1: Preferences */}
-              <div class="flex flex-col gap-1 w-full">
-                <TabsV2.Trigger value="general">
-                  <Icon name="sliders" />
-                  {language.t("settings.tab.preferences")}
-                </TabsV2.Trigger>
-                <TabsV2.Trigger value="appearance">
-                  <Icon name="appearance" />
-                  {language.t("settings.general.section.appearance")}
-                </TabsV2.Trigger>
-                <TabsV2.Trigger value="notifications">
-                  <Icon name="notifications" />
-                  {language.t("settings.tab.notifications")}
-                </TabsV2.Trigger>
-                <TabsV2.Trigger value="shortcuts">
-                  <Icon name="keyboard" />
-                  {language.t("settings.tab.shortcuts")}
-                </TabsV2.Trigger>
-              </div>
+            <div class="flex flex-col gap-3 w-full">
+              <div class="flex flex-col gap-3">
+                <div class="flex flex-col gap-1.5">
+                  <TabsV2.SectionTitle>{language.t("settings.section.desktop")}</TabsV2.SectionTitle>
+                  <div class="flex flex-col gap-1.5 w-full">
+                    <TabsV2.Trigger value="general">
+                      <Icon name="sliders" />
+                      {language.t("settings.tab.general")}
+                    </TabsV2.Trigger>
+                    <TabsV2.Trigger value="shortcuts">
+                      <Icon name="keyboard" />
+                      {language.t("settings.tab.shortcuts")}
+                    </TabsV2.Trigger>
+                  </div>
+                </div>
 
-              {/* Group 2: Environment & Workspaces */}
-              <div class="flex flex-col gap-1 w-full">
-                <TabsV2.Trigger value="servers">
-                  <Icon name="server" />
-                  {language.t("status.popover.tab.servers")}
-                </TabsV2.Trigger>
-                <TabsV2.Trigger value="projects">
-                  <Icon name="folder" />
-                  {language.t("settings.tab.projects")}
-                </TabsV2.Trigger>
-                <TabsV2.Trigger value="workspaces">
-                  <Icon name="workspace-isolated" />
-                  {language.t("settings.tab.workspaces")}
-                </TabsV2.Trigger>
-              </div>
-
-              {/* Group 3: Capabilities & Extensions */}
-              <div class="flex flex-col gap-1 w-full">
-                <TabsV2.Trigger value="providers">
-                  <Icon name="providers" />
-                  {language.t("settings.providers.title")}
-                </TabsV2.Trigger>
-                <TabsV2.Trigger value="models">
-                  <Icon name="models" />
-                  {language.t("settings.models.title")}
-                </TabsV2.Trigger>
-                <TabsV2.Trigger value="extensions">
-                  <Icon name="extensions" />
-                  {language.t("settings.tab.extensions")}
-                </TabsV2.Trigger>
+                <div class="flex flex-col gap-1.5">
+                  <TabsV2.SectionTitle>{language.t("settings.section.server")}</TabsV2.SectionTitle>
+                  <div class="flex flex-col gap-1.5 w-full">
+                    <TabsV2.Trigger value="servers">
+                      <Icon name="server" />
+                      {language.t("status.popover.tab.servers")}
+                    </TabsV2.Trigger>
+                    <TabsV2.Trigger value="providers">
+                      <Icon name="providers" />
+                      {language.t("settings.providers.title")}
+                    </TabsV2.Trigger>
+                    <TabsV2.Trigger value="models">
+                      <Icon name="models" />
+                      {language.t("settings.models.title")}
+                    </TabsV2.Trigger>
+                  </div>
+                </div>
               </div>
             </div>
-
             <div class="settings-v2-nav-footer">
               <span>{language.t("app.name.desktop")}</span>
               <span>v{platform.version}</span>
             </div>
           </div>
         </TabsV2.List>
-
         <TabsV2.Content value="general" class="settings-v2-panel">
-          <SettingsGeneral server={server()} sessionID={props.sessionID} />
-        </TabsV2.Content>
-        <TabsV2.Content value="appearance" class="settings-v2-panel">
-          <SettingsAppearanceV2 />
-        </TabsV2.Content>
-        <TabsV2.Content value="notifications" class="settings-v2-panel">
-          <SettingsNotificationsV2 />
+          <SettingsGeneralV2 sessionID={props.sessionID} />
         </TabsV2.Content>
         <TabsV2.Content value="shortcuts" class="settings-v2-panel">
-          <SettingsKeybinds />
+          <SettingsKeybinds v2 />
         </TabsV2.Content>
         <TabsV2.Content value="servers" class="settings-v2-panel">
           <SettingsServersV2 />
         </TabsV2.Content>
-        <TabsV2.Content value="projects" class="settings-v2-panel">
-          <SettingsProjectsV2 />
+        <TabsV2.Content value="providers" class="settings-v2-panel">
+          <SettingsProvidersV2 directory={directory} onBack={showProviders} />
+        </TabsV2.Content>
+        <TabsV2.Content value="models" class="settings-v2-panel">
+          <SettingsModelsV2 />
         </TabsV2.Content>
-        <SettingsServerScope directory={directory()}>
-          <TabsV2.Content value="workspaces" class="settings-v2-panel">
-            <SettingsWorkspacesV2 activeDirectory={directory()} />
-          </TabsV2.Content>
-          <TabsV2.Content value="providers" class="settings-v2-panel">
-            <SettingsProvidersV2 directory={directory()} onBack={showProviders} />
-          </TabsV2.Content>
-          <TabsV2.Content value="models" class="settings-v2-panel">
-            <SettingsModelsV2 />
-          </TabsV2.Content>
-          <TabsV2.Content value="extensions" class="settings-v2-panel">
-            <SettingsExtensionsV2 />
-          </TabsV2.Content>
-        </SettingsServerScope>
       </TabsV2>
     </Dialog>
   )

packages/app/src/components/settings-v2/extensions.tsx

@@ -1,154 +0,0 @@
-import { Component, For, createMemo, createResource } from "solid-js"
-import { Icon } from "@opencode-ai/ui/icon"
-import { Switch } from "@opencode-ai/ui/v2/switch-v2"
-import { TabsV2 } from "@opencode-ai/ui/v2/tabs-v2"
-import { useLanguage } from "@/context/language"
-import { useServerSDK } from "@/context/server-sdk"
-import { useServerSync } from "@/context/server-sync"
-import { ExternalLink } from "../external-link"
-import { InlineServerSelect } from "./parts/server-select"
-import "./settings-v2.css"
-
-interface McpRowItem {
-  name: string
-  enabled: boolean
-}
-
-interface PluginRowItem {
-  name: string
-}
-
-export const SettingsExtensionsV2: Component = () => {
-  const language = useLanguage()
-  const serverSdk = useServerSDK()
-  const serverSync = useServerSync()
-  const mcps = createMemo<McpRowItem[]>(() => {
-    const configMcp = serverSync.data.config.mcp ?? {}
-    return Object.entries(configMcp).map(([name, config]) => ({
-      name,
-      enabled: typeof config !== "object" || config === null || !("enabled" in config) || config.enabled !== false,
-    }))
-  })
-
-  const handleMcpToggle = (item: McpRowItem, checked: boolean) => {
-    const before = serverSync.data.config.mcp ?? {}
-    const config = before[item.name]
-    if (typeof config !== "object" || config === null) return
-    const next = { ...before, [item.name]: { ...config, enabled: checked } }
-    serverSync.set("config", "mcp", next)
-    void serverSync.updateConfig({ mcp: next }).catch(() => serverSync.set("config", "mcp", before))
-  }
-
-  const plugins = createMemo<PluginRowItem[]>(() => {
-    const raw = serverSync.data.config.plugin ?? []
-    return raw.map((item) => {
-      const name = typeof item === "string" ? item : item[0]
-      return { name }
-    })
-  })
-
-  const [skills] = createResource(serverSdk, (sdk) => sdk.api.skill.list().then((result) => result.data), {
-    initialValue: [],
-  })
-
-  return (
-    <>
-      <div class="settings-v2-tab-header">
-        <div class="settings-v2-tab-header-row">
-          <div class="flex flex-col gap-1">
-            <h2 class="settings-v2-tab-title">{language.t("settings.tab.extensions")}</h2>
-            <span class="text-11-regular text-v2-text-text-muted">{language.t("settings.extensions.description")}</span>
-          </div>
-          <InlineServerSelect />
-        </div>
-      </div>
-
-      <div class="settings-v2-tab-body">
-        <TabsV2 variant="pill" defaultValue="mcps" class="settings-v2-extensions-tabs">
-          <TabsV2.List>
-            <TabsV2.Trigger value="mcps">{language.t("settings.extensions.tab.mcps")}</TabsV2.Trigger>
-            <TabsV2.Trigger value="plugins">{language.t("status.popover.tab.plugins")}</TabsV2.Trigger>
-            <TabsV2.Trigger value="skills">{language.t("settings.extensions.tab.skills")}</TabsV2.Trigger>
-          </TabsV2.List>
-
-          <TabsV2.Content value="mcps">
-            <div class="settings-v2-section">
-              <div class="flex items-center justify-between">
-                <span class="text-13-medium text-v2-text-text-base">
-                  {language.t("settings.extensions.availableAll")}
-                </span>
-                <span class="text-13-regular text-v2-text-faint">{language.t("settings.extensions.manageConfig")}</span>
-              </div>
-              <div class="bg-[var(--v2-background-bg-base)] border-[0.5px] border-[var(--v2-border-border-base)] rounded-[8px] pl-4 pr-3 overflow-hidden">
-                <For each={mcps()}>
-                  {(item) => (
-                    <div class="py-4 flex items-center justify-between border-b-[0.5px] border-[var(--v2-border-border-base)] last:border-b-0">
-                      <div class="flex items-center gap-2.5 min-w-0">
-                        <Icon name="mcp" class="text-v2-icon-icon-muted shrink-0" />
-                        <span class="text-13-medium text-v2-text-text-base truncate">{item.name}</span>
-                      </div>
-                      <Switch checked={item.enabled} onChange={(checked) => handleMcpToggle(item, checked)} hideLabel>
-                        {item.name}
-                      </Switch>
-                    </div>
-                  )}
-                </For>
-              </div>
-            </div>
-          </TabsV2.Content>
-
-          <TabsV2.Content value="plugins">
-            <div class="settings-v2-section">
-              <div class="flex items-center justify-between">
-                <span class="text-13-medium text-v2-text-text-base">
-                  {language.t("settings.extensions.availableAll")}
-                </span>
-                <span class="text-13-regular text-v2-text-faint">{language.t("settings.extensions.manageConfig")}</span>
-              </div>
-              <div class="bg-[var(--v2-background-bg-base)] border-[0.5px] border-[var(--v2-border-border-base)] rounded-[8px] pl-4 pr-3 overflow-hidden">
-                <For each={plugins()}>
-                  {(plugin) => (
-                    <div class="py-4 flex items-center justify-between border-b-[0.5px] border-[var(--v2-border-border-base)] last:border-b-0">
-                      <div class="flex items-center gap-2.5 min-w-0">
-                        <Icon name="cube" class="text-v2-icon-icon-muted shrink-0" />
-                        <span class="text-13-medium text-v2-text-text-base truncate font-mono">{plugin.name}</span>
-                      </div>
-                    </div>
-                  )}
-                </For>
-              </div>
-            </div>
-          </TabsV2.Content>
-
-          <TabsV2.Content value="skills">
-            <div class="settings-v2-section">
-              <div class="flex items-center justify-between">
-                <span class="text-13-medium text-v2-text-text-base">
-                  {language.t("settings.extensions.availableAll")}
-                </span>
-                <ExternalLink
-                  class="text-13-regular text-v2-text-accent hover:underline"
-                  href="https://opencode.ai/docs/skills/"
-                >
-                  {language.t("settings.extensions.addSkills")}
-                </ExternalLink>
-              </div>
-              <div class="bg-[var(--v2-background-bg-base)] border-[0.5px] border-[var(--v2-border-border-base)] rounded-[8px] pl-4 pr-3 overflow-hidden">
-                <For each={skills()}>
-                  {(skill) => (
-                    <div class="py-4 flex items-center justify-between border-b-[0.5px] border-[var(--v2-border-border-base)] last:border-b-0">
-                      <div class="flex items-center gap-2.5 min-w-0">
-                        <Icon name="post-skill" class="text-v2-icon-icon-muted shrink-0" />
-                        <span class="text-13-medium text-v2-text-text-base truncate">{skill.name}</span>
-                      </div>
-                    </div>
-                  )}
-                </For>
-              </div>
-            </div>
-          </TabsV2.Content>
-        </TabsV2>
-      </div>
-    </>
-  )
-}