docs(bash): clarify output capture guidance

.github/actions/setup-bun/action.yml

@@ -3,6 +3,14 @@ description: "Setup Bun with caching and install dependencies"
 runs:
   using: "composite"
   steps:
+    - name: Cache Bun dependencies
+      uses: actions/cache@v4
+      with:
+        path: ~/.bun/install/cache
+        key: ${{ runner.os }}-bun-${{ hashFiles('**/bun.lockb') }}
+        restore-keys: |
+          ${{ runner.os }}-bun-
+
     - name: Get baseline download URL
       id: bun-url
       shell: bash
@@ -23,23 +31,6 @@ runs:
         bun-version-file: ${{ !steps.bun-url.outputs.url && 'package.json' || '' }}
         bun-download-url: ${{ steps.bun-url.outputs.url }}
 
-    - name: Get cache directory
-      id: cache
-      shell: bash
-      run: echo "dir=$(bun pm cache)" >> "$GITHUB_OUTPUT"
-
-    - name: Cache Bun dependencies
-      uses: actions/cache@v4
-      with:
-        path: ${{ steps.cache.outputs.dir }}
-        key: ${{ runner.os }}-bun-${{ hashFiles('**/bun.lock') }}
-        restore-keys: |
-          ${{ runner.os }}-bun-
-
-    - name: Install setuptools for distutils compatibility
-      run: python3 -m pip install setuptools || pip install setuptools || true
-      shell: bash
-
     - name: Install dependencies
       run: bun install
       shell: bash

.github/workflows/publish.yml

@@ -99,6 +99,7 @@ jobs:
         with:
           name: opencode-cli
           path: packages/opencode/dist
+
     outputs:
       version: ${{ needs.version.outputs.version }}
 
@@ -115,9 +116,6 @@ jobs:
             target: x86_64-apple-darwin
           - host: macos-latest
             target: aarch64-apple-darwin
-          # github-hosted: blacksmith lacks ARM64 MSVC cross-compilation toolchain
-          - host: windows-2025
-            target: aarch64-pc-windows-msvc
           - host: blacksmith-4vcpu-windows-2025
             target: x86_64-pc-windows-msvc
           - host: blacksmith-4vcpu-ubuntu-2404
@@ -152,10 +150,6 @@ jobs:
 
       - uses: ./.github/actions/setup-bun
 
-      - uses: actions/setup-node@v4
-        with:
-          node-version: "24"
-
       - name: Cache apt packages
         if: contains(matrix.settings.host, 'ubuntu')
         uses: actions/cache@v4
@@ -246,135 +240,11 @@ jobs:
           APPLE_API_KEY: ${{ secrets.APPLE_API_KEY }}
           APPLE_API_KEY_PATH: ${{ runner.temp }}/apple-api-key.p8
 
-  build-electron:
-    needs:
-      - build-cli
-      - version
-    continue-on-error: false
-    strategy:
-      fail-fast: false
-      matrix:
-        settings:
-          - host: macos-latest
-            target: x86_64-apple-darwin
-            platform_flag: --mac --x64
-          - host: macos-latest
-            target: aarch64-apple-darwin
-            platform_flag: --mac --arm64
-          # github-hosted: blacksmith lacks ARM64 MSVC cross-compilation toolchain
-          - host: "windows-2025"
-            target: aarch64-pc-windows-msvc
-            platform_flag: --win --arm64
-          - host: "blacksmith-4vcpu-windows-2025"
-            target: x86_64-pc-windows-msvc
-            platform_flag: --win
-          - host: "blacksmith-4vcpu-ubuntu-2404"
-            target: x86_64-unknown-linux-gnu
-            platform_flag: --linux
-          - host: "blacksmith-4vcpu-ubuntu-2404"
-            target: aarch64-unknown-linux-gnu
-            platform_flag: --linux
-    runs-on: ${{ matrix.settings.host }}
-    # if: github.ref_name == 'beta'
-    steps:
-      - uses: actions/checkout@v3
-
-      - uses: apple-actions/import-codesign-certs@v2
-        if: runner.os == 'macOS'
-        with:
-          keychain: build
-          p12-file-base64: ${{ secrets.APPLE_CERTIFICATE }}
-          p12-password: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
-
-      - name: Setup Apple API Key
-        if: runner.os == 'macOS'
-        run: echo "${{ secrets.APPLE_API_KEY_PATH }}" > $RUNNER_TEMP/apple-api-key.p8
-
-      - uses: ./.github/actions/setup-bun
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: "24"
-
-      - name: Cache apt packages
-        if: contains(matrix.settings.host, 'ubuntu')
-        uses: actions/cache@v4
-        with:
-          path: ~/apt-cache
-          key: ${{ runner.os }}-${{ matrix.settings.target }}-apt-electron-${{ hashFiles('.github/workflows/publish.yml') }}
-          restore-keys: |
-            ${{ runner.os }}-${{ matrix.settings.target }}-apt-electron-
-
-      - name: Install dependencies (ubuntu only)
-        if: contains(matrix.settings.host, 'ubuntu')
-        run: |
-          mkdir -p ~/apt-cache && chmod -R a+rw ~/apt-cache
-          sudo apt-get update
-          sudo apt-get install -y --no-install-recommends -o dir::cache::archives="$HOME/apt-cache" rpm
-          sudo chmod -R a+rw ~/apt-cache
-
-      - name: Setup git committer
-        id: committer
-        uses: ./.github/actions/setup-git-committer
-        with:
-          opencode-app-id: ${{ vars.OPENCODE_APP_ID }}
-          opencode-app-secret: ${{ secrets.OPENCODE_APP_SECRET }}
-
-      - name: Prepare
-        run: bun ./scripts/prepare.ts
-        working-directory: packages/desktop-electron
-        env:
-          OPENCODE_VERSION: ${{ needs.version.outputs.version }}
-          OPENCODE_CHANNEL: ${{ (github.ref_name == 'beta' && 'beta') || 'prod' }}
-          RUST_TARGET: ${{ matrix.settings.target }}
-          GH_TOKEN: ${{ github.token }}
-          GITHUB_RUN_ID: ${{ github.run_id }}
-
-      - name: Build
-        run: bun run build
-        working-directory: packages/desktop-electron
-        env:
-          OPENCODE_CHANNEL: ${{ (github.ref_name == 'beta' && 'beta') || 'prod' }}
-
-      - name: Package and publish
-        if: needs.version.outputs.release
-        run: npx electron-builder ${{ matrix.settings.platform_flag }} --publish always --config electron-builder.config.ts
-        working-directory: packages/desktop-electron
-        timeout-minutes: 60
-        env:
-          OPENCODE_CHANNEL: ${{ (github.ref_name == 'beta' && 'beta') || 'prod' }}
-          GH_TOKEN: ${{ steps.committer.outputs.token }}
-          CSC_LINK: ${{ secrets.APPLE_CERTIFICATE }}
-          CSC_KEY_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
-          APPLE_API_KEY: ${{ runner.temp }}/apple-api-key.p8
-          APPLE_API_KEY_ID: ${{ secrets.APPLE_API_KEY }}
-          APPLE_API_ISSUER: ${{ secrets.APPLE_API_ISSUER }}
-
-      - name: Package (no publish)
-        if: ${{ !needs.version.outputs.release }}
-        run: npx electron-builder ${{ matrix.settings.platform_flag }} --publish never --config electron-builder.config.ts
-        working-directory: packages/desktop-electron
-        timeout-minutes: 60
-        env:
-          OPENCODE_CHANNEL: ${{ (github.ref_name == 'beta' && 'beta') || 'prod' }}
-
-      - uses: actions/upload-artifact@v4
-        with:
-          name: opencode-electron-${{ matrix.settings.target }}
-          path: packages/desktop-electron/dist/*
-
-      - uses: actions/upload-artifact@v4
-        if: needs.version.outputs.release
-        with:
-          name: latest-yml-${{ matrix.settings.target }}
-          path: packages/desktop-electron/dist/latest*.yml
-
   publish:
     needs:
       - version
       - build-cli
       - build-tauri
-      - build-electron
     runs-on: blacksmith-4vcpu-ubuntu-2404
     steps:
       - uses: actions/checkout@v3
@@ -411,12 +281,6 @@ jobs:
           name: opencode-cli
           path: packages/opencode/dist
 
-      - uses: actions/download-artifact@v4
-        if: needs.version.outputs.release
-        with:
-          pattern: latest-yml-*
-          path: /tmp/latest-yml
-
       - name: Cache apt packages (AUR)
         uses: actions/cache@v4
         with:
@@ -444,4 +308,3 @@ jobs:
           GITHUB_TOKEN: ${{ steps.committer.outputs.token }}
           GH_REPO: ${{ needs.version.outputs.repo }}
           NPM_CONFIG_PROVENANCE: false
-          LATEST_YML_DIR: /tmp/latest-yml

.github/workflows/storybook.yml

@@ -1,38 +0,0 @@
-name: storybook
-
-on:
-  push:
-    branches: [dev]
-    paths:
-      - ".github/workflows/storybook.yml"
-      - "package.json"
-      - "bun.lock"
-      - "packages/storybook/**"
-      - "packages/ui/**"
-  pull_request:
-    branches: [dev]
-    paths:
-      - ".github/workflows/storybook.yml"
-      - "package.json"
-      - "bun.lock"
-      - "packages/storybook/**"
-      - "packages/ui/**"
-  workflow_dispatch:
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  build:
-    name: storybook build
-    runs-on: blacksmith-4vcpu-ubuntu-2404
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup Bun
-        uses: ./.github/actions/setup-bun
-
-      - name: Build Storybook
-        run: bun --cwd packages/storybook build

.github/workflows/test.yml

@@ -6,16 +6,6 @@ on:
       - dev
   pull_request:
   workflow_dispatch:
-
-concurrency:
-  # Keep every run on dev so cancelled checks do not pollute the default branch
-  # commit history. PRs and other branches still share a group and cancel stale runs.
-  group: ${{ case(github.ref == 'refs/heads/dev', format('{0}-{1}', github.workflow, github.run_id), format('{0}-{1}', github.workflow, github.event.pull_request.number || github.ref)) }}
-  cancel-in-progress: true
-
-permissions:
-  contents: read
-
 jobs:
   unit:
     name: unit (${{ matrix.settings.name }})
@@ -96,3 +86,18 @@ jobs:
           path: |
             packages/app/e2e/test-results
             packages/app/e2e/playwright-report
+
+  required:
+    name: test (linux)
+    runs-on: blacksmith-4vcpu-ubuntu-2404
+    needs:
+      - unit
+      - e2e
+    if: always()
+    steps:
+      - name: Verify upstream test jobs passed
+        run: |
+          echo "unit=${{ needs.unit.result }}"
+          echo "e2e=${{ needs.e2e.result }}"
+          test "${{ needs.unit.result }}" = "success"
+          test "${{ needs.e2e.result }}" = "success"

.gitignore

@@ -17,7 +17,7 @@ ts-dist
 /result
 refs
 Session.vim
-/opencode.json
+opencode.json
 a.out
 target
 .scripts

.opencode/.gitignore

@@ -1,4 +1,3 @@
 plans/
 bun.lock
 package.json
-package-lock.json

.opencode/opencode.jsonc

@@ -5,11 +5,6 @@
       "options": {},
     },
   },
-  "permission": {
-    "edit": {
-      "packages/opencode/migration/*": "deny",
-    },
-  },
   "mcp": {},
   "tools": {
     "github-triage": false,

.opencode/tool/github-pr-search.txt

@@ -1,6 +1,6 @@
 Use this tool to search GitHub pull requests by title and description.
 
-This tool searches PRs in the anomalyco/opencode repository and returns LLM-friendly results including:
+This tool searches PRs in the sst/opencode repository and returns LLM-friendly results including:
 - PR number and title
 - Author
 - State (open/closed/merged)

.opencode/tool/github-triage.ts

@@ -5,8 +5,16 @@ import DESCRIPTION from "./github-triage.txt"
 const TEAM = {
   desktop: ["adamdotdevin", "iamdavidhill", "Brendonovich", "nexxeln"],
   zen: ["fwang", "MrMushrooooom"],
-  tui: ["thdxr", "kommander", "rekram1-node"],
-  core: ["thdxr", "rekram1-node", "jlongster"],
+  tui: [
+    "thdxr",
+    "kommander",
+    // "rekram1-node" (on vacation)
+  ],
+  core: [
+    "thdxr",
+    // "rekram1-node", (on vacation)
+    "jlongster",
+  ],
   docs: ["R44VC0RP"],
   windows: ["Hona"],
 } as const
@@ -42,10 +50,7 @@ async function githubFetch(endpoint: string, options: RequestInit = {}) {
 export default tool({
   description: DESCRIPTION,
   args: {
-    assignee: tool.schema
-      .enum(ASSIGNEES as [string, ...string[]])
-      .describe("The username of the assignee")
-      .default("rekram1-node"),
+    assignee: tool.schema.enum(ASSIGNEES as [string, ...string[]]).describe("The username of the assignee"),
     labels: tool.schema
       .array(tool.schema.enum(["nix", "opentui", "perf", "web", "desktop", "zen", "docs", "windows", "core"]))
       .describe("The labels(s) to add to the issue")
@@ -68,7 +73,8 @@ export default tool({
       results.push("Dropped label: nix (issue does not mention nix)")
     }
 
-    const assignee = nix ? "rekram1-node" : web ? pick(TEAM.desktop) : args.assignee
+    // const assignee = nix ? "rekram1-node" : web ? pick(TEAM.desktop) : args.assignee
+    const assignee = web ? pick(TEAM.desktop) : args.assignee
 
     if (labels.includes("zen") && !zen) {
       throw new Error("Only add the zen label when issue title/body contains 'zen'")

.opencode/tool/github-triage.txt

@@ -4,3 +4,5 @@ Choose labels and assignee using the current triage policy and ownership rules.
 Pick the most fitting labels for the issue and assign one owner.
 
 If unsure, choose the team/section with the most overlap with the issue and assign a member from that team at random.
+
+(Note: rekram1-node is on vacation, do not assign issues to him.)

AGENTS.md

@@ -122,7 +122,3 @@ const table = sqliteTable("session", {
 - Avoid mocks as much as possible
 - Test actual implementation, do not duplicate logic into tests
 - Tests cannot run from repo root (guard: `do-not-run-tests-from-root`); run from package dirs like `packages/opencode`.
-
-## Type Checking
-
-- Always run `bun typecheck` from package directories (e.g., `packages/opencode`), never `tsc` directly.

README.ar.md

@@ -35,8 +35,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.bn.md

@@ -35,8 +35,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.br.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.bs.md

@@ -35,8 +35,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.da.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.de.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.es.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.fr.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.gr.md

@@ -35,8 +35,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.it.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.ja.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.ko.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.md

@@ -35,8 +35,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.no.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.pl.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.ru.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.th.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.tr.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.uk.md

@@ -35,8 +35,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)

README.vi.md

@@ -1,141 +0,0 @@
-<p align="center">
-  <a href="https://opencode.ai">
-    <picture>
-      <source srcset="packages/console/app/src/asset/logo-ornate-dark.svg" media="(prefers-color-scheme: dark)">
-      <source srcset="packages/console/app/src/asset/logo-ornate-light.svg" media="(prefers-color-scheme: light)">
-      <img src="packages/console/app/src/asset/logo-ornate-light.svg" alt="OpenCode logo">
-    </picture>
-  </a>
-</p>
-<p align="center">Trợ lý lập trình AI mã nguồn mở.</p>
-<p align="center">
-  <a href="https://opencode.ai/discord"><img alt="Discord" src="https://img.shields.io/discord/1391832426048651334?style=flat-square&label=discord" /></a>
-  <a href="https://www.npmjs.com/package/opencode-ai"><img alt="npm" src="https://img.shields.io/npm/v/opencode-ai?style=flat-square" /></a>
-  <a href="https://github.com/anomalyco/opencode/actions/workflows/publish.yml"><img alt="Build status" src="https://img.shields.io/github/actions/workflow/status/anomalyco/opencode/publish.yml?style=flat-square&branch=dev" /></a>
-</p>
-
-<p align="center">
-  <a href="README.md">English</a> |
-  <a href="README.zh.md">简体中文</a> |
-  <a href="README.zht.md">繁體中文</a> |
-  <a href="README.ko.md">한국어</a> |
-  <a href="README.de.md">Deutsch</a> |
-  <a href="README.es.md">Español</a> |
-  <a href="README.fr.md">Français</a> |
-  <a href="README.it.md">Italiano</a> |
-  <a href="README.da.md">Dansk</a> |
-  <a href="README.ja.md">日本語</a> |
-  <a href="README.pl.md">Polski</a> |
-  <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
-  <a href="README.ar.md">العربية</a> |
-  <a href="README.no.md">Norsk</a> |
-  <a href="README.br.md">Português (Brasil)</a> |
-  <a href="README.th.md">ไทย</a> |
-  <a href="README.tr.md">Türkçe</a> |
-  <a href="README.uk.md">Українська</a> |
-  <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
-</p>
-
-[![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)
-
----
-
-### Cài đặt
-
-```bash
-# YOLO
-curl -fsSL https://opencode.ai/install | bash
-
-# Các trình quản lý gói (Package managers)
-npm i -g opencode-ai@latest        # hoặc bun/pnpm/yarn
-scoop install opencode             # Windows
-choco install opencode             # Windows
-brew install anomalyco/tap/opencode # macOS và Linux (khuyên dùng, luôn cập nhật)
-brew install opencode              # macOS và Linux (công thức brew chính thức, ít cập nhật hơn)
-sudo pacman -S opencode            # Arch Linux (Bản ổn định)
-paru -S opencode-bin               # Arch Linux (Bản mới nhất từ AUR)
-mise use -g opencode               # Mọi hệ điều hành
-nix run nixpkgs#opencode           # hoặc github:anomalyco/opencode cho nhánh dev mới nhất
-```
-
-> [!TIP]
-> Hãy xóa các phiên bản cũ hơn 0.1.x trước khi cài đặt.
-
-### Ứng dụng Desktop (BETA)
-
-OpenCode cũng có sẵn dưới dạng ứng dụng desktop. Tải trực tiếp từ [trang releases](https://github.com/anomalyco/opencode/releases) hoặc [opencode.ai/download](https://opencode.ai/download).
-
-| Nền tảng              | Tải xuống                             |
-| --------------------- | ------------------------------------- |
-| macOS (Apple Silicon) | `opencode-desktop-darwin-aarch64.dmg` |
-| macOS (Intel)         | `opencode-desktop-darwin-x64.dmg`     |
-| Windows               | `opencode-desktop-windows-x64.exe`    |
-| Linux                 | `.deb`, `.rpm`, hoặc AppImage         |
-
-```bash
-# macOS (Homebrew)
-brew install --cask opencode-desktop
-# Windows (Scoop)
-scoop bucket add extras; scoop install extras/opencode-desktop
-```
-
-#### Thư mục cài đặt
-
-Tập lệnh cài đặt tuân theo thứ tự ưu tiên sau cho đường dẫn cài đặt:
-
-1. `$OPENCODE_INSTALL_DIR` - Thư mục cài đặt tùy chỉnh
-2. `$XDG_BIN_DIR` - Đường dẫn tuân thủ XDG Base Directory Specification
-3. `$HOME/bin` - Thư mục nhị phân tiêu chuẩn của người dùng (nếu tồn tại hoặc có thể tạo)
-4. `$HOME/.opencode/bin` - Mặc định dự phòng
-
-```bash
-# Ví dụ
-OPENCODE_INSTALL_DIR=/usr/local/bin curl -fsSL https://opencode.ai/install | bash
-XDG_BIN_DIR=$HOME/.local/bin curl -fsSL https://opencode.ai/install | bash
-```
-
-### Agents (Đại diện)
-
-OpenCode bao gồm hai agent được tích hợp sẵn mà bạn có thể chuyển đổi bằng phím `Tab`.
-
-- **build** - Agent mặc định, có toàn quyền truy cập cho công việc lập trình
-- **plan** - Agent chỉ đọc dùng để phân tích và khám phá mã nguồn
-  - Mặc định từ chối việc chỉnh sửa tệp
-  - Hỏi quyền trước khi chạy các lệnh bash
-  - Lý tưởng để khám phá các codebase lạ hoặc lên kế hoạch thay đổi
-
-Ngoài ra còn có một subagent **general** dùng cho các tìm kiếm phức tạp và tác vụ nhiều bước.
-Agent này được sử dụng nội bộ và có thể gọi bằng cách dùng `@general` trong tin nhắn.
-
-Tìm hiểu thêm về [agents](https://opencode.ai/docs/agents).
-
-### Tài liệu
-
-Để biết thêm thông tin về cách cấu hình OpenCode, [**hãy truy cập tài liệu của chúng tôi**](https://opencode.ai/docs).
-
-### Đóng góp
-
-Nếu bạn muốn đóng góp cho OpenCode, vui lòng đọc [tài liệu hướng dẫn đóng góp](./CONTRIBUTING.md) trước khi gửi pull request.
-
-### Xây dựng trên nền tảng OpenCode
-
-Nếu bạn đang làm việc trên một dự án liên quan đến OpenCode và sử dụng "opencode" như một phần của tên dự án, ví dụ "opencode-dashboard" hoặc "opencode-mobile", vui lòng thêm một ghi chú vào README của bạn để làm rõ rằng dự án đó không được xây dựng bởi đội ngũ OpenCode và không liên kết với chúng tôi dưới bất kỳ hình thức nào.
-
-### Các câu hỏi thường gặp (FAQ)
-
-#### OpenCode khác biệt thế nào so với Claude Code?
-
-Về mặt tính năng, nó rất giống Claude Code. Dưới đây là những điểm khác biệt chính:
-
-- 100% mã nguồn mở
-- Không bị ràng buộc với bất kỳ nhà cung cấp nào. Mặc dù chúng tôi khuyên dùng các mô hình được cung cấp qua [OpenCode Zen](https://opencode.ai/zen), OpenCode có thể được sử dụng với Claude, OpenAI, Google, hoặc thậm chí các mô hình chạy cục bộ. Khi các mô hình phát triển, khoảng cách giữa chúng sẽ thu hẹp lại và giá cả sẽ giảm, vì vậy việc không phụ thuộc vào nhà cung cấp là rất quan trọng.
-- Hỗ trợ LSP ngay từ đầu
-- Tập trung vào TUI (Giao diện người dùng dòng lệnh). OpenCode được xây dựng bởi những người dùng neovim và đội ngũ tạo ra [terminal.shop](https://terminal.shop); chúng tôi sẽ đẩy giới hạn của những gì có thể làm được trên terminal lên mức tối đa.
-- Kiến trúc client/server. Chẳng hạn, điều này cho phép OpenCode chạy trên máy tính của bạn trong khi bạn điều khiển nó từ xa qua một ứng dụng di động, nghĩa là frontend TUI chỉ là một trong những client có thể dùng.
-
----
-
-**Tham gia cộng đồng của chúng tôi** [Discord](https://discord.gg/opencode) | [X.com](https://x.com/opencode)

README.zh.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)
@@ -137,4 +135,4 @@ OpenCode 内置两种 Agent，可用 `Tab` 键快速切换：
 
 ---
 
-**加入我们的社区** [飞书](https://applink.feishu.cn/client/chat/chatter/add_by_link?link_token=de8k6664-1b5e-43f2-8efd-21d6772647b5&qr_code=true) | [X.com](https://x.com/opencode)
+**加入我们的社区** [Discord](https://discord.gg/opencode) | [X.com](https://x.com/opencode)

README.zht.md

@@ -27,7 +27,6 @@
   <a href="README.ja.md">日本語</a> |
   <a href="README.pl.md">Polski</a> |
   <a href="README.ru.md">Русский</a> |
-  <a href="README.bs.md">Bosanski</a> |
   <a href="README.ar.md">العربية</a> |
   <a href="README.no.md">Norsk</a> |
   <a href="README.br.md">Português (Brasil)</a> |
@@ -35,8 +34,7 @@
   <a href="README.tr.md">Türkçe</a> |
   <a href="README.uk.md">Українська</a> |
   <a href="README.bn.md">বাংলা</a> |
-  <a href="README.gr.md">Ελληνικά</a> |
-  <a href="README.vi.md">Tiếng Việt</a>
+  <a href="README.gr.md">Ελληνικά</a>
 </p>
 
 [![OpenCode Terminal UI](packages/web/src/assets/lander/screenshot.png)](https://opencode.ai)
@@ -137,4 +135,4 @@ OpenCode 內建了兩種 Agent，您可以使用 `Tab` 鍵快速切換。
 
 ---
 
-**加入我們的社群** [飞书](https://applink.feishu.cn/client/chat/chatter/add_by_link?link_token=de8k6664-1b5e-43f2-8efd-21d6772647b5&qr_code=true) | [X.com](https://x.com/opencode)
+**加入我們的社群** [Discord](https://discord.gg/opencode) | [X.com](https://x.com/opencode)

github/index.ts

@@ -8,7 +8,6 @@ import type { Context as GitHubContext } from "@actions/github/lib/context"
 import type { IssueCommentEvent, PullRequestReviewCommentEvent } from "@octokit/webhooks-types"
 import { createOpencodeClient } from "@opencode-ai/sdk"
 import { spawn } from "node:child_process"
-import { setTimeout as sleep } from "node:timers/promises"
 
 type GitHubAuthor = {
   login: string
@@ -282,7 +281,7 @@ async function assertOpencodeConnected() {
       connected = true
       break
     } catch (e) {}
-    await sleep(300)
+    await Bun.sleep(300)
   } while (retry++ < 30)
 
   if (!connected) {

infra/console.ts

@@ -103,12 +103,6 @@ export const stripeWebhook = new stripe.WebhookEndpoint("StripeWebhookEndpoint",
 const zenLiteProduct = new stripe.Product("ZenLite", {
   name: "OpenCode Go",
 })
-const zenLiteCouponFirstMonth50 = new stripe.Coupon("ZenLiteCouponFirstMonth50", {
-  name: "First month 50% off",
-  percentOff: 50,
-  appliesToProducts: [zenLiteProduct.id],
-  duration: "once",
-})
 const zenLitePrice = new stripe.Price("ZenLitePrice", {
   product: zenLiteProduct.id,
   currency: "usd",
@@ -122,7 +116,6 @@ const ZEN_LITE_PRICE = new sst.Linkable("ZEN_LITE_PRICE", {
   properties: {
     product: zenLiteProduct.id,
     price: zenLitePrice.id,
-    firstMonth50Coupon: zenLiteCouponFirstMonth50.id,
   },
 })
 

nix/hashes.json

@@ -1,8 +1,8 @@
 {
   "nodeModules": {
-    "x86_64-linux": "sha256-WJgo6UclmtQOEubnKMZybdIEhZ1uRTucF61yojjd+l0=",
-    "aarch64-linux": "sha256-QfZ/g7EZFpe6ndR3dG8WvVfMj5Kyd/R/4kkTJfGJxL4=",
-    "aarch64-darwin": "sha256-ezr/R70XJr9eN5l3mgb7HzLF6QsofNEKUOtuxbfli80=",
-    "x86_64-darwin": "sha256-MbsBGS415uEU/n1RQ/5H5pqh+udLY3+oimJ+eS5uJVI="
+    "x86_64-linux": "sha256-8jEwsY7X7N/vKKbVZ0L8Djj2SfH9HCY+2jKSlaCrm9o=",
+    "aarch64-linux": "sha256-L0G7mSzzR+sZW0uACosJGsE2y/Uh3Vi4piXL4UJOmCw=",
+    "aarch64-darwin": "sha256-1S/g/51MSHjDfsL+U8wlt9Rl50hFf7I3fHgbhSqBIP4=",
+    "x86_64-darwin": "sha256-cveFpKVwcrUOzomU4J3wgYEKRwmJQF0KQiRqKgLJqWs="
   }
 }

package.json

@@ -41,9 +41,8 @@
       "@tailwindcss/vite": "4.1.11",
       "diff": "8.0.2",
       "dompurify": "3.3.1",
-      "drizzle-kit": "1.0.0-beta.16-ea816b6",
-      "drizzle-orm": "1.0.0-beta.16-ea816b6",
-      "effect": "4.0.0-beta.31",
+      "drizzle-kit": "1.0.0-beta.12-a5629fb",
+      "drizzle-orm": "1.0.0-beta.12-a5629fb",
       "ai": "5.0.124",
       "hono": "4.10.7",
       "hono-openapi": "1.1.2",
@@ -72,13 +71,12 @@
     "@actions/artifact": "5.0.1",
     "@tsconfig/bun": "catalog:",
     "@types/mime-types": "3.0.1",
-    "@typescript/native-preview": "catalog:",
     "glob": "13.0.5",
     "husky": "9.1.7",
     "prettier": "3.6.2",
     "semver": "^7.6.0",
     "sst": "3.18.10",
-    "turbo": "2.8.13"
+    "turbo": "2.5.6"
   },
   "dependencies": {
     "@aws-sdk/client-s3": "3.933.0",
@@ -101,8 +99,7 @@
     "protobufjs",
     "tree-sitter",
     "tree-sitter-bash",
-    "web-tree-sitter",
-    "electron"
+    "web-tree-sitter"
   ],
   "overrides": {
     "@types/bun": "catalog:",

packages/app/e2e/AGENTS.md

@@ -70,15 +70,7 @@ test("test description", async ({ page, sdk, gotoSession }) => {
 - `openSettings(page)` - Open settings dialog
 - `closeDialog(page, dialog)` - Close any dialog
 - `openSidebar(page)` / `closeSidebar(page)` - Toggle sidebar
-- `waitTerminalReady(page, { term? })` - Wait for a mounted terminal to connect and finish rendering output
-- `runTerminal(page, { cmd, token, term?, timeout? })` - Type into the terminal via the browser and wait for rendered output
 - `withSession(sdk, title, callback)` - Create temp session
-- `withProject(...)` - Create temp project/workspace
-- `sessionIDFromUrl(url)` - Read session ID from URL
-- `slugFromUrl(url)` - Read workspace slug from URL
-- `waitSlug(page, skip?)` - Wait for resolved workspace slug
-- `trackSession(sessionID, directory?)` - Register session for fixture cleanup
-- `trackDirectory(directory)` - Register directory for fixture cleanup
 - `clickListItem(container, filter)` - Click list item by key/text
 
 **Selectors** (`selectors.ts`):
@@ -117,7 +109,7 @@ import { test, expect } from "@playwright/test"
 
 ### Error Handling
 
-Tests should clean up after themselves. Prefer fixture-managed cleanup:
+Tests should clean up after themselves:
 
 ```typescript
 test("test with cleanup", async ({ page, sdk, gotoSession }) => {
@@ -128,11 +120,6 @@ test("test with cleanup", async ({ page, sdk, gotoSession }) => {
 })
 ```
 
-- Prefer `withSession(...)` for temp sessions
-- In `withProject(...)` tests that create sessions or extra workspaces, call `trackSession(sessionID, directory?)` and `trackDirectory(directory)`
-- This lets fixture teardown abort, wait for idle, and clean up safely under CI concurrency
-- Avoid calling `sdk.session.delete(...)` directly
-
 ### Timeouts
 
 Default: 60s per test, 10s per assertion. Override when needed:
@@ -169,41 +156,14 @@ await page.keyboard.press(`${modKey}+B`) // Toggle sidebar
 await page.keyboard.press(`${modKey}+Comma`) // Open settings
 ```
 
-### Terminal Tests
-
-- In terminal tests, type through the browser. Do not write to the PTY through the SDK.
-- Use `waitTerminalReady(page, { term? })` and `runTerminal(page, { cmd, token, term?, timeout? })` from `actions.ts`.
-- These helpers use the fixture-enabled test-only terminal driver and wait for output after the terminal writer settles.
-- Avoid `waitForTimeout` and custom DOM or `data-*` readiness checks.
-
-### Wait on state
-
-- Never use wall-clock waits like `page.waitForTimeout(...)` to make a test pass
-- Avoid race-prone flows that assume work is finished after an action
-- Wait or poll on observable state with `expect(...)`, `expect.poll(...)`, or existing helpers
-- Prefer locator assertions like `toBeVisible()`, `toHaveCount(0)`, and `toHaveAttribute(...)` for normal UI state, and reserve `expect.poll(...)` for probe, mock, or backend state
-
-### Add hooks
-
-- If required state is not observable from the UI, add a small test-only driver or probe in app code instead of sleeps or fragile DOM checks
-- Keep these hooks minimal and purpose-built, following the style of `packages/app/src/testing/terminal.ts`
-- Test-only hooks must be inert unless explicitly enabled; do not add normal-runtime listeners, reactive subscriptions, or per-update allocations for e2e ceremony
-- When mocking routes or APIs, expose explicit mock state and wait on that before asserting post-action UI
-
-### Prefer helpers
-
-- Prefer fluent helpers and drivers when they make intent obvious and reduce locator-heavy noise
-- Use direct locators when the interaction is simple and a helper would not add clarity
-
 ## Writing New Tests
 
 1. Choose appropriate folder or create new one
 2. Import from `../fixtures`
 3. Use helper functions from `../actions` and `../selectors`
-4. When validating routing, use shared helpers from `../actions`. Workspace URL slugs can be canonicalized on Windows, so assert against canonical or resolved workspace slugs.
-5. Clean up any created resources
-6. Use specific selectors (avoid CSS classes)
-7. Test one feature per test file
+4. Clean up any created resources
+5. Use specific selectors (avoid CSS classes)
+6. Test one feature per test file
 
 ## Local Development
 

packages/app/e2e/actions.ts

@@ -3,23 +3,22 @@ import fs from "node:fs/promises"
 import os from "node:os"
 import path from "node:path"
 import { execSync } from "node:child_process"
-import { terminalAttr, type E2EWindow } from "../src/testing/terminal"
-import { createSdk, modKey, resolveDirectory, serverUrl } from "./utils"
+import { modKey, serverUrl } from "./utils"
 import {
+  sessionItemSelector,
   dropdownMenuTriggerSelector,
   dropdownMenuContentSelector,
   projectMenuTriggerSelector,
-  projectCloseMenuSelector,
   projectWorkspacesToggleSelector,
   titlebarRightSelector,
   popoverBodySelector,
   listItemSelector,
   listItemKeySelector,
   listItemKeyStartsWithSelector,
-  terminalSelector,
   workspaceItemSelector,
   workspaceMenuTriggerSelector,
 } from "./selectors"
+import type { createSdk } from "./utils"
 
 export async function defocus(page: Page) {
   await page
@@ -30,69 +29,6 @@ export async function defocus(page: Page) {
     .catch(() => undefined)
 }
 
-async function terminalID(term: Locator) {
-  const id = await term.getAttribute(terminalAttr)
-  if (id) return id
-  throw new Error(`Active terminal missing ${terminalAttr}`)
-}
-
-export async function terminalConnects(page: Page, input?: { term?: Locator }) {
-  const term = input?.term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(term)
-  return page.evaluate((id) => {
-    return (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id]?.connects ?? 0
-  }, id)
-}
-
-export async function disconnectTerminal(page: Page, input?: { term?: Locator }) {
-  const term = input?.term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(term)
-  await page.evaluate((id) => {
-    ;(window as E2EWindow).__opencode_e2e?.terminal?.controls?.[id]?.disconnect?.()
-  }, id)
-}
-
-async function terminalReady(page: Page, term?: Locator) {
-  const next = term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(next)
-  return page.evaluate((id) => {
-    const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id]
-    return !!state?.connected && (state.settled ?? 0) > 0
-  }, id)
-}
-
-async function terminalHas(page: Page, input: { term?: Locator; token: string }) {
-  const next = input.term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(next)
-  return page.evaluate(
-    (input) => {
-      const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[input.id]
-      return state?.rendered.includes(input.token) ?? false
-    },
-    { id, token: input.token },
-  )
-}
-
-export async function waitTerminalReady(page: Page, input?: { term?: Locator; timeout?: number }) {
-  const term = input?.term ?? page.locator(terminalSelector).first()
-  const timeout = input?.timeout ?? 10_000
-  await expect(term).toBeVisible()
-  await expect(term.locator("textarea")).toHaveCount(1)
-  await expect.poll(() => terminalReady(page, term), { timeout }).toBe(true)
-}
-
-export async function runTerminal(page: Page, input: { cmd: string; token: string; term?: Locator; timeout?: number }) {
-  const term = input.term ?? page.locator(terminalSelector).first()
-  const timeout = input.timeout ?? 10_000
-  await waitTerminalReady(page, { term, timeout })
-  const textarea = term.locator("textarea")
-  await term.click()
-  await expect(textarea).toBeFocused()
-  await page.keyboard.type(input.cmd)
-  await page.keyboard.press("Enter")
-  await expect.poll(() => terminalHas(page, { term, token: input.token }), { timeout }).toBe(true)
-}
-
 export async function openPalette(page: Page) {
   await defocus(page)
   await page.keyboard.press(`${modKey}+P`)
@@ -125,9 +61,9 @@ export async function closeDialog(page: Page, dialog: Locator) {
 }
 
 export async function isSidebarClosed(page: Page) {
-  const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
-  await expect(button).toBeVisible()
-  return (await button.getAttribute("aria-expanded")) !== "true"
+  const main = page.locator("main")
+  const classes = (await main.getAttribute("class")) ?? ""
+  return classes.includes("xl:border-l")
 }
 
 export async function toggleSidebar(page: Page) {
@@ -139,34 +75,48 @@ export async function openSidebar(page: Page) {
   if (!(await isSidebarClosed(page))) return
 
   const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
-  await button.click()
+  const visible = await button
+    .isVisible()
+    .then((x) => x)
+    .catch(() => false)
 
-  const opened = await expect(button)
-    .toHaveAttribute("aria-expanded", "true", { timeout: 1500 })
+  if (visible) await button.click()
+  if (!visible) await toggleSidebar(page)
+
+  const main = page.locator("main")
+  const opened = await expect(main)
+    .not.toHaveClass(/xl:border-l/, { timeout: 1500 })
     .then(() => true)
     .catch(() => false)
 
   if (opened) return
 
   await toggleSidebar(page)
-  await expect(button).toHaveAttribute("aria-expanded", "true")
+  await expect(main).not.toHaveClass(/xl:border-l/)
 }
 
 export async function closeSidebar(page: Page) {
   if (await isSidebarClosed(page)) return
 
   const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
-  await button.click()
+  const visible = await button
+    .isVisible()
+    .then((x) => x)
+    .catch(() => false)
 
-  const closed = await expect(button)
-    .toHaveAttribute("aria-expanded", "false", { timeout: 1500 })
+  if (visible) await button.click()
+  if (!visible) await toggleSidebar(page)
+
+  const main = page.locator("main")
+  const closed = await expect(main)
+    .toHaveClass(/xl:border-l/, { timeout: 1500 })
     .then(() => true)
     .catch(() => false)
 
   if (closed) return
 
   await toggleSidebar(page)
-  await expect(button).toHaveAttribute("aria-expanded", "false")
+  await expect(main).toHaveClass(/xl:border-l/)
 }
 
 export async function openSettings(page: Page) {
@@ -247,48 +197,17 @@ export async function createTestProject() {
   await fs.writeFile(path.join(root, "README.md"), "# e2e\n")
 
   execSync("git init", { cwd: root, stdio: "ignore" })
-  execSync("git config core.fsmonitor false", { cwd: root, stdio: "ignore" })
   execSync("git add -A", { cwd: root, stdio: "ignore" })
   execSync('git -c user.name="e2e" -c user.email="e2e@example.com" commit -m "init" --allow-empty', {
     cwd: root,
     stdio: "ignore",
   })
 
-  return resolveDirectory(root)
+  return root
 }
 
 export async function cleanupTestProject(directory: string) {
-  try {
-    execSync("git fsmonitor--daemon stop", { cwd: directory, stdio: "ignore" })
-  } catch {}
-  await fs.rm(directory, { recursive: true, force: true, maxRetries: 5, retryDelay: 100 }).catch(() => undefined)
-}
-
-export function slugFromUrl(url: string) {
-  return /\/([^/]+)\/session(?:[/?#]|$)/.exec(url)?.[1] ?? ""
-}
-
-export async function waitSlug(page: Page, skip: string[] = []) {
-  let prev = ""
-  let next = ""
-  await expect
-    .poll(
-      () => {
-        const slug = slugFromUrl(page.url())
-        if (!slug) return ""
-        if (skip.includes(slug)) return ""
-        if (slug !== prev) {
-          prev = slug
-          next = ""
-          return ""
-        }
-        next = slug
-        return slug
-      },
-      { timeout: 45_000 },
-    )
-    .not.toBe("")
-  return next
+  await fs.rm(directory, { recursive: true, force: true }).catch(() => undefined)
 }
 
 export function sessionIDFromUrl(url: string) {
@@ -297,7 +216,7 @@ export function sessionIDFromUrl(url: string) {
 }
 
 export async function hoverSessionItem(page: Page, sessionID: string) {
-  const sessionEl = page.locator(`[data-session-id="${sessionID}"]`).last()
+  const sessionEl = page.locator(sessionItemSelector(sessionID)).first()
   await expect(sessionEl).toBeVisible()
   await sessionEl.hover()
   return sessionEl
@@ -398,57 +317,6 @@ export async function clickListItem(
   return item
 }
 
-async function status(sdk: ReturnType<typeof createSdk>, sessionID: string) {
-  const data = await sdk.session
-    .status()
-    .then((x) => x.data ?? {})
-    .catch(() => undefined)
-  return data?.[sessionID]
-}
-
-async function stable(sdk: ReturnType<typeof createSdk>, sessionID: string, timeout = 10_000) {
-  let prev = ""
-  await expect
-    .poll(
-      async () => {
-        const info = await sdk.session
-          .get({ sessionID })
-          .then((x) => x.data)
-          .catch(() => undefined)
-        if (!info) return true
-        const next = `${info.title}:${info.time.updated ?? info.time.created}`
-        if (next !== prev) {
-          prev = next
-          return false
-        }
-        return true
-      },
-      { timeout },
-    )
-    .toBe(true)
-}
-
-export async function waitSessionIdle(sdk: ReturnType<typeof createSdk>, sessionID: string, timeout = 30_000) {
-  await expect.poll(() => status(sdk, sessionID).then((x) => !x || x.type === "idle"), { timeout }).toBe(true)
-}
-
-export async function cleanupSession(input: {
-  sessionID: string
-  directory?: string
-  sdk?: ReturnType<typeof createSdk>
-}) {
-  const sdk = input.sdk ?? (input.directory ? createSdk(input.directory) : undefined)
-  if (!sdk) throw new Error("cleanupSession requires sdk or directory")
-  await waitSessionIdle(sdk, input.sessionID, 5_000).catch(() => undefined)
-  const current = await status(sdk, input.sessionID).catch(() => undefined)
-  if (current && current.type !== "idle") {
-    await sdk.session.abort({ sessionID: input.sessionID }).catch(() => undefined)
-    await waitSessionIdle(sdk, input.sessionID).catch(() => undefined)
-  }
-  await stable(sdk, input.sessionID).catch(() => undefined)
-  await sdk.session.delete({ sessionID: input.sessionID }).catch(() => undefined)
-}
-
 export async function withSession<T>(
   sdk: ReturnType<typeof createSdk>,
   title: string,
@@ -460,7 +328,7 @@ export async function withSession<T>(
   try {
     return await callback(session)
   } finally {
-    await cleanupSession({ sdk, sessionID: session.id })
+    await sdk.session.delete({ sessionID: session.id }).catch(() => undefined)
   }
 }
 
@@ -573,64 +441,6 @@ export async function seedSessionPermission(
   return { id: result.id }
 }
 
-export async function seedSessionTask(
-  sdk: ReturnType<typeof createSdk>,
-  input: {
-    sessionID: string
-    description: string
-    prompt: string
-    subagentType?: string
-  },
-) {
-  const text = [
-    "Your only valid response is one task tool call.",
-    `Use this JSON input: ${JSON.stringify({
-      description: input.description,
-      prompt: input.prompt,
-      subagent_type: input.subagentType ?? "general",
-    })}`,
-    "Do not output plain text.",
-    "Wait for the task to start and return the child session id.",
-  ].join("\n")
-
-  const result = await seed({
-    sdk,
-    sessionID: input.sessionID,
-    prompt: text,
-    timeout: 90_000,
-    probe: async () => {
-      const messages = await sdk.session.messages({ sessionID: input.sessionID, limit: 50 }).then((x) => x.data ?? [])
-      const part = messages
-        .flatMap((message) => message.parts)
-        .find((part) => {
-          if (part.type !== "tool" || part.tool !== "task") return false
-          if (!("state" in part) || !part.state || typeof part.state !== "object") return false
-          if (!("input" in part.state) || !part.state.input || typeof part.state.input !== "object") return false
-          if (!("description" in part.state.input) || part.state.input.description !== input.description) return false
-          if (!("metadata" in part.state) || !part.state.metadata || typeof part.state.metadata !== "object")
-            return false
-          if (!("sessionId" in part.state.metadata)) return false
-          return typeof part.state.metadata.sessionId === "string" && part.state.metadata.sessionId.length > 0
-        })
-
-      if (!part || !("state" in part) || !part.state || typeof part.state !== "object") return
-      if (!("metadata" in part.state) || !part.state.metadata || typeof part.state.metadata !== "object") return
-      if (!("sessionId" in part.state.metadata)) return
-      const id = part.state.metadata.sessionId
-      if (typeof id !== "string" || !id) return
-      const child = await sdk.session
-        .get({ sessionID: id })
-        .then((x) => x.data)
-        .catch(() => undefined)
-      if (!child?.id) return
-      return { sessionID: id }
-    },
-  })
-
-  if (!result) throw new Error("Timed out seeding task tool")
-  return result
-}
-
 export async function seedSessionTodos(
   sdk: ReturnType<typeof createSdk>,
   input: {
@@ -705,42 +515,32 @@ export async function openProjectMenu(page: Page, projectSlug: string) {
   const trigger = page.locator(projectMenuTriggerSelector(projectSlug)).first()
   await expect(trigger).toHaveCount(1)
 
-  const menu = page
-    .locator(dropdownMenuContentSelector)
-    .filter({ has: page.locator(projectCloseMenuSelector(projectSlug)) })
-    .first()
-  const close = menu.locator(projectCloseMenuSelector(projectSlug)).first()
-
-  const clicked = await trigger
-    .click({ timeout: 1500 })
-    .then(() => true)
-    .catch(() => false)
-
-  if (clicked) {
-    const opened = await menu
-      .waitFor({ state: "visible", timeout: 1500 })
-      .then(() => true)
-      .catch(() => false)
-    if (opened) {
-      await expect(close).toBeVisible()
-      return menu
-    }
-  }
-
   await trigger.focus()
   await page.keyboard.press("Enter")
 
+  const menu = page.locator(dropdownMenuContentSelector).first()
   const opened = await menu
     .waitFor({ state: "visible", timeout: 1500 })
     .then(() => true)
     .catch(() => false)
 
   if (opened) {
-    await expect(close).toBeVisible()
+    const viewport = page.viewportSize()
+    const x = viewport ? Math.max(viewport.width - 5, 0) : 1200
+    const y = viewport ? Math.max(viewport.height - 5, 0) : 800
+    await page.mouse.move(x, y)
     return menu
   }
 
-  throw new Error(`Failed to open project menu: ${projectSlug}`)
+  await trigger.click({ force: true })
+
+  await expect(menu).toBeVisible()
+
+  const viewport = page.viewportSize()
+  const x = viewport ? Math.max(viewport.width - 5, 0) : 1200
+  const y = viewport ? Math.max(viewport.height - 5, 0) : 800
+  await page.mouse.move(x, y)
+  return menu
 }
 
 export async function setWorkspacesEnabled(page: Page, projectSlug: string, enabled: boolean) {
@@ -753,18 +553,11 @@ export async function setWorkspacesEnabled(page: Page, projectSlug: string, enab
 
   if (current === enabled) return
 
-  const flip = async (timeout?: number) => {
-    const menu = await openProjectMenu(page, projectSlug)
-    const toggle = menu.locator(projectWorkspacesToggleSelector(projectSlug)).first()
-    await expect(toggle).toBeVisible()
-    return toggle.click({ force: true, timeout })
-  }
+  await openProjectMenu(page, projectSlug)
 
-  const flipped = await flip(1500)
-    .then(() => true)
-    .catch(() => false)
-
-  if (!flipped) await flip()
+  const toggle = page.locator(projectWorkspacesToggleSelector(projectSlug)).first()
+  await expect(toggle).toBeVisible()
+  await toggle.click({ force: true })
 
   const expected = enabled ? "New workspace" : "New session"
   await expect(page.getByRole("button", { name: expected }).first()).toBeVisible()

packages/app/e2e/app/home.spec.ts

@@ -1,17 +1,17 @@
 import { test, expect } from "../fixtures"
-import { serverNamePattern } from "../utils"
+import { serverName } from "../utils"
 
 test("home renders and shows core entrypoints", async ({ page }) => {
   await page.goto("/")
 
   await expect(page.getByRole("button", { name: "Open project" }).first()).toBeVisible()
-  await expect(page.getByRole("button", { name: serverNamePattern })).toBeVisible()
+  await expect(page.getByRole("button", { name: serverName })).toBeVisible()
 })
 
 test("server picker dialog opens from home", async ({ page }) => {
   await page.goto("/")
 
-  const trigger = page.getByRole("button", { name: serverNamePattern })
+  const trigger = page.getByRole("button", { name: serverName })
   await expect(trigger).toBeVisible()
   await trigger.click()
 

packages/app/e2e/app/server-default.spec.ts

@@ -1,6 +1,6 @@
 import { test, expect } from "../fixtures"
-import { serverNamePattern, serverUrls } from "../utils"
-import { closeDialog, clickMenuItem } from "../actions"
+import { serverName, serverUrl } from "../utils"
+import { clickListItem, closeDialog, clickMenuItem } from "../actions"
 
 const DEFAULT_SERVER_URL_KEY = "opencode.settings.dat:defaultServerUrl"
 
@@ -31,9 +31,10 @@ test("can set a default server on web", async ({ page, gotoSession }) => {
   const dialog = page.getByRole("dialog")
   await expect(dialog).toBeVisible()
 
-  await expect(dialog.getByText(serverNamePattern).first()).toBeVisible()
+  const row = dialog.locator('[data-slot="list-item"]').filter({ hasText: serverName }).first()
+  await expect(row).toBeVisible()
 
-  const menuTrigger = dialog.locator('[data-slot="dropdown-menu-trigger"]').first()
+  const menuTrigger = row.locator('[data-slot="dropdown-menu-trigger"]').first()
   await expect(menuTrigger).toBeVisible()
   await menuTrigger.click({ force: true })
 
@@ -41,18 +42,14 @@ test("can set a default server on web", async ({ page, gotoSession }) => {
   await expect(menu).toBeVisible()
   await clickMenuItem(menu, /set as default/i)
 
-  await expect
-    .poll(async () =>
-      serverUrls.includes((await page.evaluate((key) => localStorage.getItem(key), DEFAULT_SERVER_URL_KEY)) ?? ""),
-    )
-    .toBe(true)
-  await expect(dialog.getByText("Default", { exact: true })).toBeVisible()
+  await expect.poll(() => page.evaluate((key) => localStorage.getItem(key), DEFAULT_SERVER_URL_KEY)).toBe(serverUrl)
+  await expect(row.getByText("Default", { exact: true })).toBeVisible()
 
   await closeDialog(page, dialog)
 
   await ensurePopoverOpen()
 
-  const serverRow = popover.locator("button").filter({ hasText: serverNamePattern }).first()
+  const serverRow = popover.locator("button").filter({ hasText: serverName }).first()
   await expect(serverRow).toBeVisible()
   await expect(serverRow.getByText("Default", { exact: true })).toBeVisible()
 })

packages/app/e2e/app/titlebar-history.spec.ts

@@ -16,6 +16,7 @@ test("titlebar back/forward navigates between sessions", async ({ page, slug, sd
 
       const link = page.locator(`[data-session-id="${two.id}"] a`).first()
       await expect(link).toBeVisible()
+      await link.scrollIntoViewIfNeeded()
       await link.click()
 
       await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`))
@@ -55,6 +56,7 @@ test("titlebar forward is cleared after branching history from sidebar", async (
 
         const second = page.locator(`[data-session-id="${b.id}"] a`).first()
         await expect(second).toBeVisible()
+        await second.scrollIntoViewIfNeeded()
         await second.click()
 
         await expect(page).toHaveURL(new RegExp(`/${slug}/session/${b.id}(?:\\?|#|$)`))
@@ -74,6 +76,7 @@ test("titlebar forward is cleared after branching history from sidebar", async (
 
         const third = page.locator(`[data-session-id="${c.id}"] a`).first()
         await expect(third).toBeVisible()
+        await third.scrollIntoViewIfNeeded()
         await third.click()
 
         await expect(page).toHaveURL(new RegExp(`/${slug}/session/${c.id}(?:\\?|#|$)`))
@@ -99,6 +102,7 @@ test("keyboard shortcuts navigate titlebar history", async ({ page, slug, sdk, g
 
       const link = page.locator(`[data-session-id="${two.id}"] a`).first()
       await expect(link).toBeVisible()
+      await link.scrollIntoViewIfNeeded()
       await link.click()
 
       await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`))

packages/app/e2e/commands/panels.spec.ts

@@ -10,8 +10,6 @@ const expanded = async (el: { getAttribute: (name: string) => Promise<string | n
 test("review panel can be toggled via keybind", async ({ page, gotoSession }) => {
   await gotoSession()
 
-  const reviewPanel = page.locator("#review-panel")
-
   const treeToggle = page.getByRole("button", { name: "Toggle file tree" }).first()
   await expect(treeToggle).toBeVisible()
   if (await expanded(treeToggle)) await treeToggle.click()
@@ -21,13 +19,13 @@ test("review panel can be toggled via keybind", async ({ page, gotoSession }) =>
   await expect(reviewToggle).toBeVisible()
   if (await expanded(reviewToggle)) await reviewToggle.click()
   await expect(reviewToggle).toHaveAttribute("aria-expanded", "false")
-  await expect(reviewPanel).toHaveAttribute("aria-hidden", "true")
+  await expect(page.locator("#review-panel")).toHaveCount(0)
 
   await page.keyboard.press(`${modKey}+Shift+R`)
   await expect(reviewToggle).toHaveAttribute("aria-expanded", "true")
-  await expect(reviewPanel).toHaveAttribute("aria-hidden", "false")
+  await expect(page.locator("#review-panel")).toBeVisible()
 
   await page.keyboard.press(`${modKey}+Shift+R`)
   await expect(reviewToggle).toHaveAttribute("aria-expanded", "false")
-  await expect(reviewPanel).toHaveAttribute("aria-hidden", "true")
+  await expect(page.locator("#review-panel")).toHaveCount(0)
 })

packages/app/e2e/files/file-tree.spec.ts

@@ -43,13 +43,6 @@ test("file tree can expand folders and open a file", async ({ page, gotoSession
   await tab.click()
   await expect(tab).toHaveAttribute("aria-selected", "true")
 
-  await toggle.click()
-  await expect(toggle).toHaveAttribute("aria-expanded", "false")
-
-  await toggle.click()
-  await expect(toggle).toHaveAttribute("aria-expanded", "true")
-  await expect(allTab).toHaveAttribute("aria-selected", "true")
-
   const viewer = page.locator('[data-component="file"][data-mode="text"]').first()
   await expect(viewer).toBeVisible()
   await expect(viewer).toContainText("export default function FileTree")

packages/app/e2e/files/file-viewer.spec.ts

@@ -101,56 +101,3 @@ test("cmd+f opens text viewer search while prompt is focused", async ({ page, go
   await expect(findInput).toBeVisible()
   await expect(findInput).toBeFocused()
 })
-
-test("cmd+f opens text viewer search while prompt is not focused", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  await page.locator(promptSelector).click()
-  await page.keyboard.type("/open")
-
-  const command = page.locator('[data-slash-id="file.open"]').first()
-  await expect(command).toBeVisible()
-  await page.keyboard.press("Enter")
-
-  const dialog = page
-    .getByRole("dialog")
-    .filter({ has: page.getByPlaceholder(/search files/i) })
-    .first()
-  await expect(dialog).toBeVisible()
-
-  const input = dialog.getByRole("textbox").first()
-  await input.fill("package.json")
-
-  const items = dialog.locator('[data-slot="list-item"][data-key^="file:"]')
-  let index = -1
-  await expect
-    .poll(
-      async () => {
-        const keys = await items.evaluateAll((nodes) => nodes.map((node) => node.getAttribute("data-key") ?? ""))
-        index = keys.findIndex((key) => /packages[\\/]+app[\\/]+package\.json$/i.test(key.replace(/^file:/, "")))
-        return index >= 0
-      },
-      { timeout: 30_000 },
-    )
-    .toBe(true)
-
-  const item = items.nth(index)
-  await expect(item).toBeVisible()
-  await item.click()
-
-  await expect(dialog).toHaveCount(0)
-
-  const tab = page.getByRole("tab", { name: "package.json" })
-  await expect(tab).toBeVisible()
-  await tab.click()
-
-  const viewer = page.locator('[data-component="file"][data-mode="text"]').first()
-  await expect(viewer).toBeVisible()
-
-  await viewer.click()
-  await page.keyboard.press(`${modKey}+f`)
-
-  const findInput = page.getByPlaceholder("Find")
-  await expect(findInput).toBeVisible()
-  await expect(findInput).toBeFocused()
-})

packages/app/e2e/fixtures.ts

@@ -1,6 +1,5 @@
 import { test as base, expect, type Page } from "@playwright/test"
-import type { E2EWindow } from "../src/testing/terminal"
-import { cleanupSession, cleanupTestProject, createTestProject, seedProjects, sessionIDFromUrl } from "./actions"
+import { cleanupTestProject, createTestProject, seedProjects } from "./actions"
 import { promptSelector } from "./selectors"
 import { createSdk, dirSlug, getWorktree, sessionPath } from "./utils"
 
@@ -14,8 +13,6 @@ type TestFixtures = {
       directory: string
       slug: string
       gotoSession: (sessionID?: string) => Promise<void>
-      trackSession: (sessionID: string, directory?: string) => void
-      trackDirectory: (directory: string) => void
     }) => Promise<T>,
     options?: { extra?: string[] },
   ) => Promise<T>
@@ -54,36 +51,20 @@ export const test = base.extend<TestFixtures, WorkerFixtures>({
   },
   withProject: async ({ page }, use) => {
     await use(async (callback, options) => {
-      const root = await createTestProject()
-      const slug = dirSlug(root)
-      const sessions = new Map<string, string>()
-      const dirs = new Set<string>()
-      await seedStorage(page, { directory: root, extra: options?.extra })
+      const directory = await createTestProject()
+      const slug = dirSlug(directory)
+      await seedStorage(page, { directory, extra: options?.extra })
 
       const gotoSession = async (sessionID?: string) => {
-        await page.goto(sessionPath(root, sessionID))
+        await page.goto(sessionPath(directory, sessionID))
         await expect(page.locator(promptSelector)).toBeVisible()
-        const current = sessionIDFromUrl(page.url())
-        if (current) trackSession(current)
-      }
-
-      const trackSession = (sessionID: string, directory?: string) => {
-        sessions.set(sessionID, directory ?? root)
-      }
-
-      const trackDirectory = (directory: string) => {
-        if (directory !== root) dirs.add(directory)
       }
 
       try {
         await gotoSession()
-        return await callback({ directory: root, slug, gotoSession, trackSession, trackDirectory })
+        return await callback({ directory, slug, gotoSession })
       } finally {
-        await Promise.allSettled(
-          Array.from(sessions, ([sessionID, directory]) => cleanupSession({ sessionID, directory })),
-        )
-        await Promise.allSettled(Array.from(dirs, (directory) => cleanupTestProject(directory)))
-        await cleanupTestProject(root)
+        await cleanupTestProject(directory)
       }
     })
   },
@@ -92,17 +73,6 @@ export const test = base.extend<TestFixtures, WorkerFixtures>({
 async function seedStorage(page: Page, input: { directory: string; extra?: string[] }) {
   await seedProjects(page, input)
   await page.addInitScript(() => {
-    const win = window as E2EWindow
-    win.__opencode_e2e = {
-      ...win.__opencode_e2e,
-      model: {
-        enabled: true,
-      },
-      terminal: {
-        enabled: true,
-        terminals: {},
-      },
-    }
     localStorage.setItem(
       "opencode.global.dat:model",
       JSON.stringify({

packages/app/e2e/projects/project-edit.spec.ts

@@ -1,15 +1,25 @@
 import { test, expect } from "../fixtures"
-import { clickMenuItem, openProjectMenu, openSidebar } from "../actions"
+import { openSidebar } from "../actions"
 
 test("dialog edit project updates name and startup script", async ({ page, withProject }) => {
   await page.setViewportSize({ width: 1400, height: 800 })
 
-  await withProject(async ({ slug }) => {
+  await withProject(async () => {
     await openSidebar(page)
 
     const open = async () => {
-      const menu = await openProjectMenu(page, slug)
-      await clickMenuItem(menu, /^Edit$/i, { force: true })
+      const header = page.locator(".group\\/project").first()
+      await header.hover()
+      const trigger = header.getByRole("button", { name: "More options" }).first()
+      await expect(trigger).toBeVisible()
+      await trigger.click({ force: true })
+
+      const menu = page.locator('[data-component="dropdown-menu-content"]').first()
+      await expect(menu).toBeVisible()
+
+      const editItem = menu.getByRole("menuitem", { name: "Edit" }).first()
+      await expect(editItem).toBeVisible()
+      await editItem.click({ force: true })
 
       const dialog = page.getByRole("dialog")
       await expect(dialog).toBeVisible()

packages/app/e2e/projects/projects-close.spec.ts

@@ -1,8 +1,36 @@
 import { test, expect } from "../fixtures"
 import { createTestProject, cleanupTestProject, openSidebar, clickMenuItem, openProjectMenu } from "../actions"
-import { projectSwitchSelector } from "../selectors"
+import { projectCloseHoverSelector, projectSwitchSelector } from "../selectors"
 import { dirSlug } from "../utils"
 
+test("can close a project via hover card close button", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const otherSlug = dirSlug(other)
+
+  try {
+    await withProject(
+      async () => {
+        await openSidebar(page)
+
+        const otherButton = page.locator(projectSwitchSelector(otherSlug)).first()
+        await expect(otherButton).toBeVisible()
+        await otherButton.hover()
+
+        const close = page.locator(projectCloseHoverSelector(otherSlug)).first()
+        await expect(close).toBeVisible()
+        await close.click()
+
+        await expect(otherButton).toHaveCount(0)
+      },
+      { extra: [other] },
+    )
+  } finally {
+    await cleanupTestProject(other)
+  }
+})
+
 test("closing active project navigates to another open project", async ({ page, withProject }) => {
   await page.setViewportSize({ width: 1400, height: 800 })
 
@@ -25,26 +53,16 @@ test("closing active project navigates to another open project", async ({ page,
         await clickMenuItem(menu, /^Close$/i, { force: true })
 
         await expect
-          .poll(
-            () => {
-              const pathname = new URL(page.url()).pathname
-              if (new RegExp(`^/${slug}/session(?:/[^/]+)?/?$`).test(pathname)) return "project"
-              if (pathname === "/") return "home"
-              return ""
-            },
-            { timeout: 15_000 },
-          )
+          .poll(() => {
+            const pathname = new URL(page.url()).pathname
+            if (new RegExp(`^/${slug}/session(?:/[^/]+)?/?$`).test(pathname)) return "project"
+            if (pathname === "/") return "home"
+            return ""
+          })
           .toMatch(/^(project|home)$/)
 
         await expect(page).not.toHaveURL(new RegExp(`/${otherSlug}/session(?:[/?#]|$)`))
-        await expect
-          .poll(
-            async () => {
-              return await page.locator(projectSwitchSelector(otherSlug)).count()
-            },
-            { timeout: 15_000 },
-          )
-          .toBe(0)
+        await expect(otherButton).toHaveCount(0)
       },
       { extra: [other] },
     )

packages/app/e2e/projects/projects-switch.spec.ts

@@ -1,39 +1,18 @@
 import { base64Decode } from "@opencode-ai/util/encode"
-import type { Page } from "@playwright/test"
 import { test, expect } from "../fixtures"
-import { defocus, createTestProject, cleanupTestProject, openSidebar, sessionIDFromUrl, waitSlug } from "../actions"
+import {
+  defocus,
+  createTestProject,
+  cleanupTestProject,
+  openSidebar,
+  setWorkspacesEnabled,
+  sessionIDFromUrl,
+} from "../actions"
 import { projectSwitchSelector, promptSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors"
-import { dirSlug, resolveDirectory } from "../utils"
+import { createSdk, dirSlug, sessionPath } from "../utils"
 
-async function workspaces(page: Page, directory: string, enabled: boolean) {
-  await page.evaluate(
-    ({ directory, enabled }: { directory: string; enabled: boolean }) => {
-      const key = "opencode.global.dat:layout"
-      const raw = localStorage.getItem(key)
-      const data = raw ? JSON.parse(raw) : {}
-      const sidebar = data.sidebar && typeof data.sidebar === "object" ? data.sidebar : {}
-      const current =
-        sidebar.workspaces && typeof sidebar.workspaces === "object" && !Array.isArray(sidebar.workspaces)
-          ? sidebar.workspaces
-          : {}
-      const next = { ...current }
-
-      if (enabled) next[directory] = true
-      if (!enabled) delete next[directory]
-
-      localStorage.setItem(
-        key,
-        JSON.stringify({
-          ...data,
-          sidebar: {
-            ...sidebar,
-            workspaces: next,
-          },
-        }),
-      )
-    },
-    { directory, enabled },
-  )
+function slugFromUrl(url: string) {
+  return /\/([^/]+)\/session(?:\/|$)/.exec(url)?.[1] ?? ""
 }
 
 test("can switch between projects from sidebar", async ({ page, withProject }) => {
@@ -72,39 +51,46 @@ test("switching back to a project opens the latest workspace session", async ({
 
   const other = await createTestProject()
   const otherSlug = dirSlug(other)
+  let rootDir: string | undefined
+  let workspaceDir: string | undefined
+  let sessionID: string | undefined
+
   try {
     await withProject(
-      async ({ directory, slug, trackSession, trackDirectory }) => {
+      async ({ directory, slug }) => {
+        rootDir = directory
         await defocus(page)
-        await workspaces(page, directory, true)
-        await page.reload()
-        await expect(page.locator(promptSelector)).toBeVisible()
         await openSidebar(page)
-        await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()
+        await setWorkspacesEnabled(page, slug, true)
 
         await page.getByRole("button", { name: "New workspace" }).first().click()
 
-        const raw = await waitSlug(page, [slug])
-        const dir = base64Decode(raw)
-        if (!dir) throw new Error(`Failed to decode workspace slug: ${raw}`)
-        const space = await resolveDirectory(dir)
-        const next = dirSlug(space)
-        trackDirectory(space)
+        await expect
+          .poll(
+            () => {
+              const next = slugFromUrl(page.url())
+              if (!next) return ""
+              if (next === slug) return ""
+              return next
+            },
+            { timeout: 45_000 },
+          )
+          .not.toBe("")
+
+        const workspaceSlug = slugFromUrl(page.url())
+        workspaceDir = base64Decode(workspaceSlug)
+        if (!workspaceDir) throw new Error(`Failed to decode workspace slug: ${workspaceSlug}`)
         await openSidebar(page)
 
-        const item = page.locator(`${workspaceItemSelector(next)}, ${workspaceItemSelector(raw)}`).first()
-        await expect(item).toBeVisible()
-        await item.hover()
+        const workspace = page.locator(workspaceItemSelector(workspaceSlug)).first()
+        await expect(workspace).toBeVisible()
+        await workspace.hover()
 
-        const btn = page.locator(`${workspaceNewSessionSelector(next)}, ${workspaceNewSessionSelector(raw)}`).first()
-        await expect(btn).toBeVisible()
-        await btn.click({ force: true })
+        const newSession = page.locator(workspaceNewSessionSelector(workspaceSlug)).first()
+        await expect(newSession).toBeVisible()
+        await newSession.click({ force: true })
 
-        // A new workspace can be discovered via a transient slug before the route and sidebar
-        // settle to the canonical workspace path on Windows, so interact with either and assert
-        // against the resolved workspace slug.
-        await waitSlug(page)
-        await expect(page).toHaveURL(new RegExp(`/${next}/session(?:[/?#]|$)`))
+        await expect(page).toHaveURL(new RegExp(`/${workspaceSlug}/session(?:[/?#]|$)`))
 
         // Create a session by sending a prompt
         const prompt = page.locator(promptSelector)
@@ -117,9 +103,9 @@ test("switching back to a project opens the latest workspace session", async ({
 
         const created = sessionIDFromUrl(page.url())
         if (!created) throw new Error(`Failed to get session ID from url: ${page.url()}`)
-        trackSession(created, space)
+        sessionID = created
 
-        await expect(page).toHaveURL(new RegExp(`/${next}/session/${created}(?:[/?#]|$)`))
+        await expect(page).toHaveURL(new RegExp(`/${workspaceSlug}/session/${created}(?:[/?#]|$)`))
 
         await openSidebar(page)
 
@@ -138,6 +124,20 @@ test("switching back to a project opens the latest workspace session", async ({
       { extra: [other] },
     )
   } finally {
+    if (sessionID) {
+      const id = sessionID
+      const dirs = [rootDir, workspaceDir].filter((x): x is string => !!x)
+      await Promise.all(
+        dirs.map((directory) =>
+          createSdk(directory)
+            .session.delete({ sessionID: id })
+            .catch(() => undefined),
+        ),
+      )
+    }
+    if (workspaceDir) {
+      await cleanupTestProject(workspaceDir)
+    }
     await cleanupTestProject(other)
   }
 })

packages/app/e2e/projects/workspace-new-session.spec.ts

@@ -1,10 +1,14 @@
 import { base64Decode } from "@opencode-ai/util/encode"
 import type { Page } from "@playwright/test"
 import { test, expect } from "../fixtures"
-import { openSidebar, sessionIDFromUrl, setWorkspacesEnabled, slugFromUrl, waitSlug } from "../actions"
+import { cleanupTestProject, openSidebar, sessionIDFromUrl, setWorkspacesEnabled } from "../actions"
 import { promptSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors"
 import { createSdk } from "../utils"
 
+function slugFromUrl(url: string) {
+  return /\/([^/]+)\/session(?:\/|$)/.exec(url)?.[1] ?? ""
+}
+
 async function waitWorkspaceReady(page: Page, slug: string) {
   await openSidebar(page)
   await expect
@@ -27,7 +31,20 @@ async function createWorkspace(page: Page, root: string, seen: string[]) {
   await openSidebar(page)
   await page.getByRole("button", { name: "New workspace" }).first().click()
 
-  const slug = await waitSlug(page, [root, ...seen])
+  await expect
+    .poll(
+      () => {
+        const slug = slugFromUrl(page.url())
+        if (!slug) return ""
+        if (slug === root) return ""
+        if (seen.includes(slug)) return ""
+        return slug
+      },
+      { timeout: 45_000 },
+    )
+    .not.toBe("")
+
+  const slug = slugFromUrl(page.url())
   const directory = base64Decode(slug)
   if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`)
   return { slug, directory }
@@ -43,13 +60,12 @@ async function openWorkspaceNewSession(page: Page, slug: string) {
   await expect(button).toBeVisible()
   await button.click({ force: true })
 
-  const next = await waitSlug(page)
-  await expect(page).toHaveURL(new RegExp(`/${next}/session(?:[/?#]|$)`))
-  return next
+  await expect.poll(() => slugFromUrl(page.url())).toBe(slug)
+  await expect(page).toHaveURL(new RegExp(`/${slug}/session(?:[/?#]|$)`))
 }
 
 async function createSessionFromWorkspace(page: Page, slug: string, text: string) {
-  const next = await openWorkspaceNewSession(page, slug)
+  await openWorkspaceNewSession(page, slug)
 
   const prompt = page.locator(promptSelector)
   await expect(prompt).toBeVisible()
@@ -60,13 +76,13 @@ async function createSessionFromWorkspace(page: Page, slug: string, text: string
   await expect.poll(async () => ((await prompt.textContent()) ?? "").trim()).toContain(text)
   await prompt.press("Enter")
 
-  await expect.poll(() => slugFromUrl(page.url())).toBe(next)
+  await expect.poll(() => slugFromUrl(page.url())).toBe(slug)
   await expect.poll(() => sessionIDFromUrl(page.url()) ?? "", { timeout: 30_000 }).not.toBe("")
 
   const sessionID = sessionIDFromUrl(page.url())
   if (!sessionID) throw new Error(`Failed to parse session id from url: ${page.url()}`)
-  await expect(page).toHaveURL(new RegExp(`/${next}/session/${sessionID}(?:[/?#]|$)`))
-  return { sessionID, slug: next }
+  await expect(page).toHaveURL(new RegExp(`/${slug}/session/${sessionID}(?:[/?#]|$)`))
+  return sessionID
 }
 
 async function sessionDirectory(directory: string, sessionID: string) {
@@ -81,29 +97,48 @@ async function sessionDirectory(directory: string, sessionID: string) {
 test("new sessions from sidebar workspace actions stay in selected workspace", async ({ page, withProject }) => {
   await page.setViewportSize({ width: 1400, height: 800 })
 
-  await withProject(async ({ directory, slug: root, trackSession, trackDirectory }) => {
-    await openSidebar(page)
-    await setWorkspacesEnabled(page, root, true)
+  await withProject(async ({ directory, slug: root }) => {
+    const workspaces = [] as { slug: string; directory: string }[]
+    const sessions = [] as string[]
 
-    const first = await createWorkspace(page, root, [])
-    trackDirectory(first.directory)
-    await waitWorkspaceReady(page, first.slug)
+    try {
+      await openSidebar(page)
+      await setWorkspacesEnabled(page, root, true)
 
-    const second = await createWorkspace(page, root, [first.slug])
-    trackDirectory(second.directory)
-    await waitWorkspaceReady(page, second.slug)
+      const first = await createWorkspace(page, root, [])
+      workspaces.push(first)
+      await waitWorkspaceReady(page, first.slug)
 
-    const firstSession = await createSessionFromWorkspace(page, first.slug, `workspace one ${Date.now()}`)
-    trackSession(firstSession.sessionID, first.directory)
+      const second = await createWorkspace(page, root, [first.slug])
+      workspaces.push(second)
+      await waitWorkspaceReady(page, second.slug)
 
-    const secondSession = await createSessionFromWorkspace(page, second.slug, `workspace two ${Date.now()}`)
-    trackSession(secondSession.sessionID, second.directory)
+      const firstSession = await createSessionFromWorkspace(page, first.slug, `workspace one ${Date.now()}`)
+      sessions.push(firstSession)
 
-    const thirdSession = await createSessionFromWorkspace(page, first.slug, `workspace one again ${Date.now()}`)
-    trackSession(thirdSession.sessionID, first.directory)
+      const secondSession = await createSessionFromWorkspace(page, second.slug, `workspace two ${Date.now()}`)
+      sessions.push(secondSession)
 
-    await expect.poll(() => sessionDirectory(first.directory, firstSession.sessionID)).toBe(first.directory)
-    await expect.poll(() => sessionDirectory(second.directory, secondSession.sessionID)).toBe(second.directory)
-    await expect.poll(() => sessionDirectory(first.directory, thirdSession.sessionID)).toBe(first.directory)
+      const thirdSession = await createSessionFromWorkspace(page, first.slug, `workspace one again ${Date.now()}`)
+      sessions.push(thirdSession)
+
+      await expect.poll(() => sessionDirectory(first.directory, firstSession)).toBe(first.directory)
+      await expect.poll(() => sessionDirectory(second.directory, secondSession)).toBe(second.directory)
+      await expect.poll(() => sessionDirectory(first.directory, thirdSession)).toBe(first.directory)
+    } finally {
+      const dirs = [directory, ...workspaces.map((workspace) => workspace.directory)]
+      await Promise.all(
+        sessions.map((sessionID) =>
+          Promise.all(
+            dirs.map((dir) =>
+              createSdk(dir)
+                .session.delete({ sessionID })
+                .catch(() => undefined),
+            ),
+          ),
+        ),
+      )
+      await Promise.all(workspaces.map((workspace) => cleanupTestProject(workspace.directory)))
+    }
   })
 })

packages/app/e2e/projects/workspaces.spec.ts

@@ -14,12 +14,14 @@ import {
   openSidebar,
   openWorkspaceMenu,
   setWorkspacesEnabled,
-  slugFromUrl,
-  waitSlug,
 } from "../actions"
 import { dropdownMenuContentSelector, inlineInputSelector, workspaceItemSelector } from "../selectors"
 import { createSdk, dirSlug } from "../utils"
 
+function slugFromUrl(url: string) {
+  return /\/([^/]+)\/session(?:\/|$)/.exec(url)?.[1] ?? ""
+}
+
 async function setupWorkspaceTest(page: Page, project: { slug: string }) {
   const rootSlug = project.slug
   await openSidebar(page)
@@ -27,7 +29,17 @@ async function setupWorkspaceTest(page: Page, project: { slug: string }) {
   await setWorkspacesEnabled(page, rootSlug, true)
 
   await page.getByRole("button", { name: "New workspace" }).first().click()
-  const slug = await waitSlug(page, [rootSlug])
+  await expect
+    .poll(
+      () => {
+        const slug = slugFromUrl(page.url())
+        return slug.length > 0 && slug !== rootSlug
+      },
+      { timeout: 45_000 },
+    )
+    .toBe(true)
+
+  const slug = slugFromUrl(page.url())
   const dir = base64Decode(slug)
 
   await openSidebar(page)
@@ -79,7 +91,18 @@ test("can create a workspace", async ({ page, withProject }) => {
     await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()
 
     await page.getByRole("button", { name: "New workspace" }).first().click()
-    const workspaceSlug = await waitSlug(page, [slug])
+
+    await expect
+      .poll(
+        () => {
+          const currentSlug = slugFromUrl(page.url())
+          return currentSlug.length > 0 && currentSlug !== slug
+        },
+        { timeout: 45_000 },
+      )
+      .toBe(true)
+
+    const workspaceSlug = slugFromUrl(page.url())
     const workspaceDir = base64Decode(workspaceSlug)
 
     await openSidebar(page)
@@ -256,7 +279,7 @@ test("can delete a workspace", async ({ page, withProject }) => {
     await clickMenuItem(menu, /^Delete$/i, { force: true })
     await confirmDialog(page, /^Delete workspace$/i)
 
-    await expect.poll(() => base64Decode(slugFromUrl(page.url()))).toBe(project.directory)
+    await expect(page).toHaveURL(new RegExp(`/${rootSlug}/session`))
 
     await expect
       .poll(
@@ -313,6 +336,9 @@ test("can reorder workspaces by drag and drop", async ({ page, withProject }) =>
       const src = page.locator(workspaceItemSelector(from)).first()
       const dst = page.locator(workspaceItemSelector(to)).first()
 
+      await src.scrollIntoViewIfNeeded()
+      await dst.scrollIntoViewIfNeeded()
+
       const a = await src.boundingBox()
       const b = await dst.boundingBox()
       if (!a || !b) throw new Error("Failed to resolve workspace drag bounds")
@@ -331,7 +357,17 @@ test("can reorder workspaces by drag and drop", async ({ page, withProject }) =>
       for (const _ of [0, 1]) {
         const prev = slugFromUrl(page.url())
         await page.getByRole("button", { name: "New workspace" }).first().click()
-        const slug = await waitSlug(page, [rootSlug, prev])
+        await expect
+          .poll(
+            () => {
+              const slug = slugFromUrl(page.url())
+              return slug.length > 0 && slug !== rootSlug && slug !== prev
+            },
+            { timeout: 45_000 },
+          )
+          .toBe(true)
+
+        const slug = slugFromUrl(page.url())
         const dir = base64Decode(slug)
         workspaces.push({ slug, directory: dir })
 

packages/app/e2e/prompt/prompt-async.spec.ts

@@ -1,8 +1,6 @@
 import { test, expect } from "../fixtures"
 import { promptSelector } from "../selectors"
-import { cleanupSession, sessionIDFromUrl, withSession } from "../actions"
-
-const text = (value: string | null) => (value ?? "").replace(/\u200B/g, "").trim()
+import { sessionIDFromUrl } from "../actions"
 
 // Regression test for Issue #12453: the synchronous POST /message endpoint holds
 // the connection open while the agent works, causing "Failed to fetch" over
@@ -40,37 +38,6 @@ test("prompt succeeds when sync message endpoint is unreachable", async ({ page,
       )
       .toContain(token)
   } finally {
-    await cleanupSession({ sdk, sessionID })
+    await sdk.session.delete({ sessionID }).catch(() => undefined)
   }
 })
-
-test("failed prompt send restores the composer input", async ({ page, sdk, gotoSession }) => {
-  await withSession(sdk, `e2e prompt failure ${Date.now()}`, async (session) => {
-    const prompt = page.locator(promptSelector)
-    const value = `restore ${Date.now()}`
-
-    await page.route(`**/session/${session.id}/prompt_async`, (route) =>
-      route.fulfill({
-        status: 500,
-        contentType: "application/json",
-        body: JSON.stringify({ message: "e2e prompt failure" }),
-      }),
-    )
-
-    await gotoSession(session.id)
-    await prompt.click()
-    await page.keyboard.type(value)
-    await page.keyboard.press("Enter")
-
-    await expect.poll(async () => text(await prompt.textContent())).toBe(value)
-    await expect
-      .poll(
-        async () => {
-          const messages = await sdk.session.messages({ sessionID: session.id, limit: 50 }).then((r) => r.data ?? [])
-          return messages.length
-        },
-        { timeout: 15_000 },
-      )
-      .toBe(0)
-  })
-})

packages/app/e2e/prompt/prompt-history.spec.ts

@@ -1,181 +0,0 @@
-import type { ToolPart } from "@opencode-ai/sdk/v2/client"
-import type { Page } from "@playwright/test"
-import { test, expect } from "../fixtures"
-import { withSession } from "../actions"
-import { promptSelector } from "../selectors"
-
-const text = (value: string | null) => (value ?? "").replace(/\u200B/g, "").trim()
-
-const isBash = (part: unknown): part is ToolPart => {
-  if (!part || typeof part !== "object") return false
-  if (!("type" in part) || part.type !== "tool") return false
-  if (!("tool" in part) || part.tool !== "bash") return false
-  return "state" in part
-}
-
-async function edge(page: Page, pos: "start" | "end") {
-  await page.locator(promptSelector).evaluate((el: HTMLDivElement, pos: "start" | "end") => {
-    const selection = window.getSelection()
-    if (!selection) return
-
-    const walk = document.createTreeWalker(el, NodeFilter.SHOW_TEXT)
-    const nodes: Text[] = []
-    for (let node = walk.nextNode(); node; node = walk.nextNode()) {
-      nodes.push(node as Text)
-    }
-
-    if (nodes.length === 0) {
-      const node = document.createTextNode("")
-      el.appendChild(node)
-      nodes.push(node)
-    }
-
-    const node = pos === "start" ? nodes[0]! : nodes[nodes.length - 1]!
-    const range = document.createRange()
-    range.setStart(node, pos === "start" ? 0 : (node.textContent ?? "").length)
-    range.collapse(true)
-    selection.removeAllRanges()
-    selection.addRange(range)
-  }, pos)
-}
-
-async function wait(page: Page, value: string) {
-  await expect.poll(async () => text(await page.locator(promptSelector).textContent())).toBe(value)
-}
-
-async function reply(sdk: Parameters<typeof withSession>[0], sessionID: string, token: string) {
-  await expect
-    .poll(
-      async () => {
-        const messages = await sdk.session.messages({ sessionID, limit: 50 }).then((r) => r.data ?? [])
-        return messages
-          .filter((item) => item.info.role === "assistant")
-          .flatMap((item) => item.parts)
-          .filter((item) => item.type === "text")
-          .map((item) => item.text)
-          .join("\n")
-      },
-      { timeout: 90_000 },
-    )
-    .toContain(token)
-}
-
-async function shell(sdk: Parameters<typeof withSession>[0], sessionID: string, cmd: string, token: string) {
-  await expect
-    .poll(
-      async () => {
-        const messages = await sdk.session.messages({ sessionID, limit: 50 }).then((r) => r.data ?? [])
-        const part = messages
-          .filter((item) => item.info.role === "assistant")
-          .flatMap((item) => item.parts)
-          .filter(isBash)
-          .find((item) => item.state.input?.command === cmd && item.state.status === "completed")
-
-        if (!part || part.state.status !== "completed") return
-        return typeof part.state.metadata?.output === "string" ? part.state.metadata.output : part.state.output
-      },
-      { timeout: 90_000 },
-    )
-    .toContain(token)
-}
-
-test("prompt history restores unsent draft with arrow navigation", async ({ page, sdk, gotoSession }) => {
-  test.setTimeout(120_000)
-
-  await withSession(sdk, `e2e prompt history ${Date.now()}`, async (session) => {
-    await gotoSession(session.id)
-
-    const prompt = page.locator(promptSelector)
-    const firstToken = `E2E_HISTORY_ONE_${Date.now()}`
-    const secondToken = `E2E_HISTORY_TWO_${Date.now()}`
-    const first = `Reply with exactly: ${firstToken}`
-    const second = `Reply with exactly: ${secondToken}`
-    const draft = `draft ${Date.now()}`
-
-    await prompt.click()
-    await page.keyboard.type(first)
-    await page.keyboard.press("Enter")
-    await wait(page, "")
-    await reply(sdk, session.id, firstToken)
-
-    await prompt.click()
-    await page.keyboard.type(second)
-    await page.keyboard.press("Enter")
-    await wait(page, "")
-    await reply(sdk, session.id, secondToken)
-
-    await prompt.click()
-    await page.keyboard.type(draft)
-    await wait(page, draft)
-
-    await edge(page, "start")
-    await page.keyboard.press("ArrowUp")
-    await wait(page, second)
-
-    await page.keyboard.press("ArrowUp")
-    await wait(page, first)
-
-    await page.keyboard.press("ArrowDown")
-    await wait(page, second)
-
-    await page.keyboard.press("ArrowDown")
-    await wait(page, draft)
-  })
-})
-
-test("shell history stays separate from normal prompt history", async ({ page, sdk, gotoSession }) => {
-  test.setTimeout(120_000)
-
-  await withSession(sdk, `e2e shell history ${Date.now()}`, async (session) => {
-    await gotoSession(session.id)
-
-    const prompt = page.locator(promptSelector)
-    const firstToken = `E2E_SHELL_ONE_${Date.now()}`
-    const secondToken = `E2E_SHELL_TWO_${Date.now()}`
-    const normalToken = `E2E_NORMAL_${Date.now()}`
-    const first = `echo ${firstToken}`
-    const second = `echo ${secondToken}`
-    const normal = `Reply with exactly: ${normalToken}`
-
-    await prompt.click()
-    await page.keyboard.type("!")
-    await page.keyboard.type(first)
-    await page.keyboard.press("Enter")
-    await wait(page, "")
-    await shell(sdk, session.id, first, firstToken)
-
-    await prompt.click()
-    await page.keyboard.type("!")
-    await page.keyboard.type(second)
-    await page.keyboard.press("Enter")
-    await wait(page, "")
-    await shell(sdk, session.id, second, secondToken)
-
-    await prompt.click()
-    await page.keyboard.type("!")
-    await page.keyboard.press("ArrowUp")
-    await wait(page, second)
-
-    await page.keyboard.press("ArrowUp")
-    await wait(page, first)
-
-    await page.keyboard.press("ArrowDown")
-    await wait(page, second)
-
-    await page.keyboard.press("ArrowDown")
-    await wait(page, "")
-
-    await page.keyboard.press("Escape")
-    await wait(page, "")
-
-    await prompt.click()
-    await page.keyboard.type(normal)
-    await page.keyboard.press("Enter")
-    await wait(page, "")
-    await reply(sdk, session.id, normalToken)
-
-    await prompt.click()
-    await page.keyboard.press("ArrowUp")
-    await wait(page, normal)
-  })
-})

packages/app/e2e/prompt/prompt-shell.spec.ts

@@ -1,62 +0,0 @@
-import type { ToolPart } from "@opencode-ai/sdk/v2/client"
-import { test, expect } from "../fixtures"
-import { sessionIDFromUrl } from "../actions"
-import { promptSelector } from "../selectors"
-import { createSdk } from "../utils"
-
-const isBash = (part: unknown): part is ToolPart => {
-  if (!part || typeof part !== "object") return false
-  if (!("type" in part) || part.type !== "tool") return false
-  if (!("tool" in part) || part.tool !== "bash") return false
-  return "state" in part
-}
-
-test("shell mode runs a command in the project directory", async ({ page, withProject }) => {
-  test.setTimeout(120_000)
-
-  await withProject(async ({ directory, gotoSession, trackSession }) => {
-    const sdk = createSdk(directory)
-    const prompt = page.locator(promptSelector)
-    const cmd = process.platform === "win32" ? "dir" : "ls"
-
-    await gotoSession()
-    await prompt.click()
-    await page.keyboard.type("!")
-    await expect(prompt).toHaveAttribute("aria-label", /enter shell command/i)
-
-    await page.keyboard.type(cmd)
-    await page.keyboard.press("Enter")
-
-    await expect(page).toHaveURL(/\/session\/[^/?#]+/, { timeout: 30_000 })
-
-    const id = sessionIDFromUrl(page.url())
-    if (!id) throw new Error(`Failed to parse session id from url: ${page.url()}`)
-    trackSession(id, directory)
-
-    await expect
-      .poll(
-        async () => {
-          const list = await sdk.session.messages({ sessionID: id, limit: 50 }).then((x) => x.data ?? [])
-          const msg = list.findLast(
-            (item) => item.info.role === "assistant" && "path" in item.info && item.info.path.cwd === directory,
-          )
-          if (!msg) return
-
-          const part = msg.parts
-            .filter(isBash)
-            .find((item) => item.state.input?.command === cmd && item.state.status === "completed")
-
-          if (!part || part.state.status !== "completed") return
-          const output =
-            typeof part.state.metadata?.output === "string" ? part.state.metadata.output : part.state.output
-          if (!output.includes("README.md")) return
-
-          return { cwd: directory, output }
-        },
-        { timeout: 90_000 },
-      )
-      .toEqual(expect.objectContaining({ cwd: directory, output: expect.stringContaining("README.md") }))
-
-    await expect(prompt).toHaveText("")
-  })
-})

packages/app/e2e/prompt/prompt-slash-share.spec.ts

@@ -1,64 +0,0 @@
-import { test, expect } from "../fixtures"
-import { promptSelector } from "../selectors"
-import { withSession } from "../actions"
-
-const shareDisabled = process.env.OPENCODE_DISABLE_SHARE === "true" || process.env.OPENCODE_DISABLE_SHARE === "1"
-
-async function seed(sdk: Parameters<typeof withSession>[0], sessionID: string) {
-  await sdk.session.promptAsync({
-    sessionID,
-    noReply: true,
-    parts: [{ type: "text", text: "e2e share seed" }],
-  })
-
-  await expect
-    .poll(
-      async () => {
-        const messages = await sdk.session.messages({ sessionID, limit: 1 }).then((r) => r.data ?? [])
-        return messages.length
-      },
-      { timeout: 30_000 },
-    )
-    .toBeGreaterThan(0)
-}
-
-test("/share and /unshare update session share state", async ({ page, sdk, gotoSession }) => {
-  test.skip(shareDisabled, "Share is disabled in this environment (OPENCODE_DISABLE_SHARE).")
-
-  await withSession(sdk, `e2e slash share ${Date.now()}`, async (session) => {
-    const prompt = page.locator(promptSelector)
-
-    await seed(sdk, session.id)
-    await gotoSession(session.id)
-
-    await prompt.click()
-    await page.keyboard.type("/share")
-    await expect(page.locator('[data-slash-id="session.share"]').first()).toBeVisible()
-    await page.keyboard.press("Enter")
-
-    await expect
-      .poll(
-        async () => {
-          const data = await sdk.session.get({ sessionID: session.id }).then((r) => r.data)
-          return data?.share?.url || undefined
-        },
-        { timeout: 30_000 },
-      )
-      .not.toBeUndefined()
-
-    await prompt.click()
-    await page.keyboard.type("/unshare")
-    await expect(page.locator('[data-slash-id="session.unshare"]').first()).toBeVisible()
-    await page.keyboard.press("Enter")
-
-    await expect
-      .poll(
-        async () => {
-          const data = await sdk.session.get({ sessionID: session.id }).then((r) => r.data)
-          return data?.share?.url || undefined
-        },
-        { timeout: 30_000 },
-      )
-      .toBeUndefined()
-  })
-})

packages/app/e2e/prompt/prompt-slash-terminal.spec.ts

@@ -1,5 +1,4 @@
 import { test, expect } from "../fixtures"
-import { waitTerminalReady } from "../actions"
 import { promptSelector, terminalSelector } from "../selectors"
 
 test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => {
@@ -7,29 +6,18 @@ test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => {
 
   const prompt = page.locator(promptSelector)
   const terminal = page.locator(terminalSelector)
-  const slash = page.locator('[data-slash-id="terminal.toggle"]').first()
 
   await expect(terminal).not.toBeVisible()
 
-  await prompt.fill("/terminal")
-  await expect(slash).toBeVisible()
+  await prompt.click()
+  await page.keyboard.type("/terminal")
+  await expect(page.locator('[data-slash-id="terminal.toggle"]').first()).toBeVisible()
   await page.keyboard.press("Enter")
-  await waitTerminalReady(page, { term: terminal })
+  await expect(terminal).toBeVisible()
 
-  // Terminal panel retries focus (immediate, RAF, 120ms, 240ms) after opening,
-  // which can steal focus from the prompt and prevent fill() from triggering
-  // the slash popover. Re-attempt click+fill until all retries are exhausted
-  // and the popover appears.
-  await expect
-    .poll(
-      async () => {
-        await prompt.click().catch(() => false)
-        await prompt.fill("/terminal").catch(() => false)
-        return slash.isVisible().catch(() => false)
-      },
-      { timeout: 10_000 },
-    )
-    .toBe(true)
+  await prompt.click()
+  await page.keyboard.type("/terminal")
+  await expect(page.locator('[data-slash-id="terminal.toggle"]').first()).toBeVisible()
   await page.keyboard.press("Enter")
   await expect(terminal).not.toBeVisible()
 })

packages/app/e2e/prompt/prompt.spec.ts

@@ -1,6 +1,6 @@
 import { test, expect } from "../fixtures"
 import { promptSelector } from "../selectors"
-import { cleanupSession, sessionIDFromUrl, withSession } from "../actions"
+import { sessionIDFromUrl, withSession } from "../actions"
 
 test("can send a prompt and receive a reply", async ({ page, sdk, gotoSession }) => {
   test.setTimeout(120_000)
@@ -46,7 +46,7 @@ test("can send a prompt and receive a reply", async ({ page, sdk, gotoSession })
       .toContain(token)
   } finally {
     page.off("pageerror", onPageError)
-    await cleanupSession({ sdk, sessionID })
+    await sdk.session.delete({ sessionID }).catch(() => undefined)
   }
 
   if (pageErrors.length > 0) {

packages/app/e2e/selectors.ts

@@ -1,6 +1,5 @@
 export const promptSelector = '[data-component="prompt-input"]'
-export const terminalPanelSelector = '#terminal-panel[aria-hidden="false"]'
-export const terminalSelector = `${terminalPanelSelector} [data-component="terminal"]`
+export const terminalSelector = '[data-component="terminal"]'
 export const sessionComposerDockSelector = '[data-component="session-prompt-dock"]'
 export const questionDockSelector = '[data-component="dock-prompt"][data-kind="question"]'
 export const permissionDockSelector = '[data-component="dock-prompt"][data-kind="permission"]'
@@ -13,9 +12,6 @@ export const sessionTodoToggleButtonSelector = '[data-action="session-todo-toggl
 export const sessionTodoListSelector = '[data-slot="session-todo-list"]'
 
 export const modelVariantCycleSelector = '[data-action="model-variant-cycle"]'
-export const promptAgentSelector = '[data-component="prompt-agent-control"]'
-export const promptModelSelector = '[data-component="prompt-model-control"]'
-export const promptVariantSelector = '[data-component="prompt-variant-control"]'
 export const settingsLanguageSelectSelector = '[data-action="settings-language"]'
 export const settingsColorSchemeSelector = '[data-action="settings-color-scheme"]'
 export const settingsThemeSelector = '[data-action="settings-theme"]'
@@ -34,6 +30,8 @@ export const sidebarNavSelector = '[data-component="sidebar-nav-desktop"]'
 export const projectSwitchSelector = (slug: string) =>
   `${sidebarNavSelector} [data-action="project-switch"][data-project="${slug}"]`
 
+export const projectCloseHoverSelector = (slug: string) => `[data-action="project-close-hover"][data-project="${slug}"]`
+
 export const projectMenuTriggerSelector = (slug: string) =>
   `${sidebarNavSelector} [data-action="project-menu"][data-project="${slug}"]`
 

packages/app/e2e/session/session-child-navigation.spec.ts

@@ -1,37 +0,0 @@
-import { seedSessionTask, withSession } from "../actions"
-import { test, expect } from "../fixtures"
-
-test("task tool child-session link does not trigger stale show errors", async ({ page, sdk, gotoSession }) => {
-  test.setTimeout(120_000)
-
-  const errs: string[] = []
-  const onError = (err: Error) => {
-    errs.push(err.message)
-  }
-  page.on("pageerror", onError)
-
-  await withSession(sdk, `e2e child nav ${Date.now()}`, async (session) => {
-    const child = await seedSessionTask(sdk, {
-      sessionID: session.id,
-      description: "Open child session",
-      prompt: "Search the repository for AssistantParts and then reply with exactly CHILD_OK.",
-    })
-
-    try {
-      await gotoSession(session.id)
-
-      const link = page
-        .locator("a.subagent-link")
-        .filter({ hasText: /open child session/i })
-        .first()
-      await expect(link).toBeVisible({ timeout: 30_000 })
-      await link.click()
-
-      await expect(page).toHaveURL(new RegExp(`/session/${child.sessionID}(?:[/?#]|$)`), { timeout: 30_000 })
-      await page.waitForTimeout(1000)
-      expect(errs).toEqual([])
-    } finally {
-      page.off("pageerror", onError)
-    }
-  })
-})

packages/app/e2e/session/session-composer-dock.spec.ts

@@ -1,16 +1,12 @@
 import { test, expect } from "../fixtures"
-import {
-  composerEvent,
-  type ComposerDriverState,
-  type ComposerProbeState,
-  type ComposerWindow,
-} from "../../src/testing/session-composer"
-import { cleanupSession, clearSessionDockSeed, seedSessionQuestion } from "../actions"
+import { clearSessionDockSeed, seedSessionQuestion, seedSessionTodos } from "../actions"
 import {
   permissionDockSelector,
   promptSelector,
   questionDockSelector,
   sessionComposerDockSelector,
+  sessionTodoDockSelector,
+  sessionTodoListSelector,
   sessionTodoToggleButtonSelector,
 } from "../selectors"
 
@@ -30,7 +26,7 @@ async function withDockSession<T>(
   try {
     return await fn(session)
   } finally {
-    await cleanupSession({ sdk, sessionID: session.id })
+    await sdk.session.delete({ sessionID: session.id }).catch(() => undefined)
   }
 }
 
@@ -46,8 +42,12 @@ async function withDockSeed<T>(sdk: Sdk, sessionID: string, fn: () => Promise<T>
 
 async function clearPermissionDock(page: any, label: RegExp) {
   const dock = page.locator(permissionDockSelector)
-  await expect(dock).toBeVisible()
-  await dock.getByRole("button", { name: label }).click()
+  for (let i = 0; i < 3; i++) {
+    const count = await dock.count()
+    if (count === 0) return
+    await dock.getByRole("button", { name: label }).click()
+    await page.waitForTimeout(150)
+  }
 }
 
 async function setAutoAccept(page: any, enabled: boolean) {
@@ -59,120 +59,6 @@ async function setAutoAccept(page: any, enabled: boolean) {
   await expect(button).toHaveAttribute("aria-pressed", enabled ? "true" : "false")
 }
 
-async function expectQuestionBlocked(page: any) {
-  await expect(page.locator(questionDockSelector)).toBeVisible()
-  await expect(page.locator(promptSelector)).toHaveCount(0)
-}
-
-async function expectQuestionOpen(page: any) {
-  await expect(page.locator(questionDockSelector)).toHaveCount(0)
-  await expect(page.locator(promptSelector)).toBeVisible()
-}
-
-async function expectPermissionBlocked(page: any) {
-  await expect(page.locator(permissionDockSelector)).toBeVisible()
-  await expect(page.locator(promptSelector)).toHaveCount(0)
-}
-
-async function expectPermissionOpen(page: any) {
-  await expect(page.locator(permissionDockSelector)).toHaveCount(0)
-  await expect(page.locator(promptSelector)).toBeVisible()
-}
-
-async function todoDock(page: any, sessionID: string) {
-  await page.addInitScript(() => {
-    const win = window as ComposerWindow
-    win.__opencode_e2e = {
-      ...win.__opencode_e2e,
-      composer: {
-        enabled: true,
-        sessions: {},
-      },
-    }
-  })
-
-  const write = async (driver: ComposerDriverState | undefined) => {
-    await page.evaluate(
-      (input) => {
-        const win = window as ComposerWindow
-        const composer = win.__opencode_e2e?.composer
-        if (!composer?.enabled) throw new Error("Composer e2e driver is not enabled")
-        composer.sessions ??= {}
-        const prev = composer.sessions[input.sessionID] ?? {}
-        if (!input.driver) {
-          if (!prev.probe) {
-            delete composer.sessions[input.sessionID]
-          } else {
-            composer.sessions[input.sessionID] = { probe: prev.probe }
-          }
-        } else {
-          composer.sessions[input.sessionID] = {
-            ...prev,
-            driver: input.driver,
-          }
-        }
-        window.dispatchEvent(new CustomEvent(input.event, { detail: { sessionID: input.sessionID } }))
-      },
-      { event: composerEvent, sessionID, driver },
-    )
-  }
-
-  const read = () =>
-    page.evaluate((sessionID) => {
-      const win = window as ComposerWindow
-      return win.__opencode_e2e?.composer?.sessions?.[sessionID]?.probe ?? null
-    }, sessionID) as Promise<ComposerProbeState | null>
-
-  const api = {
-    async clear() {
-      await write(undefined)
-      return api
-    },
-    async open(todos: NonNullable<ComposerDriverState["todos"]>) {
-      await write({ live: true, todos })
-      return api
-    },
-    async finish(todos: NonNullable<ComposerDriverState["todos"]>) {
-      await write({ live: false, todos })
-      return api
-    },
-    async expectOpen(states: ComposerProbeState["states"]) {
-      await expect.poll(read, { timeout: 10_000 }).toMatchObject({
-        mounted: true,
-        collapsed: false,
-        hidden: false,
-        count: states.length,
-        states,
-      })
-      return api
-    },
-    async expectCollapsed(states: ComposerProbeState["states"]) {
-      await expect.poll(read, { timeout: 10_000 }).toMatchObject({
-        mounted: true,
-        collapsed: true,
-        hidden: true,
-        count: states.length,
-        states,
-      })
-      return api
-    },
-    async expectClosed() {
-      await expect.poll(read, { timeout: 10_000 }).toMatchObject({ mounted: false })
-      return api
-    },
-    async collapse() {
-      await page.locator(sessionTodoToggleButtonSelector).click()
-      return api
-    },
-    async expand() {
-      await page.locator(sessionTodoToggleButtonSelector).click()
-      return api
-    },
-  }
-
-  return api
-}
-
 async function withMockPermission<T>(
   page: any,
   request: {
@@ -184,7 +70,7 @@ async function withMockPermission<T>(
     always?: string[]
   },
   opts: { child?: any } | undefined,
-  fn: (state: { resolved: () => Promise<void> }) => Promise<T>,
+  fn: () => Promise<T>,
 ) {
   let pending = [
     {
@@ -233,14 +119,8 @@ async function withMockPermission<T>(
 
   if (sessionList) await page.route("**/session?*", sessionList)
 
-  const state = {
-    async resolved() {
-      await expect.poll(() => pending.length, { timeout: 10_000 }).toBe(0)
-    },
-  }
-
   try {
-    return await fn(state)
+    return await fn()
   } finally {
     await page.unroute("**/permission", list)
     await page.unroute("**/session/*/permissions/*", reply)
@@ -293,12 +173,14 @@ test("blocked question flow unblocks after submit", async ({ page, sdk, gotoSess
       })
 
       const dock = page.locator(questionDockSelector)
-      await expectQuestionBlocked(page)
+      await expect.poll(() => dock.count(), { timeout: 10_000 }).toBe(1)
+      await expect(page.locator(promptSelector)).toHaveCount(0)
 
       await dock.locator('[data-slot="question-option"]').first().click()
       await dock.getByRole("button", { name: /submit/i }).click()
 
-      await expectQuestionOpen(page)
+      await expect.poll(() => page.locator(questionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+      await expect(page.locator(promptSelector)).toBeVisible()
     })
   })
 })
@@ -317,14 +199,15 @@ test("blocked permission flow supports allow once", async ({ page, sdk, gotoSess
         metadata: { description: "Need permission for command" },
       },
       undefined,
-      async (state) => {
+      async () => {
         await page.goto(page.url())
-        await expectPermissionBlocked(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await clearPermissionDock(page, /allow once/i)
-        await state.resolved()
         await page.goto(page.url())
-        await expectPermissionOpen(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       },
     )
   })
@@ -343,14 +226,15 @@ test("blocked permission flow supports reject", async ({ page, sdk, gotoSession
         patterns: ["/tmp/opencode-e2e-perm-reject"],
       },
       undefined,
-      async (state) => {
+      async () => {
         await page.goto(page.url())
-        await expectPermissionBlocked(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await clearPermissionDock(page, /deny/i)
-        await state.resolved()
         await page.goto(page.url())
-        await expectPermissionOpen(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       },
     )
   })
@@ -370,14 +254,15 @@ test("blocked permission flow supports allow always", async ({ page, sdk, gotoSe
         metadata: { description: "Need permission for command" },
       },
       undefined,
-      async (state) => {
+      async () => {
         await page.goto(page.url())
-        await expectPermissionBlocked(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await clearPermissionDock(page, /allow always/i)
-        await state.resolved()
         await page.goto(page.url())
-        await expectPermissionOpen(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       },
     )
   })
@@ -416,15 +301,17 @@ test("child session question request blocks parent dock and unblocks after submi
         })
 
         const dock = page.locator(questionDockSelector)
-        await expectQuestionBlocked(page)
+        await expect.poll(() => dock.count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await dock.locator('[data-slot="question-option"]').first().click()
         await dock.getByRole("button", { name: /submit/i }).click()
 
-        await expectQuestionOpen(page)
+        await expect.poll(() => page.locator(questionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       })
     } finally {
-      await cleanupSession({ sdk, sessionID: child.id })
+      await sdk.session.delete({ sessionID: child.id }).catch(() => undefined)
     }
   })
 })
@@ -457,50 +344,57 @@ test("child session permission request blocks parent dock and supports allow onc
           metadata: { description: "Need child permission" },
         },
         { child },
-        async (state) => {
+        async () => {
           await page.goto(page.url())
-          await expectPermissionBlocked(page)
+          const dock = page.locator(permissionDockSelector)
+          await expect.poll(() => dock.count(), { timeout: 10_000 }).toBe(1)
+          await expect(page.locator(promptSelector)).toHaveCount(0)
 
           await clearPermissionDock(page, /allow once/i)
-          await state.resolved()
           await page.goto(page.url())
 
-          await expectPermissionOpen(page)
+          await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+          await expect(page.locator(promptSelector)).toBeVisible()
         },
       )
     } finally {
-      await cleanupSession({ sdk, sessionID: child.id })
+      await sdk.session.delete({ sessionID: child.id }).catch(() => undefined)
     }
   })
 })
 
 test("todo dock transitions and collapse behavior", async ({ page, sdk, gotoSession }) => {
   await withDockSession(sdk, "e2e composer dock todo", async (session) => {
-    const dock = await todoDock(page, session.id)
-    await gotoSession(session.id)
-    await expect(page.locator(sessionComposerDockSelector)).toBeVisible()
+    await withDockSeed(sdk, session.id, async () => {
+      await gotoSession(session.id)
 
-    try {
-      await dock.open([
-        { content: "first task", status: "pending", priority: "high" },
-        { content: "second task", status: "in_progress", priority: "medium" },
-      ])
-      await dock.expectOpen(["pending", "in_progress"])
+      await seedSessionTodos(sdk, {
+        sessionID: session.id,
+        todos: [
+          { content: "first task", status: "pending", priority: "high" },
+          { content: "second task", status: "in_progress", priority: "medium" },
+        ],
+      })
 
-      await dock.collapse()
-      await dock.expectCollapsed(["pending", "in_progress"])
+      await expect.poll(() => page.locator(sessionTodoDockSelector).count(), { timeout: 10_000 }).toBe(1)
+      await expect(page.locator(sessionTodoListSelector)).toBeVisible()
 
-      await dock.expand()
-      await dock.expectOpen(["pending", "in_progress"])
+      await page.locator(sessionTodoToggleButtonSelector).click()
+      await expect(page.locator(sessionTodoListSelector)).toBeHidden()
 
-      await dock.finish([
-        { content: "first task", status: "completed", priority: "high" },
-        { content: "second task", status: "cancelled", priority: "medium" },
-      ])
-      await dock.expectClosed()
-    } finally {
-      await dock.clear()
-    }
+      await page.locator(sessionTodoToggleButtonSelector).click()
+      await expect(page.locator(sessionTodoListSelector)).toBeVisible()
+
+      await seedSessionTodos(sdk, {
+        sessionID: session.id,
+        todos: [
+          { content: "first task", status: "completed", priority: "high" },
+          { content: "second task", status: "cancelled", priority: "medium" },
+        ],
+      })
+
+      await expect.poll(() => page.locator(sessionTodoDockSelector).count(), { timeout: 10_000 }).toBe(0)
+    })
   })
 })
 
@@ -520,7 +414,8 @@ test("keyboard focus stays off prompt while blocked", async ({ page, sdk, gotoSe
         ],
       })
 
-      await expectQuestionBlocked(page)
+      await expect.poll(() => page.locator(questionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+      await expect(page.locator(promptSelector)).toHaveCount(0)
 
       await page.locator("main").click({ position: { x: 5, y: 5 } })
       await page.keyboard.type("abc")

packages/app/e2e/session/session-model-persistence.spec.ts

@@ -1,351 +0,0 @@
-import { base64Decode } from "@opencode-ai/util/encode"
-import type { Locator, Page } from "@playwright/test"
-import { test, expect } from "../fixtures"
-import { openSidebar, sessionIDFromUrl, setWorkspacesEnabled, waitSessionIdle, waitSlug } from "../actions"
-import {
-  promptAgentSelector,
-  promptModelSelector,
-  promptSelector,
-  promptVariantSelector,
-  workspaceItemSelector,
-  workspaceNewSessionSelector,
-} from "../selectors"
-import { createSdk, sessionPath } from "../utils"
-
-type Footer = {
-  agent: string
-  model: string
-  variant: string
-}
-
-type Probe = {
-  dir?: string
-  sessionID?: string
-  model?: { providerID: string; modelID: string }
-}
-
-const escape = (value: string) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")
-
-const text = async (locator: Locator) => ((await locator.textContent()) ?? "").trim()
-
-const modelKey = (state: Probe | null) => (state?.model ? `${state.model.providerID}:${state.model.modelID}` : null)
-
-const dirKey = (state: Probe | null) => state?.dir ?? ""
-
-async function probe(page: Page): Promise<Probe | null> {
-  return page.evaluate(() => {
-    const win = window as Window & {
-      __opencode_e2e?: {
-        model?: {
-          current?: Probe
-        }
-      }
-    }
-    return win.__opencode_e2e?.model?.current ?? null
-  })
-}
-
-async function currentDir(page: Page) {
-  let hit = ""
-  await expect
-    .poll(
-      async () => {
-        const next = dirKey(await probe(page))
-        if (next) hit = next
-        return next
-      },
-      { timeout: 30_000 },
-    )
-    .not.toBe("")
-  return hit
-}
-
-async function read(page: Page): Promise<Footer> {
-  return {
-    agent: await text(page.locator(`${promptAgentSelector} [data-slot="select-select-trigger-value"]`).first()),
-    model: await text(page.locator(`${promptModelSelector} [data-action="prompt-model"] span`).first()),
-    variant: await text(page.locator(`${promptVariantSelector} [data-slot="select-select-trigger-value"]`).first()),
-  }
-}
-
-async function waitFooter(page: Page, expected: Partial<Footer>) {
-  let hit: Footer | null = null
-  await expect
-    .poll(
-      async () => {
-        const state = await read(page)
-        const ok = Object.entries(expected).every(([key, value]) => state[key as keyof Footer] === value)
-        if (ok) hit = state
-        return ok
-      },
-      { timeout: 30_000 },
-    )
-    .toBe(true)
-  if (!hit) throw new Error("Failed to resolve prompt footer state")
-  return hit
-}
-
-async function waitModel(page: Page, value: string) {
-  await expect.poll(() => probe(page).then(modelKey), { timeout: 30_000 }).toBe(value)
-}
-
-async function choose(page: Page, root: string, value: string) {
-  const select = page.locator(root)
-  await expect(select).toBeVisible()
-  await select.locator('[data-action], [data-slot="select-select-trigger"]').first().click()
-  const item = page
-    .locator('[data-slot="select-select-item"]')
-    .filter({ hasText: new RegExp(`^\\s*${escape(value)}\\s*$`) })
-    .first()
-  await expect(item).toBeVisible()
-  await item.click()
-}
-
-async function variantCount(page: Page) {
-  const select = page.locator(promptVariantSelector)
-  await expect(select).toBeVisible()
-  await select.locator('[data-slot="select-select-trigger"]').click()
-  const count = await page.locator('[data-slot="select-select-item"]').count()
-  await page.keyboard.press("Escape")
-  return count
-}
-
-async function agents(page: Page) {
-  const select = page.locator(promptAgentSelector)
-  await expect(select).toBeVisible()
-  await select.locator('[data-action], [data-slot="select-select-trigger"]').first().click()
-  const labels = await page.locator('[data-slot="select-select-item-label"]').allTextContents()
-  await page.keyboard.press("Escape")
-  return labels.map((item) => item.trim()).filter(Boolean)
-}
-
-async function ensureVariant(page: Page, directory: string): Promise<Footer> {
-  const current = await read(page)
-  if ((await variantCount(page)) >= 2) return current
-
-  const cfg = await createSdk(directory)
-    .config.get()
-    .then((x) => x.data)
-  const visible = new Set(await agents(page))
-  const entry = Object.entries(cfg?.agent ?? {}).find((item) => {
-    const value = item[1]
-    return !!value && typeof value === "object" && "variant" in value && "model" in value && visible.has(item[0])
-  })
-  const name = entry?.[0]
-  test.skip(!name, "no agent with alternate variants available")
-  if (!name) return current
-
-  await choose(page, promptAgentSelector, name)
-  await expect.poll(() => variantCount(page), { timeout: 30_000 }).toBeGreaterThanOrEqual(2)
-  return waitFooter(page, { agent: name })
-}
-
-async function chooseDifferentVariant(page: Page): Promise<Footer> {
-  const current = await read(page)
-  const select = page.locator(promptVariantSelector)
-  await expect(select).toBeVisible()
-  await select.locator('[data-slot="select-select-trigger"]').click()
-
-  const items = page.locator('[data-slot="select-select-item"]')
-  const count = await items.count()
-  if (count < 2) throw new Error("Current model has no alternate variant to select")
-
-  for (let i = 0; i < count; i++) {
-    const item = items.nth(i)
-    const next = await text(item.locator('[data-slot="select-select-item-label"]').first())
-    if (!next || next === current.variant) continue
-    await item.click()
-    return waitFooter(page, { agent: current.agent, model: current.model, variant: next })
-  }
-
-  throw new Error("Failed to choose a different variant")
-}
-
-async function chooseOtherModel(page: Page): Promise<Footer> {
-  const current = await read(page)
-  const button = page.locator(`${promptModelSelector} [data-action="prompt-model"]`)
-  await expect(button).toBeVisible()
-  await button.click()
-
-  const dialog = page.getByRole("dialog")
-  await expect(dialog).toBeVisible()
-  const items = dialog.locator('[data-slot="list-item"]')
-  const count = await items.count()
-  expect(count).toBeGreaterThan(1)
-
-  for (let i = 0; i < count; i++) {
-    const item = items.nth(i)
-    const selected = (await item.getAttribute("data-selected")) === "true"
-    if (selected) continue
-    await item.click()
-    await expect(dialog).toHaveCount(0)
-    await expect.poll(async () => (await read(page)).model !== current.model, { timeout: 30_000 }).toBe(true)
-    return read(page)
-  }
-
-  throw new Error("Failed to choose a different model")
-}
-
-async function goto(page: Page, directory: string, sessionID?: string) {
-  await page.goto(sessionPath(directory, sessionID))
-  await expect(page.locator(promptSelector)).toBeVisible()
-  await expect.poll(async () => dirKey(await probe(page)), { timeout: 30_000 }).toBe(directory)
-}
-
-async function submit(page: Page, value: string) {
-  const prompt = page.locator(promptSelector)
-  await expect(prompt).toBeVisible()
-  await prompt.click()
-  await prompt.fill(value)
-  await prompt.press("Enter")
-
-  await expect.poll(() => sessionIDFromUrl(page.url()) ?? "", { timeout: 30_000 }).not.toBe("")
-  const id = sessionIDFromUrl(page.url())
-  if (!id) throw new Error(`Failed to resolve session id from ${page.url()}`)
-  return id
-}
-
-async function waitUser(directory: string, sessionID: string) {
-  const sdk = createSdk(directory)
-  await expect
-    .poll(
-      async () => {
-        const items = await sdk.session.messages({ sessionID, limit: 20 }).then((x) => x.data ?? [])
-        return items.some((item) => item.info.role === "user")
-      },
-      { timeout: 30_000 },
-    )
-    .toBe(true)
-  await sdk.session.abort({ sessionID }).catch(() => undefined)
-  await waitSessionIdle(sdk, sessionID, 30_000).catch(() => undefined)
-}
-
-async function createWorkspace(page: Page, root: string, seen: string[]) {
-  await openSidebar(page)
-  await page.getByRole("button", { name: "New workspace" }).first().click()
-
-  const slug = await waitSlug(page, [root, ...seen])
-  const directory = base64Decode(slug)
-  if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`)
-  return { slug, directory }
-}
-
-async function waitWorkspace(page: Page, slug: string) {
-  await openSidebar(page)
-  await expect
-    .poll(
-      async () => {
-        const item = page.locator(workspaceItemSelector(slug)).first()
-        try {
-          await item.hover({ timeout: 500 })
-          return true
-        } catch {
-          return false
-        }
-      },
-      { timeout: 60_000 },
-    )
-    .toBe(true)
-}
-
-async function newWorkspaceSession(page: Page, slug: string) {
-  await waitWorkspace(page, slug)
-  const item = page.locator(workspaceItemSelector(slug)).first()
-  await item.hover()
-
-  const button = page.locator(workspaceNewSessionSelector(slug)).first()
-  await expect(button).toBeVisible()
-  await button.click({ force: true })
-
-  const next = await waitSlug(page)
-  await expect(page).toHaveURL(new RegExp(`/${next}/session(?:[/?#]|$)`))
-  await expect(page.locator(promptSelector)).toBeVisible()
-  return currentDir(page)
-}
-
-test("session model and variant restore per session without leaking into new sessions", async ({
-  page,
-  withProject,
-}) => {
-  await page.setViewportSize({ width: 1440, height: 900 })
-
-  await withProject(async ({ directory, gotoSession, trackSession }) => {
-    await gotoSession()
-
-    await ensureVariant(page, directory)
-    const firstState = await chooseDifferentVariant(page)
-    const first = await submit(page, `session variant ${Date.now()}`)
-    trackSession(first)
-    await waitUser(directory, first)
-
-    await page.reload()
-    await expect(page.locator(promptSelector)).toBeVisible()
-    await waitFooter(page, firstState)
-
-    await gotoSession()
-    const fresh = await ensureVariant(page, directory)
-    expect(fresh.variant).not.toBe(firstState.variant)
-
-    const secondState = await chooseOtherModel(page)
-    const second = await submit(page, `session model ${Date.now()}`)
-    trackSession(second)
-    await waitUser(directory, second)
-
-    await goto(page, directory, first)
-    await waitFooter(page, firstState)
-
-    await goto(page, directory, second)
-    await waitFooter(page, secondState)
-
-    await gotoSession()
-    await waitFooter(page, fresh)
-  })
-})
-
-test("session model restore across workspaces", async ({ page, withProject }) => {
-  await page.setViewportSize({ width: 1440, height: 900 })
-
-  await withProject(async ({ directory: root, slug, gotoSession, trackDirectory, trackSession }) => {
-    await gotoSession()
-
-    await ensureVariant(page, root)
-    const firstState = await chooseDifferentVariant(page)
-    const first = await submit(page, `root session ${Date.now()}`)
-    trackSession(first, root)
-    await waitUser(root, first)
-
-    await openSidebar(page)
-    await setWorkspacesEnabled(page, slug, true)
-
-    const one = await createWorkspace(page, slug, [])
-    const oneDir = await newWorkspaceSession(page, one.slug)
-    trackDirectory(oneDir)
-
-    const secondState = await chooseOtherModel(page)
-    const second = await submit(page, `workspace one ${Date.now()}`)
-    trackSession(second, oneDir)
-    await waitUser(oneDir, second)
-
-    const two = await createWorkspace(page, slug, [one.slug])
-    const twoDir = await newWorkspaceSession(page, two.slug)
-    trackDirectory(twoDir)
-
-    await ensureVariant(page, twoDir)
-    const thirdState = await chooseDifferentVariant(page)
-    const third = await submit(page, `workspace two ${Date.now()}`)
-    trackSession(third, twoDir)
-    await waitUser(twoDir, third)
-
-    await goto(page, root, first)
-    await waitFooter(page, firstState)
-
-    await goto(page, oneDir, second)
-    await waitFooter(page, secondState)
-
-    await goto(page, twoDir, third)
-    await waitFooter(page, thirdState)
-
-    await goto(page, root, first)
-    await waitFooter(page, firstState)
-  })
-})

packages/app/e2e/session/session-review.spec.ts

@@ -1,217 +0,0 @@
-import { waitSessionIdle, withSession } from "../actions"
-import { test, expect } from "../fixtures"
-import { createSdk } from "../utils"
-
-const count = 14
-
-function body(mark: string) {
-  return [
-    `title ${mark}`,
-    `mark ${mark}`,
-    ...Array.from({ length: 32 }, (_, i) => `line ${String(i + 1).padStart(2, "0")} ${mark}`),
-  ]
-}
-
-function files(tag: string) {
-  return Array.from({ length: count }, (_, i) => {
-    const id = String(i).padStart(2, "0")
-    return {
-      file: `review-scroll-${id}.txt`,
-      mark: `${tag}-${id}`,
-    }
-  })
-}
-
-function seed(list: ReturnType<typeof files>) {
-  const out = ["*** Begin Patch"]
-
-  for (const item of list) {
-    out.push(`*** Add File: ${item.file}`)
-    for (const line of body(item.mark)) out.push(`+${line}`)
-  }
-
-  out.push("*** End Patch")
-  return out.join("\n")
-}
-
-function edit(file: string, prev: string, next: string) {
-  return ["*** Begin Patch", `*** Update File: ${file}`, "@@", `-mark ${prev}`, `+mark ${next}`, "*** End Patch"].join(
-    "\n",
-  )
-}
-
-async function patch(sdk: ReturnType<typeof createSdk>, sessionID: string, patchText: string) {
-  await sdk.session.promptAsync({
-    sessionID,
-    agent: "build",
-    system: [
-      "You are seeding deterministic e2e UI state.",
-      "Your only valid response is one apply_patch tool call.",
-      `Use this JSON input: ${JSON.stringify({ patchText })}`,
-      "Do not call any other tools.",
-      "Do not output plain text.",
-    ].join("\n"),
-    parts: [{ type: "text", text: "Apply the provided patch exactly once." }],
-  })
-
-  await waitSessionIdle(sdk, sessionID, 120_000)
-}
-
-async function show(page: Parameters<typeof test>[0]["page"]) {
-  const btn = page.getByRole("button", { name: "Toggle review" }).first()
-  await expect(btn).toBeVisible()
-  if ((await btn.getAttribute("aria-expanded")) !== "true") await btn.click()
-  await expect(btn).toHaveAttribute("aria-expanded", "true")
-}
-
-async function expand(page: Parameters<typeof test>[0]["page"]) {
-  const close = page.getByRole("button", { name: /^Collapse all$/i }).first()
-  const open = await close
-    .isVisible()
-    .then((value) => value)
-    .catch(() => false)
-
-  const btn = page.getByRole("button", { name: /^Expand all$/i }).first()
-  if (open) {
-    await close.click()
-    await expect(btn).toBeVisible()
-  }
-
-  await expect(btn).toBeVisible()
-  await btn.click()
-  await expect(close).toBeVisible()
-}
-
-async function waitMark(page: Parameters<typeof test>[0]["page"], file: string, mark: string) {
-  await page.waitForFunction(
-    ({ file, mark }) => {
-      const view = document.querySelector('[data-slot="session-review-scroll"] .scroll-view__viewport')
-      if (!(view instanceof HTMLElement)) return false
-
-      const head = Array.from(view.querySelectorAll("h3")).find(
-        (node) => node instanceof HTMLElement && node.textContent?.includes(file),
-      )
-      if (!(head instanceof HTMLElement)) return false
-
-      return Array.from(head.parentElement?.querySelectorAll("diffs-container") ?? []).some((host) => {
-        if (!(host instanceof HTMLElement)) return false
-        const root = host.shadowRoot
-        return root?.textContent?.includes(`mark ${mark}`) ?? false
-      })
-    },
-    { file, mark },
-    { timeout: 60_000 },
-  )
-}
-
-async function spot(page: Parameters<typeof test>[0]["page"], file: string) {
-  return page.evaluate((file) => {
-    const view = document.querySelector('[data-slot="session-review-scroll"] .scroll-view__viewport')
-    if (!(view instanceof HTMLElement)) return null
-
-    const row = Array.from(view.querySelectorAll("h3")).find(
-      (node) => node instanceof HTMLElement && node.textContent?.includes(file),
-    )
-    if (!(row instanceof HTMLElement)) return null
-
-    const a = row.getBoundingClientRect()
-    const b = view.getBoundingClientRect()
-    return {
-      top: a.top - b.top,
-      y: view.scrollTop,
-    }
-  }, file)
-}
-
-test("review keeps scroll position after a live diff update", async ({ page, withProject }) => {
-  test.skip(Boolean(process.env.CI), "Flaky in CI for now.")
-  test.setTimeout(180_000)
-
-  const tag = `review-${Date.now()}`
-  const list = files(tag)
-  const hit = list[list.length - 4]!
-  const next = `${tag}-live`
-
-  await page.setViewportSize({ width: 1600, height: 1000 })
-
-  await withProject(async (project) => {
-    const sdk = createSdk(project.directory)
-
-    await withSession(sdk, `e2e review ${tag}`, async (session) => {
-      await patch(sdk, session.id, seed(list))
-
-      await expect
-        .poll(
-          async () => {
-            const info = await sdk.session.get({ sessionID: session.id }).then((res) => res.data)
-            return info?.summary?.files ?? 0
-          },
-          { timeout: 60_000 },
-        )
-        .toBe(list.length)
-
-      await expect
-        .poll(
-          async () => {
-            const diff = await sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? [])
-            return diff.length
-          },
-          { timeout: 60_000 },
-        )
-        .toBe(list.length)
-
-      await project.gotoSession(session.id)
-      await show(page)
-
-      const tab = page.getByRole("tab", { name: /Review/i }).first()
-      await expect(tab).toBeVisible()
-      await tab.click()
-
-      const view = page.locator('[data-slot="session-review-scroll"] .scroll-view__viewport').first()
-      await expect(view).toBeVisible()
-      const heads = page.getByRole("heading", { level: 3 }).filter({ hasText: /^review-scroll-/ })
-      await expect(heads).toHaveCount(list.length, {
-        timeout: 60_000,
-      })
-
-      await expand(page)
-      await waitMark(page, hit.file, hit.mark)
-
-      const row = page
-        .getByRole("heading", { level: 3, name: new RegExp(hit.file.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")) })
-        .first()
-      await expect(row).toBeVisible()
-      await row.evaluate((el) => el.scrollIntoView({ block: "center" }))
-
-      await expect.poll(async () => (await spot(page, hit.file))?.y ?? 0).toBeGreaterThan(200)
-      const prev = await spot(page, hit.file)
-      if (!prev) throw new Error(`missing review row for ${hit.file}`)
-
-      await patch(sdk, session.id, edit(hit.file, hit.mark, next))
-
-      await expect
-        .poll(
-          async () => {
-            const diff = await sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? [])
-            const item = diff.find((item) => item.file === hit.file)
-            return typeof item?.after === "string" ? item.after : ""
-          },
-          { timeout: 60_000 },
-        )
-        .toContain(`mark ${next}`)
-
-      await waitMark(page, hit.file, next)
-
-      await expect
-        .poll(
-          async () => {
-            const next = await spot(page, hit.file)
-            if (!next) return Number.POSITIVE_INFINITY
-            return Math.max(Math.abs(next.top - prev.top), Math.abs(next.y - prev.y))
-          },
-          { timeout: 60_000 },
-        )
-        .toBeLessThanOrEqual(32)
-    })
-  })
-})

packages/app/e2e/session/session-undo-redo.spec.ts

@@ -45,7 +45,7 @@ async function seedConversation(input: {
     .toBe(true)
 
   if (!userMessageID) throw new Error("Expected a user message id")
-  await expect(input.page.locator(`[data-message-id="${userMessageID}"]`)).toHaveCount(1, { timeout: 30_000 })
+  await expect(input.page.locator(`[data-message-id="${userMessageID}"]`).first()).toBeVisible({ timeout: 30_000 })
   return { prompt, userMessageID }
 }
 
@@ -123,7 +123,7 @@ test("slash redo clears revert and restores latest state", async ({ page, withPr
         .toBeUndefined()
 
       await expect(seeded.prompt).not.toContainText(token)
-      await expect(page.locator(`[data-message-id="${seeded.userMessageID}"]`)).toHaveCount(1)
+      await expect(page.locator(`[data-message-id="${seeded.userMessageID}"]`).first()).toBeVisible()
     })
   })
 })
@@ -158,8 +158,8 @@ test("slash undo/redo traverses multi-step revert stack", async ({ page, withPro
       const firstMessage = page.locator(`[data-message-id="${first.userMessageID}"]`)
       const secondMessage = page.locator(`[data-message-id="${second.userMessageID}"]`)
 
-      await expect(firstMessage).toHaveCount(1)
-      await expect(secondMessage).toHaveCount(1)
+      await expect(firstMessage.first()).toBeVisible()
+      await expect(secondMessage.first()).toBeVisible()
 
       await second.prompt.click()
       await page.keyboard.press(`${modKey}+A`)
@@ -176,7 +176,7 @@ test("slash undo/redo traverses multi-step revert stack", async ({ page, withPro
         })
         .toBe(second.userMessageID)
 
-      await expect(firstMessage).toHaveCount(1)
+      await expect(firstMessage.first()).toBeVisible()
       await expect(secondMessage).toHaveCount(0)
 
       await second.prompt.click()
@@ -210,7 +210,7 @@ test("slash undo/redo traverses multi-step revert stack", async ({ page, withPro
         })
         .toBe(second.userMessageID)
 
-      await expect(firstMessage).toHaveCount(1)
+      await expect(firstMessage.first()).toBeVisible()
       await expect(secondMessage).toHaveCount(0)
 
       await second.prompt.click()
@@ -226,8 +226,8 @@ test("slash undo/redo traverses multi-step revert stack", async ({ page, withPro
         })
         .toBeUndefined()
 
-      await expect(firstMessage).toHaveCount(1)
-      await expect(secondMessage).toHaveCount(1)
+      await expect(firstMessage.first()).toBeVisible()
+      await expect(secondMessage.first()).toBeVisible()
     })
   })
 })

packages/app/e2e/settings/settings-keybinds.spec.ts

@@ -1,5 +1,5 @@
 import { test, expect } from "../fixtures"
-import { openSettings, closeDialog, waitTerminalReady, withSession } from "../actions"
+import { openSettings, closeDialog, withSession } from "../actions"
 import { keybindButtonSelector, terminalSelector } from "../selectors"
 import { modKey } from "../utils"
 
@@ -32,19 +32,22 @@ test("changing sidebar toggle keybind works", async ({ page, gotoSession }) => {
 
   await closeDialog(page, dialog)
 
-  const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
-  const initiallyClosed = (await button.getAttribute("aria-expanded")) !== "true"
+  const main = page.locator("main")
+  const initialClasses = (await main.getAttribute("class")) ?? ""
+  const initiallyClosed = initialClasses.includes("xl:border-l")
 
   await page.keyboard.press(`${modKey}+Shift+H`)
-  await expect(button).toHaveAttribute("aria-expanded", initiallyClosed ? "true" : "false")
+  await page.waitForTimeout(100)
 
-  const afterToggleClosed = (await button.getAttribute("aria-expanded")) !== "true"
+  const afterToggleClasses = (await main.getAttribute("class")) ?? ""
+  const afterToggleClosed = afterToggleClasses.includes("xl:border-l")
   expect(afterToggleClosed).toBe(!initiallyClosed)
 
   await page.keyboard.press(`${modKey}+Shift+H`)
-  await expect(button).toHaveAttribute("aria-expanded", initiallyClosed ? "false" : "true")
+  await page.waitForTimeout(100)
 
-  const finalClosed = (await button.getAttribute("aria-expanded")) !== "true"
+  const finalClasses = (await main.getAttribute("class")) ?? ""
+  const finalClosed = finalClasses.includes("xl:border-l")
   expect(finalClosed).toBe(initiallyClosed)
 })
 
@@ -302,7 +305,7 @@ test("changing terminal toggle keybind works", async ({ page, gotoSession }) =>
   await expect(terminal).not.toBeVisible()
 
   await page.keyboard.press(`${modKey}+Y`)
-  await waitTerminalReady(page, { term: terminal })
+  await expect(terminal).toBeVisible()
 
   await page.keyboard.press(`${modKey}+Y`)
   await expect(terminal).not.toBeVisible()

packages/app/e2e/settings/settings.spec.ts

@@ -83,23 +83,16 @@ test("changing theme persists in localStorage", async ({ page, gotoSession }) =>
   const select = dialog.locator(settingsThemeSelector)
   await expect(select).toBeVisible()
 
-  const currentThemeId = await page.evaluate(() => {
-    return document.documentElement.getAttribute("data-theme")
-  })
-  const currentTheme = (await select.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? ""
-
   await select.locator('[data-slot="select-select-trigger"]').click()
 
   const items = page.locator('[data-slot="select-select-item"]')
   const count = await items.count()
   expect(count).toBeGreaterThan(1)
 
-  const nextTheme = (await items.locator('[data-slot="select-select-item-label"]').allTextContents())
-    .map((x) => x.trim())
-    .find((x) => x && x !== currentTheme)
-  expect(nextTheme).toBeTruthy()
+  const firstTheme = await items.nth(1).locator('[data-slot="select-select-item-label"]').textContent()
+  expect(firstTheme).toBeTruthy()
 
-  await items.filter({ hasText: nextTheme! }).first().click()
+  await items.nth(1).click()
 
   await page.keyboard.press("Escape")
 
@@ -108,7 +101,7 @@ test("changing theme persists in localStorage", async ({ page, gotoSession }) =>
   })
 
   expect(storedThemeId).not.toBeNull()
-  expect(storedThemeId).not.toBe(currentThemeId)
+  expect(storedThemeId).not.toBe("oc-1")
 
   const dataTheme = await page.evaluate(() => {
     return document.documentElement.getAttribute("data-theme")
@@ -116,42 +109,6 @@ test("changing theme persists in localStorage", async ({ page, gotoSession }) =>
   expect(dataTheme).toBe(storedThemeId)
 })
 
-test("legacy oc-1 theme migrates to oc-2", async ({ page, gotoSession }) => {
-  await page.addInitScript(() => {
-    localStorage.setItem("opencode-theme-id", "oc-1")
-    localStorage.setItem("opencode-theme-css-light", "--background-base:#fff;")
-    localStorage.setItem("opencode-theme-css-dark", "--background-base:#000;")
-  })
-
-  await gotoSession()
-
-  await expect(page.locator("html")).toHaveAttribute("data-theme", "oc-2")
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate(() => {
-        return localStorage.getItem("opencode-theme-id")
-      })
-    })
-    .toBe("oc-2")
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate(() => {
-        return localStorage.getItem("opencode-theme-css-light")
-      })
-    })
-    .toBeNull()
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate(() => {
-        return localStorage.getItem("opencode-theme-css-dark")
-      })
-    })
-    .toBeNull()
-})
-
 test("changing font persists in localStorage and updates CSS variable", async ({ page, gotoSession }) => {
   await gotoSession()
 

packages/app/e2e/sidebar/sidebar-popover-actions.spec.ts

@@ -1,6 +1,6 @@
 import { test, expect } from "../fixtures"
-import { cleanupSession, closeSidebar, hoverSessionItem } from "../actions"
-import { projectSwitchSelector } from "../selectors"
+import { closeSidebar, hoverSessionItem } from "../actions"
+import { projectSwitchSelector, sessionItemSelector } from "../selectors"
 
 test("collapsed sidebar popover stays open when archiving a session", async ({ page, slug, sdk, gotoSession }) => {
   const stamp = Date.now()
@@ -15,15 +15,12 @@ test("collapsed sidebar popover stays open when archiving a session", async ({ p
     await gotoSession(one.id)
     await closeSidebar(page)
 
-    const oneItem = page.locator(`[data-session-id="${one.id}"]`).last()
-    const twoItem = page.locator(`[data-session-id="${two.id}"]`).last()
-
     const project = page.locator(projectSwitchSelector(slug)).first()
     await expect(project).toBeVisible()
     await project.hover()
 
-    await expect(oneItem).toBeVisible()
-    await expect(twoItem).toBeVisible()
+    await expect(page.locator(sessionItemSelector(one.id)).first()).toBeVisible()
+    await expect(page.locator(sessionItemSelector(two.id)).first()).toBeVisible()
 
     const item = await hoverSessionItem(page, one.id)
     await item
@@ -31,9 +28,9 @@ test("collapsed sidebar popover stays open when archiving a session", async ({ p
       .first()
       .click()
 
-    await expect(twoItem).toBeVisible()
+    await expect(page.locator(sessionItemSelector(two.id)).first()).toBeVisible()
   } finally {
-    await cleanupSession({ sdk, sessionID: one.id })
-    await cleanupSession({ sdk, sessionID: two.id })
+    await sdk.session.delete({ sessionID: one.id }).catch(() => undefined)
+    await sdk.session.delete({ sessionID: two.id }).catch(() => undefined)
   }
 })

packages/app/e2e/sidebar/sidebar-session-links.spec.ts

@@ -1,5 +1,5 @@
 import { test, expect } from "../fixtures"
-import { cleanupSession, openSidebar, withSession } from "../actions"
+import { openSidebar, withSession } from "../actions"
 import { promptSelector } from "../selectors"
 
 test("sidebar session links navigate to the selected session", async ({ page, slug, sdk, gotoSession }) => {
@@ -18,13 +18,14 @@ test("sidebar session links navigate to the selected session", async ({ page, sl
 
     const target = page.locator(`[data-session-id="${two.id}"] a`).first()
     await expect(target).toBeVisible()
+    await target.scrollIntoViewIfNeeded()
     await target.click()
 
     await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`))
     await expect(page.locator(promptSelector)).toBeVisible()
     await expect(page.locator(`[data-session-id="${two.id}"] a`).first()).toHaveClass(/\bactive\b/)
   } finally {
-    await cleanupSession({ sdk, sessionID: one.id })
-    await cleanupSession({ sdk, sessionID: two.id })
+    await sdk.session.delete({ sessionID: one.id }).catch(() => undefined)
+    await sdk.session.delete({ sessionID: two.id }).catch(() => undefined)
   }
 })

packages/app/e2e/sidebar/sidebar.spec.ts

@@ -5,14 +5,12 @@ test("sidebar can be collapsed and expanded", async ({ page, gotoSession }) => {
   await gotoSession()
 
   await openSidebar(page)
-  const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
-  await expect(button).toHaveAttribute("aria-expanded", "true")
 
   await toggleSidebar(page)
-  await expect(button).toHaveAttribute("aria-expanded", "false")
+  await expect(page.locator("main")).toHaveClass(/xl:border-l/)
 
   await toggleSidebar(page)
-  await expect(button).toHaveAttribute("aria-expanded", "true")
+  await expect(page.locator("main")).not.toHaveClass(/xl:border-l/)
 })
 
 test("sidebar collapsed state persists across navigation and reload", async ({ page, sdk, gotoSession }) => {
@@ -21,15 +19,14 @@ test("sidebar collapsed state persists across navigation and reload", async ({ p
       await gotoSession(session1.id)
 
       await openSidebar(page)
-      const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
       await toggleSidebar(page)
-      await expect(button).toHaveAttribute("aria-expanded", "false")
+      await expect(page.locator("main")).toHaveClass(/xl:border-l/)
 
       await gotoSession(session2.id)
-      await expect(button).toHaveAttribute("aria-expanded", "false")
+      await expect(page.locator("main")).toHaveClass(/xl:border-l/)
 
       await page.reload()
-      await expect(button).toHaveAttribute("aria-expanded", "false")
+      await expect(page.locator("main")).toHaveClass(/xl:border-l/)
 
       const opened = await page.evaluate(
         () => JSON.parse(localStorage.getItem("opencode.global.dat:layout") ?? "{}").sidebar?.opened,

packages/app/e2e/terminal/terminal-init.spec.ts

@@ -1,5 +1,4 @@
 import { test, expect } from "../fixtures"
-import { waitTerminalReady } from "../actions"
 import { promptSelector, terminalSelector } from "../selectors"
 import { terminalToggleKey } from "../utils"
 
@@ -14,7 +13,8 @@ test("smoke terminal mounts and can create a second tab", async ({ page, gotoSes
     await page.keyboard.press(terminalToggleKey)
   }
 
-  await waitTerminalReady(page, { term: terminals.first() })
+  await expect(terminals.first()).toBeVisible()
+  await expect(terminals.first().locator("textarea")).toHaveCount(1)
   await expect(terminals).toHaveCount(1)
 
   // Ghostty captures a lot of keybinds when focused; move focus back
@@ -24,5 +24,5 @@ test("smoke terminal mounts and can create a second tab", async ({ page, gotoSes
 
   await expect(tabs).toHaveCount(2)
   await expect(terminals).toHaveCount(1)
-  await waitTerminalReady(page, { term: terminals.first() })
+  await expect(terminals.first().locator("textarea")).toHaveCount(1)
 })

packages/app/e2e/terminal/terminal-reconnect.spec.ts

@@ -1,46 +0,0 @@
-import type { Page } from "@playwright/test"
-import { disconnectTerminal, runTerminal, terminalConnects, waitTerminalReady } from "../actions"
-import { test, expect } from "../fixtures"
-import { terminalSelector } from "../selectors"
-import { terminalToggleKey } from "../utils"
-
-async function open(page: Page) {
-  const term = page.locator(terminalSelector).first()
-  const visible = await term.isVisible().catch(() => false)
-  if (!visible) await page.keyboard.press(terminalToggleKey)
-  await waitTerminalReady(page, { term })
-  return term
-}
-
-test("terminal reconnects without replacing the pty", async ({ page, withProject }) => {
-  await withProject(async ({ gotoSession }) => {
-    const name = `OPENCODE_E2E_RECONNECT_${Date.now()}`
-    const token = `E2E_RECONNECT_${Date.now()}`
-
-    await gotoSession()
-
-    const term = await open(page)
-    const id = await term.getAttribute("data-pty-id")
-    if (!id) throw new Error("Active terminal missing data-pty-id")
-
-    const prev = await terminalConnects(page, { term })
-
-    await runTerminal(page, {
-      term,
-      cmd: `export ${name}=${token}; echo ${token}`,
-      token,
-    })
-
-    await disconnectTerminal(page, { term })
-
-    await expect.poll(() => terminalConnects(page, { term }), { timeout: 15_000 }).toBeGreaterThan(prev)
-    await expect.poll(() => term.getAttribute("data-pty-id"), { timeout: 5_000 }).toBe(id)
-
-    await runTerminal(page, {
-      term,
-      cmd: `echo $${name}`,
-      token,
-      timeout: 15_000,
-    })
-  })
-})

packages/app/e2e/terminal/terminal-tabs.spec.ts

@@ -1,132 +0,0 @@
-import type { Page } from "@playwright/test"
-import { runTerminal, waitTerminalReady } from "../actions"
-import { test, expect } from "../fixtures"
-import { terminalSelector } from "../selectors"
-import { terminalToggleKey, workspacePersistKey } from "../utils"
-
-type State = {
-  active?: string
-  all: Array<{
-    id: string
-    title: string
-    titleNumber: number
-    buffer?: string
-  }>
-}
-
-async function open(page: Page) {
-  const terminal = page.locator(terminalSelector)
-  const visible = await terminal.isVisible().catch(() => false)
-  if (!visible) await page.keyboard.press(terminalToggleKey)
-  await waitTerminalReady(page, { term: terminal })
-}
-
-async function store(page: Page, key: string) {
-  return page.evaluate((key) => {
-    const raw = localStorage.getItem(key)
-    if (raw) return JSON.parse(raw) as State
-
-    for (let i = 0; i < localStorage.length; i++) {
-      const next = localStorage.key(i)
-      if (!next?.endsWith(":workspace:terminal")) continue
-      const value = localStorage.getItem(next)
-      if (!value) continue
-      return JSON.parse(value) as State
-    }
-  }, key)
-}
-
-test("inactive terminal tab buffers persist across tab switches", async ({ page, withProject }) => {
-  await withProject(async ({ directory, gotoSession }) => {
-    const key = workspacePersistKey(directory, "terminal")
-    const one = `E2E_TERM_ONE_${Date.now()}`
-    const two = `E2E_TERM_TWO_${Date.now()}`
-    const tabs = page.locator('#terminal-panel [data-slot="tabs-trigger"]')
-    const first = tabs.filter({ hasText: /Terminal 1/ }).first()
-    const second = tabs.filter({ hasText: /Terminal 2/ }).first()
-
-    await gotoSession()
-    await open(page)
-
-    await runTerminal(page, { cmd: `echo ${one}`, token: one })
-
-    await page.getByRole("button", { name: /new terminal/i }).click()
-    await expect(tabs).toHaveCount(2)
-
-    await runTerminal(page, { cmd: `echo ${two}`, token: two })
-
-    await first.click()
-    await expect(first).toHaveAttribute("aria-selected", "true")
-
-    await expect
-      .poll(
-        async () => {
-          const state = await store(page, key)
-          const first = state?.all.find((item) => item.titleNumber === 1)?.buffer ?? ""
-          const second = state?.all.find((item) => item.titleNumber === 2)?.buffer ?? ""
-          return {
-            first: first.includes(one),
-            second: second.includes(two),
-          }
-        },
-        { timeout: 5_000 },
-      )
-      .toEqual({ first: false, second: true })
-
-    await second.click()
-    await expect(second).toHaveAttribute("aria-selected", "true")
-    await expect
-      .poll(
-        async () => {
-          const state = await store(page, key)
-          const first = state?.all.find((item) => item.titleNumber === 1)?.buffer ?? ""
-          const second = state?.all.find((item) => item.titleNumber === 2)?.buffer ?? ""
-          return {
-            first: first.includes(one),
-            second: second.includes(two),
-          }
-        },
-        { timeout: 5_000 },
-      )
-      .toEqual({ first: true, second: false })
-  })
-})
-
-test("closing the active terminal tab falls back to the previous tab", async ({ page, withProject }) => {
-  await withProject(async ({ directory, gotoSession }) => {
-    const key = workspacePersistKey(directory, "terminal")
-    const tabs = page.locator('#terminal-panel [data-slot="tabs-trigger"]')
-
-    await gotoSession()
-    await open(page)
-
-    await page.getByRole("button", { name: /new terminal/i }).click()
-    await expect(tabs).toHaveCount(2)
-
-    const second = tabs.filter({ hasText: /Terminal 2/ }).first()
-    await second.click()
-    await expect(second).toHaveAttribute("aria-selected", "true")
-
-    await second.hover()
-    await page
-      .getByRole("button", { name: /close terminal/i })
-      .nth(1)
-      .click({ force: true })
-
-    const first = tabs.filter({ hasText: /Terminal 1/ }).first()
-    await expect(tabs).toHaveCount(1)
-    await expect(first).toHaveAttribute("aria-selected", "true")
-    await expect
-      .poll(
-        async () => {
-          const state = await store(page, key)
-          return {
-            count: state?.all.length ?? 0,
-            first: state?.all.some((item) => item.titleNumber === 1) ?? false,
-          }
-        },
-        { timeout: 15_000 },
-      )
-      .toEqual({ count: 1, first: true })
-  })
-})

packages/app/e2e/terminal/terminal.spec.ts

@@ -1,5 +1,4 @@
 import { test, expect } from "../fixtures"
-import { waitTerminalReady } from "../actions"
 import { terminalSelector } from "../selectors"
 import { terminalToggleKey } from "../utils"
 
@@ -14,5 +13,5 @@ test("terminal panel can be toggled", async ({ page, gotoSession }) => {
   }
 
   await page.keyboard.press(terminalToggleKey)
-  await waitTerminalReady(page, { term: terminal })
+  await expect(terminal).toBeVisible()
 })

packages/app/e2e/tsconfig.json

@@ -2,8 +2,7 @@
   "extends": "../tsconfig.json",
   "compilerOptions": {
     "noEmit": true,
-    "rootDir": "..",
     "types": ["node", "bun"]
   },
-  "include": ["./**/*.ts", "../src/testing/terminal.ts"]
+  "include": ["./**/*.ts"]
 }

packages/app/e2e/utils.ts

@@ -1,5 +1,5 @@
 import { createOpencodeClient } from "@opencode-ai/sdk/v2/client"
-import { base64Encode, checksum } from "@opencode-ai/util/encode"
+import { base64Encode } from "@opencode-ai/util/encode"
 
 export const serverHost = process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"
 export const serverPort = process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"
@@ -7,22 +7,6 @@ export const serverPort = process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"
 export const serverUrl = `http://${serverHost}:${serverPort}`
 export const serverName = `${serverHost}:${serverPort}`
 
-const localHosts = ["127.0.0.1", "localhost"]
-
-const serverLabels = (() => {
-  const url = new URL(serverUrl)
-  if (!localHosts.includes(url.hostname)) return [serverName]
-  return localHosts.map((host) => `${host}:${url.port}`)
-})()
-
-export const serverNames = [...new Set(serverLabels)]
-
-export const serverUrls = serverNames.map((name) => `http://${name}`)
-
-const escape = (value: string) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")
-
-export const serverNamePattern = new RegExp(`(?:${serverNames.map(escape).join("|")})`)
-
 export const modKey = process.platform === "darwin" ? "Meta" : "Control"
 export const terminalToggleKey = "Control+Backquote"
 
@@ -30,12 +14,6 @@ export function createSdk(directory?: string) {
   return createOpencodeClient({ baseUrl: serverUrl, directory, throwOnError: true })
 }
 
-export async function resolveDirectory(directory: string) {
-  return createSdk(directory)
-    .path.get()
-    .then((x) => x.data?.directory ?? directory)
-}
-
 export async function getWorktree() {
   const sdk = createSdk()
   const result = await sdk.path.get()
@@ -55,9 +33,3 @@ export function dirPath(directory: string) {
 export function sessionPath(directory: string, sessionID?: string) {
   return `${dirPath(directory)}/session${sessionID ? `/${sessionID}` : ""}`
 }
-
-export function workspacePersistKey(directory: string, key: string) {
-  const head = (directory.slice(0, 12) || "workspace").replace(/[^a-zA-Z0-9._-]/g, "-")
-  const sum = checksum(directory) ?? "0"
-  return `opencode.workspace.${head}.${sum}.dat:workspace:${key}`
-}

packages/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/app",
-  "version": "1.2.25",
+  "version": "1.2.15",
   "description": "",
   "type": "module",
   "exports": {
@@ -45,8 +45,8 @@
     "@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/i18n": "2.2.1",
+    "@solid-primitives/event-bus": "1.1.2",
     "@solid-primitives/media": "2.3.3",
     "@solid-primitives/resize-observer": "2.1.3",
     "@solid-primitives/scroll": "2.1.3",
@@ -56,9 +56,8 @@
     "@solidjs/router": "catalog:",
     "@thisbeyond/solid-dnd": "0.7.5",
     "diff": "catalog:",
-    "effect": "4.0.0-beta.31",
     "fuzzysort": "catalog:",
-    "ghostty-web": "github:anomalyco/ghostty-web#main",
+    "ghostty-web": "0.4.0",
     "luxon": "catalog:",
     "marked": "catalog:",
     "marked-shiki": "catalog:",

packages/app/playwright.config.ts

@@ -6,7 +6,6 @@ const serverHost = process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1"
 const serverPort = process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"
 const command = `bun run dev -- --host 0.0.0.0 --port ${port}`
 const reuse = !process.env.CI
-const workers = Number(process.env.PLAYWRIGHT_WORKERS ?? (process.env.CI ? 5 : 0)) || undefined
 
 export default defineConfig({
   testDir: "./e2e",
@@ -18,7 +17,6 @@ export default defineConfig({
   fullyParallel: process.env.PLAYWRIGHT_FULLY_PARALLEL === "1",
   forbidOnly: !!process.env.CI,
   retries: process.env.CI ? 2 : 0,
-  workers,
   reporter: [["html", { outputFolder: "e2e/playwright-report", open: "never" }], ["line"]],
   webServer: {
     command,

packages/app/public/oc-theme-preload.js

@@ -1,13 +1,6 @@
 ;(function () {
-  var key = "opencode-theme-id"
-  var themeId = localStorage.getItem(key) || "oc-2"
-
-  if (themeId === "oc-1") {
-    themeId = "oc-2"
-    localStorage.setItem(key, themeId)
-    localStorage.removeItem("opencode-theme-css-light")
-    localStorage.removeItem("opencode-theme-css-dark")
-  }
+  var themeId = localStorage.getItem("opencode-theme-id")
+  if (!themeId) return
 
   var scheme = localStorage.getItem("opencode-color-scheme") || "system"
   var isDark = scheme === "dark" || (scheme === "system" && matchMedia("(prefers-color-scheme: dark)").matches)
@@ -16,9 +9,9 @@
   document.documentElement.dataset.theme = themeId
   document.documentElement.dataset.colorScheme = mode
 
-  if (themeId === "oc-2") return
+  if (themeId === "oc-1") return
 
-  var css = localStorage.getItem("opencode-theme-css-" + mode)
+  var css = localStorage.getItem("opencode-theme-css-" + themeId + "-" + mode)
   if (css) {
     var style = document.createElement("style")
     style.id = "oc-theme-preload"

packages/app/script/e2e-local.ts

@@ -73,7 +73,6 @@ const serverEnv = {
   OPENCODE_E2E_MESSAGE: "Seeded for UI e2e",
   OPENCODE_E2E_MODEL: "opencode/gpt-5-nano",
   OPENCODE_CLIENT: "app",
-  OPENCODE_STRICT_CONFIG_DEPS: "true",
 } satisfies Record<string, string>
 
 const runnerEnv = {

packages/app/src/app.tsx

@@ -1,30 +1,14 @@
 import "@/index.css"
+import { File } from "@opencode-ai/ui/file"
 import { I18nProvider } from "@opencode-ai/ui/context"
 import { DialogProvider } from "@opencode-ai/ui/context/dialog"
 import { FileComponentProvider } from "@opencode-ai/ui/context/file"
 import { MarkedProvider } from "@opencode-ai/ui/context/marked"
-import { File } from "@opencode-ai/ui/file"
 import { Font } from "@opencode-ai/ui/font"
-import { Splash } from "@opencode-ai/ui/logo"
 import { ThemeProvider } from "@opencode-ai/ui/theme"
 import { MetaProvider } from "@solidjs/meta"
-import { type BaseRouterProps, Navigate, Route, Router } from "@solidjs/router"
-import { type Duration, Effect } from "effect"
-import {
-  type Component,
-  createMemo,
-  createResource,
-  createSignal,
-  ErrorBoundary,
-  For,
-  type JSX,
-  lazy,
-  onCleanup,
-  type ParentProps,
-  Show,
-  Suspense,
-} from "solid-js"
-import { Dynamic } from "solid-js/web"
+import { Navigate, Route, Router } from "@solidjs/router"
+import { ErrorBoundary, type JSX, lazy, type ParentProps, Show, Suspense } from "solid-js"
 import { CommandProvider } from "@/context/command"
 import { CommentsProvider } from "@/context/comments"
 import { FileProvider } from "@/context/file"
@@ -38,13 +22,12 @@ import { NotificationProvider } from "@/context/notification"
 import { PermissionProvider } from "@/context/permission"
 import { usePlatform } from "@/context/platform"
 import { PromptProvider } from "@/context/prompt"
-import { ServerConnection, ServerProvider, serverName, useServer } from "@/context/server"
+import { type ServerConnection, ServerProvider, useServer } from "@/context/server"
 import { SettingsProvider } from "@/context/settings"
 import { TerminalProvider } from "@/context/terminal"
 import DirectoryLayout from "@/pages/directory-layout"
 import Layout from "@/pages/layout"
 import { ErrorPage } from "./pages/error"
-import { useCheckServerHealth } from "./utils/server-health"
 
 const Home = lazy(() => import("@/pages/home"))
 const Session = lazy(() => import("@/pages/session"))
@@ -68,7 +51,7 @@ const SessionIndexRoute = () => <Navigate href="session" />
 
 function UiI18nBridge(props: ParentProps) {
   const language = useLanguage()
-  return <I18nProvider value={{ locale: language.intl, t: language.t }}>{props.children}</I18nProvider>
+  return <I18nProvider value={{ locale: language.locale, t: language.t }}>{props.children}</I18nProvider>
 }
 
 declare global {
@@ -78,9 +61,6 @@ declare global {
       deepLinks?: string[]
       wsl?: boolean
     }
-    api?: {
-      setTitlebar?: (theme: { mode: "light" | "dark" }) => Promise<void>
-    }
   }
 }
 
@@ -134,11 +114,7 @@ export function AppBaseProviders(props: ParentProps) {
   return (
     <MetaProvider>
       <Font />
-      <ThemeProvider
-        onThemeApplied={(_, mode) => {
-          void window.api?.setTitlebar?.({ mode })
-        }}
-      >
+      <ThemeProvider>
         <LanguageProvider>
           <UiI18nBridge>
             <ErrorBoundary fallback={(error) => <ErrorPage error={error} />}>
@@ -155,130 +131,26 @@ export function AppBaseProviders(props: ParentProps) {
   )
 }
 
-const effectMinDuration =
-  (duration: Duration.Input) =>
-  <A, E, R>(e: Effect.Effect<A, E, R>) =>
-    Effect.all([e, Effect.sleep(duration)], { concurrency: "unbounded" }).pipe(Effect.map((v) => v[0]))
-
-function ConnectionGate(props: ParentProps<{ disableHealthCheck?: boolean }>) {
+function ServerKey(props: ParentProps) {
   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(
-          effectMinDuration(checkMode() === "blocking" ? "1.2 seconds" : 0),
-          Effect.timeoutOrElse({ duration: "10 seconds", onTimeout: () => Effect.succeed(false) }),
-          Effect.ensuring(Effect.sync(() => setCheckMode("background"))),
-          Effect.runPromise,
-        ),
-  )
-
   return (
-    <Show
-      when={checkMode() === "blocking" ? !startupHealthCheck.loading : startupHealthCheck.state !== "pending"}
-      fallback={
-        <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base">
-          <Splash class="w-16 h-20 opacity-50 animate-pulse" />
-        </div>
-      }
-    >
-      <Show
-        when={startupHealthCheck()}
-        fallback={
-          <ConnectionError
-            onRetry={() => {
-              if (checkMode() === "background") healthCheckActions.refetch()
-            }}
-            onServerSelected={(key) => {
-              setCheckMode("blocking")
-              server.setActive(key)
-              healthCheckActions.refetch()
-            }}
-          />
-        }
-      >
-        {props.children}
-      </Show>
+    <Show when={server.key} keyed>
+      {props.children}
     </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>
-  )
-}
-
 export function AppInterface(props: {
   children?: JSX.Element
   defaultServer: ServerConnection.Key
   servers?: Array<ServerConnection.Any>
-  router?: Component<BaseRouterProps>
-  disableHealthCheck?: boolean
 }) {
   return (
     <ServerProvider defaultServer={props.defaultServer} servers={props.servers}>
-      <ConnectionGate disableHealthCheck={props.disableHealthCheck}>
+      <ServerKey>
         <GlobalSDKProvider>
           <GlobalSyncProvider>
-            <Dynamic
-              component={props.router ?? Router}
+            <Router
               root={(routerProps) => <RouterRoot appChildren={props.children}>{routerProps.children}</RouterRoot>}
             >
               <Route path="/" component={HomeRoute} />
@@ -286,10 +158,10 @@ export function AppInterface(props: {
                 <Route path="/" component={SessionIndexRoute} />
                 <Route path="/session/:id?" component={SessionRoute} />
               </Route>
-            </Dynamic>
+            </Router>
           </GlobalSyncProvider>
         </GlobalSDKProvider>
-      </ConnectionGate>
+      </ServerKey>
     </ServerProvider>
   )
 }

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

@@ -1,447 +0,0 @@
-import { useIsRouting, useLocation } from "@solidjs/router"
-import { batch, createEffect, onCleanup, onMount } from "solid-js"
-import { createStore } from "solid-js/store"
-import { Tooltip } from "@opencode-ai/ui/tooltip"
-import { useLanguage } from "@/context/language"
-
-type Mem = Performance & {
-  memory?: {
-    usedJSHeapSize: number
-    jsHeapSizeLimit: number
-  }
-}
-
-type Evt = PerformanceEntry & {
-  interactionId?: number
-  processingStart?: number
-}
-
-type Shift = PerformanceEntry & {
-  hadRecentInput: boolean
-  value: number
-}
-
-type Obs = PerformanceObserverInit & {
-  durationThreshold?: number
-}
-
-const span = 5000
-
-const ms = (n?: number, d = 0) => {
-  if (n === undefined || Number.isNaN(n)) return
-  return `${n.toFixed(d)}ms`
-}
-
-const time = (n?: number) => {
-  if (n === undefined || Number.isNaN(n)) return
-  return `${Math.round(n)}`
-}
-
-const mb = (n?: number) => {
-  if (n === undefined || Number.isNaN(n)) return
-  const v = n / 1024 / 1024
-  return `${v >= 1024 ? v.toFixed(0) : v.toFixed(1)}MB`
-}
-
-const bad = (n: number | undefined, limit: number, low = false) => {
-  if (n === undefined || Number.isNaN(n)) return false
-  return low ? n < limit : n > limit
-}
-
-const session = (path: string) => path.includes("/session")
-
-function Cell(props: { bad?: boolean; dim?: boolean; label: string; tip: string; value: string; wide?: boolean }) {
-  return (
-    <Tooltip value={props.tip} placement="top">
-      <div
-        classList={{
-          "flex min-h-[42px] w-full min-w-0 flex-col items-center justify-center rounded-[8px] bg-white/5 px-0.5 py-1 text-center": true,
-          "col-span-2": !!props.wide,
-        }}
-      >
-        <div class="text-[10px] leading-none font-black uppercase tracking-[0.04em] opacity-70">{props.label}</div>
-        <div
-          classList={{
-            "text-[13px] leading-none font-bold tabular-nums sm:text-[14px]": true,
-            "text-text-on-critical-base": !!props.bad,
-            "opacity-70": !!props.dim,
-          }}
-        >
-          {props.value}
-        </div>
-      </div>
-    </Tooltip>
-  )
-}
-
-export function DebugBar() {
-  const language = useLanguage()
-  const location = useLocation()
-  const routing = useIsRouting()
-  const [state, setState] = createStore({
-    cls: undefined as number | undefined,
-    delay: undefined as number | undefined,
-    fps: undefined as number | undefined,
-    gap: undefined as number | undefined,
-    heap: {
-      limit: undefined as number | undefined,
-      used: undefined as number | undefined,
-    },
-    inp: undefined as number | undefined,
-    jank: undefined as number | undefined,
-    long: {
-      block: undefined as number | undefined,
-      count: undefined as number | undefined,
-      max: undefined as number | undefined,
-    },
-    nav: {
-      dur: undefined as number | undefined,
-      pending: false,
-    },
-  })
-
-  const na = () => language.t("debugBar.na")
-  const heap = () => (state.heap.limit ? (state.heap.used ?? 0) / state.heap.limit : undefined)
-  const heapv = () => {
-    const value = heap()
-    if (value === undefined) return na()
-    return `${Math.round(value * 100)}%`
-  }
-  const longv = () => (state.long.count === undefined ? na() : `${time(state.long.block) ?? na()}/${state.long.count}`)
-  const navv = () => (state.nav.pending ? "..." : (time(state.nav.dur) ?? na()))
-
-  let prev = ""
-  let start = 0
-  let init = false
-  let one = 0
-  let two = 0
-
-  createEffect(() => {
-    const busy = routing()
-    const next = `${location.pathname}${location.search}`
-
-    if (!init) {
-      init = true
-      prev = next
-      return
-    }
-
-    if (busy) {
-      if (one !== 0) cancelAnimationFrame(one)
-      if (two !== 0) cancelAnimationFrame(two)
-      one = 0
-      two = 0
-      if (start !== 0) return
-      start = performance.now()
-      if (session(prev)) setState("nav", { dur: undefined, pending: true })
-      return
-    }
-
-    if (start === 0) {
-      prev = next
-      return
-    }
-
-    const at = start
-    const from = prev
-    start = 0
-    prev = next
-
-    if (!(session(from) || session(next))) return
-
-    if (one !== 0) cancelAnimationFrame(one)
-    if (two !== 0) cancelAnimationFrame(two)
-    one = requestAnimationFrame(() => {
-      one = 0
-      two = requestAnimationFrame(() => {
-        two = 0
-        setState("nav", { dur: performance.now() - at, pending: false })
-      })
-    })
-  })
-
-  onMount(() => {
-    const obs: PerformanceObserver[] = []
-    const fps: Array<{ at: number; dur: number }> = []
-    const long: Array<{ at: number; dur: number }> = []
-    const seen = new Map<number | string, { at: number; delay: number; dur: number }>()
-    let hasLong = false
-    let poll: number | undefined
-    let raf = 0
-    let last = 0
-    let snap = 0
-
-    const trim = (list: Array<{ at: number; dur: number }>, span: number, at: number) => {
-      while (list[0] && at - list[0].at > span) list.shift()
-    }
-
-    const syncFrame = (at: number) => {
-      trim(fps, span, at)
-      const total = fps.reduce((sum, entry) => sum + entry.dur, 0)
-      const gap = fps.reduce((max, entry) => Math.max(max, entry.dur), 0)
-      const jank = fps.filter((entry) => entry.dur > 32).length
-      batch(() => {
-        setState("fps", total > 0 ? (fps.length * 1000) / total : undefined)
-        setState("gap", gap > 0 ? gap : undefined)
-        setState("jank", jank)
-      })
-    }
-
-    const syncLong = (at = performance.now()) => {
-      if (!hasLong) return
-      trim(long, span, at)
-      const block = long.reduce((sum, entry) => sum + Math.max(0, entry.dur - 50), 0)
-      const max = long.reduce((hi, entry) => Math.max(hi, entry.dur), 0)
-      setState("long", { block, count: long.length, max })
-    }
-
-    const syncInp = (at = performance.now()) => {
-      for (const [key, entry] of seen) {
-        if (at - entry.at > span) seen.delete(key)
-      }
-      let delay = 0
-      let inp = 0
-      for (const entry of seen.values()) {
-        delay = Math.max(delay, entry.delay)
-        inp = Math.max(inp, entry.dur)
-      }
-      batch(() => {
-        setState("delay", delay > 0 ? delay : undefined)
-        setState("inp", inp > 0 ? inp : undefined)
-      })
-    }
-
-    const syncHeap = () => {
-      const mem = (performance as Mem).memory
-      if (!mem) return
-      setState("heap", { limit: mem.jsHeapSizeLimit, used: mem.usedJSHeapSize })
-    }
-
-    const reset = () => {
-      fps.length = 0
-      long.length = 0
-      seen.clear()
-      last = 0
-      snap = 0
-      batch(() => {
-        setState("fps", undefined)
-        setState("gap", undefined)
-        setState("jank", undefined)
-        setState("delay", undefined)
-        setState("inp", undefined)
-        if (hasLong) setState("long", { block: 0, count: 0, max: 0 })
-      })
-    }
-
-    const watch = (type: string, init: Obs, fn: (entries: PerformanceEntry[]) => void) => {
-      if (typeof PerformanceObserver === "undefined") return false
-      if (!(PerformanceObserver.supportedEntryTypes ?? []).includes(type)) return false
-      const ob = new PerformanceObserver((list) => fn(list.getEntries()))
-      try {
-        ob.observe(init)
-        obs.push(ob)
-        return true
-      } catch {
-        ob.disconnect()
-        return false
-      }
-    }
-
-    if (
-      watch("layout-shift", { buffered: true, type: "layout-shift" }, (entries) => {
-        const add = entries.reduce((sum, entry) => {
-          const item = entry as Shift
-          if (item.hadRecentInput) return sum
-          return sum + item.value
-        }, 0)
-        if (add === 0) return
-        setState("cls", (value) => (value ?? 0) + add)
-      })
-    ) {
-      setState("cls", 0)
-    }
-
-    if (
-      watch("longtask", { buffered: true, type: "longtask" }, (entries) => {
-        const at = performance.now()
-        long.push(...entries.map((entry) => ({ at: entry.startTime, dur: entry.duration })))
-        syncLong(at)
-      })
-    ) {
-      hasLong = true
-      setState("long", { block: 0, count: 0, max: 0 })
-    }
-
-    watch("event", { buffered: true, durationThreshold: 16, type: "event" }, (entries) => {
-      for (const raw of entries) {
-        const entry = raw as Evt
-        if (entry.duration < 16) continue
-        const key =
-          entry.interactionId && entry.interactionId > 0
-            ? entry.interactionId
-            : `${entry.name}:${Math.round(entry.startTime)}`
-        const prev = seen.get(key)
-        const delay = Math.max(0, (entry.processingStart ?? entry.startTime) - entry.startTime)
-        seen.set(key, {
-          at: entry.startTime,
-          delay: Math.max(prev?.delay ?? 0, delay),
-          dur: Math.max(prev?.dur ?? 0, entry.duration),
-        })
-        if (seen.size <= 200) continue
-        const first = seen.keys().next().value
-        if (first !== undefined) seen.delete(first)
-      }
-      syncInp()
-    })
-
-    const loop = (at: number) => {
-      if (document.visibilityState !== "visible") {
-        raf = 0
-        return
-      }
-
-      if (last === 0) {
-        last = at
-        raf = requestAnimationFrame(loop)
-        return
-      }
-
-      fps.push({ at, dur: at - last })
-      last = at
-
-      if (at - snap >= 250) {
-        snap = at
-        syncFrame(at)
-      }
-
-      raf = requestAnimationFrame(loop)
-    }
-
-    const stop = () => {
-      if (raf !== 0) cancelAnimationFrame(raf)
-      raf = 0
-      if (poll === undefined) return
-      clearInterval(poll)
-      poll = undefined
-    }
-
-    const start = () => {
-      if (document.visibilityState !== "visible") return
-      if (poll === undefined) {
-        poll = window.setInterval(() => {
-          syncLong()
-          syncInp()
-          syncHeap()
-        }, 1000)
-      }
-      if (raf !== 0) return
-      raf = requestAnimationFrame(loop)
-    }
-
-    const vis = () => {
-      if (document.visibilityState !== "visible") {
-        stop()
-        return
-      }
-      reset()
-      start()
-    }
-
-    syncHeap()
-    start()
-    document.addEventListener("visibilitychange", vis)
-
-    onCleanup(() => {
-      if (one !== 0) cancelAnimationFrame(one)
-      if (two !== 0) cancelAnimationFrame(two)
-      stop()
-      document.removeEventListener("visibilitychange", vis)
-      for (const ob of obs) ob.disconnect()
-    })
-  })
-
-  return (
-    <aside
-      aria-label={language.t("debugBar.ariaLabel")}
-      class="pointer-events-auto fixed bottom-3 right-3 z-50 w-[308px] max-w-[calc(100vw-1.5rem)] overflow-hidden rounded-xl border p-0.5 text-text-on-interactive-base shadow-[var(--shadow-lg-border-base)] sm:bottom-4 sm:right-4 sm:w-[324px]"
-      style={{
-        "background-color": "color-mix(in srgb, var(--icon-interactive-base) 42%, black)",
-        "border-color": "color-mix(in srgb, white 14%, transparent)",
-      }}
-    >
-      <div class="grid grid-cols-5 gap-px font-mono">
-        <Cell
-          label={language.t("debugBar.nav.label")}
-          tip={language.t("debugBar.nav.tip")}
-          value={navv()}
-          bad={bad(state.nav.dur, 400)}
-          dim={state.nav.dur === undefined && !state.nav.pending}
-        />
-        <Cell
-          label={language.t("debugBar.fps.label")}
-          tip={language.t("debugBar.fps.tip")}
-          value={state.fps === undefined ? na() : `${Math.round(state.fps)}`}
-          bad={bad(state.fps, 50, true)}
-          dim={state.fps === undefined}
-        />
-        <Cell
-          label={language.t("debugBar.frame.label")}
-          tip={language.t("debugBar.frame.tip")}
-          value={time(state.gap) ?? na()}
-          bad={bad(state.gap, 50)}
-          dim={state.gap === undefined}
-        />
-        <Cell
-          label={language.t("debugBar.jank.label")}
-          tip={language.t("debugBar.jank.tip")}
-          value={state.jank === undefined ? na() : `${state.jank}`}
-          bad={bad(state.jank, 8)}
-          dim={state.jank === undefined}
-        />
-        <Cell
-          label={language.t("debugBar.long.label")}
-          tip={language.t("debugBar.long.tip", { max: ms(state.long.max) ?? na() })}
-          value={longv()}
-          bad={bad(state.long.block, 200)}
-          dim={state.long.count === undefined}
-        />
-        <Cell
-          label={language.t("debugBar.delay.label")}
-          tip={language.t("debugBar.delay.tip")}
-          value={time(state.delay) ?? na()}
-          bad={bad(state.delay, 100)}
-          dim={state.delay === undefined}
-        />
-        <Cell
-          label={language.t("debugBar.inp.label")}
-          tip={language.t("debugBar.inp.tip")}
-          value={time(state.inp) ?? na()}
-          bad={bad(state.inp, 200)}
-          dim={state.inp === undefined}
-        />
-        <Cell
-          label={language.t("debugBar.cls.label")}
-          tip={language.t("debugBar.cls.tip")}
-          value={state.cls === undefined ? na() : state.cls.toFixed(2)}
-          bad={bad(state.cls, 0.1)}
-          dim={state.cls === undefined}
-        />
-        <Cell
-          label={language.t("debugBar.mem.label")}
-          tip={
-            state.heap.used === undefined
-              ? language.t("debugBar.mem.tipUnavailable")
-              : language.t("debugBar.mem.tip", {
-                  used: mb(state.heap.used) ?? na(),
-                  limit: mb(state.heap.limit) ?? na(),
-                })
-          }
-          value={heapv()}
-          bad={bad(heap(), 0.8)}
-          dim={state.heap.used === undefined}
-          wide
-        />
-      </div>
-    </aside>
-  )
-}

packages/app/src/components/dialog-custom-provider-form.ts

@@ -1,159 +0,0 @@
-const PROVIDER_ID = /^[a-z0-9][a-z0-9-_]*$/
-const OPENAI_COMPATIBLE = "@ai-sdk/openai-compatible"
-
-type Translator = (key: string, vars?: Record<string, string | number | boolean>) => string
-
-export type ModelErr = {
-  id?: string
-  name?: string
-}
-
-export type HeaderErr = {
-  key?: string
-  value?: string
-}
-
-export type ModelRow = {
-  row: string
-  id: string
-  name: string
-  err: ModelErr
-}
-
-export type HeaderRow = {
-  row: string
-  key: string
-  value: string
-  err: HeaderErr
-}
-
-export type FormState = {
-  providerID: string
-  name: string
-  baseURL: string
-  apiKey: string
-  models: ModelRow[]
-  headers: HeaderRow[]
-  saving: boolean
-  err: {
-    providerID?: string
-    name?: string
-    baseURL?: string
-  }
-}
-
-type ValidateArgs = {
-  form: FormState
-  t: Translator
-  disabledProviders: string[]
-  existingProviderIDs: Set<string>
-}
-
-export function validateCustomProvider(input: ValidateArgs) {
-  const providerID = input.form.providerID.trim()
-  const name = input.form.name.trim()
-  const baseURL = input.form.baseURL.trim()
-  const apiKey = input.form.apiKey.trim()
-
-  const env = apiKey.match(/^\{env:([^}]+)\}$/)?.[1]?.trim()
-  const key = apiKey && !env ? apiKey : undefined
-
-  const idError = !providerID
-    ? input.t("provider.custom.error.providerID.required")
-    : !PROVIDER_ID.test(providerID)
-      ? input.t("provider.custom.error.providerID.format")
-      : undefined
-
-  const nameError = !name ? input.t("provider.custom.error.name.required") : undefined
-  const urlError = !baseURL
-    ? input.t("provider.custom.error.baseURL.required")
-    : !/^https?:\/\//.test(baseURL)
-      ? input.t("provider.custom.error.baseURL.format")
-      : undefined
-
-  const disabled = input.disabledProviders.includes(providerID)
-  const existsError = idError
-    ? undefined
-    : input.existingProviderIDs.has(providerID) && !disabled
-      ? input.t("provider.custom.error.providerID.exists")
-      : undefined
-
-  const seenModels = new Set<string>()
-  const models = input.form.models.map((m) => {
-    const id = m.id.trim()
-    const idError = !id
-      ? input.t("provider.custom.error.required")
-      : seenModels.has(id)
-        ? input.t("provider.custom.error.duplicate")
-        : (() => {
-            seenModels.add(id)
-            return undefined
-          })()
-    const nameError = !m.name.trim() ? input.t("provider.custom.error.required") : undefined
-    return { id: idError, name: nameError }
-  })
-  const modelsValid = models.every((m) => !m.id && !m.name)
-  const modelConfig = Object.fromEntries(input.form.models.map((m) => [m.id.trim(), { name: m.name.trim() }]))
-
-  const seenHeaders = new Set<string>()
-  const headers = input.form.headers.map((h) => {
-    const key = h.key.trim()
-    const value = h.value.trim()
-
-    if (!key && !value) return {}
-    const keyError = !key
-      ? input.t("provider.custom.error.required")
-      : seenHeaders.has(key.toLowerCase())
-        ? input.t("provider.custom.error.duplicate")
-        : (() => {
-            seenHeaders.add(key.toLowerCase())
-            return undefined
-          })()
-    const valueError = !value ? input.t("provider.custom.error.required") : undefined
-    return { key: keyError, value: valueError }
-  })
-  const headersValid = headers.every((h) => !h.key && !h.value)
-  const headerConfig = Object.fromEntries(
-    input.form.headers
-      .map((h) => ({ key: h.key.trim(), value: h.value.trim() }))
-      .filter((h) => !!h.key && !!h.value)
-      .map((h) => [h.key, h.value]),
-  )
-
-  const err = {
-    providerID: idError ?? existsError,
-    name: nameError,
-    baseURL: urlError,
-  }
-
-  const ok = !idError && !existsError && !nameError && !urlError && modelsValid && headersValid
-  if (!ok) return { err, models, headers }
-
-  return {
-    err,
-    models,
-    headers,
-    result: {
-      providerID,
-      name,
-      key,
-      config: {
-        npm: OPENAI_COMPATIBLE,
-        name,
-        ...(env ? { env: [env] } : {}),
-        options: {
-          baseURL,
-          ...(Object.keys(headerConfig).length ? { headers: headerConfig } : {}),
-        },
-        models: modelConfig,
-      },
-    },
-  }
-}
-
-let row = 0
-
-const nextRow = () => `row-${row++}`
-
-export const modelRow = (): ModelRow => ({ row: nextRow(), id: "", name: "", err: {} })
-export const headerRow = (): HeaderRow => ({ row: nextRow(), key: "", value: "", err: {} })

packages/app/src/components/dialog-custom-provider.test.ts

@@ -1,82 +0,0 @@
-import { describe, expect, test } from "bun:test"
-import { validateCustomProvider } from "./dialog-custom-provider-form"
-
-const t = (key: string) => key
-
-describe("validateCustomProvider", () => {
-  test("builds trimmed config payload", () => {
-    const result = validateCustomProvider({
-      form: {
-        providerID: "custom-provider",
-        name: " Custom Provider ",
-        baseURL: "https://api.example.com ",
-        apiKey: " {env: CUSTOM_PROVIDER_KEY} ",
-        models: [{ row: "m0", id: " model-a ", name: " Model A ", err: {} }],
-        headers: [
-          { row: "h0", key: " X-Test ", value: " enabled ", err: {} },
-          { row: "h1", key: "", value: "", err: {} },
-        ],
-        saving: false,
-        err: {},
-      },
-      t,
-      disabledProviders: [],
-      existingProviderIDs: new Set(),
-    })
-
-    expect(result.result).toEqual({
-      providerID: "custom-provider",
-      name: "Custom Provider",
-      key: undefined,
-      config: {
-        npm: "@ai-sdk/openai-compatible",
-        name: "Custom Provider",
-        env: ["CUSTOM_PROVIDER_KEY"],
-        options: {
-          baseURL: "https://api.example.com",
-          headers: {
-            "X-Test": "enabled",
-          },
-        },
-        models: {
-          "model-a": { name: "Model A" },
-        },
-      },
-    })
-  })
-
-  test("flags duplicate rows and allows reconnecting disabled providers", () => {
-    const result = validateCustomProvider({
-      form: {
-        providerID: "custom-provider",
-        name: "Provider",
-        baseURL: "https://api.example.com",
-        apiKey: "secret",
-        models: [
-          { row: "m0", id: "model-a", name: "Model A", err: {} },
-          { row: "m1", id: "model-a", name: "Model A 2", err: {} },
-        ],
-        headers: [
-          { row: "h0", key: "Authorization", value: "one", err: {} },
-          { row: "h1", key: "authorization", value: "two", err: {} },
-        ],
-        saving: false,
-        err: {},
-      },
-      t,
-      disabledProviders: ["custom-provider"],
-      existingProviderIDs: new Set(["custom-provider"]),
-    })
-
-    expect(result.result).toBeUndefined()
-    expect(result.err.providerID).toBeUndefined()
-    expect(result.models[1]).toEqual({
-      id: "provider.custom.error.duplicate",
-      name: undefined,
-    })
-    expect(result.headers[1]).toEqual({
-      key: "provider.custom.error.duplicate",
-      value: undefined,
-    })
-  })
-})

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

@@ -5,15 +5,158 @@ import { IconButton } from "@opencode-ai/ui/icon-button"
 import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
 import { TextField } from "@opencode-ai/ui/text-field"
 import { showToast } from "@opencode-ai/ui/toast"
-import { batch, For } from "solid-js"
-import { createStore, produce } from "solid-js/store"
+import { For } from "solid-js"
+import { createStore } from "solid-js/store"
 import { Link } from "@/components/link"
 import { useGlobalSDK } from "@/context/global-sdk"
 import { useGlobalSync } from "@/context/global-sync"
 import { useLanguage } from "@/context/language"
-import { type FormState, headerRow, modelRow, validateCustomProvider } from "./dialog-custom-provider-form"
 import { DialogSelectProvider } from "./dialog-select-provider"
 
+const PROVIDER_ID = /^[a-z0-9][a-z0-9-_]*$/
+const OPENAI_COMPATIBLE = "@ai-sdk/openai-compatible"
+
+type Translator = ReturnType<typeof useLanguage>["t"]
+
+type ModelRow = {
+  id: string
+  name: string
+}
+
+type HeaderRow = {
+  key: string
+  value: string
+}
+
+type FormState = {
+  providerID: string
+  name: string
+  baseURL: string
+  apiKey: string
+  models: ModelRow[]
+  headers: HeaderRow[]
+  saving: boolean
+}
+
+type FormErrors = {
+  providerID: string | undefined
+  name: string | undefined
+  baseURL: string | undefined
+  models: Array<{ id?: string; name?: string }>
+  headers: Array<{ key?: string; value?: string }>
+}
+
+type ValidateArgs = {
+  form: FormState
+  t: Translator
+  disabledProviders: string[]
+  existingProviderIDs: Set<string>
+}
+
+function validateCustomProvider(input: ValidateArgs) {
+  const providerID = input.form.providerID.trim()
+  const name = input.form.name.trim()
+  const baseURL = input.form.baseURL.trim()
+  const apiKey = input.form.apiKey.trim()
+
+  const env = apiKey.match(/^\{env:([^}]+)\}$/)?.[1]?.trim()
+  const key = apiKey && !env ? apiKey : undefined
+
+  const idError = !providerID
+    ? input.t("provider.custom.error.providerID.required")
+    : !PROVIDER_ID.test(providerID)
+      ? input.t("provider.custom.error.providerID.format")
+      : undefined
+
+  const nameError = !name ? input.t("provider.custom.error.name.required") : undefined
+  const urlError = !baseURL
+    ? input.t("provider.custom.error.baseURL.required")
+    : !/^https?:\/\//.test(baseURL)
+      ? input.t("provider.custom.error.baseURL.format")
+      : undefined
+
+  const disabled = input.disabledProviders.includes(providerID)
+  const existsError = idError
+    ? undefined
+    : input.existingProviderIDs.has(providerID) && !disabled
+      ? input.t("provider.custom.error.providerID.exists")
+      : undefined
+
+  const seenModels = new Set<string>()
+  const modelErrors = input.form.models.map((m) => {
+    const id = m.id.trim()
+    const modelIdError = !id
+      ? input.t("provider.custom.error.required")
+      : seenModels.has(id)
+        ? input.t("provider.custom.error.duplicate")
+        : (() => {
+            seenModels.add(id)
+            return undefined
+          })()
+    const modelNameError = !m.name.trim() ? input.t("provider.custom.error.required") : undefined
+    return { id: modelIdError, name: modelNameError }
+  })
+  const modelsValid = modelErrors.every((m) => !m.id && !m.name)
+  const models = Object.fromEntries(input.form.models.map((m) => [m.id.trim(), { name: m.name.trim() }]))
+
+  const seenHeaders = new Set<string>()
+  const headerErrors = input.form.headers.map((h) => {
+    const key = h.key.trim()
+    const value = h.value.trim()
+
+    if (!key && !value) return {}
+    const keyError = !key
+      ? input.t("provider.custom.error.required")
+      : seenHeaders.has(key.toLowerCase())
+        ? input.t("provider.custom.error.duplicate")
+        : (() => {
+            seenHeaders.add(key.toLowerCase())
+            return undefined
+          })()
+    const valueError = !value ? input.t("provider.custom.error.required") : undefined
+    return { key: keyError, value: valueError }
+  })
+  const headersValid = headerErrors.every((h) => !h.key && !h.value)
+  const headers = Object.fromEntries(
+    input.form.headers
+      .map((h) => ({ key: h.key.trim(), value: h.value.trim() }))
+      .filter((h) => !!h.key && !!h.value)
+      .map((h) => [h.key, h.value]),
+  )
+
+  const errors: FormErrors = {
+    providerID: idError ?? existsError,
+    name: nameError,
+    baseURL: urlError,
+    models: modelErrors,
+    headers: headerErrors,
+  }
+
+  const ok = !idError && !existsError && !nameError && !urlError && modelsValid && headersValid
+  if (!ok) return { errors }
+
+  const options = {
+    baseURL,
+    ...(Object.keys(headers).length ? { headers } : {}),
+  }
+
+  return {
+    errors,
+    result: {
+      providerID,
+      name,
+      key,
+      config: {
+        npm: OPENAI_COMPATIBLE,
+        name,
+        ...(env ? { env: [env] } : {}),
+        options,
+        models,
+      },
+    },
+  }
+}
+
 type Props = {
   back?: "providers" | "close"
 }
@@ -29,10 +172,17 @@ export function DialogCustomProvider(props: Props) {
     name: "",
     baseURL: "",
     apiKey: "",
-    models: [modelRow()],
-    headers: [headerRow()],
+    models: [{ id: "", name: "" }],
+    headers: [{ key: "", value: "" }],
     saving: false,
-    err: {},
+  })
+
+  const [errors, setErrors] = createStore<FormErrors>({
+    providerID: undefined,
+    name: undefined,
+    baseURL: undefined,
+    models: [{}],
+    headers: [{}],
   })
 
   const goBack = () => {
@@ -44,61 +194,25 @@ export function DialogCustomProvider(props: Props) {
   }
 
   const addModel = () => {
-    setForm(
-      "models",
-      produce((rows) => {
-        rows.push(modelRow())
-      }),
-    )
+    setForm("models", (v) => [...v, { id: "", name: "" }])
+    setErrors("models", (v) => [...v, {}])
   }
 
   const removeModel = (index: number) => {
     if (form.models.length <= 1) return
-    setForm(
-      "models",
-      produce((rows) => {
-        rows.splice(index, 1)
-      }),
-    )
+    setForm("models", (v) => v.filter((_, i) => i !== index))
+    setErrors("models", (v) => v.filter((_, i) => i !== index))
   }
 
   const addHeader = () => {
-    setForm(
-      "headers",
-      produce((rows) => {
-        rows.push(headerRow())
-      }),
-    )
+    setForm("headers", (v) => [...v, { key: "", value: "" }])
+    setErrors("headers", (v) => [...v, {}])
   }
 
   const removeHeader = (index: number) => {
     if (form.headers.length <= 1) return
-    setForm(
-      "headers",
-      produce((rows) => {
-        rows.splice(index, 1)
-      }),
-    )
-  }
-
-  const setField = (key: "providerID" | "name" | "baseURL" | "apiKey", value: string) => {
-    setForm(key, value)
-    if (key === "apiKey") return
-    setForm("err", key, undefined)
-  }
-
-  const setModel = (index: number, key: "id" | "name", value: string) => {
-    batch(() => {
-      setForm("models", index, key, value)
-      setForm("models", index, "err", key, undefined)
-    })
-  }
-
-  const setHeader = (index: number, key: "key" | "value", value: string) => {
-    batch(() => {
-      setForm("headers", index, key, value)
-      setForm("headers", index, "err", key, undefined)
-    })
+    setForm("headers", (v) => v.filter((_, i) => i !== index))
+    setErrors("headers", (v) => v.filter((_, i) => i !== index))
   }
 
   const validate = () => {
@@ -108,11 +222,7 @@ export function DialogCustomProvider(props: Props) {
       disabledProviders: globalSync.data.config.disabled_providers ?? [],
       existingProviderIDs: new Set(globalSync.data.provider.all.map((p) => p.id)),
     })
-    batch(() => {
-      setForm("err", output.err)
-      output.models.forEach((err, index) => setForm("models", index, "err", err))
-      output.headers.forEach((err, index) => setForm("headers", index, "err", err))
-    })
+    setErrors(output.errors)
     return output.result
   }
 
@@ -195,32 +305,32 @@ export function DialogCustomProvider(props: Props) {
               placeholder={language.t("provider.custom.field.providerID.placeholder")}
               description={language.t("provider.custom.field.providerID.description")}
               value={form.providerID}
-              onChange={(v) => setField("providerID", v)}
-              validationState={form.err.providerID ? "invalid" : undefined}
-              error={form.err.providerID}
+              onChange={(v) => setForm("providerID", v)}
+              validationState={errors.providerID ? "invalid" : undefined}
+              error={errors.providerID}
             />
             <TextField
               label={language.t("provider.custom.field.name.label")}
               placeholder={language.t("provider.custom.field.name.placeholder")}
               value={form.name}
-              onChange={(v) => setField("name", v)}
-              validationState={form.err.name ? "invalid" : undefined}
-              error={form.err.name}
+              onChange={(v) => setForm("name", v)}
+              validationState={errors.name ? "invalid" : undefined}
+              error={errors.name}
             />
             <TextField
               label={language.t("provider.custom.field.baseURL.label")}
               placeholder={language.t("provider.custom.field.baseURL.placeholder")}
               value={form.baseURL}
-              onChange={(v) => setField("baseURL", v)}
-              validationState={form.err.baseURL ? "invalid" : undefined}
-              error={form.err.baseURL}
+              onChange={(v) => setForm("baseURL", v)}
+              validationState={errors.baseURL ? "invalid" : undefined}
+              error={errors.baseURL}
             />
             <TextField
               label={language.t("provider.custom.field.apiKey.label")}
               placeholder={language.t("provider.custom.field.apiKey.placeholder")}
               description={language.t("provider.custom.field.apiKey.description")}
               value={form.apiKey}
-              onChange={(v) => setField("apiKey", v)}
+              onChange={(v) => setForm("apiKey", v)}
             />
           </div>
 
@@ -228,16 +338,16 @@ export function DialogCustomProvider(props: Props) {
             <label class="text-12-medium text-text-weak">{language.t("provider.custom.models.label")}</label>
             <For each={form.models}>
               {(m, i) => (
-                <div class="flex gap-2 items-start" data-row={m.row}>
+                <div class="flex gap-2 items-start">
                   <div class="flex-1">
                     <TextField
                       label={language.t("provider.custom.models.id.label")}
                       hideLabel
                       placeholder={language.t("provider.custom.models.id.placeholder")}
                       value={m.id}
-                      onChange={(v) => setModel(i(), "id", v)}
-                      validationState={m.err.id ? "invalid" : undefined}
-                      error={m.err.id}
+                      onChange={(v) => setForm("models", i(), "id", v)}
+                      validationState={errors.models[i()]?.id ? "invalid" : undefined}
+                      error={errors.models[i()]?.id}
                     />
                   </div>
                   <div class="flex-1">
@@ -246,9 +356,9 @@ export function DialogCustomProvider(props: Props) {
                       hideLabel
                       placeholder={language.t("provider.custom.models.name.placeholder")}
                       value={m.name}
-                      onChange={(v) => setModel(i(), "name", v)}
-                      validationState={m.err.name ? "invalid" : undefined}
-                      error={m.err.name}
+                      onChange={(v) => setForm("models", i(), "name", v)}
+                      validationState={errors.models[i()]?.name ? "invalid" : undefined}
+                      error={errors.models[i()]?.name}
                     />
                   </div>
                   <IconButton
@@ -272,16 +382,16 @@ export function DialogCustomProvider(props: Props) {
             <label class="text-12-medium text-text-weak">{language.t("provider.custom.headers.label")}</label>
             <For each={form.headers}>
               {(h, i) => (
-                <div class="flex gap-2 items-start" data-row={h.row}>
+                <div class="flex gap-2 items-start">
                   <div class="flex-1">
                     <TextField
                       label={language.t("provider.custom.headers.key.label")}
                       hideLabel
                       placeholder={language.t("provider.custom.headers.key.placeholder")}
                       value={h.key}
-                      onChange={(v) => setHeader(i(), "key", v)}
-                      validationState={h.err.key ? "invalid" : undefined}
-                      error={h.err.key}
+                      onChange={(v) => setForm("headers", i(), "key", v)}
+                      validationState={errors.headers[i()]?.key ? "invalid" : undefined}
+                      error={errors.headers[i()]?.key}
                     />
                   </div>
                   <div class="flex-1">
@@ -290,9 +400,9 @@ export function DialogCustomProvider(props: Props) {
                       hideLabel
                       placeholder={language.t("provider.custom.headers.value.placeholder")}
                       value={h.value}
-                      onChange={(v) => setHeader(i(), "value", v)}
-                      validationState={h.err.value ? "invalid" : undefined}
-                      error={h.err.value}
+                      onChange={(v) => setForm("headers", i(), "value", v)}
+                      validationState={errors.headers[i()]?.value ? "invalid" : undefined}
+                      error={errors.headers[i()]?.value}
                     />
                   </div>
                   <IconButton

packages/app/src/components/dialog-fork.tsx

@@ -66,7 +66,6 @@ export const DialogFork: Component = () => {
       directory: sdk.directory,
       attachmentName: language.t("common.attachment"),
     })
-    const dir = base64Encode(sdk.directory)
 
     sdk.client.session
       .fork({ sessionID, messageID: item.id })
@@ -76,8 +75,10 @@ export const DialogFork: Component = () => {
           return
         }
         dialog.close()
-        prompt.set(restored, undefined, { dir, id: forked.data.id })
-        navigate(`/${dir}/session/${forked.data.id}`)
+        navigate(`/${base64Encode(sdk.directory)}/session/${forked.data.id}`)
+        requestAnimationFrame(() => {
+          prompt.set(restored)
+        })
       })
       .catch((err: unknown) => {
         const message = err instanceof Error ? err.message : String(err)

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

@@ -6,7 +6,7 @@ import { Keybind } from "@opencode-ai/ui/keybind"
 import { List } from "@opencode-ai/ui/list"
 import { base64Encode } from "@opencode-ai/util/encode"
 import { getDirectory, getFilename } from "@opencode-ai/util/path"
-import { useNavigate } from "@solidjs/router"
+import { useNavigate, useParams } from "@solidjs/router"
 import { createMemo, createSignal, Match, onCleanup, Show, Switch } from "solid-js"
 import { formatKeybind, useCommand, type CommandOption } from "@/context/command"
 import { useGlobalSDK } from "@/context/global-sdk"
@@ -14,8 +14,6 @@ import { useGlobalSync } from "@/context/global-sync"
 import { useLayout } from "@/context/layout"
 import { useFile } from "@/context/file"
 import { useLanguage } from "@/context/language"
-import { useSessionLayout } from "@/pages/session/session-layout"
-import { createSessionTabs } from "@/pages/session/helpers"
 import { decode64 } from "@/utils/base64"
 import { getRelativeTime } from "@/utils/time"
 
@@ -134,14 +132,9 @@ function createFileEntries(props: {
   tabs: () => ReturnType<ReturnType<typeof useLayout>["tabs"]>
   language: ReturnType<typeof useLanguage>
 }) {
-  const tabState = createSessionTabs({
-    tabs: props.tabs,
-    pathFromTab: props.file.pathFromTab,
-    normalizeTab: (tab) => (tab.startsWith("file://") ? props.file.tab(tab) : tab),
-  })
   const recent = createMemo(() => {
-    const all = tabState.openedTabs()
-    const active = tabState.activeFileTab()
+    const all = props.tabs().all()
+    const active = props.tabs().active()
     const order = active ? [active, ...all.filter((item) => item !== active)] : all
     const seen = new Set<string>()
     const category = props.language.t("palette.group.files")
@@ -266,11 +259,14 @@ export function DialogSelectFile(props: { mode?: DialogSelectFileMode; onOpenFil
   const layout = useLayout()
   const file = useFile()
   const dialog = useDialog()
+  const params = useParams()
   const navigate = useNavigate()
   const globalSDK = useGlobalSDK()
   const globalSync = useGlobalSync()
-  const { params, tabs, view } = useSessionLayout()
   const filesOnly = () => props.mode === "files"
+  const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`)
+  const tabs = createMemo(() => layout.tabs(sessionKey))
+  const view = createMemo(() => layout.view(sessionKey))
   const state = { cleanup: undefined as (() => void) | void, committed: false }
   const [grouped, setGrouped] = createSignal(false)
   const commandEntries = createCommandEntries({ filesOnly, command, language })
@@ -426,7 +422,7 @@ export function DialogSelectFile(props: { mode?: DialogSelectFileMode; onOpenFil
                   </Show>
                 </div>
                 <Show when={item.keybind}>
-                  <Keybind class="rounded-[4px]">{formatKeybind(item.keybind ?? "", language.t)}</Keybind>
+                  <Keybind class="rounded-[4px]">{formatKeybind(item.keybind ?? "")}</Keybind>
                 </Show>
               </div>
             </Match>

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

@@ -13,10 +13,8 @@ import { DialogSelectProvider } from "./dialog-select-provider"
 import { ModelTooltip } from "./model-tooltip"
 import { useLanguage } from "@/context/language"
 
-type ModelState = ReturnType<typeof useLocal>["model"]
-
-export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props) => {
-  const model = props.model ?? useLocal().model
+export const DialogSelectModelUnpaid: Component = () => {
+  const local = useLocal()
   const dialog = useDialog()
   const providers = useProviders()
   const language = useLanguage()
@@ -37,8 +35,8 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
         <List
           class="[&_[data-slot=list-scroll]]:overflow-visible"
           ref={(ref) => (listRef = ref)}
-          items={model.list}
-          current={model.current()}
+          items={local.model.list}
+          current={local.model.current()}
           key={(x) => `${x.provider.id}:${x.id}`}
           itemWrapper={(item, node) => (
             <Tooltip
@@ -57,7 +55,7 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
             </Tooltip>
           )}
           onSelect={(x) => {
-            model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
+            local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
               recent: true,
             })
             dialog.close()

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

@@ -18,22 +18,19 @@ import { useLanguage } from "@/context/language"
 const isFree = (provider: string, cost: { input: number } | undefined) =>
   provider === "opencode" && (!cost || cost.input === 0)
 
-type ModelState = ReturnType<typeof useLocal>["model"]
-
 const ModelList: Component<{
   provider?: string
   class?: string
   onSelect: () => void
   action?: JSX.Element
-  model?: ModelState
 }> = (props) => {
-  const model = props.model ?? useLocal().model
+  const local = useLocal()
   const language = useLanguage()
 
   const models = createMemo(() =>
-    model
+    local.model
       .list()
-      .filter((m) => model.visible({ modelID: m.id, providerID: m.provider.id }))
+      .filter((m) => local.model.visible({ modelID: m.id, providerID: m.provider.id }))
       .filter((m) => (props.provider ? m.provider.id === props.provider : true)),
   )
 
@@ -44,7 +41,7 @@ const ModelList: Component<{
       emptyMessage={language.t("dialog.model.empty")}
       key={(x) => `${x.provider.id}:${x.id}`}
       items={models}
-      current={model.current()}
+      current={local.model.current()}
       filterKeys={["provider.name", "name", "id"]}
       sortBy={(a, b) => a.name.localeCompare(b.name)}
       groupBy={(x) => x.provider.name}
@@ -66,7 +63,7 @@ const ModelList: Component<{
         </Tooltip>
       )}
       onSelect={(x) => {
-        model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
+        local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
           recent: true,
         })
         props.onSelect()
@@ -91,7 +88,6 @@ type ModelSelectorTriggerProps = Omit<ComponentProps<typeof Kobalte.Trigger>, "a
 
 export function ModelSelectorPopover(props: {
   provider?: string
-  model?: ModelState
   children?: JSX.Element
   triggerAs?: ValidComponent
   triggerProps?: ModelSelectorTriggerProps
@@ -155,7 +151,6 @@ export function ModelSelectorPopover(props: {
           <Kobalte.Title class="sr-only">{language.t("dialog.model.select.title")}</Kobalte.Title>
           <ModelList
             provider={props.provider}
-            model={props.model}
             onSelect={() => setStore("open", false)}
             class="p-1"
             action={
@@ -189,7 +184,7 @@ export function ModelSelectorPopover(props: {
   )
 }
 
-export const DialogSelectModel: Component<{ provider?: string; model?: ModelState }> = (props) => {
+export const DialogSelectModel: Component<{ provider?: string }> = (props) => {
   const dialog = useDialog()
   const language = useLanguage()
 
@@ -207,7 +202,7 @@ export const DialogSelectModel: Component<{ provider?: string; model?: ModelStat
         </Button>
       }
     >
-      <ModelList provider={props.provider} model={props.model} onSelect={() => dialog.close()} />
+      <ModelList provider={props.provider} onSelect={() => dialog.close()} />
       <Button
         variant="ghost"
         class="ml-3 mt-5 mb-6 text-text-base self-start"

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

@@ -14,9 +14,7 @@ import { ServerHealthIndicator, ServerRow } from "@/components/server/server-row
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
 import { normalizeServerUrl, ServerConnection, useServer } from "@/context/server"
-import { type ServerHealth, useCheckServerHealth } from "@/utils/server-health"
-
-const DEFAULT_USERNAME = "opencode"
+import { checkServerHealth, type ServerHealth } from "@/utils/server-health"
 
 interface ServerFormProps {
   value: string
@@ -43,15 +41,13 @@ function showRequestError(language: ReturnType<typeof useLanguage>, err: unknown
   })
 }
 
-function useDefaultServer() {
-  const language = useLanguage()
-  const platform = usePlatform()
-  const [defaultKey, defaultUrlActions] = createResource(
+function useDefaultServer(platform: ReturnType<typeof usePlatform>, language: ReturnType<typeof useLanguage>) {
+  const [defaultUrl, defaultUrlActions] = createResource(
     async () => {
       try {
-        const key = await platform.getDefaultServer?.()
-        if (!key) return null
-        return key
+        const url = await platform.getDefaultServerUrl?.()
+        if (!url) return null
+        return normalizeServerUrl(url) ?? null
       } catch (err) {
         showRequestError(language, err)
         return null
@@ -60,22 +56,20 @@ function useDefaultServer() {
     { initialValue: null },
   )
 
-  const canDefault = createMemo(() => !!platform.getDefaultServer && !!platform.setDefaultServer)
-  const setDefault = async (key: ServerConnection.Key | null) => {
+  const canDefault = createMemo(() => !!platform.getDefaultServerUrl && !!platform.setDefaultServerUrl)
+  const setDefault = async (url: string | null) => {
     try {
-      await platform.setDefaultServer?.(key)
-      defaultUrlActions.mutate(key)
+      await platform.setDefaultServerUrl?.(url)
+      defaultUrlActions.mutate(url)
     } catch (err) {
       showRequestError(language, err)
     }
   }
 
-  return { defaultKey, canDefault, setDefault }
+  return { defaultUrl, canDefault, setDefault }
 }
 
-function useServerPreview() {
-  const checkServerHealth = useCheckServerHealth()
-
+function useServerPreview(fetcher: typeof fetch) {
   const looksComplete = (value: string) => {
     const normalized = normalizeServerUrl(value)
     if (!normalized) return false
@@ -98,7 +92,7 @@ function useServerPreview() {
     const http: ServerConnection.HttpBase = { url: normalized }
     if (username) http.username = username
     if (password) http.password = password
-    const result = await checkServerHealth(http)
+    const result = await checkServerHealth(http, fetcher)
     setStatus(result.healthy)
   }
 
@@ -121,7 +115,7 @@ function ServerForm(props: ServerFormProps) {
 
   return (
     <div class="px-5">
-      <div class="bg-surface-base rounded-md p-5 flex flex-col gap-3">
+      <div class="bg-surface-raised-base rounded-md p-5 flex flex-col gap-3">
         <div class="flex-1 min-w-0 [&_[data-slot=input-wrapper]]:relative">
           <TextField
             type="text"
@@ -149,7 +143,7 @@ function ServerForm(props: ServerFormProps) {
           <TextField
             type="text"
             label={language.t("dialog.server.add.username")}
-            placeholder={language.t("dialog.server.add.usernamePlaceholder")}
+            placeholder="username"
             value={props.username}
             disabled={props.busy}
             onChange={props.onUsernameChange}
@@ -158,7 +152,7 @@ function ServerForm(props: ServerFormProps) {
           <TextField
             type="password"
             label={language.t("dialog.server.add.password")}
-            placeholder={language.t("dialog.server.add.passwordPlaceholder")}
+            placeholder="password"
             value={props.password}
             disabled={props.busy}
             onChange={props.onPasswordChange}
@@ -176,15 +170,15 @@ export function DialogSelectServer() {
   const server = useServer()
   const platform = usePlatform()
   const language = useLanguage()
-  const { defaultKey, canDefault, setDefault } = useDefaultServer()
-  const { previewStatus } = useServerPreview()
-  const checkServerHealth = useCheckServerHealth()
+  const fetcher = platform.fetch ?? globalThis.fetch
+  const { defaultUrl, canDefault, setDefault } = useDefaultServer(platform, language)
+  const { previewStatus } = useServerPreview(fetcher)
   const [store, setStore] = createStore({
     status: {} as Record<ServerConnection.Key, ServerHealth | undefined>,
     addServer: {
       url: "",
       name: "",
-      username: DEFAULT_USERNAME,
+      username: "",
       password: "",
       adding: false,
       error: "",
@@ -207,7 +201,7 @@ export function DialogSelectServer() {
     setStore("addServer", {
       url: "",
       name: "",
-      username: DEFAULT_USERNAME,
+      username: "",
       password: "",
       adding: false,
       error: "",
@@ -270,7 +264,7 @@ export function DialogSelectServer() {
     const results: Record<ServerConnection.Key, ServerHealth> = {}
     await Promise.all(
       items().map(async (conn) => {
-        results[ServerConnection.key(conn)] = await checkServerHealth(conn.http)
+        results[ServerConnection.key(conn)] = await checkServerHealth(conn.http, fetcher)
       }),
     )
     setStore("status", reconcile(results))
@@ -368,9 +362,9 @@ export function DialogSelectServer() {
       http: { url: normalized },
     }
     if (store.addServer.name.trim()) conn.displayName = store.addServer.name.trim()
+    if (store.addServer.username) conn.http.username = store.addServer.username
     if (store.addServer.password) conn.http.password = store.addServer.password
-    if (store.addServer.password && store.addServer.username) conn.http.username = store.addServer.username
-    const result = await checkServerHealth(conn.http)
+    const result = await checkServerHealth(conn.http, fetcher)
     setStore("addServer", { adding: false })
     if (!result.healthy) {
       setStore("addServer", { error: language.t("dialog.server.add.error") })
@@ -410,7 +404,7 @@ export function DialogSelectServer() {
       displayName: name,
       http: { url: normalized, username, password },
     }
-    const result = await checkServerHealth(conn.http)
+    const result = await checkServerHealth(conn.http, fetcher)
     setStore("editServer", { busy: false })
     if (!result.healthy) {
       setStore("editServer", { error: language.t("dialog.server.add.error") })
@@ -447,7 +441,7 @@ export function DialogSelectServer() {
       showForm: true,
       url: "",
       name: "",
-      username: DEFAULT_USERNAME,
+      username: "",
       password: "",
       error: "",
       status: undefined,
@@ -500,8 +494,8 @@ export function DialogSelectServer() {
 
   async function handleRemove(url: ServerConnection.Key) {
     server.remove(url)
-    if ((await platform.getDefaultServer?.()) === url) {
-      platform.setDefaultServer?.(null)
+    if ((await platform.getDefaultServerUrl?.()) === url) {
+      platform.setDefaultServerUrl?.(null)
     }
   }
 
@@ -542,7 +536,7 @@ export function DialogSelectServer() {
               if (x) select(x)
             }}
             divider={true}
-            class="px-5 [&_[data-slot=list-search-wrapper]]:w-full [&_[data-slot=list-scroll]]h-[300px] [&_[data-slot=list-scroll]]:overflow-y-auto [&_[data-slot=list-items]]:bg-surface-base [&_[data-slot=list-items]]:rounded-md [&_[data-slot=list-item]]:min-h-14 [&_[data-slot=list-item]]:p-3 [&_[data-slot=list-item]]:!bg-transparent"
+            class="px-5 [&_[data-slot=list-search-wrapper]]:w-full [&_[data-slot=list-scroll]]h-[300px] [&_[data-slot=list-scroll]]:overflow-y-auto [&_[data-slot=list-items]]:bg-surface-raised-base [&_[data-slot=list-items]]:rounded-md [&_[data-slot=list-item]]:min-h-14 [&_[data-slot=list-item]]:p-3 [&_[data-slot=list-item]]:!bg-transparent"
           >
             {(i) => {
               const key = ServerConnection.key(i)
@@ -557,7 +551,7 @@ export function DialogSelectServer() {
                     status={store.status[key]}
                     class="flex items-center gap-3 min-w-0 flex-1"
                     badge={
-                      <Show when={defaultKey() === ServerConnection.key(i)}>
+                      <Show when={defaultUrl() === i.http.url}>
                         <span class="text-text-base bg-surface-base text-14-regular px-1.5 rounded-xs">
                           {language.t("dialog.server.status.default")}
                         </span>
@@ -590,14 +584,14 @@ export function DialogSelectServer() {
                             >
                               <DropdownMenu.ItemLabel>{language.t("dialog.server.menu.edit")}</DropdownMenu.ItemLabel>
                             </DropdownMenu.Item>
-                            <Show when={canDefault() && defaultKey() !== key}>
-                              <DropdownMenu.Item onSelect={() => setDefault(key)}>
+                            <Show when={canDefault() && defaultUrl() !== i.http.url}>
+                              <DropdownMenu.Item onSelect={() => setDefault(i.http.url)}>
                                 <DropdownMenu.ItemLabel>
                                   {language.t("dialog.server.menu.default")}
                                 </DropdownMenu.ItemLabel>
                               </DropdownMenu.Item>
                             </Show>
-                            <Show when={canDefault() && defaultKey() === key}>
+                            <Show when={canDefault() && defaultUrl() === i.http.url}>
                               <DropdownMenu.Item onSelect={() => setDefault(null)}>
                                 <DropdownMenu.ItemLabel>
                                   {language.t("dialog.server.menu.defaultRemove")}

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

@@ -17,6 +17,7 @@ import {
 } from "@/context/prompt"
 import { useLayout } from "@/context/layout"
 import { useSDK } from "@/context/sdk"
+import { useParams } from "@solidjs/router"
 import { useSync } from "@/context/sync"
 import { useComments } from "@/context/comments"
 import { Button } from "@opencode-ai/ui/button"
@@ -26,6 +27,7 @@ import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
 import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Select } from "@opencode-ai/ui/select"
+import { RadioGroup } from "@opencode-ai/ui/radio-group"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { ModelSelectorPopover } from "@/components/dialog-select-model"
 import { DialogSelectModelUnpaid } from "@/components/dialog-select-model-unpaid"
@@ -35,11 +37,8 @@ import { Persist, persisted } from "@/utils/persist"
 import { usePermission } from "@/context/permission"
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
-import { useSessionLayout } from "@/pages/session/session-layout"
-import { createSessionTabs } from "@/pages/session/helpers"
 import { createTextFragment, getCursorPosition, setCursorPosition, setRangeEdge } from "./prompt-input/editor-dom"
-import { createPromptAttachments } from "./prompt-input/attachments"
-import { ACCEPTED_FILE_TYPES } from "./prompt-input/files"
+import { createPromptAttachments, ACCEPTED_FILE_TYPES } from "./prompt-input/attachments"
 import {
   canNavigateHistoryAtCursor,
   navigatePromptHistory,
@@ -49,7 +48,7 @@ import {
   type PromptHistoryStoredEntry,
   promptLength,
 } from "./prompt-input/history"
-import { createPromptSubmit, type FollowupDraft } from "./prompt-input/submit"
+import { createPromptSubmit } from "./prompt-input/submit"
 import { PromptPopover, type AtOption, type SlashCommand } from "./prompt-input/slash-popover"
 import { PromptContextItems } from "./prompt-input/context-items"
 import { PromptImageAttachments } from "./prompt-input/image-attachments"
@@ -62,11 +61,6 @@ interface PromptInputProps {
   ref?: (el: HTMLDivElement) => void
   newSessionWorktree?: string
   onNewSessionWorktreeReset?: () => void
-  edit?: { id: string; prompt: Prompt; context: FollowupDraft["context"] }
-  onEditLoaded?: () => void
-  shouldQueue?: () => boolean
-  onQueue?: (draft: FollowupDraft) => void
-  onAbort?: () => void
   onSubmit?: () => void
 }
 
@@ -108,21 +102,20 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
   const prompt = usePrompt()
   const layout = useLayout()
   const comments = useComments()
+  const params = useParams()
   const dialog = useDialog()
   const providers = useProviders()
   const command = useCommand()
   const permission = usePermission()
   const language = useLanguage()
   const platform = usePlatform()
-  const { params, tabs, view } = useSessionLayout()
   let editorRef!: HTMLDivElement
   let fileInputRef: HTMLInputElement | undefined
   let scrollRef!: HTMLDivElement
   let slashPopoverRef!: HTMLDivElement
 
   const mirror = { input: false }
-  const inset = 56
-  const space = `${inset}px`
+  const inset = 44
 
   const scrollCursorIntoView = () => {
     const container = scrollRef
@@ -157,18 +150,13 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     }
   }
 
-  const queueScroll = (count = 2) => {
-    requestAnimationFrame(() => {
-      scrollCursorIntoView()
-      if (count > 1) queueScroll(count - 1)
-    })
+  const queueScroll = () => {
+    requestAnimationFrame(scrollCursorIntoView)
   }
 
-  const activeFileTab = createSessionTabs({
-    tabs,
-    pathFromTab: files.pathFromTab,
-    normalizeTab: (tab) => (tab.startsWith("file://") ? files.tab(tab) : tab),
-  }).activeFileTab
+  const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`)
+  const tabs = createMemo(() => layout.tabs(sessionKey))
+  const view = createMemo(() => layout.view(sessionKey))
 
   const commentInReview = (path: string) => {
     const sessionID = params.id
@@ -221,7 +209,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
 
   const recent = createMemo(() => {
     const all = tabs().all()
-    const active = activeFileTab()
+    const active = tabs().active()
     const order = active ? [active, ...all.filter((x) => x !== active)] : all
     const seen = new Set<string>()
     const paths: string[] = []
@@ -256,6 +244,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     draggingType: "image" | "@mention" | null
     mode: "normal" | "shell"
     applyingHistory: boolean
+    pendingAutoAccept: boolean
   }>({
     popover: null,
     historyIndex: -1,
@@ -264,18 +253,10 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     draggingType: null,
     mode: "normal",
     applyingHistory: false,
+    pendingAutoAccept: false,
   })
 
   const buttonsSpring = useSpring(() => (store.mode === "normal" ? 1 : 0), { visualDuration: 0.2, bounce: 0 })
-  const motion = (value: number) => ({
-    opacity: value,
-    transform: `scale(${0.95 + value * 0.05})`,
-    filter: `blur(${(1 - value) * 2}px)`,
-    "pointer-events": value > 0.5 ? ("auto" as const) : ("none" as const),
-  })
-  const buttons = createMemo(() => motion(buttonsSpring()))
-  const shell = createMemo(() => motion(1 - buttonsSpring()))
-  const control = createMemo(() => ({ height: "28px", ...buttons() }))
 
   const commentCount = createMemo(() => {
     if (store.mode === "shell") return 0
@@ -325,6 +306,12 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     }),
   )
 
+  createEffect(
+    on(sessionKey, () => {
+      setStore("pendingAutoAccept", false)
+    }),
+  )
+
   const historyComments = () => {
     const byID = new Map(comments.all().map((item) => [`${item.file}\n${item.id}`, item] as const))
     return prompt.context.items().flatMap((item) => {
@@ -511,18 +498,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     setComposing(false)
   }
 
-  const handleCompositionStart = () => {
-    setComposing(true)
-  }
-
-  const handleCompositionEnd = () => {
-    setComposing(false)
-    requestAnimationFrame(() => {
-      if (composing()) return
-      reconcile(prompt.current().filter((part) => part.type !== "image"))
-    })
-  }
-
   const agentList = createMemo(() =>
     sync.data.agent
       .filter((agent) => !agent.hidden && agent.mode !== "primary")
@@ -713,27 +688,24 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     }
   }
 
-  const reconcile = (input: Prompt) => {
-    if (mirror.input) {
-      mirror.input = false
-      if (isNormalizedEditor()) return
-
-      renderEditorWithCursor(input)
-      return
-    }
-
-    const dom = parseFromDOM()
-    if (isNormalizedEditor() && isPromptEqual(input, dom)) return
-
-    renderEditorWithCursor(input)
-  }
-
   createEffect(
     on(
       () => prompt.current(),
-      (parts) => {
-        if (composing()) return
-        reconcile(parts.filter((part) => part.type !== "image"))
+      (currentParts) => {
+        const inputParts = currentParts.filter((part) => part.type !== "image")
+
+        if (mirror.input) {
+          mirror.input = false
+          if (isNormalizedEditor()) return
+
+          renderEditorWithCursor(inputParts)
+          return
+        }
+
+        const domParts = parseFromDOM()
+        if (isNormalizedEditor() && isPromptEqual(inputParts, domParts)) return
+
+        renderEditorWithCursor(inputParts)
       },
     ),
   )
@@ -957,45 +929,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     setCurrentHistory("entries", next)
   }
 
-  createEffect(
-    on(
-      () => props.edit?.id,
-      (id) => {
-        const edit = props.edit
-        if (!id || !edit) return
-
-        for (const item of prompt.context.items()) {
-          prompt.context.remove(item.key)
-        }
-
-        for (const item of edit.context) {
-          prompt.context.add({
-            type: item.type,
-            path: item.path,
-            selection: item.selection,
-            comment: item.comment,
-            commentID: item.commentID,
-            commentOrigin: item.commentOrigin,
-            preview: item.preview,
-          })
-        }
-
-        setStore("mode", "normal")
-        setStore("popover", null)
-        setStore("historyIndex", -1)
-        setStore("savedPrompt", null)
-        prompt.set(edit.prompt, promptLength(edit.prompt))
-        requestAnimationFrame(() => {
-          editorRef.focus()
-          setCursorPosition(editorRef, promptLength(edit.prompt))
-          queueScroll()
-        })
-        props.onEditLoaded?.()
-      },
-      { defer: true },
-    ),
-  )
-
   const navigateHistory = (direction: "up" | "down") => {
     const result = navigatePromptHistory({
       direction,
@@ -1012,7 +945,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     return true
   }
 
-  const { addAttachment, removeAttachment, handlePaste } = createPromptAttachments({
+  const { addImageAttachment, removeImageAttachment, handlePaste } = createPromptAttachments({
     editor: () => editorRef,
     isFocused,
     isDialogActive: () => !!dialog.active,
@@ -1028,20 +961,9 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
   const variants = createMemo(() => ["default", ...local.model.variant.list()])
   const accepting = createMemo(() => {
     const id = params.id
-    if (!id) return permission.isAutoAcceptingDirectory(sdk.directory)
+    if (!id) return store.pendingAutoAccept
     return permission.isAutoAccepting(id, sdk.directory)
   })
-  const acceptLabel = createMemo(() =>
-    language.t(accepting() ? "command.permissions.autoaccept.disable" : "command.permissions.autoaccept.enable"),
-  )
-  const toggleAccept = () => {
-    if (!params.id) {
-      permission.toggleAutoAcceptDirectory(sdk.directory)
-      return
-    }
-
-    permission.toggleAutoAccept(params.id, sdk.directory)
-  }
 
   const { abort, handleSubmit } = createPromptSubmit({
     info,
@@ -1061,9 +983,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     setPopover: (popover) => setStore("popover", popover),
     newSessionWorktree: () => props.newSessionWorktree,
     onNewSessionWorktreeReset: props.onNewSessionWorktreeReset,
-    shouldQueue: props.shouldQueue,
-    onQueue: props.onQueue,
-    onAbort: props.onAbort,
     onSubmit: props.onSubmit,
   })
 
@@ -1263,7 +1182,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
           onOpen={(attachment) =>
             dialog.show(() => <ImagePreview src={attachment.dataUrl} alt={attachment.filename} />)
           }
-          onRemove={removeAttachment}
+          onRemove={removeImageAttachment}
           removeLabel={language.t("prompt.attachment.remove")}
         />
         <div
@@ -1281,11 +1200,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
             editorRef?.focus()
           }}
         >
-          <div
-            class="relative max-h-[240px] overflow-y-auto no-scrollbar"
-            ref={(el) => (scrollRef = el)}
-            style={{ "scroll-padding-bottom": space }}
-          >
+          <div class="relative max-h-[240px] overflow-y-auto no-scrollbar" ref={(el) => (scrollRef = el)}>
             <div
               data-component="prompt-input"
               ref={(el) => {
@@ -1296,45 +1211,33 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
               aria-multiline="true"
               aria-label={placeholder()}
               contenteditable="true"
-              autocapitalize={store.mode === "normal" ? "sentences" : "off"}
-              autocorrect={store.mode === "normal" ? "on" : "off"}
-              spellcheck={store.mode === "normal"}
+              autocapitalize="off"
+              autocorrect="off"
+              spellcheck={false}
               onInput={handleInput}
               onPaste={handlePaste}
-              onCompositionStart={handleCompositionStart}
-              onCompositionEnd={handleCompositionEnd}
+              onCompositionStart={() => setComposing(true)}
+              onCompositionEnd={() => setComposing(false)}
               onBlur={handleBlur}
               onKeyDown={handleKeyDown}
               classList={{
                 "select-text": true,
-                "w-full pl-3 pr-2 pt-2 text-14-regular text-text-strong focus:outline-none whitespace-pre-wrap": true,
+                "w-full pl-3 pr-2 pt-2 pb-11 text-14-regular text-text-strong focus:outline-none whitespace-pre-wrap": true,
                 "[&_[data-type=file]]:text-syntax-property": true,
                 "[&_[data-type=agent]]:text-syntax-type": true,
                 "font-mono!": store.mode === "shell",
               }}
-              style={{ "padding-bottom": space }}
             />
             <Show when={!prompt.dirty()}>
               <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"
+                class="absolute top-0 inset-x-0 pl-3 pr-2 pt-2 pb-11 text-14-regular text-text-weak pointer-events-none whitespace-nowrap truncate"
                 classList={{ "font-mono!": store.mode === "shell" }}
-                style={{ "padding-bottom": space }}
               >
                 {placeholder()}
               </div>
             </Show>
           </div>
 
-          <div
-            aria-hidden="true"
-            class="pointer-events-none absolute inset-x-0 bottom-0"
-            style={{
-              height: space,
-              background:
-                "linear-gradient(to top, var(--surface-raised-stronger-non-alpha) calc(100% - 20px), transparent)",
-            }}
-          />
-
           <div class="pointer-events-none absolute bottom-2 right-2 flex items-center gap-2">
             <input
               ref={fileInputRef}
@@ -1343,12 +1246,42 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
               class="hidden"
               onChange={(e) => {
                 const file = e.currentTarget.files?.[0]
-                if (file) void addAttachment(file)
+                if (file) addImageAttachment(file)
                 e.currentTarget.value = ""
               }}
             />
 
-            <div class="flex items-center gap-1 pointer-events-auto">
+            <div
+              aria-hidden={store.mode !== "normal"}
+              class="flex items-center gap-1"
+              style={{
+                "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
+              }}
+            >
+              <TooltipKeybind
+                placement="top"
+                title={language.t("prompt.action.attachFile")}
+                keybind={command.keybind("file.attach")}
+              >
+                <Button
+                  data-action="prompt-attach"
+                  type="button"
+                  variant="ghost"
+                  class="size-8 p-0"
+                  style={{
+                    opacity: buttonsSpring(),
+                    transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                    filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                  }}
+                  onClick={pick}
+                  disabled={store.mode !== "normal"}
+                  tabIndex={store.mode === "normal" ? undefined : -1}
+                  aria-label={language.t("prompt.action.attachFile")}
+                >
+                  <Icon name="plus" class="size-4.5" />
+                </Button>
+              </TooltipKeybind>
+
               <Tooltip
                 placement="top"
                 inactive={!prompt.dirty() && !working()}
@@ -1377,7 +1310,11 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                   icon={working() ? "stop" : "arrow-up"}
                   variant="primary"
                   class="size-8"
-                  style={buttons()}
+                  style={{
+                    opacity: buttonsSpring(),
+                    transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                    filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                  }}
                   aria-label={working() ? language.t("prompt.action.stop") : language.t("prompt.action.send")}
                 />
               </Tooltip>
@@ -1385,30 +1322,42 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
           </div>
 
           <div class="pointer-events-none absolute bottom-2 left-2">
-            <div
-              aria-hidden={store.mode !== "normal"}
-              class="pointer-events-auto"
-              style={{
-                "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
-              }}
-            >
+            <div class="pointer-events-auto">
               <TooltipKeybind
                 placement="top"
-                title={language.t("prompt.action.attachFile")}
-                keybind={command.keybind("file.attach")}
+                gutter={8}
+                title={language.t(
+                  accepting() ? "command.permissions.autoaccept.disable" : "command.permissions.autoaccept.enable",
+                )}
+                keybind={command.keybind("permissions.autoaccept")}
               >
                 <Button
-                  data-action="prompt-attach"
-                  type="button"
+                  data-action="prompt-permissions"
                   variant="ghost"
-                  class="size-8 p-0"
-                  style={buttons()}
-                  onClick={pick}
-                  disabled={store.mode !== "normal"}
-                  tabIndex={store.mode === "normal" ? undefined : -1}
-                  aria-label={language.t("prompt.action.attachFile")}
+                  onClick={() => {
+                    if (!params.id) {
+                      setStore("pendingAutoAccept", (value) => !value)
+                      return
+                    }
+                    permission.toggleAutoAccept(params.id, sdk.directory)
+                  }}
+                  classList={{
+                    "size-6 flex items-center justify-center": true,
+                    "text-text-base": !accepting(),
+                    "hover:bg-surface-success-base": accepting(),
+                  }}
+                  aria-label={
+                    accepting()
+                      ? language.t("command.permissions.autoaccept.disable")
+                      : language.t("command.permissions.autoaccept.enable")
+                  }
+                  aria-pressed={accepting()}
                 >
-                  <Icon name="plus" class="size-4.5" />
+                  <Icon
+                    name="chevron-double-right"
+                    size="small"
+                    classList={{ "text-icon-success-base": accepting() }}
+                  />
                 </Button>
               </TooltipKeybind>
             </div>
@@ -1423,83 +1372,61 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                 class="h-7 flex items-center gap-1.5 max-w-[160px] min-w-0 absolute inset-y-0 left-0"
                 style={{
                   padding: "0 4px 0 8px",
-                  ...shell(),
+                  opacity: 1 - buttonsSpring(),
+                  transform: `scale(${0.95 + (1 - buttonsSpring()) * 0.05})`,
+                  filter: `blur(${buttonsSpring() * 2}px)`,
+                  "pointer-events": buttonsSpring() < 0.5 ? "auto" : "none",
                 }}
               >
                 <span class="truncate text-13-medium text-text-strong">{language.t("prompt.mode.shell")}</span>
                 <div class="size-4 shrink-0" />
               </div>
               <div class="flex items-center gap-1.5 min-w-0 flex-1">
-                <div data-component="prompt-agent-control">
-                  <TooltipKeybind
-                    placement="top"
-                    gutter={4}
-                    title={language.t("command.agent.cycle")}
-                    keybind={command.keybind("agent.cycle")}
-                  >
-                    <Select
-                      size="normal"
-                      options={agentNames()}
-                      current={local.agent.current()?.name ?? ""}
-                      onSelect={local.agent.set}
-                      class="capitalize max-w-[160px] text-text-base"
-                      valueClass="truncate text-13-regular text-text-base"
-                      triggerStyle={control()}
-                      triggerProps={{ "data-action": "prompt-agent" }}
-                      variant="ghost"
-                    />
-                  </TooltipKeybind>
-                </div>
-                <div data-component="prompt-model-control">
-                  <Show
-                    when={providers.paid().length > 0}
-                    fallback={
-                      <TooltipKeybind
-                        placement="top"
-                        gutter={4}
-                        title={language.t("command.model.choose")}
-                        keybind={command.keybind("model.choose")}
-                      >
-                        <Button
-                          data-action="prompt-model"
-                          as="div"
-                          variant="ghost"
-                          size="normal"
-                          class="min-w-0 max-w-[320px] text-13-regular text-text-base group"
-                          style={control()}
-                          onClick={() => dialog.show(() => <DialogSelectModelUnpaid model={local.model} />)}
-                        >
-                          <Show when={local.model.current()?.provider?.id}>
-                            <ProviderIcon
-                              id={local.model.current()!.provider.id}
-                              class="size-4 shrink-0 opacity-40 group-hover:opacity-100 transition-opacity duration-150"
-                              style={{ "will-change": "opacity", transform: "translateZ(0)" }}
-                            />
-                          </Show>
-                          <span class="truncate">
-                            {local.model.current()?.name ?? language.t("dialog.model.select.title")}
-                          </span>
-                          <Icon name="chevron-down" size="small" class="shrink-0" />
-                        </Button>
-                      </TooltipKeybind>
-                    }
-                  >
+                <TooltipKeybind
+                  placement="top"
+                  gutter={4}
+                  title={language.t("command.agent.cycle")}
+                  keybind={command.keybind("agent.cycle")}
+                >
+                  <Select
+                    size="normal"
+                    options={agentNames()}
+                    current={local.agent.current()?.name ?? ""}
+                    onSelect={local.agent.set}
+                    class="capitalize max-w-[160px]"
+                    valueClass="truncate text-13-regular"
+                    triggerStyle={{
+                      height: "28px",
+                      opacity: buttonsSpring(),
+                      transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                      filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                      "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
+                    }}
+                    variant="ghost"
+                  />
+                </TooltipKeybind>
+                <Show
+                  when={providers.paid().length > 0}
+                  fallback={
                     <TooltipKeybind
                       placement="top"
                       gutter={4}
                       title={language.t("command.model.choose")}
                       keybind={command.keybind("model.choose")}
                     >
-                      <ModelSelectorPopover
-                        model={local.model}
-                        triggerAs={Button}
-                        triggerProps={{
-                          variant: "ghost",
-                          size: "normal",
-                          style: control(),
-                          class: "min-w-0 max-w-[320px] text-13-regular text-text-base group",
-                          "data-action": "prompt-model",
+                      <Button
+                        as="div"
+                        variant="ghost"
+                        size="normal"
+                        class="min-w-0 max-w-[320px] text-13-regular group"
+                        style={{
+                          height: "28px",
+                          opacity: buttonsSpring(),
+                          transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                          filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                          "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
                         }}
+                        onClick={() => dialog.show(() => <DialogSelectModelUnpaid />)}
                       >
                         <Show when={local.model.current()?.provider?.id}>
                           <ProviderIcon
@@ -1512,55 +1439,101 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                           {local.model.current()?.name ?? language.t("dialog.model.select.title")}
                         </span>
                         <Icon name="chevron-down" size="small" class="shrink-0" />
-                      </ModelSelectorPopover>
+                      </Button>
                     </TooltipKeybind>
-                  </Show>
-                </div>
-                <div data-component="prompt-variant-control">
+                  }
+                >
                   <TooltipKeybind
                     placement="top"
                     gutter={4}
-                    title={language.t("command.model.variant.cycle")}
-                    keybind={command.keybind("model.variant.cycle")}
+                    title={language.t("command.model.choose")}
+                    keybind={command.keybind("model.choose")}
                   >
-                    <Select
-                      size="normal"
-                      options={variants()}
-                      current={local.model.variant.current() ?? "default"}
-                      label={(x) => (x === "default" ? language.t("common.default") : x)}
-                      onSelect={(x) => local.model.variant.set(x === "default" ? undefined : x)}
-                      class="capitalize max-w-[160px] text-text-base"
-                      valueClass="truncate text-13-regular text-text-base"
-                      triggerStyle={control()}
-                      triggerProps={{ "data-action": "prompt-model-variant" }}
-                      variant="ghost"
-                    />
+                    <ModelSelectorPopover
+                      triggerAs={Button}
+                      triggerProps={{
+                        variant: "ghost",
+                        size: "normal",
+                        style: {
+                          height: "28px",
+                          opacity: buttonsSpring(),
+                          transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                          filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                          "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
+                        },
+                        class: "min-w-0 max-w-[320px] text-13-regular group",
+                      }}
+                    >
+                      <Show when={local.model.current()?.provider?.id}>
+                        <ProviderIcon
+                          id={local.model.current()!.provider.id}
+                          class="size-4 shrink-0 opacity-40 group-hover:opacity-100 transition-opacity duration-150"
+                          style={{ "will-change": "opacity", transform: "translateZ(0)" }}
+                        />
+                      </Show>
+                      <span class="truncate">
+                        {local.model.current()?.name ?? language.t("dialog.model.select.title")}
+                      </span>
+                      <Icon name="chevron-down" size="small" class="shrink-0" />
+                    </ModelSelectorPopover>
                   </TooltipKeybind>
-                </div>
+                </Show>
                 <TooltipKeybind
                   placement="top"
-                  gutter={8}
-                  title={acceptLabel()}
-                  keybind={command.keybind("permissions.autoaccept")}
+                  gutter={4}
+                  title={language.t("command.model.variant.cycle")}
+                  keybind={command.keybind("model.variant.cycle")}
                 >
-                  <Button
-                    data-action="prompt-permissions"
-                    variant="ghost"
-                    onClick={toggleAccept}
-                    classList={{
-                      "h-7 w-7 p-0 shrink-0 flex items-center justify-center": true,
-                      "text-text-base": !accepting(),
-                      "hover:bg-surface-success-base": accepting(),
+                  <Select
+                    size="normal"
+                    options={variants()}
+                    current={local.model.variant.current() ?? "default"}
+                    label={(x) => (x === "default" ? language.t("common.default") : x)}
+                    onSelect={(x) => local.model.variant.set(x === "default" ? undefined : x)}
+                    class="capitalize max-w-[160px]"
+                    valueClass="truncate text-13-regular"
+                    triggerStyle={{
+                      height: "28px",
+                      opacity: buttonsSpring(),
+                      transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                      filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                      "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
                     }}
-                    style={control()}
-                    aria-label={acceptLabel()}
-                    aria-pressed={accepting()}
-                  >
-                    <Icon name="shield" size="small" classList={{ "text-icon-success-base": accepting() }} />
-                  </Button>
+                    variant="ghost"
+                  />
                 </TooltipKeybind>
               </div>
             </div>
+            <div class="shrink-0">
+              <RadioGroup
+                options={["shell", "normal"] as const}
+                current={store.mode}
+                value={(mode) => mode}
+                label={(mode) => (
+                  <TooltipKeybind
+                    placement="top"
+                    gutter={4}
+                    openDelay={2000}
+                    title={language.t(mode === "shell" ? "prompt.mode.shell" : "prompt.mode.normal")}
+                    keybind={command.keybind(mode === "shell" ? "prompt.mode.shell" : "prompt.mode.normal")}
+                    class="size-full flex items-center justify-center"
+                  >
+                    <Icon
+                      name={mode === "shell" ? "console" : "prompt"}
+                      class="size-[18px]"
+                      classList={{
+                        "text-icon-strong-base": store.mode === mode,
+                        "text-icon-weak": store.mode !== mode,
+                      }}
+                    />
+                  </TooltipKeybind>
+                )}
+                onSelect={(mode) => mode && setMode(mode)}
+                fill
+                pad="none"
+                class="w-[68px]"
+              />
+            </div>
           </div>
         </DockTray>
       </Show>

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

@@ -1,24 +0,0 @@
-import { describe, expect, test } from "bun:test"
-import { attachmentMime } from "./files"
-
-describe("attachmentMime", () => {
-  test("keeps PDFs when the browser reports the mime", async () => {
-    const file = new File(["%PDF-1.7"], "guide.pdf", { type: "application/pdf" })
-    expect(await attachmentMime(file)).toBe("application/pdf")
-  })
-
-  test("normalizes structured text types to text/plain", async () => {
-    const file = new File(['{"ok":true}\n'], "data.json", { type: "application/json" })
-    expect(await attachmentMime(file)).toBe("text/plain")
-  })
-
-  test("accepts text files even with a misleading browser mime", async () => {
-    const file = new File(["export const x = 1\n"], "main.ts", { type: "video/mp2t" })
-    expect(await attachmentMime(file)).toBe("text/plain")
-  })
-
-  test("rejects binary files", async () => {
-    const file = new File([Uint8Array.of(0, 255, 1, 2)], "blob.bin", { type: "application/octet-stream" })
-    expect(await attachmentMime(file)).toBeUndefined()
-  })
-})

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

@@ -4,27 +4,12 @@ import { usePrompt, type ContentPart, type ImageAttachmentPart } from "@/context
 import { useLanguage } from "@/context/language"
 import { uuid } from "@/utils/uuid"
 import { getCursorPosition } from "./editor-dom"
-import { attachmentMime } from "./files"
+
+export const ACCEPTED_IMAGE_TYPES = ["image/png", "image/jpeg", "image/gif", "image/webp"]
+export const ACCEPTED_FILE_TYPES = [...ACCEPTED_IMAGE_TYPES, "application/pdf"]
 const LARGE_PASTE_CHARS = 8000
 const LARGE_PASTE_BREAKS = 120
 
-function dataUrl(file: File, mime: string) {
-  return new Promise<string>((resolve) => {
-    const reader = new FileReader()
-    reader.addEventListener("error", () => resolve(""))
-    reader.addEventListener("load", () => {
-      const value = typeof reader.result === "string" ? reader.result : ""
-      const idx = value.indexOf(",")
-      if (idx === -1) {
-        resolve(value)
-        return
-      }
-      resolve(`data:${mime};base64,${value.slice(idx + 1)}`)
-    })
-    reader.readAsDataURL(file)
-  })
-}
-
 function largePaste(text: string) {
   if (text.length >= LARGE_PASTE_CHARS) return true
   let breaks = 0
@@ -50,41 +35,28 @@ export function createPromptAttachments(input: PromptAttachmentsInput) {
   const prompt = usePrompt()
   const language = useLanguage()
 
-  const warn = () => {
-    showToast({
-      title: language.t("prompt.toast.pasteUnsupported.title"),
-      description: language.t("prompt.toast.pasteUnsupported.description"),
-    })
+  const addImageAttachment = async (file: File) => {
+    if (!ACCEPTED_FILE_TYPES.includes(file.type)) return
+
+    const reader = new FileReader()
+    reader.onload = () => {
+      const editor = input.editor()
+      if (!editor) return
+      const dataUrl = reader.result as string
+      const attachment: ImageAttachmentPart = {
+        type: "image",
+        id: uuid(),
+        filename: file.name,
+        mime: file.type,
+        dataUrl,
+      }
+      const cursorPosition = prompt.cursor() ?? getCursorPosition(editor)
+      prompt.set([...prompt.current(), attachment], cursorPosition)
+    }
+    reader.readAsDataURL(file)
   }
 
-  const add = async (file: File, toast = true) => {
-    const mime = await attachmentMime(file)
-    if (!mime) {
-      if (toast) warn()
-      return false
-    }
-
-    const editor = input.editor()
-    if (!editor) return false
-
-    const url = await dataUrl(file, mime)
-    if (!url) return false
-
-    const attachment: ImageAttachmentPart = {
-      type: "image",
-      id: uuid(),
-      filename: file.name,
-      mime,
-      dataUrl: url,
-    }
-    const cursor = prompt.cursor() ?? getCursorPosition(editor)
-    prompt.set([...prompt.current(), attachment], cursor)
-    return true
-  }
-
-  const addAttachment = (file: File) => add(file)
-
-  const removeAttachment = (id: string) => {
+  const removeImageAttachment = (id: string) => {
     const current = prompt.current()
     const next = current.filter((part) => part.type !== "image" || part.id !== id)
     prompt.set(next, prompt.cursor())
@@ -100,16 +72,21 @@ export function createPromptAttachments(input: PromptAttachmentsInput) {
 
     const items = Array.from(clipboardData.items)
     const fileItems = items.filter((item) => item.kind === "file")
+    const imageItems = fileItems.filter((item) => ACCEPTED_FILE_TYPES.includes(item.type))
+
+    if (imageItems.length > 0) {
+      for (const item of imageItems) {
+        const file = item.getAsFile()
+        if (file) await addImageAttachment(file)
+      }
+      return
+    }
 
     if (fileItems.length > 0) {
-      let found = false
-      for (const item of fileItems) {
-        const file = item.getAsFile()
-        if (!file) continue
-        const ok = await add(file, false)
-        if (ok) found = true
-      }
-      if (!found) warn()
+      showToast({
+        title: language.t("prompt.toast.pasteUnsupported.title"),
+        description: language.t("prompt.toast.pasteUnsupported.description"),
+      })
       return
     }
 
@@ -119,7 +96,7 @@ export function createPromptAttachments(input: PromptAttachmentsInput) {
     if (input.readClipboardImage && !plainText) {
       const file = await input.readClipboardImage()
       if (file) {
-        await addAttachment(file)
+        await addImageAttachment(file)
         return
       }
     }
@@ -176,12 +153,11 @@ export function createPromptAttachments(input: PromptAttachmentsInput) {
     const dropped = event.dataTransfer?.files
     if (!dropped) return
 
-    let found = false
     for (const file of Array.from(dropped)) {
-      const ok = await add(file, false)
-      if (ok) found = true
+      if (ACCEPTED_FILE_TYPES.includes(file.type)) {
+        await addImageAttachment(file)
+      }
     }
-    if (!found && dropped.length > 0) warn()
   }
 
   onMount(() => {
@@ -197,8 +173,8 @@ export function createPromptAttachments(input: PromptAttachmentsInput) {
   })
 
   return {
-    addAttachment,
-    removeAttachment,
+    addImageAttachment,
+    removeImageAttachment,
     handlePaste,
   }
 }

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

@@ -1,119 +0,0 @@
-export const ACCEPTED_IMAGE_TYPES = ["image/png", "image/jpeg", "image/gif", "image/webp"]
-
-const IMAGE_MIMES = new Set(ACCEPTED_IMAGE_TYPES)
-const IMAGE_EXTS = new Map([
-  ["gif", "image/gif"],
-  ["jpeg", "image/jpeg"],
-  ["jpg", "image/jpeg"],
-  ["png", "image/png"],
-  ["webp", "image/webp"],
-])
-const TEXT_MIMES = new Set([
-  "application/json",
-  "application/ld+json",
-  "application/toml",
-  "application/x-toml",
-  "application/x-yaml",
-  "application/xml",
-  "application/yaml",
-])
-
-export const ACCEPTED_FILE_TYPES = [
-  ...ACCEPTED_IMAGE_TYPES,
-  "application/pdf",
-  "text/*",
-  "application/json",
-  "application/ld+json",
-  "application/toml",
-  "application/x-toml",
-  "application/x-yaml",
-  "application/xml",
-  "application/yaml",
-  ".c",
-  ".cc",
-  ".cjs",
-  ".conf",
-  ".cpp",
-  ".css",
-  ".csv",
-  ".cts",
-  ".env",
-  ".go",
-  ".gql",
-  ".graphql",
-  ".h",
-  ".hh",
-  ".hpp",
-  ".htm",
-  ".html",
-  ".ini",
-  ".java",
-  ".js",
-  ".json",
-  ".jsx",
-  ".log",
-  ".md",
-  ".mdx",
-  ".mjs",
-  ".mts",
-  ".py",
-  ".rb",
-  ".rs",
-  ".sass",
-  ".scss",
-  ".sh",
-  ".sql",
-  ".toml",
-  ".ts",
-  ".tsx",
-  ".txt",
-  ".xml",
-  ".yaml",
-  ".yml",
-  ".zsh",
-]
-
-const SAMPLE = 4096
-
-function kind(type: string) {
-  return type.split(";", 1)[0]?.trim().toLowerCase() ?? ""
-}
-
-function ext(name: string) {
-  const idx = name.lastIndexOf(".")
-  if (idx === -1) return ""
-  return name.slice(idx + 1).toLowerCase()
-}
-
-function textMime(type: string) {
-  if (!type) return false
-  if (type.startsWith("text/")) return true
-  if (TEXT_MIMES.has(type)) return true
-  if (type.endsWith("+json")) return true
-  return type.endsWith("+xml")
-}
-
-function textBytes(bytes: Uint8Array) {
-  if (bytes.length === 0) return true
-  let count = 0
-  for (const byte of bytes) {
-    if (byte === 0) return false
-    if (byte < 9 || (byte > 13 && byte < 32)) count += 1
-  }
-  return count / bytes.length <= 0.3
-}
-
-export async function attachmentMime(file: File) {
-  const type = kind(file.type)
-  if (IMAGE_MIMES.has(type)) return type
-  if (type === "application/pdf") return type
-
-  const suffix = ext(file.name)
-  const fallback = IMAGE_EXTS.get(suffix) ?? (suffix === "pdf" ? "application/pdf" : undefined)
-  if ((!type || type === "application/octet-stream") && fallback) return fallback
-
-  if (textMime(type)) return "text/plain"
-  const bytes = new Uint8Array(await file.slice(0, SAMPLE).arrayBuffer())
-  if (!textBytes(bytes)) return
-  return "text/plain"
-}

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

@@ -6,24 +6,10 @@ let createPromptSubmit: typeof import("./submit").createPromptSubmit
 const createdClients: string[] = []
 const createdSessions: string[] = []
 const enabledAutoAccept: Array<{ sessionID: string; directory: string }> = []
-const optimistic: Array<{
-  directory?: string
-  sessionID?: string
-  message: {
-    agent: string
-    model: { providerID: string; modelID: string }
-    variant?: string
-  }
-}> = []
-const optimisticSeeded: boolean[] = []
-const storedSessions: Record<string, Array<{ id: string; title?: string }>> = {}
-const promoted: Array<{ directory: string; sessionID: string }> = []
 const sentShell: string[] = []
 const syncedDirectories: string[] = []
 
-let params: { id?: string } = {}
 let selected = "/repo/worktree-a"
-let variant: string | undefined
 
 const promptValue: Prompt = [{ type: "text", content: "ls", start: 0, end: 2 }]
 
@@ -33,19 +19,13 @@ const clientFor = (directory: string) => {
     session: {
       create: async () => {
         createdSessions.push(directory)
-        return {
-          data: {
-            id: `session-${createdSessions.length}`,
-            title: `New session ${createdSessions.length}`,
-          },
-        }
+        return { data: { id: `session-${createdSessions.length}` } }
       },
       shell: async () => {
         sentShell.push(directory)
         return { data: undefined }
       },
       prompt: async () => ({ data: undefined }),
-      promptAsync: async () => ({ data: undefined }),
       command: async () => ({ data: undefined }),
       abort: async () => ({ data: undefined }),
     },
@@ -60,7 +40,7 @@ beforeAll(async () => {
 
   mock.module("@solidjs/router", () => ({
     useNavigate: () => () => undefined,
-    useParams: () => params,
+    useParams: () => ({}),
   }))
 
   mock.module("@opencode-ai/sdk/v2/client", () => ({
@@ -82,16 +62,11 @@ beforeAll(async () => {
     useLocal: () => ({
       model: {
         current: () => ({ id: "model", provider: { id: "provider" } }),
-        variant: { current: () => variant },
+        variant: { current: () => undefined },
       },
       agent: {
         current: () => ({ name: "agent" }),
       },
-      session: {
-        promote(directory: string, sessionID: string) {
-          promoted.push({ directory, sessionID })
-        },
-      },
     }),
   }))
 
@@ -143,18 +118,7 @@ beforeAll(async () => {
       data: { command: [] },
       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,
-            )
-          },
+          add: () => undefined,
           remove: () => undefined,
         },
       },
@@ -166,21 +130,7 @@ beforeAll(async () => {
     useGlobalSync: () => ({
       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 }>
-            }
-          },
-        ]
+        return [{}, () => undefined]
       },
     }),
   }))
@@ -205,15 +155,9 @@ beforeEach(() => {
   createdClients.length = 0
   createdSessions.length = 0
   enabledAutoAccept.length = 0
-  optimistic.length = 0
-  optimisticSeeded.length = 0
-  promoted.length = 0
-  params = {}
   sentShell.length = 0
   syncedDirectories.length = 0
   selected = "/repo/worktree-a"
-  variant = undefined
-  for (const key of Object.keys(storedSessions)) delete storedSessions[key]
 })
 
 describe("prompt submit worktree selection", () => {
@@ -246,12 +190,7 @@ describe("prompt submit worktree selection", () => {
     expect(createdClients).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
     expect(createdSessions).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
     expect(sentShell).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
-    expect(syncedDirectories).toEqual(["/repo/worktree-a", "/repo/worktree-a", "/repo/worktree-b", "/repo/worktree-b"])
-    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"])
+    expect(syncedDirectories).toEqual(["/repo/worktree-a", "/repo/worktree-b"])
   })
 
   test("applies auto-accept to newly created sessions", async () => {
@@ -280,67 +219,4 @@ describe("prompt submit worktree selection", () => {
 
     expect(enabledAutoAccept).toEqual([{ sessionID: "session-1", directory: "/repo/worktree-a" }])
   })
-
-  test("includes the selected variant on optimistic prompts", async () => {
-    params = { id: "session-1" }
-    variant = "high"
-
-    const submit = createPromptSubmit({
-      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,
-      onSubmit: () => undefined,
-    })
-
-    const event = { preventDefault: () => undefined } as unknown as Event
-
-    await submit.handleSubmit(event)
-
-    expect(optimistic).toHaveLength(1)
-    expect(optimistic[0]).toMatchObject({
-      message: {
-        agent: "agent",
-        model: { providerID: "provider", modelID: "model" },
-        variant: "high",
-      },
-    })
-  })
-
-  test("seeds new sessions before optimistic prompts are added", async () => {
-    const submit = createPromptSubmit({
-      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"]).toEqual([{ id: "session-1", title: "New session 1" }])
-    expect(optimisticSeeded).toEqual([true])
-  })
 })

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

@@ -1,7 +1,6 @@
-import type { Message, Session } from "@opencode-ai/sdk/v2/client"
+import type { Message } from "@opencode-ai/sdk/v2/client"
 import { showToast } from "@opencode-ai/ui/toast"
 import { base64Encode } from "@opencode-ai/util/encode"
-import { Binary } from "@opencode-ai/util/binary"
 import { useNavigate, useParams } from "@solidjs/router"
 import type { Accessor } from "solid-js"
 import type { FileSelection } from "@/context/file"
@@ -10,14 +9,13 @@ import { useLanguage } from "@/context/language"
 import { useLayout } from "@/context/layout"
 import { useLocal } from "@/context/local"
 import { usePermission } from "@/context/permission"
-import { type ContextItem, type ImageAttachmentPart, type Prompt, usePrompt } from "@/context/prompt"
+import { type ImageAttachmentPart, type Prompt, usePrompt } from "@/context/prompt"
 import { useSDK } from "@/context/sdk"
 import { useSync } from "@/context/sync"
 import { Identifier } from "@/utils/id"
 import { Worktree as WorktreeState } from "@/utils/worktree"
 import { buildRequestParts } from "./build-request-parts"
 import { setCursorPosition } from "./editor-dom"
-import { formatServerError } from "@/utils/server-errors"
 
 type PendingPrompt = {
   abort: AbortController
@@ -26,145 +24,6 @@ type PendingPrompt = {
 
 const pending = new Map<string, PendingPrompt>()
 
-export type FollowupDraft = {
-  sessionID: string
-  sessionDirectory: string
-  prompt: Prompt
-  context: (ContextItem & { key: string })[]
-  agent: string
-  model: { providerID: string; modelID: string }
-  variant?: string
-}
-
-type FollowupSendInput = {
-  client: ReturnType<typeof useSDK>["client"]
-  globalSync: ReturnType<typeof useGlobalSync>
-  sync: ReturnType<typeof useSync>
-  draft: FollowupDraft
-  messageID?: string
-  optimisticBusy?: boolean
-  before?: () => Promise<boolean> | boolean
-}
-
-const draftText = (prompt: Prompt) => prompt.map((part) => ("content" in part ? part.content : "")).join("")
-
-const draftImages = (prompt: Prompt) => prompt.filter((part): part is ImageAttachmentPart => part.type === "image")
-
-export async function sendFollowupDraft(input: FollowupSendInput) {
-  const text = draftText(input.draft.prompt)
-  const images = draftImages(input.draft.prompt)
-  const [, setStore] = input.globalSync.child(input.draft.sessionDirectory)
-
-  const setBusy = () => {
-    if (!input.optimisticBusy) return
-    setStore("session_status", input.draft.sessionID, { type: "busy" })
-  }
-
-  const setIdle = () => {
-    if (!input.optimisticBusy) return
-    setStore("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
-      }
-
-      await input.client.session.command({
-        sessionID: input.draft.sessionID,
-        command: cmd,
-        arguments: tail.join(" "),
-        agent: input.draft.agent,
-        model: `${input.draft.model.providerID}/${input.draft.model.modelID}`,
-        variant: input.draft.variant,
-        parts: images.map((attachment) => ({
-          id: Identifier.ascending("part"),
-          type: "file" as const,
-          mime: attachment.mime,
-          url: attachment.dataUrl,
-          filename: attachment.filename,
-        })),
-      })
-      return true
-    } catch (err) {
-      setIdle()
-      throw err
-    }
-  }
-
-  const messageID = input.messageID ?? Identifier.ascending("message")
-  const { requestParts, optimisticParts } = buildRequestParts({
-    prompt: input.draft.prompt,
-    context: input.draft.context,
-    images,
-    text,
-    sessionID: input.draft.sessionID,
-    messageID,
-    sessionDirectory: input.draft.sessionDirectory,
-  })
-
-  const message: Message = {
-    id: messageID,
-    sessionID: input.draft.sessionID,
-    role: "user",
-    time: { created: Date.now() },
-    agent: input.draft.agent,
-    model: input.draft.model,
-    variant: input.draft.variant,
-  }
-
-  const add = () =>
-    input.sync.session.optimistic.add({
-      directory: input.draft.sessionDirectory,
-      sessionID: input.draft.sessionID,
-      message,
-      parts: optimisticParts,
-    })
-
-  const remove = () =>
-    input.sync.session.optimistic.remove({
-      directory: input.draft.sessionDirectory,
-      sessionID: input.draft.sessionID,
-      messageID,
-    })
-
-  setBusy()
-  add()
-
-  try {
-    if (!(await wait())) {
-      setIdle()
-      remove()
-      return false
-    }
-
-    await input.client.session.promptAsync({
-      sessionID: input.draft.sessionID,
-      agent: input.draft.agent,
-      model: input.draft.model,
-      messageID,
-      parts: requestParts,
-      variant: input.draft.variant,
-    })
-    return true
-  } catch (err) {
-    setIdle()
-    remove()
-    throw err
-  }
-}
-
 type PromptSubmitInput = {
   info: Accessor<{ id: string } | undefined>
   imageAttachments: Accessor<ImageAttachmentPart[]>
@@ -181,9 +40,6 @@ type PromptSubmitInput = {
   setPopover: (popover: "at" | "slash" | null) => void
   newSessionWorktree?: Accessor<string | undefined>
   onNewSessionWorktreeReset?: () => void
-  shouldQueue?: Accessor<boolean>
-  onQueue?: (draft: FollowupDraft) => void
-  onAbort?: () => void
   onSubmit?: () => void
 }
 
@@ -225,8 +81,6 @@ export function createPromptSubmit(input: PromptSubmitInput) {
     const [, setStore] = globalSync.child(sdk.directory)
     setStore("todo", sessionID, [])
 
-    input.onAbort?.()
-
     const queued = pending.get(sessionID)
     if (queued) {
       queued.abort.abort()
@@ -261,26 +115,6 @@ export function createPromptSubmit(input: PromptSubmitInput) {
     }
   }
 
-  const clearContext = () => {
-    for (const item of prompt.context.items()) {
-      prompt.context.remove(item.key)
-    }
-  }
-
-  const seed = (dir: string, info: Session) => {
-    const [, setStore] = globalSync.child(dir)
-    setStore("session", (list: Session[]) => {
-      const result = Binary.search(list, info.id, (item) => item.id)
-      const next = [...list]
-      if (result.found) {
-        next[result.index] = info
-        return next
-      }
-      next.splice(result.index, 0, info)
-      return next
-    })
-  }
-
   const handleSubmit = async (event: Event) => {
     event.preventDefault()
 
@@ -296,7 +130,6 @@ export function createPromptSubmit(input: PromptSubmitInput) {
 
     const currentModel = local.model.current()
     const currentAgent = local.agent.current()
-    const variant = local.model.variant.current()
     if (!currentModel || !currentAgent) {
       showToast({
         title: language.t("prompt.toast.modelAgentRequired.title"),
@@ -357,7 +190,7 @@ export function createPromptSubmit(input: PromptSubmitInput) {
 
     let session = input.info()
     if (!session && isNewSession) {
-      const created = await client.session
+      session = await client.session
         .create()
         .then((x) => x.data ?? undefined)
         .catch((err) => {
@@ -367,11 +200,8 @@ export function createPromptSubmit(input: PromptSubmitInput) {
           })
           return undefined
         })
-      if (created) {
-        seed(sessionDirectory, created)
-        session = created
+      if (session) {
         if (shouldAutoAccept) permission.enableAutoAccept(session.id, sessionDirectory)
-        local.session.promote(sessionDirectory, session.id)
         layout.handoff.setTabs(base64Encode(sessionDirectory), session.id)
         navigate(`/${base64Encode(sessionDirectory)}/session/${session.id}`)
       }
@@ -384,21 +214,14 @@ export function createPromptSubmit(input: PromptSubmitInput) {
       return
     }
 
+    input.onSubmit?.()
+
     const model = {
       modelID: currentModel.id,
       providerID: currentModel.provider.id,
     }
     const agent = currentAgent.name
-    const context = prompt.context.items().slice()
-    const draft: FollowupDraft = {
-      sessionID: session.id,
-      sessionDirectory,
-      prompt: currentPrompt,
-      context,
-      agent,
-      model,
-      variant,
-    }
+    const variant = local.model.variant.current()
 
     const clearInput = () => {
       prompt.reset()
@@ -419,15 +242,6 @@ export function createPromptSubmit(input: PromptSubmitInput) {
       })
     }
 
-    if (!isNewSession && mode === "normal" && input.shouldQueue?.()) {
-      input.onQueue?.(draft)
-      clearContext()
-      clearInput()
-      return
-    }
-
-    input.onSubmit?.()
-
     if (mode === "shell") {
       clearInput()
       client.session
@@ -472,7 +286,7 @@ export function createPromptSubmit(input: PromptSubmitInput) {
           .catch((err) => {
             showToast({
               title: language.t("prompt.toast.commandSendFailed.title"),
-              description: formatServerError(err, language.t, language.t("common.requestFailed")),
+              description: errorMessage(err),
             })
             restoreInput()
           })
@@ -480,19 +294,47 @@ export function createPromptSubmit(input: PromptSubmitInput) {
       }
     }
 
+    const context = prompt.context.items().slice()
     const commentItems = context.filter((item) => item.type === "file" && !!item.comment?.trim())
-    const messageID = Identifier.ascending("message")
 
-    const removeOptimisticMessage = () => {
+    const messageID = Identifier.ascending("message")
+    const { requestParts, optimisticParts } = buildRequestParts({
+      prompt: currentPrompt,
+      context,
+      images,
+      text,
+      sessionID: session.id,
+      messageID,
+      sessionDirectory,
+    })
+
+    const optimisticMessage: Message = {
+      id: messageID,
+      sessionID: session.id,
+      role: "user",
+      time: { created: Date.now() },
+      agent,
+      model,
+    }
+
+    const addOptimisticMessage = () =>
+      sync.session.optimistic.add({
+        directory: sessionDirectory,
+        sessionID: session.id,
+        message: optimisticMessage,
+        parts: optimisticParts,
+      })
+
+    const removeOptimisticMessage = () =>
       sync.session.optimistic.remove({
         directory: sessionDirectory,
         sessionID: session.id,
         messageID,
       })
-    }
 
     removeCommentItems(commentItems)
     clearInput()
+    addOptimisticMessage()
 
     const waitForWorktree = async () => {
       const worktree = WorktreeState.get(sessionDirectory)
@@ -549,15 +391,20 @@ export function createPromptSubmit(input: PromptSubmitInput) {
       return true
     }
 
-    void sendFollowupDraft({
-      client,
-      sync,
-      globalSync,
-      draft,
-      messageID,
-      optimisticBusy: sessionDirectory === projectDirectory,
-      before: waitForWorktree,
-    }).catch((err) => {
+    const send = async () => {
+      const ok = await waitForWorktree()
+      if (!ok) return
+      await client.session.promptAsync({
+        sessionID: session.id,
+        agent,
+        model,
+        messageID,
+        parts: requestParts,
+        variant,
+      })
+    }
+
+    void send().catch((err) => {
       pending.delete(session.id)
       if (sessionDirectory === projectDirectory) {
         sync.set("session_status", session.id, { type: "idle" })

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

@@ -10,7 +10,6 @@ import {
   type ParentProps,
   Show,
 } from "solid-js"
-import { useLanguage } from "@/context/language"
 import { type ServerConnection, serverName } from "@/context/server"
 import type { ServerHealth } from "@/utils/server-health"
 
@@ -26,7 +25,6 @@ interface ServerRowProps extends ParentProps {
 }
 
 export function ServerRow(props: ServerRowProps) {
-  const language = useLanguage()
   const [truncated, setTruncated] = createSignal(false)
   let nameRef: HTMLSpanElement | undefined
   let versionRef: HTMLSpanElement | undefined
@@ -67,26 +65,22 @@ export function ServerRow(props: ServerRowProps) {
 
   return (
     <Tooltip
-      class="flex-1 min-w-0"
+      class="flex-1"
       value={tooltipValue()}
-      contentStyle={{ "max-width": "none", "white-space": "nowrap" }}
       placement="top-start"
       inactive={!truncated() && !props.conn.displayName}
     >
       <div class={props.class} classList={{ "opacity-50": props.dimmed }}>
-        <div class="flex flex-col items-start min-w-0 w-full">
-          <div class="flex flex-row items-center gap-2 min-w-0 w-full">
-            <span ref={nameRef} class={`${props.nameClass ?? "truncate"} min-w-0`}>
+        <div class="flex flex-col items-start">
+          <div class="flex flex-row items-center gap-2">
+            <span ref={nameRef} class={props.nameClass ?? "truncate"}>
               {name()}
             </span>
             <Show
               when={badge()}
               fallback={
                 <Show when={props.status?.version}>
-                  <span
-                    ref={versionRef}
-                    class={`${props.versionClass ?? "text-text-weak text-14-regular truncate"} min-w-0`}
-                  >
+                  <span ref={versionRef} class={props.versionClass ?? "text-text-weak text-14-regular truncate"}>
                     v{props.status?.version}
                   </span>
                 </Show>
@@ -102,7 +96,7 @@ export function ServerRow(props: ServerRowProps) {
                   {conn().http.username ? (
                     <span class="text-text-weak">{conn().http.username}</span>
                   ) : (
-                    <span class="text-text-weaker">{language.t("server.row.noUsername")}</span>
+                    <span class="text-text-weaker">no username</span>
                   )}
                 </span>
                 {conn().http.password && <span class="text-text-weak">••••••••</span>}

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

@@ -2,14 +2,12 @@ import { Match, Show, Switch, createMemo } from "solid-js"
 import { Tooltip, type TooltipProps } from "@opencode-ai/ui/tooltip"
 import { ProgressCircle } from "@opencode-ai/ui/progress-circle"
 import { Button } from "@opencode-ai/ui/button"
+import { useParams } from "@solidjs/router"
 
-import { useFile } from "@/context/file"
 import { useLayout } from "@/context/layout"
 import { useSync } from "@/context/sync"
 import { useLanguage } from "@/context/language"
 import { getSessionContextMetrics } from "@/components/session/session-context-metrics"
-import { useSessionLayout } from "@/pages/session/session-layout"
-import { createSessionTabs } from "@/pages/session/helpers"
 
 interface SessionContextUsageProps {
   variant?: "button" | "indicator"
@@ -29,22 +27,19 @@ function openSessionContext(args: {
 
 export function SessionContextUsage(props: SessionContextUsageProps) {
   const sync = useSync()
-  const file = useFile()
+  const params = useParams()
   const layout = useLayout()
   const language = useLanguage()
-  const { params, tabs, view } = useSessionLayout()
 
   const variant = createMemo(() => props.variant ?? "button")
-  const tabState = createSessionTabs({
-    tabs,
-    pathFromTab: file.pathFromTab,
-    normalizeTab: (tab) => (tab.startsWith("file://") ? file.tab(tab) : tab),
-  })
+  const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`)
+  const tabs = createMemo(() => layout.tabs(sessionKey))
+  const view = createMemo(() => layout.view(sessionKey))
   const messages = createMemo(() => (params.id ? (sync.data.message[params.id] ?? []) : []))
 
   const usd = createMemo(
     () =>
-      new Intl.NumberFormat(language.intl(), {
+      new Intl.NumberFormat(language.locale(), {
         style: "currency",
         currency: "USD",
       }),
@@ -59,7 +54,7 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
   const openContext = () => {
     if (!params.id) return
 
-    if (tabState.activeTab() === "context") {
+    if (tabs().active() === "context") {
       tabs().close("context")
       return
     }
@@ -82,7 +77,7 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
         {(ctx) => (
           <>
             <div class="flex items-center gap-2">
-              <span class="text-text-invert-strong">{ctx().total.toLocaleString(language.intl())}</span>
+              <span class="text-text-invert-strong">{ctx().total.toLocaleString(language.locale())}</span>
               <span class="text-text-invert-base">{language.t("context.usage.tokens")}</span>
             </div>
             <div class="flex items-center gap-2">

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

@@ -1,6 +1,8 @@
 import { createMemo, createEffect, on, onCleanup, For, Show } from "solid-js"
 import type { JSX } from "solid-js"
+import { useParams } from "@solidjs/router"
 import { useSync } from "@/context/sync"
+import { useLayout } from "@/context/layout"
 import { checksum } from "@opencode-ai/util/encode"
 import { findLast } from "@opencode-ai/util/array"
 import { same } from "@/utils/same"
@@ -12,7 +14,6 @@ import { Markdown } from "@opencode-ai/ui/markdown"
 import { ScrollView } from "@opencode-ai/ui/scroll-view"
 import type { Message, Part, UserMessage } from "@opencode-ai/sdk/v2/client"
 import { useLanguage } from "@/context/language"
-import { useSessionLayout } from "@/pages/session/session-layout"
 import { getSessionContextMetrics } from "./session-context-metrics"
 import { estimateSessionContextBreakdown, type SessionContextBreakdownKey } from "./session-context-breakdown"
 import { createSessionContextFormatter } from "./session-context-format"
@@ -90,10 +91,13 @@ const emptyMessages: Message[] = []
 const emptyUserMessages: UserMessage[] = []
 
 export function SessionContextTab() {
+  const params = useParams()
   const sync = useSync()
+  const layout = useLayout()
   const language = useLanguage()
-  const { params, view } = useSessionLayout()
 
+  const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`)
+  const view = createMemo(() => layout.view(sessionKey))
   const info = createMemo(() => (params.id ? sync.session.get(params.id) : undefined))
 
   const messages = createMemo(
@@ -124,7 +128,7 @@ export function SessionContextTab() {
 
   const usd = createMemo(
     () =>
-      new Intl.NumberFormat(language.intl(), {
+      new Intl.NumberFormat(language.locale(), {
         style: "currency",
         currency: "USD",
       }),
@@ -132,7 +136,7 @@ export function SessionContextTab() {
 
   const metrics = createMemo(() => getSessionContextMetrics(messages(), sync.data.provider.all))
   const ctx = createMemo(() => metrics().context)
-  const formatter = createMemo(() => createSessionContextFormatter(language.intl()))
+  const formatter = createMemo(() => createSessionContextFormatter(language.locale()))
 
   const cost = createMemo(() => {
     return usd().format(metrics().totalCost)
@@ -196,7 +200,7 @@ export function SessionContextTab() {
 
   const stats = [
     { label: "context.stats.session", value: () => info()?.title ?? params.id ?? "—" },
-    { label: "context.stats.messages", value: () => counts().all.toLocaleString(language.intl()) },
+    { label: "context.stats.messages", value: () => counts().all.toLocaleString(language.locale()) },
     { label: "context.stats.provider", value: providerLabel },
     { label: "context.stats.model", value: modelLabel },
     { label: "context.stats.limit", value: () => formatter().number(ctx()?.limit) },
@@ -209,8 +213,8 @@ export function SessionContextTab() {
       label: "context.stats.cacheTokens",
       value: () => `${formatter().number(ctx()?.cacheRead)} / ${formatter().number(ctx()?.cacheWrite)}`,
     },
-    { label: "context.stats.userMessages", value: () => counts().user.toLocaleString(language.intl()) },
-    { label: "context.stats.assistantMessages", value: () => counts().assistant.toLocaleString(language.intl()) },
+    { label: "context.stats.userMessages", value: () => counts().user.toLocaleString(language.locale()) },
+    { label: "context.stats.assistantMessages", value: () => counts().assistant.toLocaleString(language.locale()) },
     { label: "context.stats.totalCost", value: cost },
     { label: "context.stats.sessionCreated", value: () => formatter().time(info()?.time.created) },
     { label: "context.stats.lastActivity", value: () => formatter().time(ctx()?.message.time.created) },
@@ -303,7 +307,7 @@ export function SessionContextTab() {
                   <div class="flex items-center gap-1 text-11-regular text-text-weak">
                     <div class="size-2 rounded-sm" style={{ "background-color": BREAKDOWN_COLOR[segment.key] }} />
                     <div>{breakdownLabel(segment.key)}</div>
-                    <div class="text-text-weaker">{segment.percent.toLocaleString(language.intl())}%</div>
+                    <div class="text-text-weaker">{segment.percent.toLocaleString(language.locale())}%</div>
                   </div>
                 )}
               </For>

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

@@ -4,23 +4,23 @@ 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 { Popover } from "@opencode-ai/ui/popover"
 import { Spinner } from "@opencode-ai/ui/spinner"
+import { TextField } from "@opencode-ai/ui/text-field"
 import { showToast } from "@opencode-ai/ui/toast"
 import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { getFilename } from "@opencode-ai/util/path"
+import { useParams } from "@solidjs/router"
 import { createEffect, createMemo, For, onCleanup, Show } from "solid-js"
 import { createStore } from "solid-js/store"
 import { Portal } from "solid-js/web"
 import { useCommand } from "@/context/command"
+import { useGlobalSDK } from "@/context/global-sdk"
 import { useLanguage } from "@/context/language"
 import { useLayout } from "@/context/layout"
 import { usePlatform } from "@/context/platform"
 import { useServer } from "@/context/server"
 import { useSync } from "@/context/sync"
-import { useTerminal } from "@/context/terminal"
-import { focusTerminalById } from "@/pages/session/helpers"
-import { useSessionLayout } from "@/pages/session/session-layout"
-import { messageAgentColor } from "@/utils/agent"
 import { decode64 } from "@/utils/base64"
 import { Persist, persisted } from "@/utils/persist"
 import { StatusPopover } from "../status-popover"
@@ -48,68 +48,74 @@ type OS = "macos" | "windows" | "linux" | "unknown"
 const MAC_APPS = [
   {
     id: "vscode",
-    label: "session.header.open.app.vscode",
+    label: "VS Code",
     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: "cursor", label: "Cursor", icon: "cursor", openWith: "Cursor" },
+  { id: "zed", label: "Zed", icon: "zed", openWith: "Zed" },
+  { id: "textmate", label: "TextMate", icon: "textmate", openWith: "TextMate" },
   {
     id: "antigravity",
-    label: "session.header.open.app.antigravity",
+    label: "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: "terminal", label: "Terminal", icon: "terminal", openWith: "Terminal" },
+  { id: "iterm2", label: "iTerm2", icon: "iterm2", openWith: "iTerm" },
+  { id: "ghostty", label: "Ghostty", icon: "ghostty", openWith: "Ghostty" },
+  { id: "warp", label: "Warp", icon: "warp", openWith: "Warp" },
+  { id: "xcode", label: "Xcode", icon: "xcode", openWith: "Xcode" },
   {
     id: "android-studio",
-    label: "session.header.open.app.androidStudio",
+    label: "Android Studio",
     icon: "android-studio",
     openWith: "Android Studio",
   },
   {
     id: "sublime-text",
-    label: "session.header.open.app.sublimeText",
+    label: "Sublime Text",
     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: "vscode", label: "VS Code", icon: "vscode", openWith: "code" },
+  { id: "cursor", label: "Cursor", icon: "cursor", openWith: "cursor" },
+  { id: "zed", label: "Zed", icon: "zed", openWith: "zed" },
   {
     id: "powershell",
-    label: "session.header.open.app.powershell",
+    label: "PowerShell",
     icon: "powershell",
     openWith: "powershell",
   },
   {
     id: "sublime-text",
-    label: "session.header.open.app.sublimeText",
+    label: "Sublime Text",
     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: "vscode", label: "VS Code", icon: "vscode", openWith: "code" },
+  { id: "cursor", label: "Cursor", icon: "cursor", openWith: "cursor" },
+  { id: "zed", label: "Zed", icon: "zed", openWith: "zed" },
   {
     id: "sublime-text",
-    label: "session.header.open.app.sublimeText",
+    label: "Sublime Text",
     icon: "sublime-text",
     openWith: "Sublime Text",
   },
 ] as const
 
+type OpenOption = (typeof MAC_APPS)[number] | (typeof WINDOWS_APPS)[number] | (typeof LINUX_APPS)[number]
+type OpenIcon = OpenApp | "file-explorer"
+const OPEN_ICON_BASE = new Set<OpenIcon>(["finder", "vscode", "cursor", "zed"])
+
+const openIconSize = (id: OpenIcon) => (OPEN_ICON_BASE.has(id) ? "size-4" : "size-[19px]")
+
 const detectOS = (platform: ReturnType<typeof usePlatform>): OS => {
   if (platform.platform === "desktop" && platform.os) return platform.os
   if (typeof navigator !== "object") return "unknown"
@@ -128,15 +134,101 @@ const showRequestError = (language: ReturnType<typeof useLanguage>, err: unknown
   })
 }
 
+function useSessionShare(args: {
+  globalSDK: ReturnType<typeof useGlobalSDK>
+  currentSession: () =>
+    | {
+        share?: {
+          url?: string
+        }
+      }
+    | undefined
+  sessionID: () => string | undefined
+  projectDirectory: () => string
+  platform: ReturnType<typeof usePlatform>
+}) {
+  const [state, setState] = createStore({
+    share: false,
+    unshare: false,
+    copied: false,
+    timer: undefined as number | undefined,
+  })
+  const shareUrl = createMemo(() => args.currentSession()?.share?.url)
+
+  createEffect(() => {
+    const url = shareUrl()
+    if (url) return
+    if (state.timer) window.clearTimeout(state.timer)
+    setState({ copied: false, timer: undefined })
+  })
+
+  onCleanup(() => {
+    if (state.timer) window.clearTimeout(state.timer)
+  })
+
+  const shareSession = () => {
+    const sessionID = args.sessionID()
+    if (!sessionID || state.share) return
+    setState("share", true)
+    args.globalSDK.client.session
+      .share({ sessionID, directory: args.projectDirectory() })
+      .catch((error) => {
+        console.error("Failed to share session", error)
+      })
+      .finally(() => {
+        setState("share", false)
+      })
+  }
+
+  const unshareSession = () => {
+    const sessionID = args.sessionID()
+    if (!sessionID || state.unshare) return
+    setState("unshare", true)
+    args.globalSDK.client.session
+      .unshare({ sessionID, directory: args.projectDirectory() })
+      .catch((error) => {
+        console.error("Failed to unshare session", error)
+      })
+      .finally(() => {
+        setState("unshare", false)
+      })
+  }
+
+  const copyLink = (onError: (error: unknown) => void) => {
+    const url = shareUrl()
+    if (!url) return
+    navigator.clipboard
+      .writeText(url)
+      .then(() => {
+        if (state.timer) window.clearTimeout(state.timer)
+        setState("copied", true)
+        const timer = window.setTimeout(() => {
+          setState("copied", false)
+          setState("timer", undefined)
+        }, 3000)
+        setState("timer", timer)
+      })
+      .catch(onError)
+  }
+
+  const viewShare = () => {
+    const url = shareUrl()
+    if (!url) return
+    args.platform.openLink(url)
+  }
+
+  return { state, shareUrl, shareSession, unshareSession, copyLink, viewShare }
+}
+
 export function SessionHeader() {
+  const globalSDK = useGlobalSDK()
   const layout = useLayout()
+  const params = useParams()
   const command = useCommand()
   const server = useServer()
+  const sync = useSync()
   const platform = usePlatform()
   const language = useLanguage()
-  const sync = useSync()
-  const terminal = useTerminal()
-  const { params, view } = useSessionLayout()
 
   const projectDirectory = createMemo(() => decode64(params.dir) ?? "")
   const project = createMemo(() => {
@@ -150,6 +242,12 @@ export function SessionHeader() {
     return getFilename(projectDirectory())
   })
   const hotkey = createMemo(() => command.keybind("file.open"))
+
+  const currentSession = createMemo(() => (params.id ? sync.session.get(params.id) : undefined))
+  const shareEnabled = createMemo(() => sync.data.config.share !== "disabled")
+  const showShare = createMemo(() => shareEnabled() && !!params.id)
+  const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`)
+  const view = createMemo(() => layout.view(sessionKey))
   const os = createMemo(() => detectOS(platform))
 
   const [exists, setExists] = createStore<Partial<Record<OpenApp, boolean>>>({
@@ -163,9 +261,9 @@ export function SessionHeader() {
   })
 
   const fileManager = createMemo(() => {
-    if (os() === "macos") return { label: "session.header.open.finder", icon: "finder" as const }
-    if (os() === "windows") return { label: "session.header.open.fileExplorer", icon: "file-explorer" as const }
-    return { label: "session.header.open.fileManager", icon: "finder" as const }
+    if (os() === "macos") return { label: "Finder", icon: "finder" as const }
+    if (os() === "windows") return { label: "File Explorer", icon: "file-explorer" as const }
+    return { label: "File Manager", icon: "finder" as const }
   })
 
   createEffect(() => {
@@ -181,7 +279,10 @@ export function SessionHeader() {
         Promise.resolve(platform.checkAppExists?.(app.openWith))
           .then((value) => Boolean(value))
           .catch(() => false)
-          .then((ok) => [app.id, ok] as const),
+          .then((ok) => {
+            console.debug(`[session-header] App "${app.label}" (${app.openWith}): ${ok ? "exists" : "does not exist"}`)
+            return [app.id, ok] as const
+          }),
       ),
     ).then((entries) => {
       setExists(Object.fromEntries(entries) as Partial<Record<OpenApp, boolean>>)
@@ -190,23 +291,11 @@ export function SessionHeader() {
 
   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) })),
+      { id: "finder", label: fileManager().label, icon: fileManager().icon },
+      ...apps().filter((app) => exists[app.id]),
     ] 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({
@@ -214,16 +303,8 @@ export function SessionHeader() {
   })
 
   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 current = createMemo(() => options().find((o) => o.id === prefs.app) ?? options()[0])
   const opening = createMemo(() => openRequest.app !== undefined)
-  const tint = createMemo(() =>
-    messageAgentColor(params.id ? sync.data.message[params.id] : undefined, sync.data.agent),
-  )
 
   const selectApp = (app: OpenApp) => {
     if (!options().some((item) => item.id === app)) return
@@ -262,6 +343,14 @@ export function SessionHeader() {
       .catch((err: unknown) => showRequestError(language, err))
   }
 
+  const share = useSessionShare({
+    globalSDK,
+    currentSession,
+    sessionID: () => params.id,
+    projectDirectory,
+    platform,
+  })
+
   const centerMount = createMemo(() => document.getElementById("opencode-titlebar-center"))
   const rightMount = createMemo(() => document.getElementById("opencode-titlebar-right"))
 
@@ -289,9 +378,7 @@ export function SessionHeader() {
 
               <Show when={hotkey()}>
                 {(keybind) => (
-                  <Keybind class="shrink-0 !border-0 !bg-transparent !shadow-none px-0 text-text-weaker">
-                    {keybind()}
-                  </Keybind>
+                  <Keybind class="shrink-0 !border-0 !bg-transparent !shadow-none px-0">{keybind()}</Keybind>
                 )}
               </Show>
             </Button>
@@ -302,6 +389,7 @@ export function SessionHeader() {
         {(mount) => (
           <Portal mount={mount()}>
             <div class="flex items-center gap-2">
+              <StatusPopover />
               <Show when={projectDirectory()}>
                 <div class="hidden xl:flex items-center">
                   <Show
@@ -326,7 +414,7 @@ export function SessionHeader() {
                       <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-1.5 pl-px gap-1.5 border-none shadow-none disabled:!cursor-default"
+                          class="rounded-none h-full py-0 pr-3 pl-0.5 gap-1.5 border-none shadow-none disabled:!cursor-default"
                           classList={{
                             "bg-surface-raised-base-active": opening(),
                           }}
@@ -334,13 +422,17 @@ export function SessionHeader() {
                           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)" }} />
+                          <div class="flex size-5 shrink-0 items-center justify-center">
+                            <Show
+                              when={opening()}
+                              fallback={<AppIcon id={current().icon} class={openIconSize(current().icon)} />}
+                            >
+                              <Spinner class="size-3.5 text-icon-base" />
                             </Show>
                           </div>
                           <span class="text-12-regular text-text-strong">{language.t("common.open")}</span>
                         </Button>
+                        <div class="self-stretch w-px bg-border-weak-base" />
                         <DropdownMenu
                           gutter={4}
                           placement="bottom-end"
@@ -352,20 +444,17 @@ export function SessionHeader() {
                             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"
+                            class="rounded-none h-full w-[24px] 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.Content>
                               <DropdownMenu.Group>
-                                <DropdownMenu.GroupLabel class="!px-1 !py-1">
-                                  {language.t("session.header.openIn")}
-                                </DropdownMenu.GroupLabel>
+                                <DropdownMenu.GroupLabel>{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
@@ -382,8 +471,8 @@ export function SessionHeader() {
                                           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 class="flex size-5 shrink-0 items-center justify-center">
+                                          <AppIcon id={o.icon} class={openIconSize(o.icon)} />
                                         </div>
                                         <DropdownMenu.ItemLabel>{o.label}</DropdownMenu.ItemLabel>
                                         <DropdownMenu.ItemIndicator>
@@ -416,27 +505,146 @@ export function SessionHeader() {
                   </Show>
                 </div>
               </Show>
-              <div class="flex items-center gap-1">
-                <Tooltip placement="bottom" value={language.t("status.popover.trigger")}>
-                  <StatusPopover />
-                </Tooltip>
-                <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"
+              <Show when={showShare()}>
+                <div class="flex items-center">
+                  <Popover
+                    title={language.t("session.share.popover.title")}
+                    description={
+                      share.shareUrl()
+                        ? language.t("session.share.popover.description.shared")
+                        : language.t("session.share.popover.description.unshared")
+                    }
+                    gutter={4}
+                    placement="bottom-end"
+                    shift={-64}
+                    class="rounded-xl [&_[data-slot=popover-close-button]]:hidden"
+                    triggerAs={Button}
+                    triggerProps={{
+                      variant: "ghost",
+                      class:
+                        "rounded-md h-[24px] px-3 border border-border-weak-base bg-surface-panel shadow-none data-[expanded]:bg-surface-base-active",
+                      classList: {
+                        "rounded-r-none": share.shareUrl() !== undefined,
+                        "border-r-0": share.shareUrl() !== undefined,
+                      },
+                      style: { scale: 1 },
+                    }}
+                    trigger={<span class="text-12-regular">{language.t("session.share.action.share")}</span>}
                   >
-                    <Icon size="small" name={view().terminal.opened() ? "terminal-active" : "terminal"} />
-                  </Button>
-                </TooltipKeybind>
-
+                    <div class="flex flex-col gap-2">
+                      <Show
+                        when={share.shareUrl()}
+                        fallback={
+                          <div class="flex">
+                            <Button
+                              size="large"
+                              variant="primary"
+                              class="w-1/2"
+                              onClick={share.shareSession}
+                              disabled={share.state.share}
+                            >
+                              {share.state.share
+                                ? language.t("session.share.action.publishing")
+                                : language.t("session.share.action.publish")}
+                            </Button>
+                          </div>
+                        }
+                      >
+                        <div class="flex flex-col gap-2">
+                          <TextField
+                            value={share.shareUrl() ?? ""}
+                            readOnly
+                            copyable
+                            copyKind="link"
+                            tabIndex={-1}
+                            class="w-full"
+                          />
+                          <div class="grid grid-cols-2 gap-2">
+                            <Button
+                              size="large"
+                              variant="secondary"
+                              class="w-full shadow-none border border-border-weak-base"
+                              onClick={share.unshareSession}
+                              disabled={share.state.unshare}
+                            >
+                              {share.state.unshare
+                                ? language.t("session.share.action.unpublishing")
+                                : language.t("session.share.action.unpublish")}
+                            </Button>
+                            <Button
+                              size="large"
+                              variant="primary"
+                              class="w-full"
+                              onClick={share.viewShare}
+                              disabled={share.state.unshare}
+                            >
+                              {language.t("session.share.action.view")}
+                            </Button>
+                          </div>
+                        </div>
+                      </Show>
+                    </div>
+                  </Popover>
+                  <Show when={share.shareUrl()} fallback={<div aria-hidden="true" />}>
+                    <Tooltip
+                      value={
+                        share.state.copied
+                          ? language.t("session.share.copy.copied")
+                          : language.t("session.share.copy.copyLink")
+                      }
+                      placement="top"
+                      gutter={8}
+                    >
+                      <IconButton
+                        icon={share.state.copied ? "check" : "link"}
+                        variant="ghost"
+                        class="rounded-l-none h-[24px] border border-border-weak-base bg-surface-panel shadow-none"
+                        onClick={() => share.copyLink((error) => showRequestError(language, error))}
+                        disabled={share.state.unshare}
+                        aria-label={
+                          share.state.copied
+                            ? language.t("session.share.copy.copied")
+                            : language.t("session.share.copy.copyLink")
+                        }
+                      />
+                    </Tooltip>
+                  </Show>
+                </div>
+              </Show>
+              <div class="flex items-center gap-1">
                 <div class="hidden md:flex items-center gap-1 shrink-0">
+                  <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"
+                      onClick={() => view().terminal.toggle()}
+                      aria-label={language.t("command.terminal.toggle")}
+                      aria-expanded={view().terminal.opened()}
+                      aria-controls="terminal-panel"
+                    >
+                      <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0">
+                        <Icon
+                          size="small"
+                          name={view().terminal.opened() ? "layout-bottom-partial" : "layout-bottom"}
+                          class="group-hover/terminal-toggle:hidden"
+                        />
+                        <Icon
+                          size="small"
+                          name="layout-bottom-partial"
+                          class="hidden group-hover/terminal-toggle:inline-block"
+                        />
+                        <Icon
+                          size="small"
+                          name={view().terminal.opened() ? "layout-bottom" : "layout-bottom-partial"}
+                          class="hidden group-active/terminal-toggle:inline-block"
+                        />
+                      </div>
+                    </Button>
+                  </TooltipKeybind>
+
                   <TooltipKeybind
                     title={language.t("command.review.toggle")}
                     keybind={command.keybind("review.toggle")}
@@ -449,7 +657,23 @@ export function SessionHeader() {
                       aria-expanded={view().reviewPanel.opened()}
                       aria-controls="review-panel"
                     >
-                      <Icon size="small" name={view().reviewPanel.opened() ? "review-active" : "review"} />
+                      <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0">
+                        <Icon
+                          size="small"
+                          name={view().reviewPanel.opened() ? "layout-right-partial" : "layout-right"}
+                          class="group-hover/review-toggle:hidden"
+                        />
+                        <Icon
+                          size="small"
+                          name="layout-right-partial"
+                          class="hidden group-hover/review-toggle:inline-block"
+                        />
+                        <Icon
+                          size="small"
+                          name={view().reviewPanel.opened() ? "layout-right" : "layout-right-partial"}
+                          class="hidden group-active/review-toggle:inline-block"
+                        />
+                      </div>
                     </Button>
                   </TooltipKeybind>
 

packages/app/src/components/session/session-new-view.tsx

@@ -4,15 +4,16 @@ import { useSync } from "@/context/sync"
 import { useSDK } from "@/context/sdk"
 import { useLanguage } from "@/context/language"
 import { Icon } from "@opencode-ai/ui/icon"
-import { Mark } from "@opencode-ai/ui/logo"
 import { getDirectory, getFilename } from "@opencode-ai/util/path"
 
 const MAIN_WORKTREE = "main"
 const CREATE_WORKTREE = "create"
-const ROOT_CLASS = "size-full flex flex-col"
+const ROOT_CLASS =
+  "size-full flex flex-col justify-end items-start gap-4 flex-[1_0_0] self-stretch max-w-200 mx-auto 2xl:max-w-[1000px] px-6 pb-16"
 
 interface NewSessionViewProps {
   worktree: string
+  onWorktreeChange: (value: string) => void
 }
 
 export function NewSessionView(props: NewSessionViewProps) {
@@ -49,43 +50,33 @@ export function NewSessionView(props: NewSessionViewProps) {
 
   return (
     <div class={ROOT_CLASS}>
-      <div class="h-12 shrink-0" aria-hidden />
-      <div class="flex-1 px-6 pb-30 flex items-center justify-center text-center">
-        <div class="w-full max-w-200 flex flex-col items-center text-center gap-4">
-          <div class="flex flex-col items-center gap-6">
-            <Mark class="w-10" />
-            <div class="text-20-medium text-text-strong">{language.t("session.new.title")}</div>
-          </div>
-          <div class="w-full flex flex-col gap-4 items-center">
-            <div class="flex items-start justify-center gap-3 min-h-5">
-              <div class="text-12-medium text-text-weak select-text leading-5 min-w-0 max-w-160 break-words text-center">
-                {getDirectory(projectRoot())}
-                <span class="text-text-strong">{getFilename(projectRoot())}</span>
-              </div>
-            </div>
-            <div class="flex items-start justify-center gap-1.5 min-h-5">
-              <Icon name="branch" size="small" class="mt-0.5 shrink-0" />
-              <div class="text-12-medium text-text-weak select-text leading-5 min-w-0 max-w-160 break-words text-center">
-                {label(current())}
-              </div>
-            </div>
-            <Show when={sync.project}>
-              {(project) => (
-                <div class="flex items-start justify-center gap-3 min-h-5">
-                  <div class="text-12-medium text-text-weak leading-5 min-w-0 max-w-160 break-words text-center">
-                    {language.t("session.new.lastModified")}&nbsp;
-                    <span class="text-text-strong">
-                      {DateTime.fromMillis(project().time.updated ?? project().time.created)
-                        .setLocale(language.intl())
-                        .toRelative()}
-                    </span>
-                  </div>
-                </div>
-              )}
-            </Show>
-          </div>
+      <div class="text-20-medium text-text-weaker">{language.t("command.session.new")}</div>
+      <div class="flex justify-center items-center gap-3">
+        <Icon name="folder" size="small" />
+        <div class="text-12-medium text-text-weak select-text">
+          {getDirectory(projectRoot())}
+          <span class="text-text-strong">{getFilename(projectRoot())}</span>
         </div>
       </div>
+      <div class="flex justify-center items-center gap-1">
+        <Icon name="branch" size="small" />
+        <div class="text-12-medium text-text-weak select-text ml-2">{label(current())}</div>
+      </div>
+      <Show when={sync.project}>
+        {(project) => (
+          <div class="flex justify-center items-center gap-3">
+            <Icon name="pencil-line" size="small" />
+            <div class="text-12-medium text-text-weak">
+              {language.t("session.new.lastModified")}&nbsp;
+              <span class="text-text-strong">
+                {DateTime.fromMillis(project().time.updated ?? project().time.created)
+                  .setLocale(language.locale())
+                  .toRelative()}
+              </span>
+            </div>
+          </div>
+        )}
+      </Show>
     </div>
   )
 }