remove build-cli-merge

.github/VOUCHED.td

@@ -11,7 +11,6 @@ adamdotdevin
 -agusbasari29 AI PR slop
 ariane-emory
 -atharvau AI review spamming literally every PR
--borealbytes
 -danieljoshuanazareth
 -danieljoshuanazareth
 edemaine
@@ -22,12 +21,7 @@ jayair
 kitlangton
 kommander
 -opencode2026
--opencodeengineer bot that spams issues
 r44vc0rp
 rekram1-node
--ricardo-m-l
--robinmordasiewicz
-simonklee
 -spider-yamet clawdbot/llm psychosis, spam pinging the team
 thdxr
--toastythebot

.github/workflows/docs-locale-sync.yml

@@ -9,8 +9,7 @@ on:
 
 jobs:
   sync-locales:
-    if: false
-    #if: github.actor != 'opencode-agent[bot]'
+    if: github.actor != 'opencode-agent[bot]'
     runs-on: blacksmith-4vcpu-ubuntu-2404
     permissions:
       contents: write
@@ -35,7 +34,7 @@ jobs:
       - name: Compute changed English docs
         id: changes
         run: |
-          FILES=$(git diff --name-only "${{ github.event.before }}" "${{ github.sha }}" -- ':(glob)packages/web/src/content/docs/*.mdx' || true)
+          FILES=$(git diff --name-only "${{ github.event.before }}" "${{ github.sha }}" -- 'packages/web/src/content/docs/*.mdx' || true)
           if [ -z "$FILES" ]; then
             echo "has_changes=false" >> "$GITHUB_OUTPUT"
             echo "No English docs changed in push range"

.github/workflows/nix-hashes.yml

@@ -17,10 +17,6 @@ on:
       - "patches/**"
       - ".github/workflows/nix-hashes.yml"
 
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
 jobs:
   # Native runners required: bun install cross-compilation flags (--os/--cpu)
   # do not produce byte-identical node_modules as native installs.

.github/workflows/publish.yml

@@ -67,7 +67,7 @@ jobs:
       tag: ${{ steps.version.outputs.tag }}
       repo: ${{ steps.version.outputs.repo }}
 
-  build-cli:
+  build-cli-linux-win:
     needs: version
     runs-on: blacksmith-4vcpu-ubuntu-2404
     if: github.repository == 'anomalyco/opencode'
@@ -94,41 +94,24 @@ jobs:
           OPENCODE_RELEASE: ${{ needs.version.outputs.release }}
           GH_REPO: ${{ needs.version.outputs.repo }}
           GH_TOKEN: ${{ steps.committer.outputs.token }}
+          OPENCODE_BUILD_OS: linux,win32
+          OPENCODE_SKIP_RELEASE_UPLOAD: "1"
 
       - uses: actions/upload-artifact@v4
         with:
-          name: opencode-cli
-          path: |
-            packages/opencode/dist/opencode-darwin*
-            packages/opencode/dist/opencode-linux*
+          name: opencode-cli-linux-win
+          path: packages/opencode/dist
 
-      - uses: actions/upload-artifact@v4
-        with:
-          name: opencode-cli-windows
-          path: packages/opencode/dist/opencode-windows*
-    outputs:
-      version: ${{ needs.version.outputs.version }}
-
-  sign-cli-windows:
-    needs:
-      - build-cli
-      - version
-    runs-on: blacksmith-4vcpu-windows-2025
+  build-cli-darwin:
+    needs: version
+    runs-on: macos-latest
     if: github.repository == 'anomalyco/opencode'
-    env:
-      AZURE_CLIENT_ID: ${{ secrets.AZURE_CLIENT_ID }}
-      AZURE_TENANT_ID: ${{ secrets.AZURE_TENANT_ID }}
-      AZURE_SUBSCRIPTION_ID: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-      AZURE_TRUSTED_SIGNING_ACCOUNT_NAME: ${{ secrets.AZURE_TRUSTED_SIGNING_ACCOUNT_NAME }}
-      AZURE_TRUSTED_SIGNING_CERTIFICATE_PROFILE: ${{ secrets.AZURE_TRUSTED_SIGNING_CERTIFICATE_PROFILE }}
-      AZURE_TRUSTED_SIGNING_ENDPOINT: ${{ secrets.AZURE_TRUSTED_SIGNING_ENDPOINT }}
     steps:
       - uses: actions/checkout@v3
-
-      - uses: actions/download-artifact@v4
         with:
-          name: opencode-cli-windows
-          path: packages/opencode/dist
+          fetch-tags: true
+
+      - uses: ./.github/actions/setup-bun
 
       - name: Setup git committer
         id: committer
@@ -137,90 +120,50 @@ jobs:
           opencode-app-id: ${{ vars.OPENCODE_APP_ID }}
           opencode-app-secret: ${{ secrets.OPENCODE_APP_SECRET }}
 
-      - name: Azure login
-        uses: azure/login@v2
+      - uses: apple-actions/import-codesign-certs@v2
         with:
-          client-id: ${{ env.AZURE_CLIENT_ID }}
-          tenant-id: ${{ env.AZURE_TENANT_ID }}
-          subscription-id: ${{ env.AZURE_SUBSCRIPTION_ID }}
+          keychain: build
+          p12-file-base64: ${{ secrets.APPLE_CERTIFICATE }}
+          p12-password: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
 
-      - uses: azure/artifact-signing-action@v1
-        with:
-          endpoint: ${{ env.AZURE_TRUSTED_SIGNING_ENDPOINT }}
-          signing-account-name: ${{ env.AZURE_TRUSTED_SIGNING_ACCOUNT_NAME }}
-          certificate-profile-name: ${{ env.AZURE_TRUSTED_SIGNING_CERTIFICATE_PROFILE }}
-          files: |
-            ${{ github.workspace }}\packages\opencode\dist\opencode-windows-arm64\bin\opencode.exe
-            ${{ github.workspace }}\packages\opencode\dist\opencode-windows-x64\bin\opencode.exe
-            ${{ github.workspace }}\packages\opencode\dist\opencode-windows-x64-baseline\bin\opencode.exe
-          exclude-environment-credential: true
-          exclude-workload-identity-credential: true
-          exclude-managed-identity-credential: true
-          exclude-shared-token-cache-credential: true
-          exclude-visual-studio-credential: true
-          exclude-visual-studio-code-credential: true
-          exclude-azure-cli-credential: false
-          exclude-azure-powershell-credential: true
-          exclude-azure-developer-cli-credential: true
-          exclude-interactive-browser-credential: true
-
-      - name: Verify Windows CLI signatures
-        shell: pwsh
+      - name: Resolve signing identity
         run: |
-          $files = @(
-            "${{ github.workspace }}\packages\opencode\dist\opencode-windows-arm64\bin\opencode.exe",
-            "${{ github.workspace }}\packages\opencode\dist\opencode-windows-x64\bin\opencode.exe",
-            "${{ github.workspace }}\packages\opencode\dist\opencode-windows-x64-baseline\bin\opencode.exe"
-          )
+          CERT_INFO=$(security find-identity -v -p codesigning build.keychain | grep "Developer ID Application")
+          CERT_ID=$(echo "$CERT_INFO" | awk -F'"' '{print $2}')
+          if [ -z "$CERT_ID" ]; then
+            echo "Developer ID Application identity not found"
+            exit 1
+          fi
+          echo "CERT_ID=$CERT_ID" >> $GITHUB_ENV
 
-          foreach ($file in $files) {
-            $sig = Get-AuthenticodeSignature $file
-            if ($sig.Status -ne "Valid") {
-              throw "Invalid signature for ${file}: $($sig.Status)"
-            }
-          }
-
-      - name: Repack Windows CLI archives
-        working-directory: packages/opencode/dist
-        shell: pwsh
+      - name: Build
+        id: build
         run: |
-          Compress-Archive -Path "opencode-windows-arm64\bin\*" -DestinationPath "opencode-windows-arm64.zip" -Force
-          Compress-Archive -Path "opencode-windows-x64\bin\*" -DestinationPath "opencode-windows-x64.zip" -Force
-          Compress-Archive -Path "opencode-windows-x64-baseline\bin\*" -DestinationPath "opencode-windows-x64-baseline.zip" -Force
-
-      - name: Upload signed Windows CLI release assets
-        if: needs.version.outputs.release != ''
-        shell: pwsh
+          ./packages/opencode/script/build.ts
         env:
+          OPENCODE_VERSION: ${{ needs.version.outputs.version }}
+          OPENCODE_RELEASE: ${{ needs.version.outputs.release }}
+          GH_REPO: ${{ needs.version.outputs.repo }}
           GH_TOKEN: ${{ steps.committer.outputs.token }}
+          APPLE_SIGNING_IDENTITY: ${{ env.CERT_ID }}
+          OPENCODE_BUILD_OS: darwin
+          OPENCODE_SKIP_RELEASE_UPLOAD: "1"
+
+      - name: Verify darwin signatures
         run: |
-          gh release upload "v${{ needs.version.outputs.version }}" `
-            "${{ github.workspace }}\packages\opencode\dist\opencode-windows-arm64.zip" `
-            "${{ github.workspace }}\packages\opencode\dist\opencode-windows-x64.zip" `
-            "${{ github.workspace }}\packages\opencode\dist\opencode-windows-x64-baseline.zip" `
-            --clobber `
-            --repo "${{ needs.version.outputs.repo }}"
+          for file in packages/opencode/dist/opencode-darwin-*/bin/opencode; do
+            codesign -vvv --verify "$file"
+          done
 
       - uses: actions/upload-artifact@v4
         with:
-          name: opencode-cli-signed-windows
-          path: |
-            packages/opencode/dist/opencode-windows-arm64
-            packages/opencode/dist/opencode-windows-x64
-            packages/opencode/dist/opencode-windows-x64-baseline
+          name: opencode-cli-darwin
+          path: packages/opencode/dist
 
   build-tauri:
     needs:
-      - build-cli
       - version
     continue-on-error: false
-    env:
-      AZURE_CLIENT_ID: ${{ secrets.AZURE_CLIENT_ID }}
-      AZURE_TENANT_ID: ${{ secrets.AZURE_TENANT_ID }}
-      AZURE_SUBSCRIPTION_ID: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-      AZURE_TRUSTED_SIGNING_ACCOUNT_NAME: ${{ secrets.AZURE_TRUSTED_SIGNING_ACCOUNT_NAME }}
-      AZURE_TRUSTED_SIGNING_CERTIFICATE_PROFILE: ${{ secrets.AZURE_TRUSTED_SIGNING_CERTIFICATE_PROFILE }}
-      AZURE_TRUSTED_SIGNING_ENDPOINT: ${{ secrets.AZURE_TRUSTED_SIGNING_ENDPOINT }}
     strategy:
       fail-fast: false
       matrix:
@@ -266,14 +209,6 @@ jobs:
 
       - uses: ./.github/actions/setup-bun
 
-      - name: Azure login
-        if: runner.os == 'Windows'
-        uses: azure/login@v2
-        with:
-          client-id: ${{ env.AZURE_CLIENT_ID }}
-          tenant-id: ${{ env.AZURE_TENANT_ID }}
-          subscription-id: ${{ env.AZURE_SUBSCRIPTION_ID }}
-
       - uses: actions/setup-node@v4
         with:
           node-version: "24"
@@ -312,7 +247,6 @@ jobs:
         env:
           OPENCODE_VERSION: ${{ needs.version.outputs.version }}
           GITHUB_TOKEN: ${{ steps.committer.outputs.token }}
-          OPENCODE_CLI_ARTIFACT: ${{ (runner.os == 'Windows' && 'opencode-cli-windows') || 'opencode-cli' }}
           RUST_TARGET: ${{ matrix.settings.target }}
           GH_TOKEN: ${{ github.token }}
           GITHUB_RUN_ID: ${{ github.run_id }}
@@ -369,35 +303,10 @@ jobs:
           APPLE_API_KEY: ${{ secrets.APPLE_API_KEY }}
           APPLE_API_KEY_PATH: ${{ runner.temp }}/apple-api-key.p8
 
-      - name: Verify signed Windows desktop artifacts
-        if: runner.os == 'Windows'
-        shell: pwsh
-        run: |
-          $files = @(
-            "${{ github.workspace }}\packages\desktop\src-tauri\sidecars\opencode-cli-${{ matrix.settings.target }}.exe"
-          )
-          $files += Get-ChildItem "${{ github.workspace }}\packages\desktop\src-tauri\target\${{ matrix.settings.target }}\release\bundle\nsis\*.exe" | Select-Object -ExpandProperty FullName
-
-          foreach ($file in $files) {
-            $sig = Get-AuthenticodeSignature $file
-            if ($sig.Status -ne "Valid") {
-              throw "Invalid signature for ${file}: $($sig.Status)"
-            }
-          }
-
   build-electron:
     needs:
-      - build-cli
       - version
-    if: github.repository == 'anomalyco/opencode'
     continue-on-error: false
-    env:
-      AZURE_CLIENT_ID: ${{ secrets.AZURE_CLIENT_ID }}
-      AZURE_TENANT_ID: ${{ secrets.AZURE_TENANT_ID }}
-      AZURE_SUBSCRIPTION_ID: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-      AZURE_TRUSTED_SIGNING_ACCOUNT_NAME: ${{ secrets.AZURE_TRUSTED_SIGNING_ACCOUNT_NAME }}
-      AZURE_TRUSTED_SIGNING_CERTIFICATE_PROFILE: ${{ secrets.AZURE_TRUSTED_SIGNING_CERTIFICATE_PROFILE }}
-      AZURE_TRUSTED_SIGNING_ENDPOINT: ${{ secrets.AZURE_TRUSTED_SIGNING_ENDPOINT }}
     strategy:
       fail-fast: false
       matrix:
@@ -422,6 +331,7 @@ jobs:
             target: aarch64-unknown-linux-gnu
             platform_flag: --linux
     runs-on: ${{ matrix.settings.host }}
+    # if: github.ref_name == 'beta'
     steps:
       - uses: actions/checkout@v3
 
@@ -438,14 +348,6 @@ jobs:
 
       - uses: ./.github/actions/setup-bun
 
-      - name: Azure login
-        if: runner.os == 'Windows'
-        uses: azure/login@v2
-        with:
-          client-id: ${{ env.AZURE_CLIENT_ID }}
-          tenant-id: ${{ env.AZURE_TENANT_ID }}
-          subscription-id: ${{ env.AZURE_SUBSCRIPTION_ID }}
-
       - uses: actions/setup-node@v4
         with:
           node-version: "24"
@@ -480,7 +382,6 @@ jobs:
         env:
           OPENCODE_VERSION: ${{ needs.version.outputs.version }}
           OPENCODE_CHANNEL: ${{ (github.ref_name == 'beta' && 'beta') || 'prod' }}
-          OPENCODE_CLI_ARTIFACT: ${{ (runner.os == 'Windows' && 'opencode-cli-windows') || 'opencode-cli' }}
           RUST_TARGET: ${{ matrix.settings.target }}
           GH_TOKEN: ${{ github.token }}
           GITHUB_RUN_ID: ${{ github.run_id }}
@@ -513,22 +414,6 @@ jobs:
         env:
           OPENCODE_CHANNEL: ${{ (github.ref_name == 'beta' && 'beta') || 'prod' }}
 
-      - name: Verify signed Windows Electron artifacts
-        if: runner.os == 'Windows'
-        shell: pwsh
-        run: |
-          $files = @()
-          $files += Get-ChildItem "${{ github.workspace }}\packages\desktop-electron\dist\*.exe" | Select-Object -ExpandProperty FullName
-          $files += Get-ChildItem "${{ github.workspace }}\packages\desktop-electron\dist\*unpacked\*.exe" | Select-Object -ExpandProperty FullName
-          $files += Get-ChildItem "${{ github.workspace }}\packages\desktop-electron\dist\*unpacked\resources\opencode-cli.exe" -ErrorAction SilentlyContinue | Select-Object -ExpandProperty FullName
-
-          foreach ($file in $files | Select-Object -Unique) {
-            $sig = Get-AuthenticodeSignature $file
-            if ($sig.Status -ne "Valid") {
-              throw "Invalid signature for ${file}: $($sig.Status)"
-            }
-          }
-
       - uses: actions/upload-artifact@v4
         with:
           name: opencode-electron-${{ matrix.settings.target }}
@@ -543,11 +428,10 @@ jobs:
   publish:
     needs:
       - version
-      - build-cli
-      - sign-cli-windows
+      - build-cli-darwin
+      - build-cli-linux-win
       - build-tauri
       - build-electron
-    if: always() && !failure() && !cancelled()
     runs-on: blacksmith-4vcpu-ubuntu-2404
     steps:
       - uses: actions/checkout@v3
@@ -581,18 +465,9 @@ jobs:
 
       - uses: actions/download-artifact@v4
         with:
-          name: opencode-cli
-          path: packages/opencode/dist
-
-      - uses: actions/download-artifact@v4
-        with:
-          name: opencode-cli-windows
-          path: packages/opencode/dist
-
-      - uses: actions/download-artifact@v4
-        with:
-          name: opencode-cli-signed-windows
+          pattern: opencode-cli-*
           path: packages/opencode/dist
+          merge-multiple: true
 
       - uses: actions/download-artifact@v4
         if: needs.version.outputs.release

.github/workflows/sign-cli.yml

@@ -0,0 +1,54 @@
+name: sign-cli
+
+on:
+  push:
+    branches:
+      - brendan/desktop-signpath
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  actions: read
+
+jobs:
+  sign-cli:
+    runs-on: blacksmith-4vcpu-ubuntu-2404
+    if: github.repository == 'anomalyco/opencode'
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          fetch-tags: true
+
+      - uses: ./.github/actions/setup-bun
+
+      - name: Build
+        run: |
+          ./packages/opencode/script/build.ts
+
+      - name: Upload unsigned Windows CLI
+        id: upload_unsigned_windows_cli
+        uses: actions/upload-artifact@v4
+        with:
+          name: unsigned-opencode-windows-cli
+          path: packages/opencode/dist/opencode-windows-x64/bin/opencode.exe
+          if-no-files-found: error
+
+      - name: Submit SignPath signing request
+        id: submit_signpath_signing_request
+        uses: signpath/github-action-submit-signing-request@v1
+        with:
+          api-token: ${{ secrets.SIGNPATH_API_KEY }}
+          organization-id: ${{ secrets.SIGNPATH_ORGANIZATION_ID }}
+          project-slug: ${{ secrets.SIGNPATH_PROJECT_SLUG }}
+          signing-policy-slug: ${{ secrets.SIGNPATH_SIGNING_POLICY_SLUG }}
+          artifact-configuration-slug: ${{ secrets.SIGNPATH_ARTIFACT_CONFIGURATION_SLUG }}
+          github-artifact-id: ${{ steps.upload_unsigned_windows_cli.outputs.artifact-id }}
+          wait-for-completion: true
+          output-artifact-directory: signed-opencode-cli
+
+      - name: Upload signed Windows CLI
+        uses: actions/upload-artifact@v4
+        with:
+          name: signed-opencode-windows-cli
+          path: signed-opencode-cli/*.exe
+          if-no-files-found: error

.github/workflows/test.yml

@@ -15,10 +15,6 @@ concurrency:
 
 permissions:
   contents: read
-  checks: write
-
-env:
-  FORCE_JAVASCRIPT_ACTIONS_TO_NODE24: true
 
 jobs:
   unit:
@@ -41,11 +37,6 @@ jobs:
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
 
-      - name: Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version: "24"
-
       - name: Setup Bun
         uses: ./.github/actions/setup-bun
 
@@ -54,39 +45,8 @@ jobs:
           git config --global user.email "bot@opencode.ai"
           git config --global user.name "opencode"
 
-      - name: Cache Turbo
-        uses: actions/cache@v4
-        with:
-          path: node_modules/.cache/turbo
-          key: turbo-${{ runner.os }}-${{ hashFiles('turbo.json', '**/package.json') }}-${{ github.sha }}
-          restore-keys: |
-            turbo-${{ runner.os }}-${{ hashFiles('turbo.json', '**/package.json') }}-
-            turbo-${{ runner.os }}-
-
       - name: Run unit tests
-        run: bun turbo test:ci
-        env:
-          OPENCODE_EXPERIMENTAL_DISABLE_FILEWATCHER: ${{ runner.os == 'Windows' && 'true' || 'false' }}
-
-      - name: Publish unit reports
-        if: always()
-        uses: mikepenz/action-junit-report@v6
-        with:
-          report_paths: packages/*/.artifacts/unit/junit.xml
-          check_name: "unit results (${{ matrix.settings.name }})"
-          detailed_summary: true
-          include_time_in_summary: true
-          fail_on_failure: false
-
-      - name: Upload unit artifacts
-        if: always()
-        uses: actions/upload-artifact@v4
-        with:
-          name: unit-${{ matrix.settings.name }}-${{ github.run_attempt }}
-          include-hidden-files: true
-          if-no-files-found: ignore
-          retention-days: 7
-          path: packages/*/.artifacts/unit/junit.xml
+        run: bun turbo test
 
   e2e:
     name: e2e (${{ matrix.settings.name }})
@@ -110,18 +70,13 @@ jobs:
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
 
-      - name: Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version: "24"
-
       - name: Setup Bun
         uses: ./.github/actions/setup-bun
 
       - name: Read Playwright version
         id: playwright-version
         run: |
-          version=$(node -e 'console.log(require("./package.json").workspaces.catalog["@playwright/test"])')
+          version=$(node -e 'console.log(require("./packages/app/package.json").devDependencies["@playwright/test"])')
           echo "version=$version" >> "$GITHUB_OUTPUT"
 
       - name: Cache Playwright browsers
@@ -145,17 +100,15 @@ jobs:
         run: bun --cwd packages/app test:e2e:local
         env:
           CI: true
-          PLAYWRIGHT_JUNIT_OUTPUT: e2e/junit-${{ matrix.settings.name }}.xml
         timeout-minutes: 30
 
       - name: Upload Playwright artifacts
-        if: always()
+        if: failure()
         uses: actions/upload-artifact@v4
         with:
           name: playwright-${{ matrix.settings.name }}-${{ github.run_attempt }}
           if-no-files-found: ignore
           retention-days: 7
           path: |
-            packages/app/e2e/junit-*.xml
             packages/app/e2e/test-results
             packages/app/e2e/playwright-report

.gitignore

@@ -25,7 +25,6 @@ target
 
 # Local dev files
 opencode-dev
-UPCOMING_CHANGELOG.md
 logs/
 *.bun-build
 tsconfig.tsbuildinfo

.opencode/.gitignore

@@ -3,5 +3,4 @@ plans
 package.json
 bun.lock
 .gitignore
-package-lock.json
-references/
+package-lock.json

.opencode/agent/docs.md

@@ -0,0 +1,34 @@
+---
+description: ALWAYS use this when writing docs
+color: "#38A3EE"
+---
+
+You are an expert technical documentation writer
+
+You are not verbose
+
+Use a relaxed and friendly tone
+
+The title of the page should be a word or a 2-3 word phrase
+
+The description should be one short line, should not start with "The", should
+avoid repeating the title of the page, should be 5-10 words long
+
+Chunks of text should not be more than 2 sentences long
+
+Each section is separated by a divider of 3 dashes
+
+The section titles are short with only the first letter of the word capitalized
+
+The section titles are in the imperative mood
+
+The section titles should not repeat the term used in the page title, for
+example, if the page title is "Models", avoid using a section title like "Add
+new models". This might be unavoidable in some cases, but try to avoid it.
+
+Check out the /packages/web/src/content/docs/docs/index.mdx as an example.
+
+For JS or TS code snippets remove trailing semicolons and any trailing commas
+that might not be needed.
+
+If you are making a commit prefix the commit message with `docs:`

.opencode/command/changelog.md

@@ -1,46 +1,21 @@
 ---
-model: opencode/gpt-5.4
+model: opencode/kimi-k2.5
 ---
 
-Create `UPCOMING_CHANGELOG.md` from the structured changelog input below.
-If `UPCOMING_CHANGELOG.md` already exists, ignore its current contents completely.
-Do not preserve, merge, or reuse text from the existing file.
+create UPCOMING_CHANGELOG.md
 
-The input already contains the exact commit range since the last non-draft release.
-The commits are already filtered to the release-relevant packages and grouped into
-the release sections. Do not fetch GitHub releases, PRs, or build your own commit list.
-The input may also include a `## Community Contributors Input` section.
+it should have sections
 
-Before writing any entry you keep, inspect the real diff with
-`git show --stat --format='' <hash>` or `git show --format='' <hash>` so you can
-understand the actual code changes and not just the commit message (they may be misleading).
-Do not use `git log` or author metadata when deciding attribution.
+```
+# TUI
 
-Rules:
+# Desktop
 
-- Write the final file with sections in this order:
-  `## Core`, `## TUI`, `## Desktop`, `## SDK`, `## Extensions`
-- Only include sections that have at least one notable entry
-- Keep one bullet per commit you keep
-- Skip commits that are entirely internal, CI, tests, refactors, or otherwise not user-facing
-- Start each bullet with a capital letter
-- Prefer what changed for users over what code changed internally
-- Do not copy raw commit prefixes like `fix:` or `feat:` or trailing PR numbers like `(#123)`
-- Community attribution is deterministic: only preserve an existing `(@username)` suffix from the changelog input
-- If an input bullet has no `(@username)` suffix, do not add one
-- Never add a new `(@username)` suffix from `git show`, commit authors, names, or email addresses
-- If no notable entries remain and there is no contributor block, write exactly `No notable changes.`
-- If no notable entries remain but there is a contributor block, omit all release sections and return only the contributor block
-- If the input contains `## Community Contributors Input`, append the block below that heading to the end of the final file verbatim
-- Do not add, remove, rewrite, or reorder contributor names or commit titles in that block
-- Do not derive the thank-you section from the main summary bullets
-- Do not include the heading `## Community Contributors Input` in the final file
-- Focus on writing the least words to get your point across - users will skim read the changelog, so we should be precise
+# Core
 
-**Importantly, the changelog is for users (who are at least slightly technical), they may use the TUI, Desktop, SDK, Plugins and so forth. Be thorough in understanding flow on effects may not be immediately apparent. e.g. a package upgrade looks internal but may patch a bug. Or a refactor may also stabilise some race condition that fixes bugs for users. The PR title/body + commit message will give you the authors context, usually containing the outcome not just technical detail**
+# Misc
+```
 
-<changelog_input>
+go through each PR merged since the last tag
 
-!`bun script/raw-changelog.ts $ARGUMENTS`
-
-</changelog_input>
+for each PR spawn a subagent to summarize what the PR was about. focus on user facing changes. if it was entirely internal or code related you can ignore it. also skip docs updates. each subagent should append its summary to UPCOMING_CHANGELOG.md into the appropriate section.

.opencode/plugins/smoke-theme.json

@@ -1,223 +0,0 @@
-{
-  "$schema": "https://opencode.ai/theme.json",
-  "defs": {
-    "nord0": "#2E3440",
-    "nord1": "#3B4252",
-    "nord2": "#434C5E",
-    "nord3": "#4C566A",
-    "nord4": "#D8DEE9",
-    "nord5": "#E5E9F0",
-    "nord6": "#ECEFF4",
-    "nord7": "#8FBCBB",
-    "nord8": "#88C0D0",
-    "nord9": "#81A1C1",
-    "nord10": "#5E81AC",
-    "nord11": "#BF616A",
-    "nord12": "#D08770",
-    "nord13": "#EBCB8B",
-    "nord14": "#A3BE8C",
-    "nord15": "#B48EAD"
-  },
-  "theme": {
-    "primary": {
-      "dark": "nord10",
-      "light": "nord9"
-    },
-    "secondary": {
-      "dark": "nord9",
-      "light": "nord9"
-    },
-    "accent": {
-      "dark": "nord7",
-      "light": "nord7"
-    },
-    "error": {
-      "dark": "nord11",
-      "light": "nord11"
-    },
-    "warning": {
-      "dark": "nord12",
-      "light": "nord12"
-    },
-    "success": {
-      "dark": "nord14",
-      "light": "nord14"
-    },
-    "info": {
-      "dark": "nord8",
-      "light": "nord10"
-    },
-    "text": {
-      "dark": "nord6",
-      "light": "nord0"
-    },
-    "textMuted": {
-      "dark": "#8B95A7",
-      "light": "nord1"
-    },
-    "background": {
-      "dark": "nord0",
-      "light": "nord6"
-    },
-    "backgroundPanel": {
-      "dark": "nord1",
-      "light": "nord5"
-    },
-    "backgroundElement": {
-      "dark": "nord2",
-      "light": "nord4"
-    },
-    "border": {
-      "dark": "nord2",
-      "light": "nord3"
-    },
-    "borderActive": {
-      "dark": "nord3",
-      "light": "nord2"
-    },
-    "borderSubtle": {
-      "dark": "nord2",
-      "light": "nord3"
-    },
-    "diffAdded": {
-      "dark": "nord14",
-      "light": "nord14"
-    },
-    "diffRemoved": {
-      "dark": "nord11",
-      "light": "nord11"
-    },
-    "diffContext": {
-      "dark": "#8B95A7",
-      "light": "nord3"
-    },
-    "diffHunkHeader": {
-      "dark": "#8B95A7",
-      "light": "nord3"
-    },
-    "diffHighlightAdded": {
-      "dark": "nord14",
-      "light": "nord14"
-    },
-    "diffHighlightRemoved": {
-      "dark": "nord11",
-      "light": "nord11"
-    },
-    "diffAddedBg": {
-      "dark": "#36413C",
-      "light": "#E6EBE7"
-    },
-    "diffRemovedBg": {
-      "dark": "#43393D",
-      "light": "#ECE6E8"
-    },
-    "diffContextBg": {
-      "dark": "nord1",
-      "light": "nord5"
-    },
-    "diffLineNumber": {
-      "dark": "nord2",
-      "light": "nord4"
-    },
-    "diffAddedLineNumberBg": {
-      "dark": "#303A35",
-      "light": "#DDE4DF"
-    },
-    "diffRemovedLineNumberBg": {
-      "dark": "#3C3336",
-      "light": "#E4DDE0"
-    },
-    "markdownText": {
-      "dark": "nord4",
-      "light": "nord0"
-    },
-    "markdownHeading": {
-      "dark": "nord8",
-      "light": "nord10"
-    },
-    "markdownLink": {
-      "dark": "nord9",
-      "light": "nord9"
-    },
-    "markdownLinkText": {
-      "dark": "nord7",
-      "light": "nord7"
-    },
-    "markdownCode": {
-      "dark": "nord14",
-      "light": "nord14"
-    },
-    "markdownBlockQuote": {
-      "dark": "#8B95A7",
-      "light": "nord3"
-    },
-    "markdownEmph": {
-      "dark": "nord12",
-      "light": "nord12"
-    },
-    "markdownStrong": {
-      "dark": "nord13",
-      "light": "nord13"
-    },
-    "markdownHorizontalRule": {
-      "dark": "#8B95A7",
-      "light": "nord3"
-    },
-    "markdownListItem": {
-      "dark": "nord8",
-      "light": "nord10"
-    },
-    "markdownListEnumeration": {
-      "dark": "nord7",
-      "light": "nord7"
-    },
-    "markdownImage": {
-      "dark": "nord9",
-      "light": "nord9"
-    },
-    "markdownImageText": {
-      "dark": "nord7",
-      "light": "nord7"
-    },
-    "markdownCodeBlock": {
-      "dark": "nord4",
-      "light": "nord0"
-    },
-    "syntaxComment": {
-      "dark": "#8B95A7",
-      "light": "nord3"
-    },
-    "syntaxKeyword": {
-      "dark": "nord9",
-      "light": "nord9"
-    },
-    "syntaxFunction": {
-      "dark": "nord8",
-      "light": "nord8"
-    },
-    "syntaxVariable": {
-      "dark": "nord7",
-      "light": "nord7"
-    },
-    "syntaxString": {
-      "dark": "nord14",
-      "light": "nord14"
-    },
-    "syntaxNumber": {
-      "dark": "nord15",
-      "light": "nord15"
-    },
-    "syntaxType": {
-      "dark": "nord7",
-      "light": "nord7"
-    },
-    "syntaxOperator": {
-      "dark": "nord9",
-      "light": "nord9"
-    },
-    "syntaxPunctuation": {
-      "dark": "nord4",
-      "light": "nord0"
-    }
-  }
-}

.opencode/plugins/tui-smoke.tsx

@@ -1,937 +0,0 @@
-/** @jsxImportSource @opentui/solid */
-import { useKeyboard, useTerminalDimensions, type JSX } from "@opentui/solid"
-import { RGBA, VignetteEffect } from "@opentui/core"
-import type {
-  TuiKeybindSet,
-  TuiPlugin,
-  TuiPluginApi,
-  TuiPluginMeta,
-  TuiPluginModule,
-  TuiSlotPlugin,
-} from "@opencode-ai/plugin/tui"
-
-const tabs = ["overview", "counter", "help"]
-const bind = {
-  modal: "ctrl+shift+m",
-  screen: "ctrl+shift+o",
-  home: "escape,ctrl+h",
-  left: "left,h",
-  right: "right,l",
-  up: "up,k",
-  down: "down,j",
-  alert: "a",
-  confirm: "c",
-  prompt: "p",
-  select: "s",
-  modal_accept: "enter,return",
-  modal_close: "escape",
-  dialog_close: "escape",
-  local: "x",
-  local_push: "enter,return",
-  local_close: "q,backspace",
-  host: "z",
-}
-
-const pick = (value: unknown, fallback: string) => {
-  if (typeof value !== "string") return fallback
-  if (!value.trim()) return fallback
-  return value
-}
-
-const num = (value: unknown, fallback: number) => {
-  if (typeof value !== "number") return fallback
-  return value
-}
-
-const rec = (value: unknown) => {
-  if (!value || typeof value !== "object" || Array.isArray(value)) return
-  return Object.fromEntries(Object.entries(value))
-}
-
-type Cfg = {
-  label: string
-  route: string
-  vignette: number
-  keybinds: Record<string, unknown> | undefined
-}
-
-type Route = {
-  modal: string
-  screen: string
-}
-
-type State = {
-  tab: number
-  count: number
-  source: string
-  note: string
-  selected: string
-  local: number
-}
-
-const cfg = (options: Record<string, unknown> | undefined) => {
-  return {
-    label: pick(options?.label, "smoke"),
-    route: pick(options?.route, "workspace-smoke"),
-    vignette: Math.max(0, num(options?.vignette, 0.35)),
-    keybinds: rec(options?.keybinds),
-  }
-}
-
-const names = (input: Cfg) => {
-  return {
-    modal: `${input.route}.modal`,
-    screen: `${input.route}.screen`,
-  }
-}
-
-type Keys = TuiKeybindSet
-const ui = {
-  panel: "#1d1d1d",
-  border: "#4a4a4a",
-  text: "#f0f0f0",
-  muted: "#a5a5a5",
-  accent: "#5f87ff",
-}
-
-type Color = RGBA | string
-
-const ink = (map: Record<string, unknown>, name: string, fallback: string): Color => {
-  const value = map[name]
-  if (typeof value === "string") return value
-  if (value instanceof RGBA) return value
-  return fallback
-}
-
-const look = (map: Record<string, unknown>) => {
-  return {
-    panel: ink(map, "backgroundPanel", ui.panel),
-    border: ink(map, "border", ui.border),
-    text: ink(map, "text", ui.text),
-    muted: ink(map, "textMuted", ui.muted),
-    accent: ink(map, "primary", ui.accent),
-    selected: ink(map, "selectedListItemText", ui.text),
-  }
-}
-
-const tone = (api: TuiPluginApi) => {
-  return look(api.theme.current)
-}
-
-type Skin = {
-  panel: Color
-  border: Color
-  text: Color
-  muted: Color
-  accent: Color
-  selected: Color
-}
-
-const Btn = (props: { txt: string; run: () => void; skin: Skin; on?: boolean }) => {
-  return (
-    <box
-      onMouseUp={() => {
-        props.run()
-      }}
-      backgroundColor={props.on ? props.skin.accent : props.skin.border}
-      paddingLeft={1}
-      paddingRight={1}
-    >
-      <text fg={props.on ? props.skin.selected : props.skin.text}>{props.txt}</text>
-    </box>
-  )
-}
-
-const parse = (params: Record<string, unknown> | undefined) => {
-  const tab = typeof params?.tab === "number" ? params.tab : 0
-  const count = typeof params?.count === "number" ? params.count : 0
-  const source = typeof params?.source === "string" ? params.source : "unknown"
-  const note = typeof params?.note === "string" ? params.note : ""
-  const selected = typeof params?.selected === "string" ? params.selected : ""
-  const local = typeof params?.local === "number" ? params.local : 0
-  return {
-    tab: Math.max(0, Math.min(tab, tabs.length - 1)),
-    count,
-    source,
-    note,
-    selected,
-    local: Math.max(0, local),
-  }
-}
-
-const current = (api: TuiPluginApi, route: Route) => {
-  const value = api.route.current
-  const ok = Object.values(route).includes(value.name)
-  if (!ok) return parse(undefined)
-  if (!("params" in value)) return parse(undefined)
-  return parse(value.params)
-}
-
-const opts = [
-  {
-    title: "Overview",
-    value: 0,
-    description: "Switch to overview tab",
-  },
-  {
-    title: "Counter",
-    value: 1,
-    description: "Switch to counter tab",
-  },
-  {
-    title: "Help",
-    value: 2,
-    description: "Switch to help tab",
-  },
-]
-
-const host = (api: TuiPluginApi, input: Cfg, skin: Skin) => {
-  api.ui.dialog.setSize("medium")
-  api.ui.dialog.replace(() => (
-    <box paddingBottom={1} paddingLeft={2} paddingRight={2} gap={1} flexDirection="column">
-      <text fg={skin.text}>
-        <b>{input.label} host overlay</b>
-      </text>
-      <text fg={skin.muted}>Using api.ui.dialog stack with built-in backdrop</text>
-      <text fg={skin.muted}>esc closes · depth {api.ui.dialog.depth}</text>
-      <box flexDirection="row" gap={1}>
-        <Btn txt="close" run={() => api.ui.dialog.clear()} skin={skin} on />
-      </box>
-    </box>
-  ))
-}
-
-const warn = (api: TuiPluginApi, route: Route, value: State) => {
-  const DialogAlert = api.ui.DialogAlert
-  api.ui.dialog.setSize("medium")
-  api.ui.dialog.replace(() => (
-    <DialogAlert
-      title="Smoke alert"
-      message="Testing built-in alert dialog"
-      onConfirm={() => api.route.navigate(route.screen, { ...value, source: "alert" })}
-    />
-  ))
-}
-
-const check = (api: TuiPluginApi, route: Route, value: State) => {
-  const DialogConfirm = api.ui.DialogConfirm
-  api.ui.dialog.setSize("medium")
-  api.ui.dialog.replace(() => (
-    <DialogConfirm
-      title="Smoke confirm"
-      message="Apply +1 to counter?"
-      onConfirm={() => api.route.navigate(route.screen, { ...value, count: value.count + 1, source: "confirm" })}
-      onCancel={() => api.route.navigate(route.screen, { ...value, source: "confirm-cancel" })}
-    />
-  ))
-}
-
-const entry = (api: TuiPluginApi, route: Route, value: State) => {
-  const DialogPrompt = api.ui.DialogPrompt
-  api.ui.dialog.setSize("medium")
-  api.ui.dialog.replace(() => (
-    <DialogPrompt
-      title="Smoke prompt"
-      value={value.note}
-      onConfirm={(note) => {
-        api.ui.dialog.clear()
-        api.route.navigate(route.screen, { ...value, note, source: "prompt" })
-      }}
-      onCancel={() => {
-        api.ui.dialog.clear()
-        api.route.navigate(route.screen, value)
-      }}
-    />
-  ))
-}
-
-const picker = (api: TuiPluginApi, route: Route, value: State) => {
-  const DialogSelect = api.ui.DialogSelect
-  api.ui.dialog.setSize("medium")
-  api.ui.dialog.replace(() => (
-    <DialogSelect
-      title="Smoke select"
-      options={opts}
-      current={value.tab}
-      onSelect={(item) => {
-        api.ui.dialog.clear()
-        api.route.navigate(route.screen, {
-          ...value,
-          tab: typeof item.value === "number" ? item.value : value.tab,
-          selected: item.title,
-          source: "select",
-        })
-      }}
-    />
-  ))
-}
-
-const Screen = (props: {
-  api: TuiPluginApi
-  input: Cfg
-  route: Route
-  keys: Keys
-  meta: TuiPluginMeta
-  params?: Record<string, unknown>
-}) => {
-  const dim = useTerminalDimensions()
-  const value = parse(props.params)
-  const skin = tone(props.api)
-  const set = (local: number, base?: State) => {
-    const next = base ?? current(props.api, props.route)
-    props.api.route.navigate(props.route.screen, { ...next, local: Math.max(0, local), source: "local" })
-  }
-  const push = (base?: State) => {
-    const next = base ?? current(props.api, props.route)
-    set(next.local + 1, next)
-  }
-  const open = () => {
-    const next = current(props.api, props.route)
-    if (next.local > 0) return
-    set(1, next)
-  }
-  const pop = (base?: State) => {
-    const next = base ?? current(props.api, props.route)
-    const local = Math.max(0, next.local - 1)
-    set(local, next)
-  }
-  const show = () => {
-    setTimeout(() => {
-      open()
-    }, 0)
-  }
-  useKeyboard((evt) => {
-    if (props.api.route.current.name !== props.route.screen) return
-    const next = current(props.api, props.route)
-    if (props.api.ui.dialog.open) {
-      if (props.keys.match("dialog_close", evt)) {
-        evt.preventDefault()
-        evt.stopPropagation()
-        props.api.ui.dialog.clear()
-        return
-      }
-      return
-    }
-
-    if (next.local > 0) {
-      if (evt.name === "escape" || props.keys.match("local_close", evt)) {
-        evt.preventDefault()
-        evt.stopPropagation()
-        pop(next)
-        return
-      }
-
-      if (props.keys.match("local_push", evt)) {
-        evt.preventDefault()
-        evt.stopPropagation()
-        push(next)
-        return
-      }
-      return
-    }
-
-    if (props.keys.match("home", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate("home")
-      return
-    }
-
-    if (props.keys.match("left", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate(props.route.screen, { ...next, tab: (next.tab - 1 + tabs.length) % tabs.length })
-      return
-    }
-
-    if (props.keys.match("right", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate(props.route.screen, { ...next, tab: (next.tab + 1) % tabs.length })
-      return
-    }
-
-    if (props.keys.match("up", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate(props.route.screen, { ...next, count: next.count + 1 })
-      return
-    }
-
-    if (props.keys.match("down", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate(props.route.screen, { ...next, count: next.count - 1 })
-      return
-    }
-
-    if (props.keys.match("modal", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate(props.route.modal, next)
-      return
-    }
-
-    if (props.keys.match("local", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      open()
-      return
-    }
-
-    if (props.keys.match("host", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      host(props.api, props.input, skin)
-      return
-    }
-
-    if (props.keys.match("alert", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      warn(props.api, props.route, next)
-      return
-    }
-
-    if (props.keys.match("confirm", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      check(props.api, props.route, next)
-      return
-    }
-
-    if (props.keys.match("prompt", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      entry(props.api, props.route, next)
-      return
-    }
-
-    if (props.keys.match("select", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      picker(props.api, props.route, next)
-    }
-  })
-
-  return (
-    <box width={dim().width} height={dim().height} backgroundColor={skin.panel} position="relative">
-      <box
-        flexDirection="column"
-        width="100%"
-        height="100%"
-        paddingTop={1}
-        paddingBottom={1}
-        paddingLeft={2}
-        paddingRight={2}
-      >
-        <box flexDirection="row" justifyContent="space-between" paddingBottom={1}>
-          <text fg={skin.text}>
-            <b>{props.input.label} screen</b>
-            <span style={{ fg: skin.muted }}> plugin route</span>
-          </text>
-          <text fg={skin.muted}>{props.keys.print("home")} home</text>
-        </box>
-
-        <box flexDirection="row" gap={1} paddingBottom={1}>
-          {tabs.map((item, i) => {
-            const on = value.tab === i
-            return (
-              <Btn
-                txt={item}
-                run={() => props.api.route.navigate(props.route.screen, { ...value, tab: i })}
-                skin={skin}
-                on={on}
-              />
-            )
-          })}
-        </box>
-
-        <box
-          border
-          borderColor={skin.border}
-          paddingTop={1}
-          paddingBottom={1}
-          paddingLeft={2}
-          paddingRight={2}
-          flexGrow={1}
-        >
-          {value.tab === 0 ? (
-            <box flexDirection="column" gap={1}>
-              <text fg={skin.text}>Route: {props.route.screen}</text>
-              <text fg={skin.muted}>plugin state: {props.meta.state}</text>
-              <text fg={skin.muted}>
-                first: {props.meta.state === "first" ? "yes" : "no"} · updated:{" "}
-                {props.meta.state === "updated" ? "yes" : "no"} · loads: {props.meta.load_count}
-              </text>
-              <text fg={skin.muted}>plugin source: {props.meta.source}</text>
-              <text fg={skin.muted}>source: {value.source}</text>
-              <text fg={skin.muted}>note: {value.note || "(none)"}</text>
-              <text fg={skin.muted}>selected: {value.selected || "(none)"}</text>
-              <text fg={skin.muted}>local stack depth: {value.local}</text>
-              <text fg={skin.muted}>host stack open: {props.api.ui.dialog.open ? "yes" : "no"}</text>
-            </box>
-          ) : null}
-
-          {value.tab === 1 ? (
-            <box flexDirection="column" gap={1}>
-              <text fg={skin.text}>Counter: {value.count}</text>
-              <text fg={skin.muted}>
-                {props.keys.print("up")} / {props.keys.print("down")} change value
-              </text>
-            </box>
-          ) : null}
-
-          {value.tab === 2 ? (
-            <box flexDirection="column" gap={1}>
-              <text fg={skin.muted}>
-                {props.keys.print("modal")} modal | {props.keys.print("alert")} alert | {props.keys.print("confirm")}{" "}
-                confirm | {props.keys.print("prompt")} prompt | {props.keys.print("select")} select
-              </text>
-              <text fg={skin.muted}>
-                {props.keys.print("local")} local stack | {props.keys.print("host")} host stack
-              </text>
-              <text fg={skin.muted}>
-                local open: {props.keys.print("local_push")} push nested · esc or {props.keys.print("local_close")}{" "}
-                close
-              </text>
-              <text fg={skin.muted}>{props.keys.print("home")} returns home</text>
-            </box>
-          ) : null}
-        </box>
-
-        <box flexDirection="row" gap={1} paddingTop={1}>
-          <Btn txt="go home" run={() => props.api.route.navigate("home")} skin={skin} />
-          <Btn txt="modal" run={() => props.api.route.navigate(props.route.modal, value)} skin={skin} on />
-          <Btn txt="local overlay" run={show} skin={skin} />
-          <Btn txt="host overlay" run={() => host(props.api, props.input, skin)} skin={skin} />
-          <Btn txt="alert" run={() => warn(props.api, props.route, value)} skin={skin} />
-          <Btn txt="confirm" run={() => check(props.api, props.route, value)} skin={skin} />
-          <Btn txt="prompt" run={() => entry(props.api, props.route, value)} skin={skin} />
-          <Btn txt="select" run={() => picker(props.api, props.route, value)} skin={skin} />
-        </box>
-      </box>
-
-      <box
-        visible={value.local > 0}
-        width={dim().width}
-        height={dim().height}
-        alignItems="center"
-        position="absolute"
-        zIndex={3000}
-        paddingTop={dim().height / 4}
-        left={0}
-        top={0}
-        backgroundColor={RGBA.fromInts(0, 0, 0, 160)}
-        onMouseUp={() => {
-          pop()
-        }}
-      >
-        <box
-          onMouseUp={(evt) => {
-            evt.stopPropagation()
-          }}
-          width={60}
-          maxWidth={dim().width - 2}
-          backgroundColor={skin.panel}
-          border
-          borderColor={skin.border}
-          paddingTop={1}
-          paddingBottom={1}
-          paddingLeft={2}
-          paddingRight={2}
-          gap={1}
-          flexDirection="column"
-        >
-          <text fg={skin.text}>
-            <b>{props.input.label} local overlay</b>
-          </text>
-          <text fg={skin.muted}>Plugin-owned stack depth: {value.local}</text>
-          <text fg={skin.muted}>
-            {props.keys.print("local_push")} push nested · {props.keys.print("local_close")} pop/close
-          </text>
-          <box flexDirection="row" gap={1}>
-            <Btn txt="push" run={push} skin={skin} on />
-            <Btn txt="pop" run={pop} skin={skin} />
-          </box>
-        </box>
-      </box>
-    </box>
-  )
-}
-
-const Modal = (props: {
-  api: TuiPluginApi
-  input: Cfg
-  route: Route
-  keys: Keys
-  params?: Record<string, unknown>
-}) => {
-  const Dialog = props.api.ui.Dialog
-  const value = parse(props.params)
-  const skin = tone(props.api)
-
-  useKeyboard((evt) => {
-    if (props.api.route.current.name !== props.route.modal) return
-
-    if (props.keys.match("modal_accept", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate(props.route.screen, { ...value, source: "modal" })
-      return
-    }
-
-    if (props.keys.match("modal_close", evt)) {
-      evt.preventDefault()
-      evt.stopPropagation()
-      props.api.route.navigate("home")
-    }
-  })
-
-  return (
-    <box width="100%" height="100%" backgroundColor={skin.panel}>
-      <Dialog onClose={() => props.api.route.navigate("home")}>
-        <box paddingBottom={1} paddingLeft={2} paddingRight={2} gap={1} flexDirection="column">
-          <text fg={skin.text}>
-            <b>{props.input.label} modal</b>
-          </text>
-          <text fg={skin.muted}>{props.keys.print("modal")} modal command</text>
-          <text fg={skin.muted}>{props.keys.print("screen")} screen command</text>
-          <text fg={skin.muted}>
-            {props.keys.print("modal_accept")} opens screen · {props.keys.print("modal_close")} closes
-          </text>
-          <box flexDirection="row" gap={1}>
-            <Btn
-              txt="open screen"
-              run={() => props.api.route.navigate(props.route.screen, { ...value, source: "modal" })}
-              skin={skin}
-              on
-            />
-            <Btn txt="cancel" run={() => props.api.route.navigate("home")} skin={skin} />
-          </box>
-        </box>
-      </Dialog>
-    </box>
-  )
-}
-
-const home = (api: TuiPluginApi, input: Cfg) => ({
-  slots: {
-    home_logo(ctx) {
-      const map = ctx.theme.current
-      const skin = look(map)
-      const art = [
-        "                                  $$\\",
-        "                                  $$ |",
-        " $$$$$$$\\ $$$$$$\\$$$$\\   $$$$$$\\  $$ |  $$\\  $$$$$$\\",
-        "$$  _____|$$  _$$  _$$\\ $$  __$$\\ $$ | $$  |$$  __$$\\",
-        "\\$$$$$$\\  $$ / $$ / $$ |$$ /  $$ |$$$$$$  / $$$$$$$$ |",
-        " \\____$$\\ $$ | $$ | $$ |$$ |  $$ |$$  _$$<  $$   ____|",
-        "$$$$$$$  |$$ | $$ | $$ |\\$$$$$$  |$$ | \\$$\\ \\$$$$$$$\\",
-        "\\_______/ \\__| \\__| \\__| \\______/ \\__|  \\__| \\_______|",
-      ]
-      const fill = [
-        skin.accent,
-        skin.muted,
-        ink(map, "info", ui.accent),
-        skin.text,
-        ink(map, "success", ui.accent),
-        ink(map, "warning", ui.accent),
-        ink(map, "secondary", ui.accent),
-        ink(map, "error", ui.accent),
-      ]
-
-      return (
-        <box flexDirection="column">
-          {art.map((line, i) => (
-            <text fg={fill[i]}>{line}</text>
-          ))}
-        </box>
-      )
-    },
-    home_prompt(ctx, value) {
-      const skin = look(ctx.theme.current)
-      type Prompt = (props: {
-        workspaceID?: string
-        visible?: boolean
-        disabled?: boolean
-        onSubmit?: () => void
-        hint?: JSX.Element
-        right?: JSX.Element
-        showPlaceholder?: boolean
-        placeholders?: {
-          normal?: string[]
-          shell?: string[]
-        }
-      }) => JSX.Element
-      type Slot = (
-        props: { name: string; mode?: unknown; children?: JSX.Element } & Record<string, unknown>,
-      ) => JSX.Element | null
-      const ui = api.ui as TuiPluginApi["ui"] & { Prompt: Prompt; Slot: Slot }
-      const Prompt = ui.Prompt
-      const Slot = ui.Slot
-      const normal = [
-        `[SMOKE] route check for ${input.label}`,
-        "[SMOKE] confirm home_prompt slot override",
-        "[SMOKE] verify prompt-right slot passthrough",
-      ]
-      const shell = ["printf '[SMOKE] home prompt\n'", "git status --short", "bun --version"]
-      const hint = (
-        <box flexShrink={0} flexDirection="row" gap={1}>
-          <text fg={skin.muted}>
-            <span style={{ fg: skin.accent }}>•</span> smoke home prompt
-          </text>
-        </box>
-      )
-
-      return (
-        <Prompt
-          workspaceID={value.workspace_id}
-          hint={hint}
-          right={
-            <box flexDirection="row" gap={1}>
-              <Slot name="home_prompt_right" workspace_id={value.workspace_id} />
-              <Slot name="smoke_prompt_right" workspace_id={value.workspace_id} label={input.label} />
-            </box>
-          }
-          placeholders={{ normal, shell }}
-        />
-      )
-    },
-    home_prompt_right(ctx, value) {
-      const skin = look(ctx.theme.current)
-      const id = value.workspace_id?.slice(0, 8) ?? "none"
-      return (
-        <text fg={skin.muted}>
-          <span style={{ fg: skin.accent }}>{input.label}</span> home:{id}
-        </text>
-      )
-    },
-    session_prompt_right(ctx, value) {
-      const skin = look(ctx.theme.current)
-      return (
-        <text fg={skin.muted}>
-          <span style={{ fg: skin.accent }}>{input.label}</span> session:{value.session_id.slice(0, 8)}
-        </text>
-      )
-    },
-    smoke_prompt_right(ctx, value) {
-      const skin = look(ctx.theme.current)
-      const id = typeof value.workspace_id === "string" ? value.workspace_id.slice(0, 8) : "none"
-      const label = typeof value.label === "string" ? value.label : input.label
-      return (
-        <text fg={skin.muted}>
-          <span style={{ fg: skin.accent }}>{label}</span> custom:{id}
-        </text>
-      )
-    },
-    home_bottom(ctx) {
-      const skin = look(ctx.theme.current)
-      const text = "extra content in the unified home bottom slot"
-
-      return (
-        <box width="100%" maxWidth={75} alignItems="center" paddingTop={1} flexShrink={0} gap={1}>
-          <box
-            border
-            borderColor={skin.border}
-            backgroundColor={skin.panel}
-            paddingTop={1}
-            paddingBottom={1}
-            paddingLeft={2}
-            paddingRight={2}
-            width="100%"
-          >
-            <text fg={skin.muted}>
-              <span style={{ fg: skin.accent }}>{input.label}</span> {text}
-            </text>
-          </box>
-        </box>
-      )
-    },
-  },
-})
-
-const block = (input: Cfg, order: number, title: string, text: string): TuiSlotPlugin => ({
-  order,
-  slots: {
-    sidebar_content(ctx, value) {
-      const skin = look(ctx.theme.current)
-
-      return (
-        <box
-          border
-          borderColor={skin.border}
-          backgroundColor={skin.panel}
-          paddingTop={1}
-          paddingBottom={1}
-          paddingLeft={2}
-          paddingRight={2}
-          flexDirection="column"
-          gap={1}
-        >
-          <text fg={skin.accent}>
-            <b>{title}</b>
-          </text>
-          <text fg={skin.text}>{text}</text>
-          <text fg={skin.muted}>
-            {input.label} order {order} · session {value.session_id.slice(0, 8)}
-          </text>
-        </box>
-      )
-    },
-  },
-})
-
-const slot = (api: TuiPluginApi, input: Cfg): TuiSlotPlugin[] => [
-  home(api, input),
-  block(input, 50, "Smoke above", "renders above internal sidebar blocks"),
-  block(input, 250, "Smoke between", "renders between internal sidebar blocks"),
-  block(input, 650, "Smoke below", "renders below internal sidebar blocks"),
-]
-
-const reg = (api: TuiPluginApi, input: Cfg, keys: Keys) => {
-  const route = names(input)
-  api.command.register(() => [
-    {
-      title: `${input.label} modal`,
-      value: "plugin.smoke.modal",
-      keybind: keys.get("modal"),
-      category: "Plugin",
-      slash: {
-        name: "smoke",
-      },
-      onSelect: () => {
-        api.route.navigate(route.modal, { source: "command" })
-      },
-    },
-    {
-      title: `${input.label} screen`,
-      value: "plugin.smoke.screen",
-      keybind: keys.get("screen"),
-      category: "Plugin",
-      slash: {
-        name: "smoke-screen",
-      },
-      onSelect: () => {
-        api.route.navigate(route.screen, { source: "command", tab: 0, count: 0 })
-      },
-    },
-    {
-      title: `${input.label} alert dialog`,
-      value: "plugin.smoke.alert",
-      category: "Plugin",
-      slash: {
-        name: "smoke-alert",
-      },
-      onSelect: () => {
-        warn(api, route, current(api, route))
-      },
-    },
-    {
-      title: `${input.label} confirm dialog`,
-      value: "plugin.smoke.confirm",
-      category: "Plugin",
-      slash: {
-        name: "smoke-confirm",
-      },
-      onSelect: () => {
-        check(api, route, current(api, route))
-      },
-    },
-    {
-      title: `${input.label} prompt dialog`,
-      value: "plugin.smoke.prompt",
-      category: "Plugin",
-      slash: {
-        name: "smoke-prompt",
-      },
-      onSelect: () => {
-        entry(api, route, current(api, route))
-      },
-    },
-    {
-      title: `${input.label} select dialog`,
-      value: "plugin.smoke.select",
-      category: "Plugin",
-      slash: {
-        name: "smoke-select",
-      },
-      onSelect: () => {
-        picker(api, route, current(api, route))
-      },
-    },
-    {
-      title: `${input.label} host overlay`,
-      value: "plugin.smoke.host",
-      category: "Plugin",
-      slash: {
-        name: "smoke-host",
-      },
-      onSelect: () => {
-        host(api, input, tone(api))
-      },
-    },
-    {
-      title: `${input.label} go home`,
-      value: "plugin.smoke.home",
-      category: "Plugin",
-      enabled: api.route.current.name !== "home",
-      onSelect: () => {
-        api.route.navigate("home")
-      },
-    },
-    {
-      title: `${input.label} toast`,
-      value: "plugin.smoke.toast",
-      category: "Plugin",
-      onSelect: () => {
-        api.ui.toast({
-          variant: "info",
-          title: "Smoke",
-          message: "Plugin toast works",
-          duration: 2000,
-        })
-      },
-    },
-  ])
-}
-
-const tui: TuiPlugin = async (api, options, meta) => {
-  if (options?.enabled === false) return
-
-  await api.theme.install("./smoke-theme.json")
-  api.theme.set("smoke-theme")
-
-  const value = cfg(options ?? undefined)
-  const route = names(value)
-  const keys = api.keybind.create(bind, value.keybinds)
-  const fx = new VignetteEffect(value.vignette)
-  const post = fx.apply.bind(fx)
-  api.renderer.addPostProcessFn(post)
-  api.lifecycle.onDispose(() => {
-    api.renderer.removePostProcessFn(post)
-  })
-
-  api.route.register([
-    {
-      name: route.screen,
-      render: ({ params }) => <Screen api={api} input={value} route={route} keys={keys} meta={meta} params={params} />,
-    },
-    {
-      name: route.modal,
-      render: ({ params }) => <Modal api={api} input={value} route={route} keys={keys} params={params} />,
-    },
-  ])
-
-  reg(api, value, keys)
-  for (const item of slot(api, value)) {
-    api.slots.register(item)
-  }
-}
-
-const plugin: TuiPluginModule & { id: string } = {
-  id: "tui-smoke",
-  tui,
-}
-
-export default plugin

.opencode/skills/effect/SKILL.md

@@ -1,21 +0,0 @@
----
-name: effect
-description: Answer questions about the Effect framework
----
-
-# Effect
-
-This codebase uses Effect, a framework for writing typescript.
-
-## How to Answer Effect Questions
-
-1. Clone the Effect repository: `https://github.com/Effect-TS/effect-smol` to
-   `.opencode/references/effect-smol` in this project NOT the skill folder.
-2. Use the explore agent to search the codebase for answers about Effect patterns, APIs, and concepts
-3. Provide responses based on the actual Effect source code and documentation
-
-## Guidelines
-
-- Always use the explore agent with the cloned repository when answering Effect-related questions
-- Reference specific files and patterns found in the Effect codebase
-- Do not answer from memory - always verify against the source

.opencode/themes/.gitignore

@@ -1 +0,0 @@
-smoke-theme.json

.opencode/themes/mytheme.json

@@ -116,8 +116,8 @@
       "light": "nord5"
     },
     "diffLineNumber": {
-      "dark": "#abafb7",
-      "light": "textMuted"
+      "dark": "nord2",
+      "light": "nord4"
     },
     "diffAddedLineNumberBg": {
       "dark": "#3B4252",

.opencode/tui.json

@@ -1,18 +0,0 @@
-{
-  "$schema": "https://opencode.ai/tui.json",
-  "plugin": [
-    [
-      "./plugins/tui-smoke.tsx",
-      {
-        "enabled": false,
-        "label": "workspace",
-        "keybinds": {
-          "modal": "ctrl+alt+m",
-          "screen": "ctrl+alt+o",
-          "home": "escape,ctrl+shift+h",
-          "dialog_close": "escape,q"
-        }
-      }
-    ]
-  ]
-}

.signpath/policies/opencode/test-signing.yml

@@ -0,0 +1,5 @@
+github-policies:
+  runners:
+    allowed_groups:
+      - "GitHub Actions"
+      - "blacksmith runners 01kbd5v56sg8tz7rea39b7ygpt"

github/index.ts

@@ -496,6 +496,7 @@ async function subscribeSessionEvents() {
 
   const TOOL: Record<string, [string, string]> = {
     todowrite: ["Todo", "\x1b[33m\x1b[1m"],
+    todoread: ["Todo", "\x1b[33m\x1b[1m"],
     bash: ["Bash", "\x1b[31m\x1b[1m"],
     edit: ["Edit", "\x1b[32m\x1b[1m"],
     glob: ["Glob", "\x1b[34m\x1b[1m"],

infra/console.ts

@@ -109,12 +109,6 @@ const zenLiteCouponFirstMonth50 = new stripe.Coupon("ZenLiteCouponFirstMonth50",
   appliesToProducts: [zenLiteProduct.id],
   duration: "once",
 })
-const zenLiteCouponFirstMonth100 = new stripe.Coupon("ZenLiteCouponFirstMonth100", {
-  name: "First month 100% off",
-  percentOff: 100,
-  appliesToProducts: [zenLiteProduct.id],
-  duration: "once",
-})
 const zenLitePrice = new stripe.Price("ZenLitePrice", {
   product: zenLiteProduct.id,
   currency: "usd",
@@ -130,7 +124,6 @@ const ZEN_LITE_PRICE = new sst.Linkable("ZEN_LITE_PRICE", {
     price: zenLitePrice.id,
     priceInr: 92900,
     firstMonth50Coupon: zenLiteCouponFirstMonth50.id,
-    firstMonth100Coupon: zenLiteCouponFirstMonth100.id,
   },
 })
 
@@ -236,7 +229,6 @@ new sst.cloudflare.x.SolidStart("Console", {
     SALESFORCE_INSTANCE_URL,
     ZEN_BLACK_PRICE,
     ZEN_LITE_PRICE,
-    new sst.Secret("ZEN_LITE_COUPON_FIRST_MONTH_100_INVITEES"),
     new sst.Secret("ZEN_LIMITS"),
     new sst.Secret("ZEN_SESSION_SECRET"),
     ...ZEN_MODELS,

nix/hashes.json

@@ -1,8 +1,8 @@
 {
   "nodeModules": {
-    "x86_64-linux": "sha256-gdS7MkWGeVO0qLs0HKD156YE0uCk5vWeYjKu4JR1Apw=",
-    "aarch64-linux": "sha256-tF4pyVqzbrvdkRG23Fot37FCg8guRZkcU738fHPr/OQ=",
-    "aarch64-darwin": "sha256-FugTWzGMb2ktAbNwQvWRM3GWOb5RTR++8EocDDrQMLc=",
-    "x86_64-darwin": "sha256-jpe6EiwKr+CS00cn0eHwcDluO4LvO3t/5l/LcFBBKP0="
+    "x86_64-linux": "sha256-MmN2+NfHeLPDClpLPOlCAZTmwI94M6XgNAqXrW5Ls4I=",
+    "aarch64-linux": "sha256-whVIlmDvoMmEMUY2Yxx2vAmFDuKQic6ChY1V+9gLd84=",
+    "aarch64-darwin": "sha256-TulGiC24w3usk26hKr3PyccatvIfmAlHgEJaOTUf3pQ=",
+    "x86_64-darwin": "sha256-T8NWm0bBybJKThRdp/jQdxilv1Ec9SF1iVT3udSoZOg="
   }
 }

nix/node_modules.nix

@@ -20,7 +20,7 @@ let
 in
 stdenvNoCC.mkDerivation {
   pname = "opencode-node_modules";
-  version = "${packageJson.version}+${lib.replaceString "-" "." rev}";
+  version = "${packageJson.version}-${rev}";
 
   src = lib.fileset.toSource {
     root = ../.;
@@ -54,7 +54,6 @@ stdenvNoCC.mkDerivation {
       --filter '!./' \
       --filter './packages/opencode' \
       --filter './packages/desktop' \
-      --filter './packages/app' \
       --frozen-lockfile \
       --ignore-scripts \
       --no-progress

nix/opencode.nix

@@ -3,10 +3,10 @@
   stdenvNoCC,
   callPackage,
   bun,
-  nodejs,
   sysctl,
   makeBinaryWrapper,
   models-dev,
+  ripgrep,
   installShellFiles,
   versionCheckHook,
   writableTmpDirAsHomeHook,
@@ -19,7 +19,6 @@ stdenvNoCC.mkDerivation (finalAttrs: {
 
   nativeBuildInputs = [
     bun
-    nodejs # for patchShebangs node_modules
     installShellFiles
     makeBinaryWrapper
     models-dev
@@ -30,8 +29,6 @@ stdenvNoCC.mkDerivation (finalAttrs: {
     runHook preConfigure
 
     cp -R ${finalAttrs.node_modules}/. .
-    patchShebangs node_modules
-    patchShebangs packages/*/node_modules
 
     runHook postConfigure
   '';
@@ -51,25 +48,25 @@ stdenvNoCC.mkDerivation (finalAttrs: {
     runHook postBuild
   '';
 
-  installPhase =
-    ''
-      runHook preInstall
+  installPhase = ''
+    runHook preInstall
 
-      install -Dm755 dist/opencode-*/bin/opencode $out/bin/opencode
-      install -Dm644 schema.json $out/share/opencode/schema.json
-    ''
-    # bun runs sysctl to detect if dunning on rosetta2
-    + lib.optionalString stdenvNoCC.hostPlatform.isDarwin ''
-      wrapProgram $out/bin/opencode \
-        --prefix PATH : ${
-          lib.makeBinPath [
-            sysctl
+    install -Dm755 dist/opencode-*/bin/opencode $out/bin/opencode
+    install -Dm644 schema.json $out/share/opencode/schema.json
+
+    wrapProgram $out/bin/opencode \
+      --prefix PATH : ${
+        lib.makeBinPath (
+          [
+            ripgrep
           ]
-        }
-    ''
-    + ''
-      runHook postInstall
-    '';
+          # bun runs sysctl to detect if dunning on rosetta2
+          ++ lib.optional stdenvNoCC.hostPlatform.isDarwin sysctl
+        )
+      }
+
+    runHook postInstall
+  '';
 
   postInstall = lib.optionalString (stdenvNoCC.buildPlatform.canExecute stdenvNoCC.hostPlatform) ''
     # trick yargs into also generating zsh completions

package.json

@@ -12,7 +12,6 @@
     "dev:console": "ulimit -n 10240 2>/dev/null; bun run --cwd packages/console/app dev",
     "dev:storybook": "bun --cwd packages/storybook storybook",
     "typecheck": "bun turbo typecheck",
-    "postinstall": "bun run --cwd packages/opencode fix-node-pty",
     "prepare": "husky",
     "random": "echo 'Random script'",
     "hello": "echo 'Hello World!'",
@@ -26,10 +25,8 @@
       "packages/slack"
     ],
     "catalog": {
-      "@effect/opentelemetry": "4.0.0-beta.48",
-      "@effect/platform-node": "4.0.0-beta.48",
+      "@effect/platform-node": "4.0.0-beta.35",
       "@types/bun": "1.3.11",
-      "@types/cross-spawn": "6.0.6",
       "@octokit/rest": "22.0.0",
       "@hono/zod-validator": "0.4.2",
       "ulid": "3.0.1",
@@ -48,17 +45,15 @@
       "dompurify": "3.3.1",
       "drizzle-kit": "1.0.0-beta.19-d95b7a4",
       "drizzle-orm": "1.0.0-beta.19-d95b7a4",
-      "effect": "4.0.0-beta.48",
-      "ai": "6.0.158",
-      "cross-spawn": "7.0.6",
+      "effect": "4.0.0-beta.35",
+      "ai": "5.0.124",
       "hono": "4.10.7",
       "hono-openapi": "1.1.2",
       "fuzzysort": "3.1.0",
       "luxon": "3.6.1",
       "marked": "17.0.1",
       "marked-shiki": "1.2.1",
-      "remend": "1.3.0",
-      "@playwright/test": "1.59.1",
+      "@playwright/test": "1.51.0",
       "typescript": "5.8.2",
       "@typescript/native-preview": "7.0.0-dev.20251207.1",
       "zod": "4.1.8",
@@ -72,8 +67,7 @@
       "@solidjs/router": "0.15.4",
       "@solidjs/start": "https://pkg.pr.new/@solidjs/start@dfb2020",
       "solid-js": "1.9.10",
-      "vite-plugin-solid": "2.11.10",
-      "@lydell/node-pty": "1.2.0-beta.10"
+      "vite-plugin-solid": "2.11.10"
     }
   },
   "devDependencies": {
@@ -93,7 +87,6 @@
     "@opencode-ai/plugin": "workspace:*",
     "@opencode-ai/script": "workspace:*",
     "@opencode-ai/sdk": "workspace:*",
-    "heap-snapshot-toolkit": "1.1.3",
     "typescript": "catalog:"
   },
   "repository": {
@@ -107,11 +100,9 @@
   },
   "trustedDependencies": [
     "esbuild",
-    "node-pty",
     "protobufjs",
     "tree-sitter",
     "tree-sitter-bash",
-    "tree-sitter-powershell",
     "web-tree-sitter",
     "electron"
   ],
@@ -121,6 +112,8 @@
   },
   "patchedDependencies": {
     "@standard-community/standard-openapi@0.2.9": "patches/@standard-community%2Fstandard-openapi@0.2.9.patch",
+    "@openrouter/ai-sdk-provider@1.5.4": "patches/@openrouter%2Fai-sdk-provider@1.5.4.patch",
+    "@ai-sdk/xai@2.0.51": "patches/@ai-sdk%2Fxai@2.0.51.patch",
     "solid-js@1.9.10": "patches/solid-js@1.9.10.patch"
   }
 }

packages/app/README.md

@@ -31,10 +31,11 @@ Your app is ready to be deployed!
 
 ## E2E Testing
 
-Playwright starts the Vite dev server automatically via `webServer`, and UI tests expect an opencode backend at `localhost:4096` by default.
+Playwright starts the Vite dev server automatically via `webServer`, and UI tests need an opencode backend (defaults to `localhost:4096`).
+Use the local runner to create a temp sandbox, seed data, and run the tests.
 
 ```bash
-bunx playwright install chromium
+bunx playwright install
 bun run test:e2e:local
 bun run test:e2e:local -- --grep "settings"
 ```

packages/app/e2e/AGENTS.md

@@ -0,0 +1,226 @@
+# E2E Testing Guide
+
+## Build/Lint/Test Commands
+
+```bash
+# Run all e2e tests
+bun test:e2e
+
+# Run specific test file
+bun test:e2e -- app/home.spec.ts
+
+# Run single test by title
+bun test:e2e -- -g "home renders and shows core entrypoints"
+
+# Run tests with UI mode (for debugging)
+bun test:e2e:ui
+
+# Run tests locally with full server setup
+bun test:e2e:local
+
+# View test report
+bun test:e2e:report
+
+# Typecheck
+bun typecheck
+```
+
+## Test Structure
+
+All tests live in `packages/app/e2e/`:
+
+```
+e2e/
+├── fixtures.ts       # Test fixtures (test, expect, gotoSession, sdk)
+├── actions.ts        # Reusable action helpers
+├── selectors.ts      # DOM selectors
+├── utils.ts          # Utilities (serverUrl, modKey, path helpers)
+└── [feature]/
+    └── *.spec.ts     # Test files
+```
+
+## Test Patterns
+
+### Basic Test Structure
+
+```typescript
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { withSession } from "../actions"
+
+test("test description", async ({ page, sdk, gotoSession }) => {
+  await gotoSession() // or gotoSession(sessionID)
+
+  // Your test code
+  await expect(page.locator(promptSelector)).toBeVisible()
+})
+```
+
+### Using Fixtures
+
+- `page` - Playwright page
+- `sdk` - OpenCode SDK client for API calls
+- `gotoSession(sessionID?)` - Navigate to session
+
+### Helper Functions
+
+**Actions** (`actions.ts`):
+
+- `openPalette(page)` - Open command palette
+- `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`):
+
+- `promptSelector` - Prompt input
+- `terminalSelector` - Terminal panel
+- `sessionItemSelector(id)` - Session in sidebar
+- `listItemSelector` - Generic list items
+
+**Utils** (`utils.ts`):
+
+- `modKey` - Meta (Mac) or Control (Linux/Win)
+- `serverUrl` - Backend server URL
+- `sessionPath(dir, id?)` - Build session URL
+
+## Code Style Guidelines
+
+### Imports
+
+Always import from `../fixtures`, not `@playwright/test`:
+
+```typescript
+// ✅ Good
+import { test, expect } from "../fixtures"
+
+// ❌ Bad
+import { test, expect } from "@playwright/test"
+```
+
+### Naming Conventions
+
+- Test files: `feature-name.spec.ts`
+- Test names: lowercase, descriptive: `"sidebar can be toggled"`
+- Variables: camelCase
+- Constants: SCREAMING_SNAKE_CASE
+
+### Error Handling
+
+Tests should clean up after themselves. Prefer fixture-managed cleanup:
+
+```typescript
+test("test with cleanup", async ({ page, sdk, gotoSession }) => {
+  await withSession(sdk, "test session", async (session) => {
+    await gotoSession(session.id)
+    // Test code...
+  }) // Auto-deletes session
+})
+```
+
+- 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:
+
+```typescript
+test.setTimeout(120_000) // For long LLM operations
+test("slow test", async () => {
+  await expect.poll(() => check(), { timeout: 90_000 }).toBe(true)
+})
+```
+
+### Selectors
+
+Use `data-component`, `data-action`, or semantic roles:
+
+```typescript
+// ✅ Good
+await page.locator('[data-component="prompt-input"]').click()
+await page.getByRole("button", { name: "Open settings" }).click()
+
+// ❌ Bad
+await page.locator(".css-class-name").click()
+await page.locator("#id-name").click()
+```
+
+### Keyboard Shortcuts
+
+Use `modKey` for cross-platform compatibility:
+
+```typescript
+import { modKey } from "../utils"
+
+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.
+- After opening the terminal, use `waitTerminalFocusIdle(...)` before the next keyboard action when prompt focus or keyboard routing matters.
+- This avoids racing terminal mount, focus handoff, and prompt readiness when the next step types or sends shortcuts.
+- 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
+- Prefer semantic app state over transient DOM visibility when behavior depends on active selection, focus ownership, or async retry loops
+- Do not treat a visible element as proof that the app will route the next action to it
+- When fixing a flake, validate with `--repeat-each` and multiple workers when practical
+
+### 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
+- Add minimal test-only probes for semantic state like the active list item or selected command when DOM intermediates are unstable
+- Prefer probing committed app state over asserting on transient highlight, visibility, or animation states
+
+### 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
+- Prefer helpers that both perform an action and verify the app consumed it
+- Avoid composing helpers redundantly when one already includes the other or already waits for the resulting state
+- If a helper already covers the required wait or verification, use it directly instead of layering extra clicks, keypresses, or assertions
+
+## 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
+
+## Local Development
+
+For UI debugging, use:
+
+```bash
+bun test:e2e:ui
+```
+
+This opens Playwright's interactive UI for step-through debugging.

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

@@ -0,0 +1,24 @@
+import { test, expect } from "../fixtures"
+import { serverNamePattern } from "../utils"
+
+test("home renders and shows core entrypoints", async ({ page }) => {
+  await page.goto("/")
+  const nav = page.locator('[data-component="sidebar-nav-desktop"]')
+
+  await expect(page.getByRole("button", { name: "Open project" }).first()).toBeVisible()
+  await expect(nav.getByText("No projects open")).toBeVisible()
+  await expect(nav.getByText("Open a project to get started")).toBeVisible()
+  await expect(page.getByRole("button", { name: serverNamePattern })).toBeVisible()
+})
+
+test("server picker dialog opens from home", async ({ page }) => {
+  await page.goto("/")
+
+  const trigger = page.getByRole("button", { name: serverNamePattern })
+  await expect(trigger).toBeVisible()
+  await trigger.click()
+
+  const dialog = page.getByRole("dialog")
+  await expect(dialog).toBeVisible()
+  await expect(dialog.getByRole("textbox").first()).toBeVisible()
+})

packages/app/e2e/app/navigation.spec.ts

@@ -0,0 +1,10 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { dirPath } from "../utils"
+
+test("project route redirects to /session", async ({ page, directory, slug }) => {
+  await page.goto(dirPath(directory))
+
+  await expect(page).toHaveURL(new RegExp(`/${slug}/session`))
+  await expect(page.locator(promptSelector)).toBeVisible()
+})

packages/app/e2e/app/palette.spec.ts

@@ -0,0 +1,20 @@
+import { test, expect } from "../fixtures"
+import { closeDialog, openPalette } from "../actions"
+
+test("search palette opens and closes", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openPalette(page)
+
+  await page.keyboard.press("Escape")
+  await expect(dialog).toHaveCount(0)
+})
+
+test("search palette also opens with cmd+p", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openPalette(page, "P")
+
+  await closeDialog(page, dialog)
+  await expect(dialog).toHaveCount(0)
+})

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

@@ -0,0 +1,58 @@
+import { test, expect } from "../fixtures"
+import { serverNamePattern, serverUrls } from "../utils"
+import { closeDialog, clickMenuItem } from "../actions"
+
+const DEFAULT_SERVER_URL_KEY = "opencode.settings.dat:defaultServerUrl"
+
+test("can set a default server on web", async ({ page, gotoSession }) => {
+  await page.addInitScript((key: string) => {
+    try {
+      localStorage.removeItem(key)
+    } catch {
+      return
+    }
+  }, DEFAULT_SERVER_URL_KEY)
+
+  await gotoSession()
+
+  const status = page.getByRole("button", { name: "Status" })
+  await expect(status).toBeVisible()
+  const popover = page.locator('[data-component="popover-content"]').filter({ hasText: "Manage servers" })
+
+  const ensurePopoverOpen = async () => {
+    if (await popover.isVisible()) return
+    await status.click()
+    await expect(popover).toBeVisible()
+  }
+
+  await ensurePopoverOpen()
+  await popover.getByRole("button", { name: "Manage servers" }).click()
+
+  const dialog = page.getByRole("dialog")
+  await expect(dialog).toBeVisible()
+
+  await expect(dialog.getByText(serverNamePattern).first()).toBeVisible()
+
+  const menuTrigger = dialog.locator('[data-slot="dropdown-menu-trigger"]').first()
+  await expect(menuTrigger).toBeVisible()
+  await menuTrigger.click({ force: true })
+
+  const menu = page.locator('[data-component="dropdown-menu-content"]').first()
+  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 closeDialog(page, dialog)
+
+  await ensurePopoverOpen()
+
+  const serverRow = popover.locator("button").filter({ hasText: serverNamePattern }).first()
+  await expect(serverRow).toBeVisible()
+  await expect(serverRow.getByText("Default", { exact: true })).toBeVisible()
+})

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

@@ -0,0 +1,16 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { withSession } from "../actions"
+
+test("can open an existing session and type into the prompt", async ({ page, sdk, gotoSession }) => {
+  const title = `e2e smoke ${Date.now()}`
+
+  await withSession(sdk, title, async (session) => {
+    await gotoSession(session.id)
+
+    const prompt = page.locator(promptSelector)
+    await prompt.click()
+    await page.keyboard.type("hello from e2e")
+    await expect(prompt).toContainText("hello from e2e")
+  })
+})

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

@@ -0,0 +1,120 @@
+import { test, expect } from "../fixtures"
+import { defocus, openSidebar, withSession } from "../actions"
+import { promptSelector } from "../selectors"
+import { modKey } from "../utils"
+
+test("titlebar back/forward navigates between sessions", async ({ page, slug, sdk, gotoSession }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const stamp = Date.now()
+
+  await withSession(sdk, `e2e titlebar history 1 ${stamp}`, async (one) => {
+    await withSession(sdk, `e2e titlebar history 2 ${stamp}`, async (two) => {
+      await gotoSession(one.id)
+
+      await openSidebar(page)
+
+      const link = page.locator(`[data-session-id="${two.id}"] a`).first()
+      await expect(link).toBeVisible()
+      await link.click()
+
+      await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`))
+      await expect(page.locator(promptSelector)).toBeVisible()
+
+      const back = page.getByRole("button", { name: "Back" })
+      const forward = page.getByRole("button", { name: "Forward" })
+
+      await expect(back).toBeVisible()
+      await expect(back).toBeEnabled()
+      await back.click()
+
+      await expect(page).toHaveURL(new RegExp(`/${slug}/session/${one.id}(?:\\?|#|$)`))
+      await expect(page.locator(promptSelector)).toBeVisible()
+
+      await expect(forward).toBeVisible()
+      await expect(forward).toBeEnabled()
+      await forward.click()
+
+      await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`))
+      await expect(page.locator(promptSelector)).toBeVisible()
+    })
+  })
+})
+
+test("titlebar forward is cleared after branching history from sidebar", async ({ page, slug, sdk, gotoSession }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const stamp = Date.now()
+
+  await withSession(sdk, `e2e titlebar history a ${stamp}`, async (a) => {
+    await withSession(sdk, `e2e titlebar history b ${stamp}`, async (b) => {
+      await withSession(sdk, `e2e titlebar history c ${stamp}`, async (c) => {
+        await gotoSession(a.id)
+
+        await openSidebar(page)
+
+        const second = page.locator(`[data-session-id="${b.id}"] a`).first()
+        await expect(second).toBeVisible()
+        await second.click()
+
+        await expect(page).toHaveURL(new RegExp(`/${slug}/session/${b.id}(?:\\?|#|$)`))
+        await expect(page.locator(promptSelector)).toBeVisible()
+
+        const back = page.getByRole("button", { name: "Back" })
+        const forward = page.getByRole("button", { name: "Forward" })
+
+        await expect(back).toBeVisible()
+        await expect(back).toBeEnabled()
+        await back.click()
+
+        await expect(page).toHaveURL(new RegExp(`/${slug}/session/${a.id}(?:\\?|#|$)`))
+        await expect(page.locator(promptSelector)).toBeVisible()
+
+        await openSidebar(page)
+
+        const third = page.locator(`[data-session-id="${c.id}"] a`).first()
+        await expect(third).toBeVisible()
+        await third.click()
+
+        await expect(page).toHaveURL(new RegExp(`/${slug}/session/${c.id}(?:\\?|#|$)`))
+        await expect(page.locator(promptSelector)).toBeVisible()
+
+        await expect(forward).toBeVisible()
+        await expect(forward).toBeDisabled()
+      })
+    })
+  })
+})
+
+test("keyboard shortcuts navigate titlebar history", async ({ page, slug, sdk, gotoSession }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const stamp = Date.now()
+
+  await withSession(sdk, `e2e titlebar shortcuts 1 ${stamp}`, async (one) => {
+    await withSession(sdk, `e2e titlebar shortcuts 2 ${stamp}`, async (two) => {
+      await gotoSession(one.id)
+
+      await openSidebar(page)
+
+      const link = page.locator(`[data-session-id="${two.id}"] a`).first()
+      await expect(link).toBeVisible()
+      await link.click()
+
+      await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`))
+      await expect(page.locator(promptSelector)).toBeVisible()
+
+      await defocus(page)
+      await page.keyboard.press(`${modKey}+[`)
+
+      await expect(page).toHaveURL(new RegExp(`/${slug}/session/${one.id}(?:\\?|#|$)`))
+      await expect(page.locator(promptSelector)).toBeVisible()
+
+      await defocus(page)
+      await page.keyboard.press(`${modKey}+]`)
+
+      await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`))
+      await expect(page.locator(promptSelector)).toBeVisible()
+    })
+  })
+})

packages/app/e2e/commands/input-focus.spec.ts

@@ -0,0 +1,15 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+
+test("ctrl+l focuses the prompt", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const prompt = page.locator(promptSelector)
+  await expect(prompt).toBeVisible()
+
+  await page.locator("main").click({ position: { x: 5, y: 5 } })
+  await expect(prompt).not.toBeFocused()
+
+  await page.keyboard.press("Control+L")
+  await expect(prompt).toBeFocused()
+})

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

@@ -0,0 +1,33 @@
+import { test, expect } from "../fixtures"
+import { modKey } from "../utils"
+
+const expanded = async (el: { getAttribute: (name: string) => Promise<string | null> }) => {
+  const value = await el.getAttribute("aria-expanded")
+  if (value !== "true" && value !== "false") throw new Error(`Expected aria-expanded to be true|false, got: ${value}`)
+  return value === "true"
+}
+
+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()
+  await expect(treeToggle).toHaveAttribute("aria-expanded", "false")
+
+  const reviewToggle = page.getByRole("button", { name: "Toggle review" }).first()
+  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 page.keyboard.press(`${modKey}+Shift+R`)
+  await expect(reviewToggle).toHaveAttribute("aria-expanded", "true")
+  await expect(reviewPanel).toHaveAttribute("aria-hidden", "false")
+
+  await page.keyboard.press(`${modKey}+Shift+R`)
+  await expect(reviewToggle).toHaveAttribute("aria-expanded", "false")
+  await expect(reviewPanel).toHaveAttribute("aria-hidden", "true")
+})

packages/app/e2e/commands/tab-close.spec.ts

@@ -0,0 +1,32 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { modKey } from "../utils"
+
+test("mod+w closes the active file tab", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/open")
+  await expect(page.locator('[data-slash-id="file.open"]').first()).toBeVisible()
+  await page.keyboard.press("Enter")
+
+  const dialog = page
+    .getByRole("dialog")
+    .filter({ has: page.getByPlaceholder(/search files/i) })
+    .first()
+  await expect(dialog).toBeVisible()
+
+  await dialog.getByRole("textbox").first().fill("package.json")
+  const item = dialog.locator('[data-slot="list-item"][data-key^="file:"]').first()
+  await expect(item).toBeVisible({ timeout: 30_000 })
+  await item.click()
+  await expect(dialog).toHaveCount(0)
+
+  const tab = page.getByRole("tab", { name: "package.json" }).first()
+  await expect(tab).toBeVisible()
+  await tab.click()
+  await expect(tab).toHaveAttribute("aria-selected", "true")
+
+  await page.keyboard.press(`${modKey}+W`)
+  await expect(page.getByRole("tab", { name: "package.json" })).toHaveCount(0)
+})

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

@@ -0,0 +1,31 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+
+test("can open a file tab from the search palette", 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 item = dialog.locator('[data-slot="list-item"][data-key^="file:"]').first()
+  await expect(item).toBeVisible({ timeout: 30_000 })
+  await item.click()
+
+  await expect(dialog).toHaveCount(0)
+
+  const tabs = page.locator('[data-component="tabs"][data-variant="normal"]')
+  await expect(tabs.locator('[data-slot="tabs-trigger"]').first()).toBeVisible()
+})

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

@@ -0,0 +1,56 @@
+import { test, expect } from "../fixtures"
+
+test("file tree can expand folders and open a file", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const toggle = page.getByRole("button", { name: "Toggle file tree" })
+  const panel = page.locator("#file-tree-panel")
+  const treeTabs = panel.locator('[data-component="tabs"][data-variant="pill"][data-scope="filetree"]')
+
+  await expect(toggle).toBeVisible()
+  if ((await toggle.getAttribute("aria-expanded")) !== "true") await toggle.click()
+  await expect(toggle).toHaveAttribute("aria-expanded", "true")
+  await expect(panel).toBeVisible()
+  await expect(treeTabs).toBeVisible()
+
+  const allTab = treeTabs.getByRole("tab", { name: /^all files$/i })
+  await expect(allTab).toBeVisible()
+  await allTab.click()
+  await expect(allTab).toHaveAttribute("aria-selected", "true")
+
+  const tree = treeTabs.locator('[data-slot="tabs-content"]:not([hidden])')
+  await expect(tree).toBeVisible()
+
+  const expand = async (name: string) => {
+    const folder = tree.getByRole("button", { name, exact: true }).first()
+    await expect(folder).toBeVisible()
+    await expect(folder).toHaveAttribute("aria-expanded", /true|false/)
+    if ((await folder.getAttribute("aria-expanded")) === "false") await folder.click()
+    await expect(folder).toHaveAttribute("aria-expanded", "true")
+  }
+
+  await expand("packages")
+  await expand("app")
+  await expand("src")
+  await expand("components")
+
+  const file = tree.getByRole("button", { name: "file-tree.tsx", exact: true }).first()
+  await expect(file).toBeVisible()
+  await file.click()
+
+  const tab = page.getByRole("tab", { name: "file-tree.tsx" })
+  await expect(tab).toBeVisible()
+  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

@@ -0,0 +1,156 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { modKey } from "../utils"
+
+test("smoke file viewer renders real file content", 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 expect(viewer.getByText(/"name"\s*:\s*"@opencode-ai\/app"/)).toBeVisible()
+})
+
+test("cmd+f opens text viewer search while prompt is 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 page.locator(promptSelector).click()
+  await page.keyboard.press(`${modKey}+f`)
+
+  const findInput = page.getByPlaceholder("Find")
+  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

@@ -0,0 +1,154 @@
+import { test as base, expect, type Page } from "@playwright/test"
+import type { E2EWindow } from "../src/testing/terminal"
+import {
+  healthPhase,
+  cleanupSession,
+  cleanupTestProject,
+  createTestProject,
+  setHealthPhase,
+  seedProjects,
+  sessionIDFromUrl,
+  waitSlug,
+  waitSession,
+} from "./actions"
+import { createSdk, dirSlug, getWorktree, sessionPath } from "./utils"
+
+export const settingsKey = "settings.v3"
+
+type TestFixtures = {
+  sdk: ReturnType<typeof createSdk>
+  gotoSession: (sessionID?: string) => Promise<void>
+  withProject: <T>(
+    callback: (project: {
+      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>
+}
+
+type WorkerFixtures = {
+  directory: string
+  slug: string
+}
+
+export const test = base.extend<TestFixtures, WorkerFixtures>({
+  page: async ({ page }, use) => {
+    let boundary: string | undefined
+    setHealthPhase(page, "test")
+    const consoleHandler = (msg: { text(): string }) => {
+      const text = msg.text()
+      if (!text.includes("[e2e:error-boundary]")) return
+      if (healthPhase(page) === "cleanup") {
+        console.warn(`[e2e:error-boundary][cleanup-warning]\n${text}`)
+        return
+      }
+      boundary ||= text
+      console.log(text)
+    }
+    const pageErrorHandler = (err: Error) => {
+      console.log(`[e2e:pageerror] ${err.stack || err.message}`)
+    }
+    page.on("console", consoleHandler)
+    page.on("pageerror", pageErrorHandler)
+    await use(page)
+    page.off("console", consoleHandler)
+    page.off("pageerror", pageErrorHandler)
+    if (boundary) throw new Error(boundary)
+  },
+  directory: [
+    async ({}, use) => {
+      const directory = await getWorktree()
+      await use(directory)
+    },
+    { scope: "worker" },
+  ],
+  slug: [
+    async ({ directory }, use) => {
+      await use(dirSlug(directory))
+    },
+    { scope: "worker" },
+  ],
+  sdk: async ({ directory }, use) => {
+    await use(createSdk(directory))
+  },
+  gotoSession: async ({ page, directory }, use) => {
+    await seedStorage(page, { directory })
+
+    const gotoSession = async (sessionID?: string) => {
+      await page.goto(sessionPath(directory, sessionID))
+      await waitSession(page, { directory, sessionID })
+    }
+    await use(gotoSession)
+  },
+  withProject: async ({ page }, use) => {
+    await use(async (callback, options) => {
+      const root = await createTestProject()
+      const sessions = new Map<string, string>()
+      const dirs = new Set<string>()
+      await seedStorage(page, { directory: root, extra: options?.extra })
+
+      const gotoSession = async (sessionID?: string) => {
+        await page.goto(sessionPath(root, sessionID))
+        await waitSession(page, { directory: root, sessionID })
+        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()
+        const slug = await waitSlug(page)
+        return await callback({ directory: root, slug, gotoSession, trackSession, trackDirectory })
+      } finally {
+        setHealthPhase(page, "cleanup")
+        await Promise.allSettled(
+          Array.from(sessions, ([sessionID, directory]) => cleanupSession({ sessionID, directory })),
+        )
+        await Promise.allSettled(Array.from(dirs, (directory) => cleanupTestProject(directory)))
+        await cleanupTestProject(root)
+        setHealthPhase(page, "test")
+      }
+    })
+  },
+})
+
+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,
+      },
+      prompt: {
+        enabled: true,
+      },
+      terminal: {
+        enabled: true,
+        terminals: {},
+      },
+    }
+    localStorage.setItem(
+      "opencode.global.dat:model",
+      JSON.stringify({
+        recent: [{ providerID: "opencode", modelID: "big-pickle" }],
+        user: [],
+        variant: {},
+      }),
+    )
+  })
+}
+
+export { expect }

packages/app/e2e/models/model-picker.spec.ts

@@ -0,0 +1,48 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { clickListItem } from "../actions"
+
+test("smoke model selection updates prompt footer", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+
+  const command = page.locator('[data-slash-id="model.choose"]')
+  await expect(command).toBeVisible()
+  await command.hover()
+
+  await page.keyboard.press("Enter")
+
+  const dialog = page.getByRole("dialog")
+  await expect(dialog).toBeVisible()
+
+  const input = dialog.getByRole("textbox").first()
+
+  const selected = dialog.locator('[data-slot="list-item"][data-selected="true"]').first()
+  await expect(selected).toBeVisible()
+
+  const other = dialog.locator('[data-slot="list-item"]:not([data-selected="true"])').first()
+  const target = (await other.count()) > 0 ? other : selected
+
+  const key = await target.getAttribute("data-key")
+  if (!key) throw new Error("Failed to resolve model key from list item")
+
+  const model = key.split(":").slice(1).join(":")
+
+  await input.fill(model)
+
+  await clickListItem(dialog, { key })
+
+  await expect(dialog).toHaveCount(0)
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+  await expect(command).toBeVisible()
+  await command.hover()
+  await page.keyboard.press("Enter")
+
+  const dialogAgain = page.getByRole("dialog")
+  await expect(dialogAgain).toBeVisible()
+  await expect(dialogAgain.locator(`[data-slot="list-item"][data-key="${key}"][data-selected="true"]`)).toBeVisible()
+})

packages/app/e2e/models/models-visibility.spec.ts

@@ -0,0 +1,61 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { closeDialog, openSettings, clickListItem } from "../actions"
+
+test("hiding a model removes it from the model picker", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+
+  const command = page.locator('[data-slash-id="model.choose"]')
+  await expect(command).toBeVisible()
+  await command.hover()
+  await page.keyboard.press("Enter")
+
+  const picker = page.getByRole("dialog")
+  await expect(picker).toBeVisible()
+
+  const target = picker.locator('[data-slot="list-item"]').first()
+  await expect(target).toBeVisible()
+
+  const key = await target.getAttribute("data-key")
+  if (!key) throw new Error("Failed to resolve model key from list item")
+
+  const name = (await target.locator("span").first().innerText()).trim()
+  if (!name) throw new Error("Failed to resolve model name from list item")
+
+  await page.keyboard.press("Escape")
+  await expect(picker).toHaveCount(0)
+
+  const settings = await openSettings(page)
+
+  await settings.getByRole("tab", { name: "Models" }).click()
+  const search = settings.getByPlaceholder("Search models")
+  await expect(search).toBeVisible()
+  await search.fill(name)
+
+  const toggle = settings.locator('[data-component="switch"]').filter({ hasText: name }).first()
+  const input = toggle.locator('[data-slot="switch-input"]')
+  await expect(toggle).toBeVisible()
+  await expect(input).toHaveAttribute("aria-checked", "true")
+  await toggle.locator('[data-slot="switch-control"]').click()
+  await expect(input).toHaveAttribute("aria-checked", "false")
+
+  await closeDialog(page, settings)
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+  await expect(command).toBeVisible()
+  await command.hover()
+  await page.keyboard.press("Enter")
+
+  const pickerAgain = page.getByRole("dialog")
+  await expect(pickerAgain).toBeVisible()
+  await expect(pickerAgain.locator('[data-slot="list-item"]').first()).toBeVisible()
+
+  await expect(pickerAgain.locator(`[data-slot="list-item"][data-key="${key}"]`)).toHaveCount(0)
+
+  await page.keyboard.press("Escape")
+  await expect(pickerAgain).toHaveCount(0)
+})

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

@@ -0,0 +1,43 @@
+import { test, expect } from "../fixtures"
+import { clickMenuItem, openProjectMenu, 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 openSidebar(page)
+
+    const open = async () => {
+      const menu = await openProjectMenu(page, slug)
+      await clickMenuItem(menu, /^Edit$/i, { force: true })
+
+      const dialog = page.getByRole("dialog")
+      await expect(dialog).toBeVisible()
+      await expect(dialog.getByRole("heading", { level: 2 })).toHaveText("Edit project")
+      return dialog
+    }
+
+    const name = `e2e project ${Date.now()}`
+    const startup = `echo e2e_${Date.now()}`
+
+    const dialog = await open()
+
+    const nameInput = dialog.getByLabel("Name")
+    await nameInput.fill(name)
+
+    const startupInput = dialog.getByLabel("Workspace startup script")
+    await startupInput.fill(startup)
+
+    await dialog.getByRole("button", { name: "Save" }).click()
+    await expect(dialog).toHaveCount(0)
+
+    const header = page.locator(".group\\/project").first()
+    await expect(header).toContainText(name)
+
+    const reopened = await open()
+    await expect(reopened.getByLabel("Name")).toHaveValue(name)
+    await expect(reopened.getByLabel("Workspace startup script")).toHaveValue(startup)
+    await reopened.getByRole("button", { name: "Cancel" }).click()
+    await expect(reopened).toHaveCount(0)
+  })
+})

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

@@ -0,0 +1,54 @@
+import { test, expect } from "../fixtures"
+import { createTestProject, cleanupTestProject, openSidebar, clickMenuItem, openProjectMenu } from "../actions"
+import { projectSwitchSelector } from "../selectors"
+import { dirSlug } from "../utils"
+
+test("closing active project navigates to another open project", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const otherSlug = dirSlug(other)
+
+  try {
+    await withProject(
+      async ({ slug }) => {
+        await openSidebar(page)
+
+        const otherButton = page.locator(projectSwitchSelector(otherSlug)).first()
+        await expect(otherButton).toBeVisible()
+        await otherButton.click()
+
+        await expect(page).toHaveURL(new RegExp(`/${otherSlug}/session`))
+
+        const menu = await openProjectMenu(page, otherSlug)
+
+        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 },
+          )
+          .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)
+      },
+      { extra: [other] },
+    )
+  } finally {
+    await cleanupTestProject(other)
+  }
+})

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

@@ -0,0 +1,116 @@
+import { base64Decode } from "@opencode-ai/util/encode"
+import { test, expect } from "../fixtures"
+import {
+  defocus,
+  createTestProject,
+  cleanupTestProject,
+  openSidebar,
+  sessionIDFromUrl,
+  setWorkspacesEnabled,
+  waitSession,
+  waitSessionSaved,
+  waitSlug,
+} from "../actions"
+import { projectSwitchSelector, promptSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors"
+import { dirSlug, resolveDirectory } from "../utils"
+
+test("can switch between projects from sidebar", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const otherSlug = dirSlug(other)
+
+  try {
+    await withProject(
+      async ({ directory }) => {
+        await defocus(page)
+
+        const currentSlug = dirSlug(directory)
+        const otherButton = page.locator(projectSwitchSelector(otherSlug)).first()
+        await expect(otherButton).toBeVisible()
+        await otherButton.click()
+
+        await expect(page).toHaveURL(new RegExp(`/${otherSlug}/session`))
+
+        const currentButton = page.locator(projectSwitchSelector(currentSlug)).first()
+        await expect(currentButton).toBeVisible()
+        await currentButton.click()
+
+        await expect(page).toHaveURL(new RegExp(`/${currentSlug}/session`))
+      },
+      { extra: [other] },
+    )
+  } finally {
+    await cleanupTestProject(other)
+  }
+})
+
+test("switching back to a project opens the latest workspace session", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const otherSlug = dirSlug(other)
+  try {
+    await withProject(
+      async ({ directory, slug, trackSession, trackDirectory }) => {
+        await defocus(page)
+        await setWorkspacesEnabled(page, slug, true)
+        await openSidebar(page)
+        await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()
+
+        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 openSidebar(page)
+
+        const item = page.locator(`${workspaceItemSelector(next)}, ${workspaceItemSelector(raw)}`).first()
+        await expect(item).toBeVisible()
+        await item.hover()
+
+        const btn = page.locator(`${workspaceNewSessionSelector(next)}, ${workspaceNewSessionSelector(raw)}`).first()
+        await expect(btn).toBeVisible()
+        await btn.click({ force: true })
+
+        await waitSession(page, { directory: space })
+
+        // Create a session by sending a prompt
+        const prompt = page.locator(promptSelector)
+        await expect(prompt).toBeVisible()
+        await prompt.fill("test")
+        await page.keyboard.press("Enter")
+
+        // Wait for the URL to update with the new session ID
+        await expect.poll(() => sessionIDFromUrl(page.url()) ?? "", { timeout: 15_000 }).not.toBe("")
+
+        const created = sessionIDFromUrl(page.url())
+        if (!created) throw new Error(`Failed to get session ID from url: ${page.url()}`)
+        trackSession(created, space)
+        await waitSessionSaved(space, created)
+
+        await expect(page).toHaveURL(new RegExp(`/${next}/session/${created}(?:[/?#]|$)`))
+
+        await openSidebar(page)
+
+        const otherButton = page.locator(projectSwitchSelector(otherSlug)).first()
+        await expect(otherButton).toBeVisible()
+        await otherButton.click({ force: true })
+        await waitSession(page, { directory: other })
+
+        const rootButton = page.locator(projectSwitchSelector(slug)).first()
+        await expect(rootButton).toBeVisible()
+        await rootButton.click({ force: true })
+
+        await waitSession(page, { directory: space, sessionID: created })
+        await expect(page).toHaveURL(new RegExp(`/session/${created}(?:[/?#]|$)`))
+      },
+      { extra: [other] },
+    )
+  } finally {
+    await cleanupTestProject(other)
+  }
+})

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

@@ -0,0 +1,94 @@
+import type { Page } from "@playwright/test"
+import { test, expect } from "../fixtures"
+import {
+  openSidebar,
+  resolveSlug,
+  sessionIDFromUrl,
+  setWorkspacesEnabled,
+  waitDir,
+  waitSession,
+  waitSessionSaved,
+  waitSlug,
+} from "../actions"
+import { promptSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors"
+import { createSdk } from "../utils"
+
+function item(space: { slug: string; raw: string }) {
+  return `${workspaceItemSelector(space.slug)}, ${workspaceItemSelector(space.raw)}`
+}
+
+function button(space: { slug: string; raw: string }) {
+  return `${workspaceNewSessionSelector(space.slug)}, ${workspaceNewSessionSelector(space.raw)}`
+}
+
+async function waitWorkspaceReady(page: Page, space: { slug: string; raw: string }) {
+  await openSidebar(page)
+  await expect(page.locator(item(space)).first()).toBeVisible({ timeout: 60_000 })
+}
+
+async function createWorkspace(page: Page, root: string, seen: string[]) {
+  await openSidebar(page)
+  await page.getByRole("button", { name: "New workspace" }).first().click()
+
+  const next = await resolveSlug(await waitSlug(page, [root, ...seen]))
+  await waitDir(page, next.directory)
+  return next
+}
+
+async function openWorkspaceNewSession(page: Page, space: { slug: string; raw: string; directory: string }) {
+  await waitWorkspaceReady(page, space)
+
+  const row = page.locator(item(space)).first()
+  await row.hover()
+
+  const next = page.locator(button(space)).first()
+  await expect(next).toBeVisible()
+  await next.click({ force: true })
+
+  await waitSession(page, { directory: space.directory })
+  await expect.poll(() => sessionIDFromUrl(page.url()) ?? "").toBe("")
+}
+
+async function createSessionFromWorkspace(
+  page: Page,
+  space: { slug: string; raw: string; directory: string },
+  text: string,
+) {
+  await openWorkspaceNewSession(page, space)
+
+  const prompt = page.locator(promptSelector)
+  await expect(prompt).toBeVisible()
+  await prompt.fill(text)
+  await page.keyboard.press("Enter")
+
+  await expect.poll(() => sessionIDFromUrl(page.url()) ?? "", { timeout: 15_000 }).not.toBe("")
+  const sessionID = sessionIDFromUrl(page.url())
+  if (!sessionID) throw new Error(`Failed to parse session id from url: ${page.url()}`)
+
+  await waitSessionSaved(space.directory, sessionID)
+  await createSdk(space.directory)
+    .session.abort({ sessionID })
+    .catch(() => undefined)
+  return sessionID
+}
+
+test("new sessions from sidebar workspace actions stay in selected workspace", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  await withProject(async ({ slug: root, trackDirectory, trackSession }) => {
+    await openSidebar(page)
+    await setWorkspacesEnabled(page, root, true)
+
+    const first = await createWorkspace(page, root, [])
+    trackDirectory(first.directory)
+    await waitWorkspaceReady(page, first)
+
+    const second = await createWorkspace(page, root, [first.slug])
+    trackDirectory(second.directory)
+    await waitWorkspaceReady(page, second)
+
+    trackSession(await createSessionFromWorkspace(page, first, `workspace one ${Date.now()}`), first.directory)
+    trackSession(await createSessionFromWorkspace(page, second, `workspace two ${Date.now()}`), second.directory)
+    trackSession(await createSessionFromWorkspace(page, first, `workspace one again ${Date.now()}`), first.directory)
+  })
+})

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

@@ -0,0 +1,375 @@
+import fs from "node:fs/promises"
+import os from "node:os"
+import path from "node:path"
+import { base64Decode } from "@opencode-ai/util/encode"
+import type { Page } from "@playwright/test"
+
+import { test, expect } from "../fixtures"
+
+test.describe.configure({ mode: "serial" })
+import {
+  cleanupTestProject,
+  clickMenuItem,
+  confirmDialog,
+  openSidebar,
+  openWorkspaceMenu,
+  resolveSlug,
+  setWorkspacesEnabled,
+  slugFromUrl,
+  waitDir,
+  waitSlug,
+} from "../actions"
+import { dropdownMenuContentSelector, inlineInputSelector, workspaceItemSelector } from "../selectors"
+import { createSdk, dirSlug } from "../utils"
+
+async function setupWorkspaceTest(page: Page, project: { slug: string }) {
+  const rootSlug = project.slug
+  await openSidebar(page)
+
+  await setWorkspacesEnabled(page, rootSlug, true)
+
+  await page.getByRole("button", { name: "New workspace" }).first().click()
+  const next = await resolveSlug(await waitSlug(page, [rootSlug]))
+  await waitDir(page, next.directory)
+
+  await openSidebar(page)
+
+  await expect
+    .poll(
+      async () => {
+        const item = page.locator(workspaceItemSelector(next.slug)).first()
+        try {
+          await item.hover({ timeout: 500 })
+          return true
+        } catch {
+          return false
+        }
+      },
+      { timeout: 60_000 },
+    )
+    .toBe(true)
+
+  return { rootSlug, slug: next.slug, directory: next.directory }
+}
+
+test("can enable and disable workspaces from project menu", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  await withProject(async ({ slug }) => {
+    await openSidebar(page)
+
+    await expect(page.getByRole("button", { name: "New session" }).first()).toBeVisible()
+    await expect(page.getByRole("button", { name: "New workspace" })).toHaveCount(0)
+
+    await setWorkspacesEnabled(page, slug, true)
+    await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()
+    await expect(page.locator(workspaceItemSelector(slug)).first()).toBeVisible()
+
+    await setWorkspacesEnabled(page, slug, false)
+    await expect(page.getByRole("button", { name: "New session" }).first()).toBeVisible()
+    await expect(page.locator(workspaceItemSelector(slug))).toHaveCount(0)
+  })
+})
+
+test("can create a workspace", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  await withProject(async ({ slug }) => {
+    await openSidebar(page)
+    await setWorkspacesEnabled(page, slug, true)
+
+    await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()
+
+    await page.getByRole("button", { name: "New workspace" }).first().click()
+    const next = await resolveSlug(await waitSlug(page, [slug]))
+    await waitDir(page, next.directory)
+
+    await openSidebar(page)
+
+    await expect
+      .poll(
+        async () => {
+          const item = page.locator(workspaceItemSelector(next.slug)).first()
+          try {
+            await item.hover({ timeout: 500 })
+            return true
+          } catch {
+            return false
+          }
+        },
+        { timeout: 60_000 },
+      )
+      .toBe(true)
+
+    await expect(page.locator(workspaceItemSelector(next.slug)).first()).toBeVisible()
+
+    await cleanupTestProject(next.directory)
+  })
+})
+
+test("non-git projects keep workspace mode disabled", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const nonGit = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-project-nongit-"))
+  const nonGitSlug = dirSlug(nonGit)
+
+  await fs.writeFile(path.join(nonGit, "README.md"), "# e2e nongit\n")
+
+  try {
+    await withProject(async () => {
+      await page.goto(`/${nonGitSlug}/session`)
+
+      await expect.poll(() => slugFromUrl(page.url()), { timeout: 30_000 }).not.toBe("")
+
+      const activeDir = await resolveSlug(slugFromUrl(page.url())).then((item) => item.directory)
+      expect(path.basename(activeDir)).toContain("opencode-e2e-project-nongit-")
+
+      await openSidebar(page)
+      await expect(page.getByRole("button", { name: "New workspace" })).toHaveCount(0)
+
+      const trigger = page.locator('[data-action="project-menu"]').first()
+      const hasMenu = await trigger
+        .isVisible()
+        .then((x) => x)
+        .catch(() => false)
+      if (!hasMenu) return
+
+      await trigger.click({ force: true })
+
+      const menu = page.locator(dropdownMenuContentSelector).first()
+      await expect(menu).toBeVisible()
+
+      const toggle = menu.locator('[data-action="project-workspaces-toggle"]').first()
+
+      await expect(toggle).toBeVisible()
+      await expect(toggle).toBeDisabled()
+      await expect(menu.getByRole("menuitem", { name: "New workspace" })).toHaveCount(0)
+    })
+  } finally {
+    await cleanupTestProject(nonGit)
+  }
+})
+
+test("can rename a workspace", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  await withProject(async (project) => {
+    const { slug } = await setupWorkspaceTest(page, project)
+
+    const rename = `e2e workspace ${Date.now()}`
+    const menu = await openWorkspaceMenu(page, slug)
+    await clickMenuItem(menu, /^Rename$/i, { force: true })
+
+    await expect(menu).toHaveCount(0)
+
+    const item = page.locator(workspaceItemSelector(slug)).first()
+    await expect(item).toBeVisible()
+    const input = item.locator(inlineInputSelector).first()
+    await expect(input).toBeVisible()
+    await input.fill(rename)
+    await input.press("Enter")
+    await expect(item).toContainText(rename)
+  })
+})
+
+test("can reset a workspace", async ({ page, sdk, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  await withProject(async (project) => {
+    const { slug, directory: createdDir } = await setupWorkspaceTest(page, project)
+
+    const readme = path.join(createdDir, "README.md")
+    const extra = path.join(createdDir, `e2e_reset_${Date.now()}.txt`)
+    const original = await fs.readFile(readme, "utf8")
+    const dirty = `${original.trimEnd()}\n\nchange_${Date.now()}\n`
+    await fs.writeFile(readme, dirty, "utf8")
+    await fs.writeFile(extra, `created_${Date.now()}\n`, "utf8")
+
+    await expect
+      .poll(async () => {
+        return await fs
+          .stat(extra)
+          .then(() => true)
+          .catch(() => false)
+      })
+      .toBe(true)
+
+    await expect
+      .poll(async () => {
+        const files = await sdk.file
+          .status({ directory: createdDir })
+          .then((r) => r.data ?? [])
+          .catch(() => [])
+        return files.length
+      })
+      .toBeGreaterThan(0)
+
+    const menu = await openWorkspaceMenu(page, slug)
+    await clickMenuItem(menu, /^Reset$/i, { force: true })
+    await confirmDialog(page, /^Reset workspace$/i)
+
+    await expect
+      .poll(
+        async () => {
+          const files = await sdk.file
+            .status({ directory: createdDir })
+            .then((r) => r.data ?? [])
+            .catch(() => [])
+          return files.length
+        },
+        { timeout: 60_000 },
+      )
+      .toBe(0)
+
+    await expect.poll(() => fs.readFile(readme, "utf8"), { timeout: 60_000 }).toBe(original)
+
+    await expect
+      .poll(async () => {
+        return await fs
+          .stat(extra)
+          .then(() => true)
+          .catch(() => false)
+      })
+      .toBe(false)
+  })
+})
+
+test("can delete a workspace", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  await withProject(async (project) => {
+    const sdk = createSdk(project.directory)
+    const { rootSlug, slug, directory } = await setupWorkspaceTest(page, project)
+
+    await expect
+      .poll(
+        async () => {
+          const worktrees = await sdk.worktree
+            .list()
+            .then((r) => r.data ?? [])
+            .catch(() => [] as string[])
+          return worktrees.includes(directory)
+        },
+        { timeout: 30_000 },
+      )
+      .toBe(true)
+
+    const menu = await openWorkspaceMenu(page, slug)
+    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
+      .poll(
+        async () => {
+          const worktrees = await sdk.worktree
+            .list()
+            .then((r) => r.data ?? [])
+            .catch(() => [] as string[])
+          return worktrees.includes(directory)
+        },
+        { timeout: 60_000 },
+      )
+      .toBe(false)
+
+    await project.gotoSession()
+
+    await openSidebar(page)
+    await expect(page.locator(workspaceItemSelector(slug))).toHaveCount(0, { timeout: 60_000 })
+    await expect(page.locator(workspaceItemSelector(rootSlug)).first()).toBeVisible()
+  })
+})
+
+test("can reorder workspaces by drag and drop", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+  await withProject(async ({ slug: rootSlug }) => {
+    const workspaces = [] as { directory: string; slug: string }[]
+
+    const listSlugs = async () => {
+      const nodes = page.locator('[data-component="sidebar-nav-desktop"] [data-component="workspace-item"]')
+      const slugs = await nodes.evaluateAll((els) => {
+        return els.map((el) => el.getAttribute("data-workspace") ?? "").filter((x) => x.length > 0)
+      })
+      return slugs
+    }
+
+    const waitReady = async (slug: string) => {
+      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)
+    }
+
+    const drag = async (from: string, to: string) => {
+      const src = page.locator(workspaceItemSelector(from)).first()
+      const dst = page.locator(workspaceItemSelector(to)).first()
+
+      const a = await src.boundingBox()
+      const b = await dst.boundingBox()
+      if (!a || !b) throw new Error("Failed to resolve workspace drag bounds")
+
+      await page.mouse.move(a.x + a.width / 2, a.y + a.height / 2)
+      await page.mouse.down()
+      await page.mouse.move(b.x + b.width / 2, b.y + b.height / 2, { steps: 12 })
+      await page.mouse.up()
+    }
+
+    try {
+      await openSidebar(page)
+
+      await setWorkspacesEnabled(page, rootSlug, true)
+
+      for (const _ of [0, 1]) {
+        const prev = slugFromUrl(page.url())
+        await page.getByRole("button", { name: "New workspace" }).first().click()
+        const next = await resolveSlug(await waitSlug(page, [rootSlug, prev]))
+        await waitDir(page, next.directory)
+        workspaces.push(next)
+
+        await openSidebar(page)
+      }
+
+      if (workspaces.length !== 2) throw new Error("Expected two created workspaces")
+
+      const a = workspaces[0].slug
+      const b = workspaces[1].slug
+
+      await waitReady(a)
+      await waitReady(b)
+
+      const list = async () => {
+        const slugs = await listSlugs()
+        return slugs.filter((s) => s !== rootSlug && (s === a || s === b)).slice(0, 2)
+      }
+
+      await expect
+        .poll(async () => {
+          const slugs = await list()
+          return slugs.length === 2
+        })
+        .toBe(true)
+
+      const before = await list()
+      const from = before[1]
+      const to = before[0]
+      if (!from || !to) throw new Error("Failed to resolve initial workspace order")
+
+      await drag(from, to)
+
+      await expect.poll(async () => await list()).toEqual([from, to])
+    } finally {
+      await Promise.all(workspaces.map((w) => cleanupTestProject(w.directory)))
+    }
+  })
+})

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

@@ -0,0 +1,95 @@
+import { test, expect } from "../fixtures"
+import type { Page } from "@playwright/test"
+import { promptSelector } from "../selectors"
+import { withSession } from "../actions"
+
+function contextButton(page: Page) {
+  return page
+    .locator('[data-component="button"]')
+    .filter({ has: page.locator('[data-component="progress-circle"]').first() })
+    .first()
+}
+
+async function seedContextSession(input: { sessionID: string; sdk: Parameters<typeof withSession>[0] }) {
+  await input.sdk.session.promptAsync({
+    sessionID: input.sessionID,
+    noReply: true,
+    parts: [
+      {
+        type: "text",
+        text: "seed context",
+      },
+    ],
+  })
+
+  await expect
+    .poll(async () => {
+      const messages = await input.sdk.session
+        .messages({ sessionID: input.sessionID, limit: 1 })
+        .then((r) => r.data ?? [])
+      return messages.length
+    })
+    .toBeGreaterThan(0)
+}
+
+test("context panel can be opened from the prompt", async ({ page, sdk, gotoSession }) => {
+  const title = `e2e smoke context ${Date.now()}`
+
+  await withSession(sdk, title, async (session) => {
+    await seedContextSession({ sessionID: session.id, sdk })
+
+    await gotoSession(session.id)
+
+    const trigger = contextButton(page)
+    await expect(trigger).toBeVisible()
+    await trigger.click()
+
+    const tabs = page.locator('[data-component="tabs"][data-variant="normal"]')
+    await expect(tabs.getByRole("tab", { name: "Context" })).toBeVisible()
+  })
+})
+
+test("context panel can be closed from the context tab close action", async ({ page, sdk, gotoSession }) => {
+  await withSession(sdk, `e2e context toggle ${Date.now()}`, async (session) => {
+    await seedContextSession({ sessionID: session.id, sdk })
+    await gotoSession(session.id)
+
+    await page.locator(promptSelector).click()
+
+    const trigger = contextButton(page)
+    await expect(trigger).toBeVisible()
+    await trigger.click()
+
+    const tabs = page.locator('[data-component="tabs"][data-variant="normal"]')
+    const context = tabs.getByRole("tab", { name: "Context" })
+    await expect(context).toBeVisible()
+
+    await page.getByRole("button", { name: "Close tab" }).first().click()
+    await expect(context).toHaveCount(0)
+  })
+})
+
+test("context panel can open file picker from context actions", async ({ page, sdk, gotoSession }) => {
+  await withSession(sdk, `e2e context tabs ${Date.now()}`, async (session) => {
+    await seedContextSession({ sessionID: session.id, sdk })
+    await gotoSession(session.id)
+
+    await page.locator(promptSelector).click()
+
+    const trigger = contextButton(page)
+    await expect(trigger).toBeVisible()
+    await trigger.click()
+
+    await expect(page.getByRole("tab", { name: "Context" })).toBeVisible()
+    await page.getByRole("button", { name: "Open file" }).first().click()
+
+    const dialog = page
+      .getByRole("dialog")
+      .filter({ has: page.getByPlaceholder(/search files/i) })
+      .first()
+    await expect(dialog).toBeVisible()
+
+    await page.keyboard.press("Escape")
+    await expect(dialog).toHaveCount(0)
+  })
+})

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

@@ -0,0 +1,76 @@
+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()
+
+// Regression test for Issue #12453: the synchronous POST /message endpoint holds
+// the connection open while the agent works, causing "Failed to fetch" over
+// VPN/Tailscale. The fix switches to POST /prompt_async which returns immediately.
+test("prompt succeeds when sync message endpoint is unreachable", async ({ page, sdk, gotoSession }) => {
+  test.setTimeout(120_000)
+
+  // Simulate Tailscale/VPN killing the long-lived sync connection
+  await page.route("**/session/*/message", (route) => route.abort("connectionfailed"))
+
+  await gotoSession()
+
+  const token = `E2E_ASYNC_${Date.now()}`
+  await page.locator(promptSelector).click()
+  await page.keyboard.type(`Reply with exactly: ${token}`)
+  await page.keyboard.press("Enter")
+
+  await expect(page).toHaveURL(/\/session\/[^/?#]+/, { timeout: 30_000 })
+  const sessionID = sessionIDFromUrl(page.url())!
+
+  try {
+    // Agent response arrives via SSE despite sync endpoint being dead
+    await expect
+      .poll(
+        async () => {
+          const messages = await sdk.session.messages({ sessionID, limit: 50 }).then((r) => r.data ?? [])
+          return messages
+            .filter((m) => m.info.role === "assistant")
+            .flatMap((m) => m.parts)
+            .filter((p) => p.type === "text")
+            .map((p) => p.text)
+            .join("\n")
+        },
+        { timeout: 90_000 },
+      )
+      .toContain(token)
+  } finally {
+    await cleanupSession({ sdk, sessionID })
+  }
+})
+
+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-drop-file-uri.spec.ts

@@ -0,0 +1,22 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+
+test("dropping text/plain file: uri inserts a file pill", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const prompt = page.locator(promptSelector)
+  await prompt.click()
+
+  const path = process.platform === "win32" ? "C:\\opencode-e2e-drop.txt" : "/tmp/opencode-e2e-drop.txt"
+  const dt = await page.evaluateHandle((text) => {
+    const dt = new DataTransfer()
+    dt.setData("text/plain", text)
+    return dt
+  }, `file:${path}`)
+
+  await page.dispatchEvent("body", "drop", { dataTransfer: dt })
+
+  const pill = page.locator(`${promptSelector} [data-type="file"]`).first()
+  await expect(pill).toBeVisible()
+  await expect(pill).toHaveAttribute("data-path", path)
+})

packages/app/e2e/prompt/prompt-drop-file.spec.ts

@@ -0,0 +1,30 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+
+test("dropping an image file adds an attachment", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const prompt = page.locator(promptSelector)
+  await prompt.click()
+
+  const png = "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO3+4uQAAAAASUVORK5CYII="
+  const dt = await page.evaluateHandle((b64) => {
+    const dt = new DataTransfer()
+    const bytes = Uint8Array.from(atob(b64), (c) => c.charCodeAt(0))
+    const file = new File([bytes], "drop.png", { type: "image/png" })
+    dt.items.add(file)
+    return dt
+  }, png)
+
+  await page.dispatchEvent("body", "drop", { dataTransfer: dt })
+
+  const img = page.locator('img[alt="drop.png"]').first()
+  await expect(img).toBeVisible()
+
+  const remove = page.getByRole("button", { name: "Remove attachment" }).first()
+  await expect(remove).toBeVisible()
+
+  await img.hover()
+  await remove.click()
+  await expect(page.locator('img[alt="drop.png"]')).toHaveCount(0)
+})

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

@@ -0,0 +1,184 @@
+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)
+
+    // Clear the draft before navigating history (ArrowUp only works when prompt is empty)
+    await prompt.fill("")
+    await wait(page, "")
+
+    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, "")
+  })
+})
+
+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-mention.spec.ts

@@ -0,0 +1,26 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+
+test("smoke @mention inserts file pill token", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.locator(promptSelector).click()
+  const sep = process.platform === "win32" ? "\\" : "/"
+  const file = ["packages", "app", "package.json"].join(sep)
+  const filePattern = /packages[\\/]+app[\\/]+\s*package\.json/
+
+  await page.keyboard.type(`@${file}`)
+
+  const suggestion = page.getByRole("button", { name: filePattern }).first()
+  await expect(suggestion).toBeVisible()
+  await suggestion.hover()
+
+  await page.keyboard.press("Tab")
+
+  const pill = page.locator(`${promptSelector} [data-type="file"]`).first()
+  await expect(pill).toBeVisible()
+  await expect(pill).toHaveAttribute("data-path", filePattern)
+
+  await page.keyboard.type(" ok")
+  await expect(page.locator(promptSelector)).toContainText("ok")
+})

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

@@ -0,0 +1,24 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+
+test("shift+enter inserts a newline without submitting", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await expect(page).toHaveURL(/\/session\/?$/)
+
+  const prompt = page.locator(promptSelector)
+  await prompt.focus()
+  await expect(prompt).toBeFocused()
+
+  await prompt.pressSequentially("line one")
+  await expect(prompt).toBeFocused()
+
+  await prompt.press("Shift+Enter")
+  await expect(page).toHaveURL(/\/session\/?$/)
+  await expect(prompt).toBeFocused()
+
+  await prompt.pressSequentially("line two")
+
+  await expect(page).toHaveURL(/\/session\/?$/)
+  await expect.poll(() => prompt.evaluate((el) => el.innerText)).toBe("line one\nline two")
+})

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

@@ -0,0 +1,62 @@
+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-open.spec.ts

@@ -0,0 +1,22 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+
+test("smoke /open opens file picker dialog", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/open")
+
+  const command = page.locator('[data-slash-id="file.open"]')
+  await expect(command).toBeVisible()
+  await command.hover()
+
+  await page.keyboard.press("Enter")
+
+  const dialog = page.getByRole("dialog")
+  await expect(dialog).toBeVisible()
+  await expect(dialog.getByRole("textbox").first()).toBeVisible()
+
+  await page.keyboard.press("Escape")
+  await expect(dialog).toHaveCount(0)
+})

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

@@ -0,0 +1,64 @@
+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

@@ -0,0 +1,18 @@
+import { test, expect } from "../fixtures"
+import { runPromptSlash, waitTerminalFocusIdle } from "../actions"
+import { promptSelector, terminalSelector } from "../selectors"
+
+test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const prompt = page.locator(promptSelector)
+  const terminal = page.locator(terminalSelector)
+
+  await expect(terminal).not.toBeVisible()
+
+  await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" })
+  await waitTerminalFocusIdle(page, { term: terminal })
+
+  await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" })
+  await expect(terminal).not.toBeVisible()
+})

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

@@ -0,0 +1,55 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { cleanupSession, sessionIDFromUrl, withSession } from "../actions"
+
+test("can send a prompt and receive a reply", async ({ page, sdk, gotoSession }) => {
+  test.setTimeout(120_000)
+
+  const pageErrors: string[] = []
+  const onPageError = (err: Error) => {
+    pageErrors.push(err.message)
+  }
+  page.on("pageerror", onPageError)
+
+  await gotoSession()
+
+  const token = `E2E_OK_${Date.now()}`
+
+  const prompt = page.locator(promptSelector)
+  await prompt.click()
+  await page.keyboard.type(`Reply with exactly: ${token}`)
+  await page.keyboard.press("Enter")
+
+  await expect(page).toHaveURL(/\/session\/[^/?#]+/, { timeout: 30_000 })
+
+  const sessionID = (() => {
+    const id = sessionIDFromUrl(page.url())
+    if (!id) throw new Error(`Failed to parse session id from url: ${page.url()}`)
+    return id
+  })()
+
+  try {
+    await expect
+      .poll(
+        async () => {
+          const messages = await sdk.session.messages({ sessionID, limit: 50 }).then((r) => r.data ?? [])
+          return messages
+            .filter((m) => m.info.role === "assistant")
+            .flatMap((m) => m.parts)
+            .filter((p) => p.type === "text")
+            .map((p) => p.text)
+            .join("\n")
+        },
+        { timeout: 90_000 },
+      )
+
+      .toContain(token)
+  } finally {
+    page.off("pageerror", onPageError)
+    await cleanupSession({ sdk, sessionID })
+  }
+
+  if (pageErrors.length > 0) {
+    throw new Error(`Page error(s):\n${pageErrors.join("\n")}`)
+  }
+})

packages/app/e2e/selectors.ts

@@ -0,0 +1,75 @@
+export const promptSelector = '[data-component="prompt-input"]'
+export const terminalPanelSelector = '#terminal-panel[aria-hidden="false"]'
+export const terminalSelector = `${terminalPanelSelector} [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"]'
+export const permissionRejectSelector = `${permissionDockSelector} [data-slot="permission-footer-actions"] [data-component="button"]:nth-child(1)`
+export const permissionAllowAlwaysSelector = `${permissionDockSelector} [data-slot="permission-footer-actions"] [data-component="button"]:nth-child(2)`
+export const permissionAllowOnceSelector = `${permissionDockSelector} [data-slot="permission-footer-actions"] [data-component="button"]:nth-child(3)`
+export const sessionTodoDockSelector = '[data-component="session-todo-dock"]'
+export const sessionTodoToggleSelector = '[data-action="session-todo-toggle"]'
+export const sessionTodoToggleButtonSelector = '[data-action="session-todo-toggle-button"]'
+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"]'
+export const settingsFontSelector = '[data-action="settings-font"]'
+export const settingsNotificationsAgentSelector = '[data-action="settings-notifications-agent"]'
+export const settingsNotificationsPermissionsSelector = '[data-action="settings-notifications-permissions"]'
+export const settingsNotificationsErrorsSelector = '[data-action="settings-notifications-errors"]'
+export const settingsSoundsAgentSelector = '[data-action="settings-sounds-agent"]'
+export const settingsSoundsPermissionsSelector = '[data-action="settings-sounds-permissions"]'
+export const settingsSoundsErrorsSelector = '[data-action="settings-sounds-errors"]'
+export const settingsUpdatesStartupSelector = '[data-action="settings-updates-startup"]'
+export const settingsReleaseNotesSelector = '[data-action="settings-release-notes"]'
+
+export const sidebarNavSelector = '[data-component="sidebar-nav-desktop"]'
+
+export const projectSwitchSelector = (slug: string) =>
+  `${sidebarNavSelector} [data-action="project-switch"][data-project="${slug}"]`
+
+export const projectMenuTriggerSelector = (slug: string) =>
+  `${sidebarNavSelector} [data-action="project-menu"][data-project="${slug}"]`
+
+export const projectCloseMenuSelector = (slug: string) => `[data-action="project-close-menu"][data-project="${slug}"]`
+
+export const projectClearNotificationsSelector = (slug: string) =>
+  `[data-action="project-clear-notifications"][data-project="${slug}"]`
+
+export const projectWorkspacesToggleSelector = (slug: string) =>
+  `[data-action="project-workspaces-toggle"][data-project="${slug}"]`
+
+export const titlebarRightSelector = "#opencode-titlebar-right"
+
+export const popoverBodySelector = '[data-slot="popover-body"]'
+
+export const dropdownMenuTriggerSelector = '[data-slot="dropdown-menu-trigger"]'
+
+export const dropdownMenuContentSelector = '[data-component="dropdown-menu-content"]'
+
+export const inlineInputSelector = '[data-component="inline-input"]'
+
+export const sessionItemSelector = (sessionID: string) => `${sidebarNavSelector} [data-session-id="${sessionID}"]`
+
+export const workspaceItemSelector = (slug: string) =>
+  `${sidebarNavSelector} [data-component="workspace-item"][data-workspace="${slug}"]`
+
+export const workspaceMenuTriggerSelector = (slug: string) =>
+  `${sidebarNavSelector} [data-action="workspace-menu"][data-workspace="${slug}"]`
+
+export const workspaceNewSessionSelector = (slug: string) =>
+  `${sidebarNavSelector} [data-action="workspace-new-session"][data-workspace="${slug}"]`
+
+export const listItemSelector = '[data-slot="list-item"]'
+
+export const listItemKeyStartsWithSelector = (prefix: string) => `${listItemSelector}[data-key^="${prefix}"]`
+
+export const listItemKeySelector = (key: string) => `${listItemSelector}[data-key="${key}"]`
+
+export const keybindButtonSelector = (id: string) => `[data-keybind-id="${id}"]`

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

@@ -0,0 +1,37 @@
+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

@@ -0,0 +1,530 @@
+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 {
+  permissionDockSelector,
+  promptSelector,
+  questionDockSelector,
+  sessionComposerDockSelector,
+  sessionTodoToggleButtonSelector,
+} from "../selectors"
+
+type Sdk = Parameters<typeof clearSessionDockSeed>[0]
+type PermissionRule = { permission: string; pattern: string; action: "allow" | "deny" | "ask" }
+
+async function withDockSession<T>(
+  sdk: Sdk,
+  title: string,
+  fn: (session: { id: string; title: string }) => Promise<T>,
+  opts?: { permission?: PermissionRule[] },
+) {
+  const session = await sdk.session
+    .create(opts?.permission ? { title, permission: opts.permission } : { title })
+    .then((r) => r.data)
+  if (!session?.id) throw new Error("Session create did not return an id")
+  try {
+    return await fn(session)
+  } finally {
+    await cleanupSession({ sdk, sessionID: session.id })
+  }
+}
+
+test.setTimeout(120_000)
+
+async function withDockSeed<T>(sdk: Sdk, sessionID: string, fn: () => Promise<T>) {
+  try {
+    return await fn()
+  } finally {
+    await clearSessionDockSeed(sdk, sessionID).catch(() => undefined)
+  }
+}
+
+async function clearPermissionDock(page: any, label: RegExp) {
+  const dock = page.locator(permissionDockSelector)
+  await expect(dock).toBeVisible()
+  await dock.getByRole("button", { name: label }).click()
+}
+
+async function setAutoAccept(page: any, enabled: boolean) {
+  const button = page.locator('[data-action="prompt-permissions"]').first()
+  await expect(button).toBeVisible()
+  const pressed = (await button.getAttribute("aria-pressed")) === "true"
+  if (pressed === enabled) return
+  await button.click()
+  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: {
+    id: string
+    sessionID: string
+    permission: string
+    patterns: string[]
+    metadata?: Record<string, unknown>
+    always?: string[]
+  },
+  opts: { child?: any } | undefined,
+  fn: (state: { resolved: () => Promise<void> }) => Promise<T>,
+) {
+  let pending = [
+    {
+      ...request,
+      always: request.always ?? ["*"],
+      metadata: request.metadata ?? {},
+    },
+  ]
+
+  const list = async (route: any) => {
+    await route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify(pending),
+    })
+  }
+
+  const reply = async (route: any) => {
+    const url = new URL(route.request().url())
+    const id = url.pathname.split("/").pop()
+    pending = pending.filter((item) => item.id !== id)
+    await route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify(true),
+    })
+  }
+
+  await page.route("**/permission", list)
+  await page.route("**/session/*/permissions/*", reply)
+
+  const sessionList = opts?.child
+    ? async (route: any) => {
+        const res = await route.fetch()
+        const json = await res.json()
+        const list = Array.isArray(json) ? json : Array.isArray(json?.data) ? json.data : undefined
+        if (Array.isArray(list) && !list.some((item) => item?.id === opts.child?.id)) list.push(opts.child)
+        await route.fulfill({
+          status: res.status(),
+          headers: res.headers(),
+          contentType: "application/json",
+          body: JSON.stringify(json),
+        })
+      }
+    : undefined
+
+  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)
+  } finally {
+    await page.unroute("**/permission", list)
+    await page.unroute("**/session/*/permissions/*", reply)
+    if (sessionList) await page.unroute("**/session?*", sessionList)
+  }
+}
+
+test("default dock shows prompt input", async ({ page, sdk, gotoSession }) => {
+  await withDockSession(sdk, "e2e composer dock default", async (session) => {
+    await gotoSession(session.id)
+
+    await expect(page.locator(sessionComposerDockSelector)).toBeVisible()
+    await expect(page.locator(promptSelector)).toBeVisible()
+    await expect(page.locator(questionDockSelector)).toHaveCount(0)
+    await expect(page.locator(permissionDockSelector)).toHaveCount(0)
+
+    await page.locator(promptSelector).click()
+    await expect(page.locator(promptSelector)).toBeFocused()
+  })
+})
+
+test("auto-accept toggle works before first submit", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const button = page.locator('[data-action="prompt-permissions"]').first()
+  await expect(button).toBeVisible()
+  await expect(button).toHaveAttribute("aria-pressed", "false")
+
+  await setAutoAccept(page, true)
+  await setAutoAccept(page, false)
+})
+
+test("blocked question flow unblocks after submit", async ({ page, sdk, gotoSession }) => {
+  await withDockSession(sdk, "e2e composer dock question", async (session) => {
+    await withDockSeed(sdk, session.id, async () => {
+      await gotoSession(session.id)
+
+      await seedSessionQuestion(sdk, {
+        sessionID: session.id,
+        questions: [
+          {
+            header: "Need input",
+            question: "Pick one option",
+            options: [
+              { label: "Continue", description: "Continue now" },
+              { label: "Stop", description: "Stop here" },
+            ],
+          },
+        ],
+      })
+
+      const dock = page.locator(questionDockSelector)
+      await expectQuestionBlocked(page)
+
+      await dock.locator('[data-slot="question-option"]').first().click()
+      await dock.getByRole("button", { name: /submit/i }).click()
+
+      await expectQuestionOpen(page)
+    })
+  })
+})
+
+test("blocked permission flow supports allow once", async ({ page, sdk, gotoSession }) => {
+  await withDockSession(sdk, "e2e composer dock permission once", async (session) => {
+    await gotoSession(session.id)
+    await setAutoAccept(page, false)
+    await withMockPermission(
+      page,
+      {
+        id: "per_e2e_once",
+        sessionID: session.id,
+        permission: "bash",
+        patterns: ["/tmp/opencode-e2e-perm-once"],
+        metadata: { description: "Need permission for command" },
+      },
+      undefined,
+      async (state) => {
+        await page.goto(page.url())
+        await expectPermissionBlocked(page)
+
+        await clearPermissionDock(page, /allow once/i)
+        await state.resolved()
+        await page.goto(page.url())
+        await expectPermissionOpen(page)
+      },
+    )
+  })
+})
+
+test("blocked permission flow supports reject", async ({ page, sdk, gotoSession }) => {
+  await withDockSession(sdk, "e2e composer dock permission reject", async (session) => {
+    await gotoSession(session.id)
+    await setAutoAccept(page, false)
+    await withMockPermission(
+      page,
+      {
+        id: "per_e2e_reject",
+        sessionID: session.id,
+        permission: "bash",
+        patterns: ["/tmp/opencode-e2e-perm-reject"],
+      },
+      undefined,
+      async (state) => {
+        await page.goto(page.url())
+        await expectPermissionBlocked(page)
+
+        await clearPermissionDock(page, /deny/i)
+        await state.resolved()
+        await page.goto(page.url())
+        await expectPermissionOpen(page)
+      },
+    )
+  })
+})
+
+test("blocked permission flow supports allow always", async ({ page, sdk, gotoSession }) => {
+  await withDockSession(sdk, "e2e composer dock permission always", async (session) => {
+    await gotoSession(session.id)
+    await setAutoAccept(page, false)
+    await withMockPermission(
+      page,
+      {
+        id: "per_e2e_always",
+        sessionID: session.id,
+        permission: "bash",
+        patterns: ["/tmp/opencode-e2e-perm-always"],
+        metadata: { description: "Need permission for command" },
+      },
+      undefined,
+      async (state) => {
+        await page.goto(page.url())
+        await expectPermissionBlocked(page)
+
+        await clearPermissionDock(page, /allow always/i)
+        await state.resolved()
+        await page.goto(page.url())
+        await expectPermissionOpen(page)
+      },
+    )
+  })
+})
+
+test("child session question request blocks parent dock and unblocks after submit", async ({
+  page,
+  sdk,
+  gotoSession,
+}) => {
+  await withDockSession(sdk, "e2e composer dock child question parent", async (session) => {
+    await gotoSession(session.id)
+
+    const child = await sdk.session
+      .create({
+        title: "e2e composer dock child question",
+        parentID: session.id,
+      })
+      .then((r) => r.data)
+    if (!child?.id) throw new Error("Child session create did not return an id")
+
+    try {
+      await withDockSeed(sdk, child.id, async () => {
+        await seedSessionQuestion(sdk, {
+          sessionID: child.id,
+          questions: [
+            {
+              header: "Child input",
+              question: "Pick one child option",
+              options: [
+                { label: "Continue", description: "Continue child" },
+                { label: "Stop", description: "Stop child" },
+              ],
+            },
+          ],
+        })
+
+        const dock = page.locator(questionDockSelector)
+        await expectQuestionBlocked(page)
+
+        await dock.locator('[data-slot="question-option"]').first().click()
+        await dock.getByRole("button", { name: /submit/i }).click()
+
+        await expectQuestionOpen(page)
+      })
+    } finally {
+      await cleanupSession({ sdk, sessionID: child.id })
+    }
+  })
+})
+
+test("child session permission request blocks parent dock and supports allow once", async ({
+  page,
+  sdk,
+  gotoSession,
+}) => {
+  await withDockSession(sdk, "e2e composer dock child permission parent", async (session) => {
+    await gotoSession(session.id)
+    await setAutoAccept(page, false)
+
+    const child = await sdk.session
+      .create({
+        title: "e2e composer dock child permission",
+        parentID: session.id,
+      })
+      .then((r) => r.data)
+    if (!child?.id) throw new Error("Child session create did not return an id")
+
+    try {
+      await withMockPermission(
+        page,
+        {
+          id: "per_e2e_child",
+          sessionID: child.id,
+          permission: "bash",
+          patterns: ["/tmp/opencode-e2e-perm-child"],
+          metadata: { description: "Need child permission" },
+        },
+        { child },
+        async (state) => {
+          await page.goto(page.url())
+          await expectPermissionBlocked(page)
+
+          await clearPermissionDock(page, /allow once/i)
+          await state.resolved()
+          await page.goto(page.url())
+
+          await expectPermissionOpen(page)
+        },
+      )
+    } finally {
+      await cleanupSession({ sdk, sessionID: child.id })
+    }
+  })
+})
+
+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()
+
+    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 dock.collapse()
+      await dock.expectCollapsed(["pending", "in_progress"])
+
+      await dock.expand()
+      await dock.expectOpen(["pending", "in_progress"])
+
+      await dock.finish([
+        { content: "first task", status: "completed", priority: "high" },
+        { content: "second task", status: "cancelled", priority: "medium" },
+      ])
+      await dock.expectClosed()
+    } finally {
+      await dock.clear()
+    }
+  })
+})
+
+test("keyboard focus stays off prompt while blocked", async ({ page, sdk, gotoSession }) => {
+  await withDockSession(sdk, "e2e composer dock keyboard", async (session) => {
+    await withDockSeed(sdk, session.id, async () => {
+      await gotoSession(session.id)
+
+      await seedSessionQuestion(sdk, {
+        sessionID: session.id,
+        questions: [
+          {
+            header: "Need input",
+            question: "Pick one option",
+            options: [{ label: "Continue", description: "Continue now" }],
+          },
+        ],
+      })
+
+      await expectQuestionBlocked(page)
+
+      await page.locator("main").click({ position: { x: 5, y: 5 } })
+      await page.keyboard.type("abc")
+      await expect(page.locator(promptSelector)).toHaveCount(0)
+    })
+  })
+})

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

@@ -0,0 +1,359 @@
+import type { Locator, Page } from "@playwright/test"
+import { test, expect } from "../fixtures"
+import {
+  openSidebar,
+  resolveSlug,
+  sessionIDFromUrl,
+  setWorkspacesEnabled,
+  waitSession,
+  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)
+
+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 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 waitSession(page, { directory, sessionID })
+}
+
+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 next = await resolveSlug(await waitSlug(page, [root, ...seen]))
+  await waitSession(page, { directory: next.directory })
+  return next
+}
+
+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 resolveSlug(await waitSlug(page))
+  return waitSession(page, { directory: next.directory }).then((item) => item.directory)
+}
+
+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 waitSession(page, { directory, sessionID: first })
+    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)
+  })
+})
+
+test("variant preserved when switching agent modes", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1440, height: 900 })
+
+  await withProject(async ({ directory, gotoSession }) => {
+    await gotoSession()
+
+    await ensureVariant(page, directory)
+    const updated = await chooseDifferentVariant(page)
+
+    const available = await agents(page)
+    const other = available.find((name) => name !== updated.agent)
+    test.skip(!other, "only one agent available")
+    if (!other) return
+
+    await choose(page, promptAgentSelector, other)
+    await waitFooter(page, { agent: other, variant: updated.variant })
+
+    await choose(page, promptAgentSelector, updated.agent)
+    await waitFooter(page, { agent: updated.agent, variant: updated.variant })
+  })
+})

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

@@ -0,0 +1,426 @@
+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)
+}
+
+async function comment(page: Parameters<typeof test>[0]["page"], file: string, note: string) {
+  const row = page.locator(`[data-file="${file}"]`).first()
+  await expect(row).toBeVisible()
+
+  const line = row.locator('diffs-container [data-line="2"]').first()
+  await expect(line).toBeVisible()
+  await line.hover()
+
+  const add = row.getByRole("button", { name: /^Comment$/ }).first()
+  await expect(add).toBeVisible()
+  await add.click()
+
+  const area = row.locator('[data-slot="line-comment-textarea"]').first()
+  await expect(area).toBeVisible()
+  await area.fill(note)
+
+  const submit = row.locator('[data-slot="line-comment-action"][data-variant="primary"]').first()
+  await expect(submit).toBeEnabled()
+  await submit.click()
+
+  await expect(row.locator('[data-slot="line-comment-content"]').filter({ hasText: note }).first()).toBeVisible()
+  await expect(row.locator('[data-slot="line-comment-tools"]').first()).toBeVisible()
+}
+
+async function overflow(page: Parameters<typeof test>[0]["page"], file: string) {
+  const row = page.locator(`[data-file="${file}"]`).first()
+  const view = page.locator('[data-slot="session-review-scroll"] .scroll-view__viewport').first()
+  const pop = row.locator('[data-slot="line-comment-popover"][data-inline-body]').first()
+  const tools = row.locator('[data-slot="line-comment-tools"]').first()
+
+  const [width, viewBox, popBox, toolsBox] = await Promise.all([
+    view.evaluate((el) => el.scrollWidth - el.clientWidth),
+    view.boundingBox(),
+    pop.boundingBox(),
+    tools.boundingBox(),
+  ])
+
+  if (!viewBox || !popBox || !toolsBox) return null
+
+  return {
+    width,
+    pop: popBox.x + popBox.width - (viewBox.x + viewBox.width),
+    tools: toolsBox.x + toolsBox.width - (viewBox.x + viewBox.width),
+  }
+}
+
+async function openReviewFile(page: Parameters<typeof test>[0]["page"], file: string) {
+  const row = page.locator(`[data-file="${file}"]`).first()
+  await expect(row).toBeVisible()
+  await row.hover()
+
+  const open = row.getByRole("button", { name: /^Open file$/i }).first()
+  await expect(open).toBeVisible()
+  await open.click()
+
+  const tab = page.getByRole("tab", { name: file }).first()
+  await expect(tab).toBeVisible()
+  await tab.click()
+
+  const viewer = page.locator('[data-component="file"][data-mode="text"]').first()
+  await expect(viewer).toBeVisible()
+  return viewer
+}
+
+async function fileComment(page: Parameters<typeof test>[0]["page"], note: string) {
+  const viewer = page.locator('[data-component="file"][data-mode="text"]').first()
+  await expect(viewer).toBeVisible()
+
+  const line = viewer.locator('diffs-container [data-line="2"]').first()
+  await expect(line).toBeVisible()
+  await line.hover()
+
+  const add = viewer.getByRole("button", { name: /^Comment$/ }).first()
+  await expect(add).toBeVisible()
+  await add.click()
+
+  const area = viewer.locator('[data-slot="line-comment-textarea"]').first()
+  await expect(area).toBeVisible()
+  await area.fill(note)
+
+  const submit = viewer.locator('[data-slot="line-comment-action"][data-variant="primary"]').first()
+  await expect(submit).toBeEnabled()
+  await submit.click()
+
+  await expect(viewer.locator('[data-slot="line-comment-content"]').filter({ hasText: note }).first()).toBeVisible()
+  await expect(viewer.locator('[data-slot="line-comment-tools"]').first()).toBeVisible()
+}
+
+async function fileOverflow(page: Parameters<typeof test>[0]["page"]) {
+  const viewer = page.locator('[data-component="file"][data-mode="text"]').first()
+  const view = page.locator('[role="tabpanel"] .scroll-view__viewport').first()
+  const pop = viewer.locator('[data-slot="line-comment-popover"][data-inline-body]').first()
+  const tools = viewer.locator('[data-slot="line-comment-tools"]').first()
+
+  const [width, viewBox, popBox, toolsBox] = await Promise.all([
+    view.evaluate((el) => el.scrollWidth - el.clientWidth),
+    view.boundingBox(),
+    pop.boundingBox(),
+    tools.boundingBox(),
+  ])
+
+  if (!viewBox || !popBox || !toolsBox) return null
+
+  return {
+    width,
+    pop: popBox.x + popBox.width - (viewBox.x + viewBox.width),
+    tools: toolsBox.x + toolsBox.width - (viewBox.x + viewBox.width),
+  }
+}
+
+test("review applies inline comment clicks without horizontal overflow", async ({ page, withProject }) => {
+  test.setTimeout(180_000)
+
+  const tag = `review-comment-${Date.now()}`
+  const file = `review-comment-${tag}.txt`
+  const note = `comment ${tag}`
+
+  await page.setViewportSize({ width: 1280, height: 900 })
+
+  await withProject(async (project) => {
+    const sdk = createSdk(project.directory)
+
+    await withSession(sdk, `e2e review comment ${tag}`, async (session) => {
+      await patch(sdk, session.id, seed([{ file, mark: tag }]))
+
+      await expect
+        .poll(
+          async () => {
+            const diff = await sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? [])
+            return diff.length
+          },
+          { timeout: 60_000 },
+        )
+        .toBe(1)
+
+      await project.gotoSession(session.id)
+      await show(page)
+
+      const tab = page.getByRole("tab", { name: /Review/i }).first()
+      await expect(tab).toBeVisible()
+      await tab.click()
+
+      await expand(page)
+      await waitMark(page, file, tag)
+      await comment(page, file, note)
+
+      await expect
+        .poll(async () => (await overflow(page, file))?.width ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+      await expect
+        .poll(async () => (await overflow(page, file))?.pop ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+      await expect
+        .poll(async () => (await overflow(page, file))?.tools ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+    })
+  })
+})
+
+test("review file comments submit on click without clipping actions", async ({ page, withProject }) => {
+  test.setTimeout(180_000)
+
+  const tag = `review-file-comment-${Date.now()}`
+  const file = `review-file-comment-${tag}.txt`
+  const note = `comment ${tag}`
+
+  await page.setViewportSize({ width: 1280, height: 900 })
+
+  await withProject(async (project) => {
+    const sdk = createSdk(project.directory)
+
+    await withSession(sdk, `e2e review file comment ${tag}`, async (session) => {
+      await patch(sdk, session.id, seed([{ file, mark: tag }]))
+
+      await expect
+        .poll(
+          async () => {
+            const diff = await sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? [])
+            return diff.length
+          },
+          { timeout: 60_000 },
+        )
+        .toBe(1)
+
+      await project.gotoSession(session.id)
+      await show(page)
+
+      const tab = page.getByRole("tab", { name: /Review/i }).first()
+      await expect(tab).toBeVisible()
+      await tab.click()
+
+      await expand(page)
+      await waitMark(page, file, tag)
+      await openReviewFile(page, file)
+      await fileComment(page, note)
+
+      await expect
+        .poll(async () => (await fileOverflow(page))?.width ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+      await expect
+        .poll(async () => (await fileOverflow(page))?.pop ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+      await expect
+        .poll(async () => (await fileOverflow(page))?.tools ?? Number.POSITIVE_INFINITY, { timeout: 10_000 })
+        .toBeLessThanOrEqual(1)
+    })
+  })
+})
+
+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

@@ -0,0 +1,233 @@
+import type { Page } from "@playwright/test"
+import { test, expect } from "../fixtures"
+import { withSession } from "../actions"
+import { createSdk, modKey } from "../utils"
+import { promptSelector } from "../selectors"
+
+async function seedConversation(input: {
+  page: Page
+  sdk: ReturnType<typeof createSdk>
+  sessionID: string
+  token: string
+}) {
+  const messages = async () =>
+    await input.sdk.session.messages({ sessionID: input.sessionID, limit: 100 }).then((r) => r.data ?? [])
+  const seeded = await messages()
+  const userIDs = new Set(seeded.filter((m) => m.info.role === "user").map((m) => m.info.id))
+
+  const prompt = input.page.locator(promptSelector)
+  await expect(prompt).toBeVisible()
+  await input.sdk.session.promptAsync({
+    sessionID: input.sessionID,
+    noReply: true,
+    parts: [{ type: "text", text: input.token }],
+  })
+
+  let userMessageID: string | undefined
+  await expect
+    .poll(
+      async () => {
+        const users = (await messages()).filter(
+          (m) =>
+            !userIDs.has(m.info.id) &&
+            m.info.role === "user" &&
+            m.parts.filter((p) => p.type === "text").some((p) => p.text.includes(input.token)),
+        )
+        if (users.length === 0) return false
+
+        const user = users[users.length - 1]
+        if (!user) return false
+        userMessageID = user.info.id
+        return true
+      },
+      { timeout: 90_000, intervals: [250, 500, 1_000] },
+    )
+    .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 })
+  return { prompt, userMessageID }
+}
+
+test("slash undo sets revert and restores prior prompt", async ({ page, withProject }) => {
+  test.setTimeout(120_000)
+
+  const token = `undo_${Date.now()}`
+
+  await withProject(async (project) => {
+    const sdk = createSdk(project.directory)
+
+    await withSession(sdk, `e2e undo ${Date.now()}`, async (session) => {
+      await project.gotoSession(session.id)
+
+      const seeded = await seedConversation({ page, sdk, sessionID: session.id, token })
+
+      await seeded.prompt.click()
+      await page.keyboard.type("/undo")
+
+      const undo = page.locator('[data-slash-id="session.undo"]').first()
+      await expect(undo).toBeVisible()
+      await page.keyboard.press("Enter")
+
+      await expect
+        .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), {
+          timeout: 30_000,
+        })
+        .toBe(seeded.userMessageID)
+
+      await expect(seeded.prompt).toContainText(token)
+      await expect(page.locator(`[data-message-id="${seeded.userMessageID}"]`)).toHaveCount(0)
+    })
+  })
+})
+
+test("slash redo clears revert and restores latest state", async ({ page, withProject }) => {
+  test.setTimeout(120_000)
+
+  const token = `redo_${Date.now()}`
+
+  await withProject(async (project) => {
+    const sdk = createSdk(project.directory)
+
+    await withSession(sdk, `e2e redo ${Date.now()}`, async (session) => {
+      await project.gotoSession(session.id)
+
+      const seeded = await seedConversation({ page, sdk, sessionID: session.id, token })
+
+      await seeded.prompt.click()
+      await page.keyboard.type("/undo")
+
+      const undo = page.locator('[data-slash-id="session.undo"]').first()
+      await expect(undo).toBeVisible()
+      await page.keyboard.press("Enter")
+
+      await expect
+        .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), {
+          timeout: 30_000,
+        })
+        .toBe(seeded.userMessageID)
+
+      await seeded.prompt.click()
+      await page.keyboard.press(`${modKey}+A`)
+      await page.keyboard.press("Backspace")
+      await page.keyboard.type("/redo")
+
+      const redo = page.locator('[data-slash-id="session.redo"]').first()
+      await expect(redo).toBeVisible()
+      await page.keyboard.press("Enter")
+
+      await expect
+        .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), {
+          timeout: 30_000,
+        })
+        .toBeUndefined()
+
+      await expect(seeded.prompt).not.toContainText(token)
+      await expect(page.locator(`[data-message-id="${seeded.userMessageID}"]`)).toHaveCount(1)
+    })
+  })
+})
+
+test("slash undo/redo traverses multi-step revert stack", async ({ page, withProject }) => {
+  test.setTimeout(120_000)
+
+  const firstToken = `undo_redo_first_${Date.now()}`
+  const secondToken = `undo_redo_second_${Date.now()}`
+
+  await withProject(async (project) => {
+    const sdk = createSdk(project.directory)
+
+    await withSession(sdk, `e2e undo redo stack ${Date.now()}`, async (session) => {
+      await project.gotoSession(session.id)
+
+      const first = await seedConversation({
+        page,
+        sdk,
+        sessionID: session.id,
+        token: firstToken,
+      })
+      const second = await seedConversation({
+        page,
+        sdk,
+        sessionID: session.id,
+        token: secondToken,
+      })
+
+      expect(first.userMessageID).not.toBe(second.userMessageID)
+
+      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 second.prompt.click()
+      await page.keyboard.press(`${modKey}+A`)
+      await page.keyboard.press("Backspace")
+      await page.keyboard.type("/undo")
+
+      const undo = page.locator('[data-slash-id="session.undo"]').first()
+      await expect(undo).toBeVisible()
+      await page.keyboard.press("Enter")
+
+      await expect
+        .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), {
+          timeout: 30_000,
+        })
+        .toBe(second.userMessageID)
+
+      await expect(firstMessage).toHaveCount(1)
+      await expect(secondMessage).toHaveCount(0)
+
+      await second.prompt.click()
+      await page.keyboard.press(`${modKey}+A`)
+      await page.keyboard.press("Backspace")
+      await page.keyboard.type("/undo")
+      await expect(undo).toBeVisible()
+      await page.keyboard.press("Enter")
+
+      await expect
+        .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), {
+          timeout: 30_000,
+        })
+        .toBe(first.userMessageID)
+
+      await expect(firstMessage).toHaveCount(0)
+      await expect(secondMessage).toHaveCount(0)
+
+      await second.prompt.click()
+      await page.keyboard.press(`${modKey}+A`)
+      await page.keyboard.press("Backspace")
+      await page.keyboard.type("/redo")
+
+      const redo = page.locator('[data-slash-id="session.redo"]').first()
+      await expect(redo).toBeVisible()
+      await page.keyboard.press("Enter")
+
+      await expect
+        .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), {
+          timeout: 30_000,
+        })
+        .toBe(second.userMessageID)
+
+      await expect(firstMessage).toHaveCount(1)
+      await expect(secondMessage).toHaveCount(0)
+
+      await second.prompt.click()
+      await page.keyboard.press(`${modKey}+A`)
+      await page.keyboard.press("Backspace")
+      await page.keyboard.type("/redo")
+      await expect(redo).toBeVisible()
+      await page.keyboard.press("Enter")
+
+      await expect
+        .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), {
+          timeout: 30_000,
+        })
+        .toBeUndefined()
+
+      await expect(firstMessage).toHaveCount(1)
+      await expect(secondMessage).toHaveCount(1)
+    })
+  })
+})

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

@@ -0,0 +1,174 @@
+import { test, expect } from "../fixtures"
+import {
+  openSidebar,
+  openSessionMoreMenu,
+  clickMenuItem,
+  confirmDialog,
+  openSharePopover,
+  withSession,
+} from "../actions"
+import { sessionItemSelector, inlineInputSelector } from "../selectors"
+
+const shareDisabled = process.env.OPENCODE_DISABLE_SHARE === "true" || process.env.OPENCODE_DISABLE_SHARE === "1"
+
+type Sdk = Parameters<typeof withSession>[0]
+
+async function seedMessage(sdk: Sdk, sessionID: string) {
+  await sdk.session.promptAsync({
+    sessionID,
+    noReply: true,
+    parts: [{ type: "text", text: "e2e 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("session can be renamed via header menu", async ({ page, sdk, gotoSession }) => {
+  const stamp = Date.now()
+  const originalTitle = `e2e rename test ${stamp}`
+  const renamedTitle = `e2e renamed ${stamp}`
+
+  await withSession(sdk, originalTitle, async (session) => {
+    await seedMessage(sdk, session.id)
+    await gotoSession(session.id)
+    await expect(page.getByRole("heading", { level: 1 }).first()).toHaveText(originalTitle)
+
+    const menu = await openSessionMoreMenu(page, session.id)
+    await clickMenuItem(menu, /rename/i)
+
+    const input = page.locator(".scroll-view__viewport").locator(inlineInputSelector).first()
+    await expect(input).toBeVisible()
+    await expect(input).toBeFocused()
+    await input.fill(renamedTitle)
+    await expect(input).toHaveValue(renamedTitle)
+    await input.press("Enter")
+
+    await expect
+      .poll(
+        async () => {
+          const data = await sdk.session.get({ sessionID: session.id }).then((r) => r.data)
+          return data?.title
+        },
+        { timeout: 30_000 },
+      )
+      .toBe(renamedTitle)
+
+    await expect(page.getByRole("heading", { level: 1 }).first()).toHaveText(renamedTitle)
+  })
+})
+
+test("session can be archived via header menu", async ({ page, sdk, gotoSession }) => {
+  const stamp = Date.now()
+  const title = `e2e archive test ${stamp}`
+
+  await withSession(sdk, title, async (session) => {
+    await seedMessage(sdk, session.id)
+    await gotoSession(session.id)
+    const menu = await openSessionMoreMenu(page, session.id)
+    await clickMenuItem(menu, /archive/i)
+
+    await expect
+      .poll(
+        async () => {
+          const data = await sdk.session.get({ sessionID: session.id }).then((r) => r.data)
+          return data?.time?.archived
+        },
+        { timeout: 30_000 },
+      )
+      .not.toBeUndefined()
+
+    await openSidebar(page)
+    await expect(page.locator(sessionItemSelector(session.id))).toHaveCount(0)
+  })
+})
+
+test("session can be deleted via header menu", async ({ page, sdk, gotoSession }) => {
+  const stamp = Date.now()
+  const title = `e2e delete test ${stamp}`
+
+  await withSession(sdk, title, async (session) => {
+    await seedMessage(sdk, session.id)
+    await gotoSession(session.id)
+    const menu = await openSessionMoreMenu(page, session.id)
+    await clickMenuItem(menu, /delete/i)
+    await confirmDialog(page, /delete/i)
+
+    await expect
+      .poll(
+        async () => {
+          const data = await sdk.session
+            .get({ sessionID: session.id })
+            .then((r) => r.data)
+            .catch(() => undefined)
+          return data?.id
+        },
+        { timeout: 30_000 },
+      )
+      .toBeUndefined()
+
+    await openSidebar(page)
+    await expect(page.locator(sessionItemSelector(session.id))).toHaveCount(0)
+  })
+})
+
+test("session can be shared and unshared via header button", async ({ page, sdk, gotoSession }) => {
+  test.skip(shareDisabled, "Share is disabled in this environment (OPENCODE_DISABLE_SHARE).")
+
+  const stamp = Date.now()
+  const title = `e2e share test ${stamp}`
+
+  await withSession(sdk, title, async (session) => {
+    await seedMessage(sdk, session.id)
+    await gotoSession(session.id)
+
+    const shared = await openSharePopover(page)
+    const publish = shared.popoverBody.getByRole("button", { name: "Publish" }).first()
+    await expect(publish).toBeVisible({ timeout: 30_000 })
+    await publish.click()
+
+    await expect(shared.popoverBody.getByRole("button", { name: "Unpublish" }).first()).toBeVisible({
+      timeout: 30_000,
+    })
+
+    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()
+
+    const unpublish = shared.popoverBody.getByRole("button", { name: "Unpublish" }).first()
+    await expect(unpublish).toBeVisible({ timeout: 30_000 })
+    await unpublish.click()
+
+    await expect(shared.popoverBody.getByRole("button", { name: "Publish" }).first()).toBeVisible({
+      timeout: 30_000,
+    })
+
+    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()
+
+    const unshared = await openSharePopover(page)
+    await expect(unshared.popoverBody.getByRole("button", { name: "Publish" }).first()).toBeVisible({
+      timeout: 30_000,
+    })
+  })
+})

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

@@ -0,0 +1,389 @@
+import { test, expect } from "../fixtures"
+import { openSettings, closeDialog, waitTerminalFocusIdle, withSession } from "../actions"
+import { keybindButtonSelector, terminalSelector } from "../selectors"
+import { modKey } from "../utils"
+
+test("changing sidebar toggle keybind works", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle")).first()
+  await expect(keybindButton).toBeVisible()
+
+  const initialKeybind = await keybindButton.textContent()
+  expect(initialKeybind).toContain("B")
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press(`${modKey}+Shift+KeyH`)
+  await page.waitForTimeout(100)
+
+  const newKeybind = await keybindButton.textContent()
+  expect(newKeybind).toContain("H")
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["sidebar.toggle"]).toBe("mod+shift+h")
+
+  await closeDialog(page, dialog)
+
+  const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
+  const initiallyClosed = (await button.getAttribute("aria-expanded")) !== "true"
+
+  await page.keyboard.press(`${modKey}+Shift+H`)
+  await expect(button).toHaveAttribute("aria-expanded", initiallyClosed ? "true" : "false")
+
+  const afterToggleClosed = (await button.getAttribute("aria-expanded")) !== "true"
+  expect(afterToggleClosed).toBe(!initiallyClosed)
+
+  await page.keyboard.press(`${modKey}+Shift+H`)
+  await expect(button).toHaveAttribute("aria-expanded", initiallyClosed ? "false" : "true")
+
+  const finalClosed = (await button.getAttribute("aria-expanded")) !== "true"
+  expect(finalClosed).toBe(initiallyClosed)
+})
+
+test("sidebar toggle keybind guards against shortcut conflicts", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle"))
+  await expect(keybindButton).toBeVisible()
+
+  const initialKeybind = await keybindButton.textContent()
+  expect(initialKeybind).toContain("B")
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press(`${modKey}+Shift+KeyP`)
+  await page.waitForTimeout(100)
+
+  const toast = page.locator('[data-component="toast"]').last()
+  await expect(toast).toBeVisible()
+  await expect(toast).toContainText(/already/i)
+
+  await keybindButton.click()
+  await expect(keybindButton).toContainText("B")
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["sidebar.toggle"]).toBeUndefined()
+
+  await closeDialog(page, dialog)
+})
+
+test("resetting all keybinds to defaults works", async ({ page, gotoSession }) => {
+  await page.addInitScript(() => {
+    localStorage.setItem("settings.v3", JSON.stringify({ keybinds: { "sidebar.toggle": "mod+shift+x" } }))
+  })
+
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle"))
+  await expect(keybindButton).toBeVisible()
+
+  const customKeybind = await keybindButton.textContent()
+  expect(customKeybind).toContain("X")
+
+  const resetButton = dialog.getByRole("button", { name: "Reset to defaults" })
+  await expect(resetButton).toBeVisible()
+  await expect(resetButton).toBeEnabled()
+  await resetButton.click()
+  await page.waitForTimeout(100)
+
+  const restoredKeybind = await keybindButton.textContent()
+  expect(restoredKeybind).toContain("B")
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["sidebar.toggle"]).toBeUndefined()
+
+  await closeDialog(page, dialog)
+})
+
+test("clearing a keybind works", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle"))
+  await expect(keybindButton).toBeVisible()
+
+  const initialKeybind = await keybindButton.textContent()
+  expect(initialKeybind).toContain("B")
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press("Delete")
+  await page.waitForTimeout(100)
+
+  const clearedKeybind = await keybindButton.textContent()
+  expect(clearedKeybind).toMatch(/unassigned|press/i)
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["sidebar.toggle"]).toBe("none")
+
+  await closeDialog(page, dialog)
+
+  await page.keyboard.press(`${modKey}+B`)
+  await page.waitForTimeout(100)
+
+  const stillOnSession = page.url().includes("/session")
+  expect(stillOnSession).toBe(true)
+})
+
+test("changing settings open keybind works", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("settings.open"))
+  await expect(keybindButton).toBeVisible()
+
+  const initialKeybind = await keybindButton.textContent()
+  expect(initialKeybind).toContain(",")
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press(`${modKey}+Slash`)
+  await page.waitForTimeout(100)
+
+  const newKeybind = await keybindButton.textContent()
+  expect(newKeybind).toContain("/")
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["settings.open"]).toBe("mod+/")
+
+  await closeDialog(page, dialog)
+
+  const settingsDialog = page.getByRole("dialog")
+  await expect(settingsDialog).toHaveCount(0)
+
+  await page.keyboard.press(`${modKey}+Slash`)
+  await page.waitForTimeout(100)
+
+  await expect(settingsDialog).toBeVisible()
+
+  await closeDialog(page, settingsDialog)
+})
+
+test("changing new session keybind works", async ({ page, sdk, gotoSession }) => {
+  await withSession(sdk, "test session for keybind", async (session) => {
+    await gotoSession(session.id)
+
+    const initialUrl = page.url()
+    expect(initialUrl).toContain(`/session/${session.id}`)
+
+    const dialog = await openSettings(page)
+    await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+    const keybindButton = dialog.locator(keybindButtonSelector("session.new"))
+    await expect(keybindButton).toBeVisible()
+
+    await keybindButton.click()
+    await expect(keybindButton).toHaveText(/press/i)
+
+    await page.keyboard.press(`${modKey}+Shift+KeyN`)
+    await page.waitForTimeout(100)
+
+    const newKeybind = await keybindButton.textContent()
+    expect(newKeybind).toContain("N")
+
+    const stored = await page.evaluate(() => {
+      const raw = localStorage.getItem("settings.v3")
+      return raw ? JSON.parse(raw) : null
+    })
+    expect(stored?.keybinds?.["session.new"]).toBe("mod+shift+n")
+
+    await closeDialog(page, dialog)
+
+    await page.keyboard.press(`${modKey}+Shift+N`)
+    await page.waitForTimeout(200)
+
+    const newUrl = page.url()
+    expect(newUrl).toMatch(/\/session\/?$/)
+    expect(newUrl).not.toContain(session.id)
+  })
+})
+
+test("changing file open keybind works", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("file.open"))
+  await expect(keybindButton).toBeVisible()
+
+  const initialKeybind = await keybindButton.textContent()
+  expect(initialKeybind).toContain("K")
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press(`${modKey}+Shift+KeyF`)
+  await page.waitForTimeout(100)
+
+  const newKeybind = await keybindButton.textContent()
+  expect(newKeybind).toContain("F")
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["file.open"]).toBe("mod+shift+f")
+
+  await closeDialog(page, dialog)
+
+  const filePickerDialog = page.getByRole("dialog").filter({ has: page.getByPlaceholder(/search files/i) })
+  await expect(filePickerDialog).toHaveCount(0)
+
+  await page.keyboard.press(`${modKey}+Shift+F`)
+  await page.waitForTimeout(100)
+
+  await expect(filePickerDialog).toBeVisible()
+
+  await page.keyboard.press("Escape")
+  await expect(filePickerDialog).toHaveCount(0)
+})
+
+test("changing terminal toggle keybind works", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("terminal.toggle"))
+  await expect(keybindButton).toBeVisible()
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press(`${modKey}+KeyY`)
+  await page.waitForTimeout(100)
+
+  const newKeybind = await keybindButton.textContent()
+  expect(newKeybind).toContain("Y")
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["terminal.toggle"]).toBe("mod+y")
+
+  await closeDialog(page, dialog)
+
+  const terminal = page.locator(terminalSelector)
+  await expect(terminal).not.toBeVisible()
+
+  await page.keyboard.press(`${modKey}+Y`)
+  await waitTerminalFocusIdle(page, { term: terminal })
+
+  await page.keyboard.press(`${modKey}+Y`)
+  await expect(terminal).not.toBeVisible()
+})
+
+test("terminal toggle keybind persists after reload", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("terminal.toggle"))
+  await expect(keybindButton).toBeVisible()
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press(`${modKey}+Shift+KeyY`)
+  await page.waitForTimeout(100)
+
+  await expect(keybindButton).toContainText("Y")
+  await closeDialog(page, dialog)
+
+  await page.reload()
+
+  await expect
+    .poll(async () => {
+      return await page.evaluate(() => {
+        const raw = localStorage.getItem("settings.v3")
+        if (!raw) return
+        const parsed = JSON.parse(raw)
+        return parsed?.keybinds?.["terminal.toggle"]
+      })
+    })
+    .toBe("mod+shift+y")
+
+  const reloaded = await openSettings(page)
+  await reloaded.getByRole("tab", { name: "Shortcuts" }).click()
+  const reloadedKeybind = reloaded.locator(keybindButtonSelector("terminal.toggle")).first()
+  await expect(reloadedKeybind).toContainText("Y")
+  await closeDialog(page, reloaded)
+})
+
+test("changing command palette keybind works", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+
+  const keybindButton = dialog.locator(keybindButtonSelector("command.palette"))
+  await expect(keybindButton).toBeVisible()
+
+  const initialKeybind = await keybindButton.textContent()
+  expect(initialKeybind).toContain("P")
+
+  await keybindButton.click()
+  await expect(keybindButton).toHaveText(/press/i)
+
+  await page.keyboard.press(`${modKey}+Shift+KeyK`)
+  await page.waitForTimeout(100)
+
+  const newKeybind = await keybindButton.textContent()
+  expect(newKeybind).toContain("K")
+
+  const stored = await page.evaluate(() => {
+    const raw = localStorage.getItem("settings.v3")
+    return raw ? JSON.parse(raw) : null
+  })
+  expect(stored?.keybinds?.["command.palette"]).toBe("mod+shift+k")
+
+  await closeDialog(page, dialog)
+
+  const palette = page.getByRole("dialog").filter({ has: page.getByRole("textbox").first() })
+  await expect(palette).toHaveCount(0)
+
+  await page.keyboard.press(`${modKey}+Shift+K`)
+  await page.waitForTimeout(100)
+
+  await expect(palette).toBeVisible()
+  await expect(palette.getByRole("textbox").first()).toBeVisible()
+
+  await page.keyboard.press("Escape")
+  await expect(palette).toHaveCount(0)
+})

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

@@ -0,0 +1,122 @@
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { closeDialog, openSettings } from "../actions"
+
+test("hiding a model removes it from the model picker", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+
+  const command = page.locator('[data-slash-id="model.choose"]')
+  await expect(command).toBeVisible()
+  await command.hover()
+  await page.keyboard.press("Enter")
+
+  const picker = page.getByRole("dialog")
+  await expect(picker).toBeVisible()
+
+  const target = picker.locator('[data-slot="list-item"]').first()
+  await expect(target).toBeVisible()
+
+  const key = await target.getAttribute("data-key")
+  if (!key) throw new Error("Failed to resolve model key from list item")
+
+  const name = (await target.locator("span").first().innerText()).trim()
+  if (!name) throw new Error("Failed to resolve model name from list item")
+
+  await page.keyboard.press("Escape")
+  await expect(picker).toHaveCount(0)
+
+  const settings = await openSettings(page)
+
+  await settings.getByRole("tab", { name: "Models" }).click()
+  const search = settings.getByPlaceholder("Search models")
+  await expect(search).toBeVisible()
+  await search.fill(name)
+
+  const toggle = settings.locator('[data-component="switch"]').filter({ hasText: name }).first()
+  const input = toggle.locator('[data-slot="switch-input"]')
+  await expect(toggle).toBeVisible()
+  await expect(input).toHaveAttribute("aria-checked", "true")
+  await toggle.locator('[data-slot="switch-control"]').click()
+  await expect(input).toHaveAttribute("aria-checked", "false")
+
+  await closeDialog(page, settings)
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+  await expect(command).toBeVisible()
+  await command.hover()
+  await page.keyboard.press("Enter")
+
+  const pickerAgain = page.getByRole("dialog")
+  await expect(pickerAgain).toBeVisible()
+  await expect(pickerAgain.locator('[data-slot="list-item"]').first()).toBeVisible()
+
+  await expect(pickerAgain.locator(`[data-slot="list-item"][data-key="${key}"]`)).toHaveCount(0)
+
+  await page.keyboard.press("Escape")
+  await expect(pickerAgain).toHaveCount(0)
+})
+
+test("showing a hidden model restores it to the model picker", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+
+  const command = page.locator('[data-slash-id="model.choose"]')
+  await expect(command).toBeVisible()
+  await command.hover()
+  await page.keyboard.press("Enter")
+
+  const picker = page.getByRole("dialog")
+  await expect(picker).toBeVisible()
+
+  const target = picker.locator('[data-slot="list-item"]').first()
+  await expect(target).toBeVisible()
+
+  const key = await target.getAttribute("data-key")
+  if (!key) throw new Error("Failed to resolve model key from list item")
+
+  const name = (await target.locator("span").first().innerText()).trim()
+  if (!name) throw new Error("Failed to resolve model name from list item")
+
+  await page.keyboard.press("Escape")
+  await expect(picker).toHaveCount(0)
+
+  const settings = await openSettings(page)
+
+  await settings.getByRole("tab", { name: "Models" }).click()
+  const search = settings.getByPlaceholder("Search models")
+  await expect(search).toBeVisible()
+  await search.fill(name)
+
+  const toggle = settings.locator('[data-component="switch"]').filter({ hasText: name }).first()
+  const input = toggle.locator('[data-slot="switch-input"]')
+  await expect(toggle).toBeVisible()
+  await expect(input).toHaveAttribute("aria-checked", "true")
+
+  await toggle.locator('[data-slot="switch-control"]').click()
+  await expect(input).toHaveAttribute("aria-checked", "false")
+
+  await toggle.locator('[data-slot="switch-control"]').click()
+  await expect(input).toHaveAttribute("aria-checked", "true")
+
+  await closeDialog(page, settings)
+
+  await page.locator(promptSelector).click()
+  await page.keyboard.type("/model")
+  await expect(command).toBeVisible()
+  await command.hover()
+  await page.keyboard.press("Enter")
+
+  const pickerAgain = page.getByRole("dialog")
+  await expect(pickerAgain).toBeVisible()
+
+  await expect(pickerAgain.locator(`[data-slot="list-item"][data-key="${key}"]`)).toBeVisible()
+
+  await page.keyboard.press("Escape")
+  await expect(pickerAgain).toHaveCount(0)
+})

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

@@ -0,0 +1,136 @@
+import { test, expect } from "../fixtures"
+import { closeDialog, openSettings } from "../actions"
+
+test("custom provider form can be filled and validates input", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const settings = await openSettings(page)
+  await settings.getByRole("tab", { name: "Providers" }).click()
+
+  const customProviderSection = settings.locator('[data-component="custom-provider-section"]')
+  await expect(customProviderSection).toBeVisible()
+
+  const connectButton = customProviderSection.getByRole("button", { name: "Connect" })
+  await connectButton.click()
+
+  const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") })
+  await expect(providerDialog).toBeVisible()
+
+  await providerDialog.getByLabel("Provider ID").fill("test-provider")
+  await providerDialog.getByLabel("Display name").fill("Test Provider")
+  await providerDialog.getByLabel("Base URL").fill("http://localhost:9999/fake")
+  await providerDialog.getByLabel("API key").fill("fake-key")
+
+  await providerDialog.getByPlaceholder("model-id").first().fill("test-model")
+  await providerDialog.getByPlaceholder("Display Name").first().fill("Test Model")
+
+  await expect(providerDialog.getByRole("textbox", { name: "Provider ID" })).toHaveValue("test-provider")
+  await expect(providerDialog.getByRole("textbox", { name: "Display name" })).toHaveValue("Test Provider")
+  await expect(providerDialog.getByRole("textbox", { name: "Base URL" })).toHaveValue("http://localhost:9999/fake")
+  await expect(providerDialog.getByRole("textbox", { name: "API key" })).toHaveValue("fake-key")
+  await expect(providerDialog.getByPlaceholder("model-id").first()).toHaveValue("test-model")
+  await expect(providerDialog.getByPlaceholder("Display Name").first()).toHaveValue("Test Model")
+
+  await page.keyboard.press("Escape")
+  await expect(providerDialog).toHaveCount(0)
+
+  await closeDialog(page, settings)
+})
+
+test("custom provider form shows validation errors", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const settings = await openSettings(page)
+  await settings.getByRole("tab", { name: "Providers" }).click()
+
+  const customProviderSection = settings.locator('[data-component="custom-provider-section"]')
+  await customProviderSection.getByRole("button", { name: "Connect" }).click()
+
+  const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") })
+  await expect(providerDialog).toBeVisible()
+
+  await providerDialog.getByLabel("Provider ID").fill("invalid provider id")
+  await providerDialog.getByLabel("Base URL").fill("not-a-url")
+
+  await providerDialog.getByRole("button", { name: /submit|save/i }).click()
+
+  await expect(providerDialog.locator('[data-slot="input-error"]').filter({ hasText: /lowercase/i })).toBeVisible()
+  await expect(providerDialog.locator('[data-slot="input-error"]').filter({ hasText: /http/i })).toBeVisible()
+
+  await page.keyboard.press("Escape")
+  await expect(providerDialog).toHaveCount(0)
+
+  await closeDialog(page, settings)
+})
+
+test("custom provider form can add and remove models", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const settings = await openSettings(page)
+  await settings.getByRole("tab", { name: "Providers" }).click()
+
+  const customProviderSection = settings.locator('[data-component="custom-provider-section"]')
+  await customProviderSection.getByRole("button", { name: "Connect" }).click()
+
+  const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") })
+  await expect(providerDialog).toBeVisible()
+
+  await providerDialog.getByLabel("Provider ID").fill("multi-model-test")
+  await providerDialog.getByLabel("Display name").fill("Multi Model Test")
+  await providerDialog.getByLabel("Base URL").fill("http://localhost:9999/multi")
+
+  await providerDialog.getByPlaceholder("model-id").first().fill("model-1")
+  await providerDialog.getByPlaceholder("Display Name").first().fill("Model 1")
+
+  const idInputsBefore = await providerDialog.getByPlaceholder("model-id").count()
+  await providerDialog.getByRole("button", { name: "Add model" }).click()
+  const idInputsAfter = await providerDialog.getByPlaceholder("model-id").count()
+  expect(idInputsAfter).toBe(idInputsBefore + 1)
+
+  await providerDialog.getByPlaceholder("model-id").nth(1).fill("model-2")
+  await providerDialog.getByPlaceholder("Display Name").nth(1).fill("Model 2")
+
+  await expect(providerDialog.getByPlaceholder("model-id").nth(1)).toHaveValue("model-2")
+  await expect(providerDialog.getByPlaceholder("Display Name").nth(1)).toHaveValue("Model 2")
+
+  await page.keyboard.press("Escape")
+  await expect(providerDialog).toHaveCount(0)
+
+  await closeDialog(page, settings)
+})
+
+test("custom provider form can add and remove headers", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const settings = await openSettings(page)
+  await settings.getByRole("tab", { name: "Providers" }).click()
+
+  const customProviderSection = settings.locator('[data-component="custom-provider-section"]')
+  await customProviderSection.getByRole("button", { name: "Connect" }).click()
+
+  const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") })
+  await expect(providerDialog).toBeVisible()
+
+  await providerDialog.getByLabel("Provider ID").fill("header-test")
+  await providerDialog.getByLabel("Display name").fill("Header Test")
+  await providerDialog.getByLabel("Base URL").fill("http://localhost:9999/headers")
+
+  await providerDialog.getByPlaceholder("model-id").first().fill("model-x")
+  await providerDialog.getByPlaceholder("Display Name").first().fill("Model X")
+
+  const headerInputsBefore = await providerDialog.getByPlaceholder("Header-Name").count()
+  await providerDialog.getByRole("button", { name: "Add header" }).click()
+  const headerInputsAfter = await providerDialog.getByPlaceholder("Header-Name").count()
+  expect(headerInputsAfter).toBe(headerInputsBefore + 1)
+
+  await providerDialog.getByPlaceholder("Header-Name").first().fill("Authorization")
+  await providerDialog.getByPlaceholder("value").first().fill("Bearer token123")
+
+  await expect(providerDialog.getByPlaceholder("Header-Name").first()).toHaveValue("Authorization")
+  await expect(providerDialog.getByPlaceholder("value").first()).toHaveValue("Bearer token123")
+
+  await page.keyboard.press("Escape")
+  await expect(providerDialog).toHaveCount(0)
+
+  await closeDialog(page, settings)
+})

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

@@ -0,0 +1,519 @@
+import { test, expect, settingsKey } from "../fixtures"
+import { closeDialog, openSettings } from "../actions"
+import {
+  settingsColorSchemeSelector,
+  settingsFontSelector,
+  settingsLanguageSelectSelector,
+  settingsNotificationsAgentSelector,
+  settingsNotificationsErrorsSelector,
+  settingsNotificationsPermissionsSelector,
+  settingsReleaseNotesSelector,
+  settingsSoundsAgentSelector,
+  settingsSoundsErrorsSelector,
+  settingsSoundsPermissionsSelector,
+  settingsThemeSelector,
+  settingsUpdatesStartupSelector,
+} from "../selectors"
+
+test("smoke settings dialog opens, switches tabs, closes", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+
+  await dialog.getByRole("tab", { name: "Shortcuts" }).click()
+  await expect(dialog.getByRole("button", { name: "Reset to defaults" })).toBeVisible()
+  await expect(dialog.getByPlaceholder("Search shortcuts")).toBeVisible()
+
+  await closeDialog(page, dialog)
+})
+
+test("changing language updates settings labels", async ({ page, gotoSession }) => {
+  await page.addInitScript(() => {
+    localStorage.setItem("opencode.global.dat:language", JSON.stringify({ locale: "en" }))
+  })
+
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+
+  const heading = dialog.getByRole("heading", { level: 2 })
+  await expect(heading).toHaveText("General")
+
+  const select = dialog.locator(settingsLanguageSelectSelector)
+  await expect(select).toBeVisible()
+  await select.locator('[data-slot="select-select-trigger"]').click()
+
+  await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Deutsch" }).click()
+
+  await expect(heading).toHaveText("Allgemein")
+
+  await select.locator('[data-slot="select-select-trigger"]').click()
+  await page.locator('[data-slot="select-select-item"]').filter({ hasText: "English" }).click()
+  await expect(heading).toHaveText("General")
+})
+
+test("changing color scheme persists in localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const select = dialog.locator(settingsColorSchemeSelector)
+  await expect(select).toBeVisible()
+
+  await select.locator('[data-slot="select-select-trigger"]').click()
+  await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Dark" }).click()
+
+  const colorScheme = await page.evaluate(() => {
+    return document.documentElement.getAttribute("data-color-scheme")
+  })
+  expect(colorScheme).toBe("dark")
+
+  await select.locator('[data-slot="select-select-trigger"]').click()
+  await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Light" }).click()
+
+  const lightColorScheme = await page.evaluate(() => {
+    return document.documentElement.getAttribute("data-color-scheme")
+  })
+  expect(lightColorScheme).toBe("light")
+})
+
+test("changing theme persists in localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  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()
+
+  await items.filter({ hasText: nextTheme! }).first().click()
+
+  await page.keyboard.press("Escape")
+
+  const storedThemeId = await page.evaluate(() => {
+    return localStorage.getItem("opencode-theme-id")
+  })
+
+  expect(storedThemeId).not.toBeNull()
+  expect(storedThemeId).not.toBe(currentThemeId)
+
+  const dataTheme = await page.evaluate(() => {
+    return document.documentElement.getAttribute("data-theme")
+  })
+  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()
+
+  const dialog = await openSettings(page)
+  const select = dialog.locator(settingsFontSelector)
+  await expect(select).toBeVisible()
+
+  const initialFontFamily = await page.evaluate(() => {
+    return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono")
+  })
+  expect(initialFontFamily).toContain("IBM Plex Mono")
+
+  await select.locator('[data-slot="select-select-trigger"]').click()
+
+  const items = page.locator('[data-slot="select-select-item"]')
+  await items.nth(2).click()
+
+  await page.waitForTimeout(100)
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.appearance?.font).not.toBe("ibm-plex-mono")
+
+  const newFontFamily = await page.evaluate(() => {
+    return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono")
+  })
+  expect(newFontFamily).not.toBe(initialFontFamily)
+})
+
+test("color scheme and font rehydrate after reload", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+
+  const colorSchemeSelect = dialog.locator(settingsColorSchemeSelector)
+  await expect(colorSchemeSelect).toBeVisible()
+  await colorSchemeSelect.locator('[data-slot="select-select-trigger"]').click()
+  await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Dark" }).click()
+  await expect(page.locator("html")).toHaveAttribute("data-color-scheme", "dark")
+
+  const fontSelect = dialog.locator(settingsFontSelector)
+  await expect(fontSelect).toBeVisible()
+
+  const initialFontFamily = await page.evaluate(() => {
+    return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim()
+  })
+
+  const initialSettings = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  const currentFont =
+    (await fontSelect.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? ""
+  await fontSelect.locator('[data-slot="select-select-trigger"]').click()
+
+  const fontItems = page.locator('[data-slot="select-select-item"]')
+  expect(await fontItems.count()).toBeGreaterThan(1)
+
+  if (currentFont) {
+    await fontItems.filter({ hasNotText: currentFont }).first().click()
+  }
+  if (!currentFont) {
+    await fontItems.nth(1).click()
+  }
+
+  await expect
+    .poll(async () => {
+      return await page.evaluate((key) => {
+        const raw = localStorage.getItem(key)
+        return raw ? JSON.parse(raw) : null
+      }, settingsKey)
+    })
+    .toMatchObject({
+      appearance: {
+        font: expect.any(String),
+      },
+    })
+
+  const updatedSettings = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  const updatedFontFamily = await page.evaluate(() => {
+    return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim()
+  })
+  expect(updatedFontFamily).not.toBe(initialFontFamily)
+  expect(updatedSettings?.appearance?.font).not.toBe(initialSettings?.appearance?.font)
+
+  await closeDialog(page, dialog)
+  await page.reload()
+
+  await expect(page.locator("html")).toHaveAttribute("data-color-scheme", "dark")
+
+  await expect
+    .poll(async () => {
+      return await page.evaluate((key) => {
+        const raw = localStorage.getItem(key)
+        return raw ? JSON.parse(raw) : null
+      }, settingsKey)
+    })
+    .toMatchObject({
+      appearance: {
+        font: updatedSettings?.appearance?.font,
+      },
+    })
+
+  const rehydratedSettings = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  await expect
+    .poll(async () => {
+      return await page.evaluate(() => {
+        return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim()
+      })
+    })
+    .not.toBe(initialFontFamily)
+
+  const rehydratedFontFamily = await page.evaluate(() => {
+    return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim()
+  })
+  expect(rehydratedFontFamily).not.toBe(initialFontFamily)
+  expect(rehydratedSettings?.appearance?.font).toBe(updatedSettings?.appearance?.font)
+})
+
+test("toggling notification agent switch updates localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const switchContainer = dialog.locator(settingsNotificationsAgentSelector)
+  await expect(switchContainer).toBeVisible()
+
+  const toggleInput = switchContainer.locator('[data-slot="switch-input"]')
+  const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(initialState).toBe(true)
+
+  await switchContainer.locator('[data-slot="switch-control"]').click()
+  await page.waitForTimeout(100)
+
+  const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(newState).toBe(false)
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.notifications?.agent).toBe(false)
+})
+
+test("toggling notification permissions switch updates localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const switchContainer = dialog.locator(settingsNotificationsPermissionsSelector)
+  await expect(switchContainer).toBeVisible()
+
+  const toggleInput = switchContainer.locator('[data-slot="switch-input"]')
+  const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(initialState).toBe(true)
+
+  await switchContainer.locator('[data-slot="switch-control"]').click()
+  await page.waitForTimeout(100)
+
+  const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(newState).toBe(false)
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.notifications?.permissions).toBe(false)
+})
+
+test("toggling notification errors switch updates localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const switchContainer = dialog.locator(settingsNotificationsErrorsSelector)
+  await expect(switchContainer).toBeVisible()
+
+  const toggleInput = switchContainer.locator('[data-slot="switch-input"]')
+  const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(initialState).toBe(false)
+
+  await switchContainer.locator('[data-slot="switch-control"]').click()
+  await page.waitForTimeout(100)
+
+  const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(newState).toBe(true)
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.notifications?.errors).toBe(true)
+})
+
+test("changing sound agent selection persists in localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const select = dialog.locator(settingsSoundsAgentSelector)
+  await expect(select).toBeVisible()
+
+  await select.locator('[data-slot="select-select-trigger"]').click()
+
+  const items = page.locator('[data-slot="select-select-item"]')
+  await items.nth(2).click()
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.sounds?.agent).not.toBe("staplebops-01")
+})
+
+test("selecting none disables agent sound", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const select = dialog.locator(settingsSoundsAgentSelector)
+  const trigger = select.locator('[data-slot="select-select-trigger"]')
+  await expect(select).toBeVisible()
+  await expect(trigger).toBeEnabled()
+
+  await trigger.click()
+  const items = page.locator('[data-slot="select-select-item"]')
+  await expect(items.first()).toBeVisible()
+  await items.first().click()
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.sounds?.agentEnabled).toBe(false)
+})
+
+test("changing permissions and errors sounds updates localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const permissionsSelect = dialog.locator(settingsSoundsPermissionsSelector)
+  const errorsSelect = dialog.locator(settingsSoundsErrorsSelector)
+  await expect(permissionsSelect).toBeVisible()
+  await expect(errorsSelect).toBeVisible()
+
+  const initial = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  const permissionsCurrent =
+    (await permissionsSelect.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? ""
+  await permissionsSelect.locator('[data-slot="select-select-trigger"]').click()
+  const permissionItems = page.locator('[data-slot="select-select-item"]')
+  expect(await permissionItems.count()).toBeGreaterThan(1)
+  if (permissionsCurrent) {
+    await permissionItems.filter({ hasNotText: permissionsCurrent }).first().click()
+  }
+  if (!permissionsCurrent) {
+    await permissionItems.nth(1).click()
+  }
+
+  const errorsCurrent =
+    (await errorsSelect.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? ""
+  await errorsSelect.locator('[data-slot="select-select-trigger"]').click()
+  const errorItems = page.locator('[data-slot="select-select-item"]')
+  expect(await errorItems.count()).toBeGreaterThan(1)
+  if (errorsCurrent) {
+    await errorItems.filter({ hasNotText: errorsCurrent }).first().click()
+  }
+  if (!errorsCurrent) {
+    await errorItems.nth(1).click()
+  }
+
+  await expect
+    .poll(async () => {
+      return await page.evaluate((key) => {
+        const raw = localStorage.getItem(key)
+        return raw ? JSON.parse(raw) : null
+      }, settingsKey)
+    })
+    .toMatchObject({
+      sounds: {
+        permissions: expect.any(String),
+        errors: expect.any(String),
+      },
+    })
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.sounds?.permissions).not.toBe(initial?.sounds?.permissions)
+  expect(stored?.sounds?.errors).not.toBe(initial?.sounds?.errors)
+})
+
+test("toggling updates startup switch updates localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const switchContainer = dialog.locator(settingsUpdatesStartupSelector)
+  await expect(switchContainer).toBeVisible()
+
+  const toggleInput = switchContainer.locator('[data-slot="switch-input"]')
+
+  const isDisabled = await toggleInput.evaluate((el: HTMLInputElement) => el.disabled)
+  if (isDisabled) {
+    test.skip()
+    return
+  }
+
+  const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(initialState).toBe(true)
+
+  await switchContainer.locator('[data-slot="switch-control"]').click()
+  await page.waitForTimeout(100)
+
+  const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(newState).toBe(false)
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.updates?.startup).toBe(false)
+})
+
+test("toggling release notes switch updates localStorage", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const dialog = await openSettings(page)
+  const switchContainer = dialog.locator(settingsReleaseNotesSelector)
+  await expect(switchContainer).toBeVisible()
+
+  const toggleInput = switchContainer.locator('[data-slot="switch-input"]')
+  const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(initialState).toBe(true)
+
+  await switchContainer.locator('[data-slot="switch-control"]').click()
+  await page.waitForTimeout(100)
+
+  const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked)
+  expect(newState).toBe(false)
+
+  const stored = await page.evaluate((key) => {
+    const raw = localStorage.getItem(key)
+    return raw ? JSON.parse(raw) : null
+  }, settingsKey)
+
+  expect(stored?.general?.releaseNotes).toBe(false)
+})

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

@@ -0,0 +1,118 @@
+import { test, expect } from "../fixtures"
+import {
+  defocus,
+  cleanupSession,
+  cleanupTestProject,
+  closeSidebar,
+  createTestProject,
+  hoverSessionItem,
+  openSidebar,
+  waitSession,
+} from "../actions"
+import { projectSwitchSelector } from "../selectors"
+import { dirSlug } from "../utils"
+
+test("collapsed sidebar popover stays open when archiving a session", async ({ page, slug, sdk, gotoSession }) => {
+  const stamp = Date.now()
+
+  const one = await sdk.session.create({ title: `e2e sidebar popover archive 1 ${stamp}` }).then((r) => r.data)
+  const two = await sdk.session.create({ title: `e2e sidebar popover archive 2 ${stamp}` }).then((r) => r.data)
+
+  if (!one?.id) throw new Error("Session create did not return an id")
+  if (!two?.id) throw new Error("Session create did not return an id")
+
+  try {
+    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()
+
+    const item = await hoverSessionItem(page, one.id)
+    await item
+      .getByRole("button", { name: /archive/i })
+      .first()
+      .click()
+
+    await expect(twoItem).toBeVisible()
+  } finally {
+    await cleanupSession({ sdk, sessionID: one.id })
+    await cleanupSession({ sdk, sessionID: two.id })
+  }
+})
+
+test("open sidebar project popover stays closed after clicking avatar", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const slug = dirSlug(other)
+
+  try {
+    await withProject(
+      async () => {
+        await openSidebar(page)
+
+        const project = page.locator(projectSwitchSelector(slug)).first()
+        const card = page.locator('[data-component="hover-card-content"]')
+
+        await expect(project).toBeVisible()
+        await project.hover()
+        await expect(card.getByText(/recent sessions/i)).toBeVisible()
+
+        await page.mouse.down()
+        await expect(card).toHaveCount(0)
+        await page.mouse.up()
+
+        await waitSession(page, { directory: other })
+        await expect(card).toHaveCount(0)
+      },
+      { extra: [other] },
+    )
+  } finally {
+    await cleanupTestProject(other)
+  }
+})
+
+test("open sidebar project switch activates on first tabbed enter", async ({ page, withProject }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const slug = dirSlug(other)
+
+  try {
+    await withProject(
+      async () => {
+        await openSidebar(page)
+        await defocus(page)
+
+        const project = page.locator(projectSwitchSelector(slug)).first()
+
+        await expect(project).toBeVisible()
+
+        let hit = false
+        for (let i = 0; i < 20; i++) {
+          hit = await project.evaluate((el) => {
+            return el.matches(":focus") || !!el.parentElement?.matches(":focus")
+          })
+          if (hit) break
+          await page.keyboard.press("Tab")
+        }
+
+        expect(hit).toBe(true)
+
+        await page.keyboard.press("Enter")
+        await waitSession(page, { directory: other })
+      },
+      { extra: [other] },
+    )
+  } finally {
+    await cleanupTestProject(other)
+  }
+})

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

@@ -0,0 +1,30 @@
+import { test, expect } from "../fixtures"
+import { cleanupSession, openSidebar, withSession } from "../actions"
+import { promptSelector } from "../selectors"
+
+test("sidebar session links navigate to the selected session", async ({ page, slug, sdk, gotoSession }) => {
+  const stamp = Date.now()
+
+  const one = await sdk.session.create({ title: `e2e sidebar nav 1 ${stamp}` }).then((r) => r.data)
+  const two = await sdk.session.create({ title: `e2e sidebar nav 2 ${stamp}` }).then((r) => r.data)
+
+  if (!one?.id) throw new Error("Session create did not return an id")
+  if (!two?.id) throw new Error("Session create did not return an id")
+
+  try {
+    await gotoSession(one.id)
+
+    await openSidebar(page)
+
+    const target = page.locator(`[data-session-id="${two.id}"] a`).first()
+    await expect(target).toBeVisible()
+    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 })
+  }
+})

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

@@ -0,0 +1,40 @@
+import { test, expect } from "../fixtures"
+import { openSidebar, toggleSidebar, withSession } from "../actions"
+
+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 toggleSidebar(page)
+  await expect(button).toHaveAttribute("aria-expanded", "true")
+})
+
+test("sidebar collapsed state persists across navigation and reload", async ({ page, sdk, gotoSession }) => {
+  await withSession(sdk, "sidebar persist session 1", async (session1) => {
+    await withSession(sdk, "sidebar persist session 2", async (session2) => {
+      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 gotoSession(session2.id)
+      await expect(button).toHaveAttribute("aria-expanded", "false")
+
+      await page.reload()
+      await expect(button).toHaveAttribute("aria-expanded", "false")
+
+      const opened = await page.evaluate(
+        () => JSON.parse(localStorage.getItem("opencode.global.dat:layout") ?? "{}").sidebar?.opened,
+      )
+      await expect(opened).toBe(false)
+    })
+  })
+})

packages/app/e2e/status/status-popover.spec.ts

@@ -0,0 +1,94 @@
+import { test, expect } from "../fixtures"
+import { openStatusPopover } from "../actions"
+
+test("status popover opens and shows tabs", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const { popoverBody } = await openStatusPopover(page)
+
+  await expect(popoverBody.getByRole("tab", { name: /servers/i })).toBeVisible()
+  await expect(popoverBody.getByRole("tab", { name: /mcp/i })).toBeVisible()
+  await expect(popoverBody.getByRole("tab", { name: /lsp/i })).toBeVisible()
+  await expect(popoverBody.getByRole("tab", { name: /plugins/i })).toBeVisible()
+
+  await page.keyboard.press("Escape")
+  await expect(popoverBody).toHaveCount(0)
+})
+
+test("status popover servers tab shows current server", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const { popoverBody } = await openStatusPopover(page)
+
+  const serversTab = popoverBody.getByRole("tab", { name: /servers/i })
+  await expect(serversTab).toHaveAttribute("aria-selected", "true")
+
+  const serverList = popoverBody.locator('[role="tabpanel"]').first()
+  await expect(serverList.locator("button").first()).toBeVisible()
+})
+
+test("status popover can switch to mcp tab", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const { popoverBody } = await openStatusPopover(page)
+
+  const mcpTab = popoverBody.getByRole("tab", { name: /mcp/i })
+  await mcpTab.click()
+
+  const ariaSelected = await mcpTab.getAttribute("aria-selected")
+  expect(ariaSelected).toBe("true")
+
+  const mcpContent = popoverBody.locator('[role="tabpanel"]:visible').first()
+  await expect(mcpContent).toBeVisible()
+})
+
+test("status popover can switch to lsp tab", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const { popoverBody } = await openStatusPopover(page)
+
+  const lspTab = popoverBody.getByRole("tab", { name: /lsp/i })
+  await lspTab.click()
+
+  const ariaSelected = await lspTab.getAttribute("aria-selected")
+  expect(ariaSelected).toBe("true")
+
+  const lspContent = popoverBody.locator('[role="tabpanel"]:visible').first()
+  await expect(lspContent).toBeVisible()
+})
+
+test("status popover can switch to plugins tab", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const { popoverBody } = await openStatusPopover(page)
+
+  const pluginsTab = popoverBody.getByRole("tab", { name: /plugins/i })
+  await pluginsTab.click()
+
+  const ariaSelected = await pluginsTab.getAttribute("aria-selected")
+  expect(ariaSelected).toBe("true")
+
+  const pluginsContent = popoverBody.locator('[role="tabpanel"]:visible').first()
+  await expect(pluginsContent).toBeVisible()
+})
+
+test("status popover closes on escape", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const { popoverBody } = await openStatusPopover(page)
+  await expect(popoverBody).toBeVisible()
+
+  await page.keyboard.press("Escape")
+  await expect(popoverBody).toHaveCount(0)
+})
+
+test("status popover closes when clicking outside", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const { popoverBody } = await openStatusPopover(page)
+  await expect(popoverBody).toBeVisible()
+
+  await page.getByRole("main").click({ position: { x: 5, y: 5 } })
+
+  await expect(popoverBody).toHaveCount(0)
+})

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

@@ -0,0 +1,28 @@
+import { test, expect } from "../fixtures"
+import { waitTerminalFocusIdle, waitTerminalReady } from "../actions"
+import { promptSelector, terminalSelector } from "../selectors"
+import { terminalToggleKey } from "../utils"
+
+test("smoke terminal mounts and can create a second tab", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const terminals = page.locator(terminalSelector)
+  const tabs = page.locator('#terminal-panel [data-slot="tabs-trigger"]')
+  const opened = await terminals.first().isVisible()
+
+  if (!opened) {
+    await page.keyboard.press(terminalToggleKey)
+  }
+
+  await waitTerminalFocusIdle(page, { term: terminals.first() })
+  await expect(terminals).toHaveCount(1)
+
+  // Ghostty captures a lot of keybinds when focused; move focus back
+  // to the app shell before triggering `terminal.new`.
+  await page.locator(promptSelector).click()
+  await page.keyboard.press("Control+Alt+T")
+
+  await expect(tabs).toHaveCount(2)
+  await expect(terminals).toHaveCount(1)
+  await waitTerminalReady(page, { term: terminals.first() })
+})

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

@@ -0,0 +1,46 @@
+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

@@ -0,0 +1,168 @@
+import type { Page } from "@playwright/test"
+import { runTerminal, waitTerminalReady } from "../actions"
+import { test, expect } from "../fixtures"
+import { dropdownMenuContentSelector, 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 })
+  })
+})
+
+test("terminal tab can be renamed from the context menu", async ({ page, withProject }) => {
+  await withProject(async ({ directory, gotoSession }) => {
+    const key = workspacePersistKey(directory, "terminal")
+    const rename = `E2E term ${Date.now()}`
+    const tab = page.locator('#terminal-panel [data-slot="tabs-trigger"]').first()
+
+    await gotoSession()
+    await open(page)
+
+    await expect(tab).toContainText(/Terminal 1/)
+    await tab.click({ button: "right" })
+
+    const menu = page.locator(dropdownMenuContentSelector).first()
+    await expect(menu).toBeVisible()
+    await menu.getByRole("menuitem", { name: /^Rename$/i }).click()
+    await expect(menu).toHaveCount(0)
+
+    const input = page.locator('#terminal-panel input[type="text"]').first()
+    await expect(input).toBeVisible()
+    await input.fill(rename)
+    await input.press("Enter")
+
+    await expect(input).toHaveCount(0)
+    await expect(tab).toContainText(rename)
+    await expect
+      .poll(
+        async () => {
+          const state = await store(page, key)
+          return state?.all[0]?.title
+        },
+        { timeout: 5_000 },
+      )
+      .toBe(rename)
+  })
+})

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

@@ -0,0 +1,18 @@
+import { test, expect } from "../fixtures"
+import { waitTerminalReady } from "../actions"
+import { terminalSelector } from "../selectors"
+import { terminalToggleKey } from "../utils"
+
+test("terminal panel can be toggled", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  const terminal = page.locator(terminalSelector)
+  const initiallyOpen = await terminal.isVisible()
+  if (initiallyOpen) {
+    await page.keyboard.press(terminalToggleKey)
+    await expect(terminal).toHaveCount(0)
+  }
+
+  await page.keyboard.press(terminalToggleKey)
+  await waitTerminalReady(page, { term: terminal })
+})

packages/app/e2e/thinking-level.spec.ts

@@ -0,0 +1,25 @@
+import { test, expect } from "./fixtures"
+import { modelVariantCycleSelector } from "./selectors"
+
+test("smoke model variant cycle updates label", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await page.addStyleTag({
+    content: `${modelVariantCycleSelector} { display: inline-block !important; }`,
+  })
+
+  const button = page.locator(modelVariantCycleSelector)
+  const exists = (await button.count()) > 0
+  test.skip(!exists, "current model has no variants")
+  if (!exists) return
+
+  await expect(button).toBeVisible()
+
+  const before = (await button.innerText()).trim()
+  await button.click()
+  await expect(button).not.toHaveText(before)
+
+  const after = (await button.innerText()).trim()
+  await button.click()
+  await expect(button).not.toHaveText(after)
+})

packages/app/e2e/todo.spec.ts

@@ -1,11 +0,0 @@
-import { test } from "@playwright/test"
-
-test(
-  "test something cool",
-  {
-    annotation: { type: "todo" },
-  },
-  async () => {
-    test.fixme()
-  },
-)

packages/app/e2e/tsconfig.json

@@ -5,5 +5,5 @@
     "rootDir": "..",
     "types": ["node", "bun"]
   },
-  "include": ["./**/*.ts"]
+  "include": ["./**/*.ts", "../src/testing/terminal.ts"]
 }

packages/app/e2e/utils.ts

@@ -0,0 +1,63 @@
+import { createOpencodeClient } from "@opencode-ai/sdk/v2/client"
+import { base64Encode, checksum } 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"
+
+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"
+
+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()
+  const data = result.data
+  if (!data?.worktree) throw new Error(`Failed to resolve a worktree from ${serverUrl}/path`)
+  return data.worktree
+}
+
+export function dirSlug(directory: string) {
+  return base64Encode(directory)
+}
+
+export function dirPath(directory: string) {
+  return `/${dirSlug(directory)}`
+}
+
+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/index.html

@@ -2,7 +2,7 @@
 <html lang="en" style="background-color: var(--background-base)">
   <head>
     <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, interactive-widget=resizes-content" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>OpenCode</title>
     <link rel="icon" type="image/png" href="/favicon-96x96-v3.png" sizes="96x96" />
     <link rel="icon" type="image/svg+xml" href="/favicon-v3.svg" />

packages/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/app",
-  "version": "1.4.4",
+  "version": "1.3.2",
   "description": "",
   "type": "module",
   "exports": {
@@ -15,18 +15,17 @@
     "build": "vite build",
     "serve": "vite preview",
     "test": "bun run test:unit",
-    "test:ci": "mkdir -p .artifacts/unit && bun test --preload ./happydom.ts ./src --reporter=junit --reporter-outfile=.artifacts/unit/junit.xml",
     "test:unit": "bun test --preload ./happydom.ts ./src",
     "test:unit:watch": "bun test --watch --preload ./happydom.ts ./src",
     "test:e2e": "playwright test",
-    "test:e2e:local": "playwright test",
+    "test:e2e:local": "bun script/e2e-local.ts",
     "test:e2e:ui": "playwright test --ui",
     "test:e2e:report": "playwright show-report e2e/playwright-report"
   },
   "license": "MIT",
   "devDependencies": {
     "@happy-dom/global-registrator": "20.0.11",
-    "@playwright/test": "catalog:",
+    "@playwright/test": "1.57.0",
     "@tailwindcss/vite": "catalog:",
     "@tsconfig/bun": "1.0.9",
     "@types/bun": "catalog:",
@@ -47,10 +46,9 @@
     "@solid-primitives/active-element": "2.1.3",
     "@solid-primitives/audio": "1.4.2",
     "@solid-primitives/event-bus": "1.1.2",
-    "@solid-primitives/event-listener": "2.4.5",
     "@solid-primitives/i18n": "2.2.1",
     "@solid-primitives/media": "2.3.3",
-    "@solid-primitives/resize-observer": "2.1.5",
+    "@solid-primitives/resize-observer": "2.1.3",
     "@solid-primitives/scroll": "2.1.3",
     "@solid-primitives/storage": "catalog:",
     "@solid-primitives/timer": "1.4.4",

packages/app/playwright.config.ts

@@ -7,11 +7,6 @@ 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
-const reporter = [["html", { outputFolder: "e2e/playwright-report", open: "never" }], ["line"]] as const
-
-if (process.env.PLAYWRIGHT_JUNIT_OUTPUT) {
-  reporter.push(["junit", { outputFile: process.env.PLAYWRIGHT_JUNIT_OUTPUT }])
-}
 
 export default defineConfig({
   testDir: "./e2e",
@@ -24,7 +19,7 @@ export default defineConfig({
   forbidOnly: !!process.env.CI,
   retries: process.env.CI ? 2 : 0,
   workers,
-  reporter,
+  reporter: [["html", { outputFolder: "e2e/playwright-report", open: "never" }], ["line"]],
   webServer: {
     command,
     url: baseURL,

packages/app/script/e2e-local.ts

@@ -0,0 +1,180 @@
+import fs from "node:fs/promises"
+import net from "node:net"
+import os from "node:os"
+import path from "node:path"
+
+async function freePort() {
+  return await new Promise<number>((resolve, reject) => {
+    const server = net.createServer()
+    server.once("error", reject)
+    server.listen(0, () => {
+      const address = server.address()
+      if (!address || typeof address === "string") {
+        server.close(() => reject(new Error("Failed to acquire a free port")))
+        return
+      }
+      server.close((err) => {
+        if (err) {
+          reject(err)
+          return
+        }
+        resolve(address.port)
+      })
+    })
+  })
+}
+
+async function waitForHealth(url: string) {
+  const timeout = Date.now() + 120_000
+  const errors: string[] = []
+  while (Date.now() < timeout) {
+    const result = await fetch(url)
+      .then((r) => ({ ok: r.ok, error: undefined }))
+      .catch((error) => ({
+        ok: false,
+        error: error instanceof Error ? error.message : String(error),
+      }))
+    if (result.ok) return
+    if (result.error) errors.push(result.error)
+    await new Promise((r) => setTimeout(r, 250))
+  }
+  const last = errors.length ? ` (last error: ${errors[errors.length - 1]})` : ""
+  throw new Error(`Timed out waiting for server health: ${url}${last}`)
+}
+
+const appDir = process.cwd()
+const repoDir = path.resolve(appDir, "../..")
+const opencodeDir = path.join(repoDir, "packages", "opencode")
+
+const extraArgs = (() => {
+  const args = process.argv.slice(2)
+  if (args[0] === "--") return args.slice(1)
+  return args
+})()
+
+const [serverPort, webPort] = await Promise.all([freePort(), freePort()])
+
+const sandbox = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-"))
+const keepSandbox = process.env.OPENCODE_E2E_KEEP_SANDBOX === "1"
+
+const serverEnv = {
+  ...process.env,
+  OPENCODE_DISABLE_SHARE: process.env.OPENCODE_DISABLE_SHARE ?? "true",
+  OPENCODE_DISABLE_LSP_DOWNLOAD: "true",
+  OPENCODE_DISABLE_DEFAULT_PLUGINS: "true",
+  OPENCODE_EXPERIMENTAL_DISABLE_FILEWATCHER: "true",
+  OPENCODE_TEST_HOME: path.join(sandbox, "home"),
+  XDG_DATA_HOME: path.join(sandbox, "share"),
+  XDG_CACHE_HOME: path.join(sandbox, "cache"),
+  XDG_CONFIG_HOME: path.join(sandbox, "config"),
+  XDG_STATE_HOME: path.join(sandbox, "state"),
+  OPENCODE_E2E_PROJECT_DIR: repoDir,
+  OPENCODE_E2E_SESSION_TITLE: "E2E Session",
+  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 = {
+  ...serverEnv,
+  PLAYWRIGHT_SERVER_HOST: "127.0.0.1",
+  PLAYWRIGHT_SERVER_PORT: String(serverPort),
+  VITE_OPENCODE_SERVER_HOST: "127.0.0.1",
+  VITE_OPENCODE_SERVER_PORT: String(serverPort),
+  PLAYWRIGHT_PORT: String(webPort),
+} satisfies Record<string, string>
+
+let seed: ReturnType<typeof Bun.spawn> | undefined
+let runner: ReturnType<typeof Bun.spawn> | undefined
+let server: { stop: () => Promise<void> | void } | undefined
+let inst: { Instance: { disposeAll: () => Promise<void> | void } } | undefined
+let cleaned = false
+
+const cleanup = async () => {
+  if (cleaned) return
+  cleaned = true
+
+  if (seed && seed.exitCode === null) seed.kill("SIGTERM")
+  if (runner && runner.exitCode === null) runner.kill("SIGTERM")
+
+  const jobs = [
+    inst?.Instance.disposeAll(),
+    server?.stop(),
+    keepSandbox ? undefined : fs.rm(sandbox, { recursive: true, force: true }),
+  ].filter(Boolean)
+  await Promise.allSettled(jobs)
+}
+
+const shutdown = (code: number, reason: string) => {
+  process.exitCode = code
+  void cleanup().finally(() => {
+    console.error(`e2e-local shutdown: ${reason}`)
+    process.exit(code)
+  })
+}
+
+const reportInternalError = (reason: string, error: unknown) => {
+  console.warn(`e2e-local ignored server error: ${reason}`)
+  console.warn(error)
+}
+
+process.once("SIGINT", () => shutdown(130, "SIGINT"))
+process.once("SIGTERM", () => shutdown(143, "SIGTERM"))
+process.once("SIGHUP", () => shutdown(129, "SIGHUP"))
+process.once("uncaughtException", (error) => {
+  reportInternalError("uncaughtException", error)
+})
+process.once("unhandledRejection", (error) => {
+  reportInternalError("unhandledRejection", error)
+})
+
+let code = 1
+
+try {
+  seed = Bun.spawn(["bun", "script/seed-e2e.ts"], {
+    cwd: opencodeDir,
+    env: serverEnv,
+    stdout: "inherit",
+    stderr: "inherit",
+  })
+
+  const seedExit = await seed.exited
+  if (seedExit !== 0) {
+    code = seedExit
+  } else {
+    Object.assign(process.env, serverEnv)
+    process.env.AGENT = "1"
+    process.env.OPENCODE = "1"
+    process.env.OPENCODE_PID = String(process.pid)
+
+    const log = await import("../../opencode/src/util/log")
+    const install = await import("../../opencode/src/installation")
+    await log.Log.init({
+      print: true,
+      dev: install.Installation.isLocal(),
+      level: "WARN",
+    })
+
+    const servermod = await import("../../opencode/src/server/server")
+    inst = await import("../../opencode/src/project/instance")
+    server = servermod.Server.listen({ port: serverPort, hostname: "127.0.0.1" })
+    console.log(`opencode server listening on http://127.0.0.1:${serverPort}`)
+
+    await waitForHealth(`http://127.0.0.1:${serverPort}/global/health`)
+    runner = Bun.spawn(["bun", "test:e2e", ...extraArgs], {
+      cwd: appDir,
+      env: runnerEnv,
+      stdout: "inherit",
+      stderr: "inherit",
+    })
+    code = await runner.exited
+  }
+} catch (error) {
+  console.error(error)
+  code = 1
+} finally {
+  await cleanup()
+}
+
+process.exit(code)

packages/app/src/app.tsx

@@ -6,7 +6,7 @@ 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/context"
+import { ThemeProvider } from "@opencode-ai/ui/theme"
 import { MetaProvider } from "@solidjs/meta"
 import { type BaseRouterProps, Navigate, Route, Router } from "@solidjs/router"
 import { QueryClient, QueryClientProvider } from "@tanstack/solid-query"
@@ -32,11 +32,12 @@ import { FileProvider } from "@/context/file"
 import { GlobalSDKProvider } from "@/context/global-sdk"
 import { GlobalSyncProvider } from "@/context/global-sync"
 import { HighlightsProvider } from "@/context/highlights"
-import { LanguageProvider, type Locale, useLanguage } from "@/context/language"
+import { LanguageProvider, useLanguage } from "@/context/language"
 import { LayoutProvider } from "@/context/layout"
 import { ModelsProvider } from "@/context/models"
 import { NotificationProvider } from "@/context/notification"
 import { PermissionProvider } from "@/context/permission"
+import { usePlatform } from "@/context/platform"
 import { PromptProvider } from "@/context/prompt"
 import { ServerConnection, ServerProvider, serverName, useServer } from "@/context/server"
 import { SettingsProvider } from "@/context/settings"
@@ -47,14 +48,9 @@ import { ErrorPage } from "./pages/error"
 import { useCheckServerHealth } from "./utils/server-health"
 
 const HomeRoute = lazy(() => import("@/pages/home"))
-const loadSession = () => import("@/pages/session")
-const Session = lazy(loadSession)
+const Session = lazy(() => import("@/pages/session"))
 const Loading = () => <div class="size-full" />
 
-if (typeof location === "object" && /\/session(?:\/|$)/.test(location.pathname)) {
-  void loadSession()
-}
-
 const SessionRoute = () => (
   <SessionProviders>
     <Session />
@@ -81,6 +77,11 @@ declare global {
   }
 }
 
+function MarkedProviderWithNativeParser(props: ParentProps) {
+  const platform = usePlatform()
+  return <MarkedProvider nativeParser={platform.parseMarkdown}>{props.children}</MarkedProvider>
+}
+
 function QueryProvider(props: ParentProps) {
   const client = new QueryClient()
   return <QueryClientProvider client={client}>{props.children}</QueryClientProvider>
@@ -129,7 +130,7 @@ function RouterRoot(props: ParentProps<{ appChildren?: JSX.Element }>) {
   )
 }
 
-export function AppBaseProviders(props: ParentProps<{ locale?: Locale }>) {
+export function AppBaseProviders(props: ParentProps) {
   return (
     <MetaProvider>
       <Font />
@@ -138,14 +139,14 @@ export function AppBaseProviders(props: ParentProps<{ locale?: Locale }>) {
           void window.api?.setTitlebar?.({ mode })
         }}
       >
-        <LanguageProvider locale={props.locale}>
+        <LanguageProvider>
           <UiI18nBridge>
             <ErrorBoundary fallback={(error) => <ErrorPage error={error} />}>
               <QueryProvider>
                 <DialogProvider>
-                  <MarkedProvider>
+                  <MarkedProviderWithNativeParser>
                     <FileComponentProvider component={File}>{props.children}</FileComponentProvider>
-                  </MarkedProvider>
+                  </MarkedProviderWithNativeParser>
                 </DialogProvider>
               </QueryProvider>
             </ErrorBoundary>
@@ -182,7 +183,8 @@ function ConnectionGate(props: ParentProps<{ disableHealthCheck?: boolean }>) {
             if (checkMode() === "background" || type === "http") return false
           }
         }).pipe(
-          Effect.timeoutOrElse({ duration: "10 seconds", orElse: () => Effect.succeed(false) }),
+          effectMinDuration(checkMode() === "blocking" ? "1.2 seconds" : 0),
+          Effect.timeoutOrElse({ duration: "10 seconds", onTimeout: () => Effect.succeed(false) }),
           Effect.ensuring(Effect.sync(() => setCheckMode("background"))),
           Effect.runPromise,
         ),
@@ -282,11 +284,7 @@ export function AppInterface(props: {
   disableHealthCheck?: boolean
 }) {
   return (
-    <ServerProvider
-      defaultServer={props.defaultServer}
-      disableHealthCheck={props.disableHealthCheck}
-      servers={props.servers}
-    >
+    <ServerProvider defaultServer={props.defaultServer} servers={props.servers}>
       <ConnectionGate disableHealthCheck={props.disableHealthCheck}>
         <ServerKey>
           <GlobalSDKProvider>

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

@@ -1,7 +1,6 @@
 import { useIsRouting, useLocation } from "@solidjs/router"
 import { batch, createEffect, onCleanup, onMount } from "solid-js"
 import { createStore } from "solid-js/store"
-import { makeEventListener } from "@solid-primitives/event-listener"
 import { Tooltip } from "@opencode-ai/ui/tooltip"
 import { useLanguage } from "@/context/language"
 
@@ -350,12 +349,13 @@ export function DebugBar() {
 
     syncHeap()
     start()
-    makeEventListener(document, "visibilitychange", vis)
+    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()
     })
   })

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

@@ -1,4 +1,4 @@
-import type { ProviderAuthAuthorization, ProviderAuthMethod } from "@opencode-ai/sdk/v2/client"
+import type { ProviderAuthAuthorization } from "@opencode-ai/sdk/v2/client"
 import { Button } from "@opencode-ai/ui/button"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { Dialog } from "@opencode-ai/ui/dialog"
@@ -9,26 +9,19 @@ import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
 import { Spinner } from "@opencode-ai/ui/spinner"
 import { TextField } from "@opencode-ai/ui/text-field"
 import { showToast } from "@opencode-ai/ui/toast"
-import { createEffect, createMemo, createResource, Match, onCleanup, onMount, Switch } from "solid-js"
+import { createMemo, Match, onCleanup, onMount, Switch } from "solid-js"
 import { createStore, produce } 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 { useProviders } from "@/hooks/use-providers"
+import { DialogSelectProvider } from "./dialog-select-provider"
 
 export function DialogConnectProvider(props: { provider: string }) {
   const dialog = useDialog()
   const globalSync = useGlobalSync()
   const globalSDK = useGlobalSDK()
   const language = useLanguage()
-  const providers = useProviders()
-
-  const all = () => {
-    void import("./dialog-select-provider").then((x) => {
-      dialog.show(() => <x.DialogSelectProvider />)
-    })
-  }
 
   const alive = { value: true }
   const timer = { current: undefined as ReturnType<typeof setTimeout> | undefined }
@@ -40,30 +33,16 @@ export function DialogConnectProvider(props: { provider: string }) {
     timer.current = undefined
   })
 
-  const provider = createMemo(
+  const provider = createMemo(() => globalSync.data.provider.all.find((x) => x.id === props.provider)!)
+  const methods = createMemo(
     () =>
-      providers.all().find((x) => x.id === props.provider) ??
-      globalSync.data.provider.all.find((x) => x.id === props.provider)!,
+      globalSync.data.provider_auth[props.provider] ?? [
+        {
+          type: "api",
+          label: language.t("provider.connect.method.apiKey"),
+        },
+      ],
   )
-  const fallback = createMemo<ProviderAuthMethod[]>(() => [
-    {
-      type: "api" as const,
-      label: language.t("provider.connect.method.apiKey"),
-    },
-  ])
-  const [auth] = createResource(
-    () => props.provider,
-    async () => {
-      const cached = globalSync.data.provider_auth[props.provider]
-      if (cached) return cached
-      const res = await globalSDK.client.provider.auth()
-      if (!alive.value) return fallback()
-      globalSync.set("provider_auth", res.data ?? {})
-      return res.data?.[props.provider] ?? fallback()
-    },
-  )
-  const loading = createMemo(() => auth.loading && !globalSync.data.provider_auth[props.provider])
-  const methods = createMemo(() => auth.latest ?? globalSync.data.provider_auth[props.provider] ?? fallback())
   const [store, setStore] = createStore({
     methodIndex: undefined as undefined | number,
     authorization: undefined as undefined | ProviderAuthAuthorization,
@@ -198,11 +177,7 @@ export function DialogConnectProvider(props: { provider: string }) {
       index: 0,
     })
 
-    const prompts = createMemo<NonNullable<ProviderAuthMethod["prompts"]>>(() => {
-      const value = method()
-      if (value?.type !== "oauth") return []
-      return value.prompts ?? []
-    })
+    const prompts = createMemo(() => method()?.prompts ?? [])
     const matches = (prompt: NonNullable<ReturnType<typeof prompts>[number]>, value: Record<string, string>) => {
       if (!prompt.when) return true
       const actual = value[prompt.when.key]
@@ -321,12 +296,8 @@ export function DialogConnectProvider(props: { provider: string }) {
     listRef?.onKeyDown(e)
   }
 
-  let auto = false
-  createEffect(() => {
-    if (auto) return
-    if (loading()) return
+  onMount(() => {
     if (methods().length === 1) {
-      auto = true
       selectMethod(0)
     }
   })
@@ -344,7 +315,7 @@ export function DialogConnectProvider(props: { provider: string }) {
 
   function goBack() {
     if (methods().length === 1) {
-      all()
+      dialog.show(() => <DialogSelectProvider />)
       return
     }
     if (store.authorization) {
@@ -355,7 +326,7 @@ export function DialogConnectProvider(props: { provider: string }) {
       dispatch({ type: "method.reset" })
       return
     }
-    all()
+    dialog.show(() => <DialogSelectProvider />)
   }
 
   function MethodSelection() {
@@ -602,14 +573,6 @@ export function DialogConnectProvider(props: { provider: string }) {
         <div class="px-2.5 pb-10 flex flex-col gap-6">
           <div onKeyDown={handleKey} tabIndex={0} autofocus={store.methodIndex === undefined ? true : undefined}>
             <Switch>
-              <Match when={loading()}>
-                <div class="text-14-regular text-text-base">
-                  <div class="flex items-center gap-x-2">
-                    <Spinner />
-                    <span>{language.t("provider.connect.status.inProgress")}</span>
-                  </div>
-                </div>
-              </Match>
               <Match when={store.methodIndex === undefined}>
                 <MethodSelection />
               </Match>

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

@@ -1,12 +1,10 @@
 import { useMutation } from "@tanstack/solid-query"
-import { Component, createEffect, createMemo, on, Show } from "solid-js"
-import { createStore } from "solid-js/store"
+import { Component, createMemo, Show } from "solid-js"
 import { useSync } from "@/context/sync"
 import { useSDK } from "@/context/sdk"
 import { Dialog } from "@opencode-ai/ui/dialog"
 import { List } from "@opencode-ai/ui/list"
 import { Switch } from "@opencode-ai/ui/switch"
-import { showToast } from "@opencode-ai/ui/toast"
 import { useLanguage } from "@/context/language"
 
 const statusLabels = {
@@ -20,48 +18,6 @@ export const DialogSelectMcp: Component = () => {
   const sync = useSync()
   const sdk = useSDK()
   const language = useLanguage()
-  const [state, setState] = createStore({
-    done: false,
-    loading: false,
-  })
-
-  createEffect(
-    on(
-      () => sync.data.mcp_ready,
-      (ready, prev) => {
-        if (!ready && prev) setState("done", false)
-      },
-      { defer: true },
-    ),
-  )
-
-  createEffect(() => {
-    if (state.done || state.loading) return
-    if (sync.data.mcp_ready) {
-      setState("done", true)
-      return
-    }
-
-    setState("loading", true)
-    void sdk.client.mcp
-      .status()
-      .then((result) => {
-        sync.set("mcp", result.data ?? {})
-        sync.set("mcp_ready", true)
-        setState("done", true)
-      })
-      .catch((err) => {
-        setState("done", true)
-        showToast({
-          variant: "error",
-          title: language.t("common.requestFailed"),
-          description: err instanceof Error ? err.message : String(err),
-        })
-      })
-      .finally(() => {
-        setState("loading", false)
-      })
-  })
 
   const items = createMemo(() =>
     Object.entries(sync.data.mcp ?? {})

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

@@ -8,6 +8,8 @@ import { Tooltip } from "@opencode-ai/ui/tooltip"
 import { type Component, Show } from "solid-js"
 import { useLocal } from "@/context/local"
 import { popularProviders, useProviders } from "@/hooks/use-providers"
+import { DialogConnectProvider } from "./dialog-connect-provider"
+import { DialogSelectProvider } from "./dialog-select-provider"
 import { ModelTooltip } from "./model-tooltip"
 import { useLanguage } from "@/context/language"
 
@@ -19,18 +21,6 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
   const providers = useProviders()
   const language = useLanguage()
 
-  const connect = (provider: string) => {
-    void import("./dialog-connect-provider").then((x) => {
-      dialog.show(() => <x.DialogConnectProvider provider={provider} />)
-    })
-  }
-
-  const all = () => {
-    void import("./dialog-select-provider").then((x) => {
-      dialog.show(() => <x.DialogSelectProvider />)
-    })
-  }
-
   let listRef: ListRef | undefined
   const handleKeyDown = (e: KeyboardEvent) => {
     if (e.key === "Escape") return
@@ -101,7 +91,7 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
                 }}
                 onSelect={(x) => {
                   if (!x) return
-                  connect(x.id)
+                  dialog.show(() => <DialogConnectProvider provider={x.id} />)
                 }}
               >
                 {(i) => (
@@ -132,7 +122,9 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
                 variant="ghost"
                 class="w-full justify-start px-[11px] py-3.5 gap-4.5 text-14-medium"
                 icon="dot-grid"
-                onClick={all}
+                onClick={() => {
+                  dialog.show(() => <DialogSelectProvider />)
+                }}
               >
                 {language.t("dialog.provider.viewAll")}
               </Button>

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

@@ -10,6 +10,8 @@ import { Tag } from "@opencode-ai/ui/tag"
 import { Dialog } from "@opencode-ai/ui/dialog"
 import { List } from "@opencode-ai/ui/list"
 import { Tooltip } from "@opencode-ai/ui/tooltip"
+import { DialogSelectProvider } from "./dialog-select-provider"
+import { DialogManageModels } from "./dialog-manage-models"
 import { ModelTooltip } from "./model-tooltip"
 import { useLanguage } from "@/context/language"
 
@@ -86,7 +88,6 @@ const ModelList: Component<{
 }
 
 type ModelSelectorTriggerProps = Omit<ComponentProps<typeof Kobalte.Trigger>, "as" | "ref">
-type Dismiss = "escape" | "outside" | "select" | "manage" | "provider"
 
 export function ModelSelectorPopover(props: {
   provider?: string
@@ -94,34 +95,24 @@ export function ModelSelectorPopover(props: {
   children?: JSX.Element
   triggerAs?: ValidComponent
   triggerProps?: ModelSelectorTriggerProps
-  onClose?: (cause: "escape" | "select") => void
 }) {
   const [store, setStore] = createStore<{
     open: boolean
-    dismiss: Dismiss | null
+    dismiss: "escape" | "outside" | null
   }>({
     open: false,
     dismiss: null,
   })
   const dialog = useDialog()
 
-  const close = (dismiss: Dismiss) => {
-    setStore("dismiss", dismiss)
-    setStore("open", false)
-  }
-
   const handleManage = () => {
-    close("manage")
-    void import("./dialog-manage-models").then((x) => {
-      dialog.show(() => <x.DialogManageModels />)
-    })
+    setStore("open", false)
+    dialog.show(() => <DialogManageModels />)
   }
 
   const handleConnectProvider = () => {
-    close("provider")
-    void import("./dialog-select-provider").then((x) => {
-      dialog.show(() => <x.DialogSelectProvider />)
-    })
+    setStore("open", false)
+    dialog.show(() => <DialogSelectProvider />)
   }
   const language = useLanguage()
 
@@ -143,19 +134,21 @@ export function ModelSelectorPopover(props: {
         <Kobalte.Content
           class="w-72 h-80 flex flex-col p-2 rounded-md border border-border-base bg-surface-raised-stronger-non-alpha shadow-md z-50 outline-none overflow-hidden"
           onEscapeKeyDown={(event) => {
-            close("escape")
+            setStore("dismiss", "escape")
+            setStore("open", false)
             event.preventDefault()
             event.stopPropagation()
           }}
-          onPointerDownOutside={() => close("outside")}
-          onFocusOutside={() => close("outside")}
+          onPointerDownOutside={() => {
+            setStore("dismiss", "outside")
+            setStore("open", false)
+          }}
+          onFocusOutside={() => {
+            setStore("dismiss", "outside")
+            setStore("open", false)
+          }}
           onCloseAutoFocus={(event) => {
-            const dismiss = store.dismiss
-            if (dismiss === "outside") event.preventDefault()
-            if (dismiss === "escape" || dismiss === "select") {
-              event.preventDefault()
-              props.onClose?.(dismiss)
-            }
+            if (store.dismiss === "outside") event.preventDefault()
             setStore("dismiss", null)
           }}
         >
@@ -163,7 +156,7 @@ export function ModelSelectorPopover(props: {
           <ModelList
             provider={props.provider}
             model={props.model}
-            onSelect={() => close("select")}
+            onSelect={() => setStore("open", false)}
             class="p-1"
             action={
               <div class="flex items-center gap-1">
@@ -200,29 +193,26 @@ export const DialogSelectModel: Component<{ provider?: string; model?: ModelStat
   const dialog = useDialog()
   const language = useLanguage()
 
-  const provider = () => {
-    void import("./dialog-select-provider").then((x) => {
-      dialog.show(() => <x.DialogSelectProvider />)
-    })
-  }
-
-  const manage = () => {
-    void import("./dialog-manage-models").then((x) => {
-      dialog.show(() => <x.DialogManageModels />)
-    })
-  }
-
   return (
     <Dialog
       title={language.t("dialog.model.select.title")}
       action={
-        <Button class="h-7 -my-1 text-14-medium" icon="plus-small" tabIndex={-1} onClick={provider}>
+        <Button
+          class="h-7 -my-1 text-14-medium"
+          icon="plus-small"
+          tabIndex={-1}
+          onClick={() => dialog.show(() => <DialogSelectProvider />)}
+        >
           {language.t("command.provider.connect")}
         </Button>
       }
     >
       <ModelList provider={props.provider} model={props.model} onSelect={() => dialog.close()} />
-      <Button variant="ghost" class="ml-3 mt-5 mb-6 text-text-base self-start" onClick={manage}>
+      <Button
+        variant="ghost"
+        class="ml-3 mt-5 mb-6 text-text-base self-start"
+        onClick={() => dialog.show(() => <DialogManageModels />)}
+      >
         {language.t("dialog.model.manage")}
       </Button>
     </Dialog>

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

@@ -27,6 +27,7 @@ import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Select } from "@opencode-ai/ui/select"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { ModelSelectorPopover } from "@/components/dialog-select-model"
+import { DialogSelectModelUnpaid } from "@/components/dialog-select-model-unpaid"
 import { useProviders } from "@/hooks/use-providers"
 import { useCommand } from "@/context/command"
 import { Persist, persisted } from "@/utils/persist"
@@ -35,6 +36,7 @@ import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
 import { useSessionLayout } from "@/pages/session/session-layout"
 import { createSessionTabs } from "@/pages/session/helpers"
+import { promptEnabled, promptProbe } from "@/testing/prompt"
 import { createTextFragment, getCursorPosition, setCursorPosition, setRangeEdge } from "./prompt-input/editor-dom"
 import { createPromptAttachments } from "./prompt-input/attachments"
 import { ACCEPTED_FILE_TYPES } from "./prompt-input/files"
@@ -242,6 +244,23 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
       },
   )
   const working = createMemo(() => status()?.type !== "idle")
+  const tip = () => {
+    if (working()) {
+      return (
+        <div class="flex items-center gap-2">
+          <span>{language.t("prompt.action.stop")}</span>
+          <span class="text-icon-base text-12-medium text-[10px]!">{language.t("common.key.esc")}</span>
+        </div>
+      )
+    }
+
+    return (
+      <div class="flex items-center gap-2">
+        <span>{language.t("prompt.action.send")}</span>
+        <Icon name="enter" size="small" class="text-icon-base" />
+      </div>
+    )
+  }
   const imageAttachments = createMemo(() =>
     prompt.current().filter((part): part is ImageAttachmentPart => part.type === "image"),
   )
@@ -279,31 +298,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     if (store.mode === "shell") return 0
     return prompt.context.items().filter((item) => !!item.comment?.trim()).length
   })
-  const blank = createMemo(() => {
-    const text = prompt
-      .current()
-      .map((part) => ("content" in part ? part.content : ""))
-      .join("")
-    return text.trim().length === 0 && imageAttachments().length === 0 && commentCount() === 0
-  })
-  const stopping = createMemo(() => working() && blank())
-  const tip = () => {
-    if (stopping()) {
-      return (
-        <div class="flex items-center gap-2">
-          <span>{language.t("prompt.action.stop")}</span>
-          <span class="text-icon-base text-12-medium text-[10px]!">{language.t("common.key.esc")}</span>
-        </div>
-      )
-    }
-
-    return (
-      <div class="flex items-center gap-2">
-        <span>{language.t("prompt.action.send")}</span>
-        <Icon name="enter" size="small" class="text-icon-base" />
-      </div>
-    )
-  }
 
   const contextItems = createMemo(() => {
     const items = prompt.context.items()
@@ -509,15 +503,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     return getCursorPosition(editorRef)
   }
 
-  const restoreFocus = () => {
-    requestAnimationFrame(() => {
-      const cursor = prompt.cursor() ?? promptLength(prompt.current())
-      editorRef.focus()
-      setCursorPosition(editorRef, cursor)
-      queueScroll()
-    })
-  }
-
   const renderEditorWithCursor = (parts: Prompt) => {
     const cursor = currentCursor()
     renderEditor(parts)
@@ -587,7 +572,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
       const open = recent()
       const seen = new Set(open)
       const pinned: AtOption[] = open.map((path) => ({ type: "file", path, display: path, recent: true }))
-      if (!query.trim()) return [...agents, ...pinned]
       const paths = await files.searchFilesAndDirectories(query)
       const fileOptions: AtOption[] = paths
         .filter((path) => !seen.has(path))
@@ -638,19 +622,19 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
 
   const handleSlashSelect = (cmd: SlashCommand | undefined) => {
     if (!cmd) return
+    promptProbe.select(cmd.id)
     closePopover()
-    const images = imageAttachments()
 
     if (cmd.type === "custom") {
       const text = `/${cmd.trigger} `
       setEditorText(text)
-      prompt.set([{ type: "text", content: text, start: 0, end: text.length }, ...images], text.length)
+      prompt.set([{ type: "text", content: text, start: 0, end: text.length }], text.length)
       focusEditorEnd()
       return
     }
 
     clearEditor()
-    prompt.set([...DEFAULT_PROMPT, ...images], 0)
+    prompt.set([{ type: "text", content: "", start: 0, end: 0 }], 0)
     command.trigger(cmd.id, "slash")
   }
 
@@ -726,6 +710,21 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
       element?.scrollIntoView({ block: "nearest", behavior: "smooth" })
     })
   })
+
+  if (promptEnabled()) {
+    createEffect(() => {
+      promptProbe.set({
+        popover: store.popover,
+        slash: {
+          active: slashActive() ?? null,
+          ids: slashFlat().map((cmd) => cmd.id),
+        },
+      })
+    })
+
+    onCleanup(() => promptProbe.clear())
+  }
+
   const selectPopoverActive = () => {
     if (store.popover === "at") {
       const items = atFlat()
@@ -1062,6 +1061,17 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     if (!id) return permission.isAutoAcceptingDirectory(sdk.directory)
     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,
@@ -1305,7 +1315,11 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
           onMouseDown={(e) => {
             const target = e.target
             if (!(target instanceof HTMLElement)) return
-            if (target.closest('[data-action="prompt-attach"], [data-action="prompt-submit"]')) {
+            if (
+              target.closest(
+                '[data-action="prompt-attach"], [data-action="prompt-submit"], [data-action="prompt-permissions"]',
+              )
+            ) {
               return
             }
             editorRef?.focus()
@@ -1329,9 +1343,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
               autocapitalize={store.mode === "normal" ? "sentences" : "off"}
               autocorrect={store.mode === "normal" ? "on" : "off"}
               spellcheck={store.mode === "normal"}
-              inputMode="text"
-              // @ts-expect-error
-              autocomplete="off"
               onInput={handleInput}
               onPaste={handlePaste}
               onCompositionStart={handleCompositionStart}
@@ -1383,17 +1394,17 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
             />
 
             <div class="flex items-center gap-1 pointer-events-auto">
-              <Tooltip placement="top" inactive={!working() && blank()} value={tip()}>
+              <Tooltip placement="top" inactive={!prompt.dirty() && !working()} value={tip()}>
                 <IconButton
                   data-action="prompt-submit"
                   type="submit"
-                  disabled={store.mode !== "normal" || (!working() && blank())}
+                  disabled={store.mode !== "normal" || (!prompt.dirty() && !working() && commentCount() === 0)}
                   tabIndex={store.mode === "normal" ? undefined : -1}
-                  icon={stopping() ? "stop" : "arrow-up"}
+                  icon={working() ? "stop" : "arrow-up"}
                   variant="primary"
                   class="size-8"
                   style={buttons()}
-                  aria-label={stopping() ? language.t("prompt.action.stop") : language.t("prompt.action.send")}
+                  aria-label={working() ? language.t("prompt.action.stop") : language.t("prompt.action.send")}
                 />
               </Tooltip>
             </div>
@@ -1456,10 +1467,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                       size="normal"
                       options={agentNames()}
                       current={local.agent.current()?.name ?? ""}
-                      onSelect={(value) => {
-                        local.agent.set(value)
-                        restoreFocus()
-                      }}
+                      onSelect={local.agent.set}
                       class="capitalize max-w-[160px] text-text-base"
                       valueClass="truncate text-13-regular text-text-base"
                       triggerStyle={control()}
@@ -1468,62 +1476,24 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                     />
                   </TooltipKeybind>
                 </div>
-                <Show when={store.mode !== "shell"}>
-                  <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={() => {
-                              void import("@/components/dialog-select-model-unpaid").then((x) => {
-                                dialog.show(() => <x.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>
-                      }
-                    >
+                <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")}
                       >
-                        <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",
-                          }}
-                          onClose={restoreFocus}
+                        <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
@@ -1536,35 +1506,85 @@ 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={(value) => {
-                          local.model.variant.set(value === "default" ? undefined : value)
-                          restoreFocus()
+                      <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",
                         }}
-                        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"
-                      />
+                      >
+                        <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>
+                  </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")}
+                  >
+                    <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"
+                    />
+                  </TooltipKeybind>
+                </div>
+                <TooltipKeybind
+                  placement="top"
+                  gutter={8}
+                  title={acceptLabel()}
+                  keybind={command.keybind("permissions.autoaccept")}
+                >
+                  <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(),
+                    }}
+                    style={control()}
+                    aria-label={acceptLabel()}
+                    aria-pressed={accepting()}
+                  >
+                    <Icon name="shield" size="small" classList={{ "text-icon-success-base": accepting() }} />
+                  </Button>
+                </TooltipKeybind>
               </div>
             </div>
           </div>

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

@@ -1,5 +1,4 @@
-import { onMount } from "solid-js"
-import { makeEventListener } from "@solid-primitives/event-listener"
+import { onCleanup, onMount } from "solid-js"
 import { showToast } from "@opencode-ai/ui/toast"
 import { usePrompt, type ContentPart, type ImageAttachmentPart } from "@/context/prompt"
 import { useLanguage } from "@/context/language"
@@ -182,9 +181,15 @@ export function createPromptAttachments(input: PromptAttachmentsInput) {
   }
 
   onMount(() => {
-    makeEventListener(document, "dragover", handleGlobalDragOver)
-    makeEventListener(document, "dragleave", handleGlobalDragLeave)
-    makeEventListener(document, "drop", handleGlobalDrop)
+    document.addEventListener("dragover", handleGlobalDragOver)
+    document.addEventListener("dragleave", handleGlobalDragLeave)
+    document.addEventListener("drop", handleGlobalDrop)
+  })
+
+  onCleanup(() => {
+    document.removeEventListener("dragover", handleGlobalDragOver)
+    document.removeEventListener("dragleave", handleGlobalDragLeave)
+    document.removeEventListener("drop", handleGlobalDrop)
   })
 
   return {

packages/app/src/components/prompt-input/build-request-parts.test.ts

@@ -100,30 +100,6 @@ describe("buildRequestParts", () => {
     expect(synthetic).toHaveLength(1)
   })
 
-  test("adds file parts for @mentions inside comment text", () => {
-    const result = buildRequestParts({
-      prompt: [{ type: "text", content: "look", start: 0, end: 4 }],
-      context: [
-        {
-          key: "ctx:comment-mention",
-          type: "file",
-          path: "src/review.ts",
-          comment: "Compare with @src/shared.ts and @src/review.ts.",
-        },
-      ],
-      images: [],
-      text: "look",
-      messageID: "msg_comment_mentions",
-      sessionID: "ses_comment_mentions",
-      sessionDirectory: "/repo",
-    })
-
-    const files = result.requestParts.filter((part) => part.type === "file")
-    expect(files).toHaveLength(2)
-    expect(files.some((part) => part.type === "file" && part.url === "file:///repo/src/review.ts")).toBe(true)
-    expect(files.some((part) => part.type === "file" && part.url === "file:///repo/src/shared.ts")).toBe(true)
-  })
-
   test("handles Windows paths correctly (simulated on macOS)", () => {
     const prompt: Prompt = [{ type: "file", path: "src\\foo.ts", content: "@src\\foo.ts", start: 0, end: 11 }]
 

packages/app/src/components/prompt-input/build-request-parts.ts

@@ -39,16 +39,6 @@ const absolute = (directory: string, path: string) => {
 const fileQuery = (selection: FileSelection | undefined) =>
   selection ? `?start=${selection.startLine}&end=${selection.endLine}` : ""
 
-const mention = /(^|[\s([{"'])@(\S+)/g
-
-const parseCommentMentions = (comment: string) => {
-  return Array.from(comment.matchAll(mention)).flatMap((match) => {
-    const path = (match[2] ?? "").replace(/[.,!?;:)}\]"']+$/, "")
-    if (!path) return []
-    return [path]
-  })
-}
-
 const isFileAttachment = (part: Prompt[number]): part is FileAttachmentPart => part.type === "file"
 const isAgentAttachment = (part: Prompt[number]): part is AgentPart => part.type === "agent"
 
@@ -148,21 +138,6 @@ export function buildRequestParts(input: BuildRequestPartsInput) {
 
     if (!comment) return [filePart]
 
-    const mentions = parseCommentMentions(comment).flatMap((path) => {
-      const url = `file://${encodeFilePath(absolute(input.sessionDirectory, path))}`
-      if (used.has(url)) return []
-      used.add(url)
-      return [
-        {
-          id: Identifier.ascending("part"),
-          type: "file",
-          mime: "text/plain",
-          url,
-          filename: getFilename(path),
-        } satisfies PromptRequestPart,
-      ]
-    })
-
     return [
       {
         id: Identifier.ascending("part"),
@@ -178,7 +153,6 @@ export function buildRequestParts(input: BuildRequestPartsInput) {
         }),
       } satisfies PromptRequestPart,
       filePart,
-      ...mentions,
     ]
   })
 

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

@@ -1,6 +1,5 @@
 import { Component, For, Show } from "solid-js"
 import { Icon } from "@opencode-ai/ui/icon"
-import { Tooltip } from "@opencode-ai/ui/tooltip"
 import type { ImageAttachmentPart } from "@/context/prompt"
 
 type PromptImageAttachmentsProps = {
@@ -23,36 +22,34 @@ export const PromptImageAttachments: Component<PromptImageAttachmentsProps> = (p
       <div class="flex flex-wrap gap-2 px-3 pt-3">
         <For each={props.attachments}>
           {(attachment) => (
-            <Tooltip value={attachment.filename} placement="top" contentClass="break-all">
-              <div class="relative group">
-                <Show
-                  when={attachment.mime.startsWith("image/")}
-                  fallback={
-                    <div class={fallbackClass}>
-                      <Icon name="folder" class="size-6 text-text-weak" />
-                    </div>
-                  }
-                >
-                  <img
-                    src={attachment.dataUrl}
-                    alt={attachment.filename}
-                    class={imageClass}
-                    onClick={() => props.onOpen(attachment)}
-                  />
-                </Show>
-                <button
-                  type="button"
-                  onClick={() => props.onRemove(attachment.id)}
-                  class={removeClass}
-                  aria-label={props.removeLabel}
-                >
-                  <Icon name="close" class="size-3 text-text-weak" />
-                </button>
-                <div class={nameClass}>
-                  <span class="text-10-regular text-white truncate block">{attachment.filename}</span>
-                </div>
+            <div class="relative group">
+              <Show
+                when={attachment.mime.startsWith("image/")}
+                fallback={
+                  <div class={fallbackClass}>
+                    <Icon name="folder" class="size-6 text-text-weak" />
+                  </div>
+                }
+              >
+                <img
+                  src={attachment.dataUrl}
+                  alt={attachment.filename}
+                  class={imageClass}
+                  onClick={() => props.onOpen(attachment)}
+                />
+              </Show>
+              <button
+                type="button"
+                onClick={() => props.onRemove(attachment.id)}
+                class={removeClass}
+                aria-label={props.removeLabel}
+              >
+                <Icon name="close" class="size-3 text-text-weak" />
+              </button>
+              <div class={nameClass}>
+                <span class="text-10-regular text-white truncate block">{attachment.filename}</span>
               </div>
-            </Tooltip>
+            </div>
           )}
         </For>
       </div>

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

@@ -146,7 +146,7 @@ beforeAll(async () => {
           add: (value: {
             directory?: string
             sessionID?: string
-            message: { agent: string; model: { providerID: string; modelID: string; variant?: string } }
+            message: { agent: string; model: { providerID: string; modelID: string }; variant?: string }
           }) => {
             optimistic.push(value)
             optimisticSeeded.push(
@@ -310,7 +310,8 @@ describe("prompt submit worktree selection", () => {
     expect(optimistic[0]).toMatchObject({
       message: {
         agent: "agent",
-        model: { providerID: "provider", modelID: "model", variant: "high" },
+        model: { providerID: "provider", modelID: "model" },
+        variant: "high",
       },
     })
   })

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

@@ -120,7 +120,8 @@ export async function sendFollowupDraft(input: FollowupSendInput) {
     role: "user",
     time: { created: Date.now() },
     agent: input.draft.agent,
-    model: { ...input.draft.model, variant: input.draft.variant },
+    model: input.draft.model,
+    variant: input.draft.variant,
   }
 
   const add = () =>

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

@@ -1,11 +1,11 @@
 import { Tooltip } from "@opencode-ai/ui/tooltip"
-import { createResizeObserver } from "@solid-primitives/resize-observer"
 import {
   children,
   createEffect,
   createMemo,
   createSignal,
   type JSXElement,
+  onCleanup,
   onMount,
   type ParentProps,
   Show,
@@ -46,9 +46,12 @@ export function ServerRow(props: ServerRowProps) {
   })
 
   onMount(() => {
-    if (typeof ResizeObserver !== "function") return
-    createResizeObserver([nameRef, versionRef], check)
     check()
+    if (typeof ResizeObserver !== "function") return
+    const observer = new ResizeObserver(check)
+    if (nameRef) observer.observe(nameRef)
+    if (versionRef) observer.observe(versionRef)
+    onCleanup(() => observer.disconnect())
   })
 
   const tooltipValue = () => (