Merge branch 'dev' into default-explore-models

.github/VOUCHED.td

@@ -10,9 +10,6 @@
 adamdotdevin
 -agusbasari29 AI PR slop
 ariane-emory
--atharvau AI review spamming literally every PR
--danieljoshuanazareth
--danieljoshuanazareth
 edemaine
 -florianleibert
 fwang
@@ -20,9 +17,7 @@ iamdavidhill
 jayair
 kitlangton
 kommander
--opencode2026
 r44vc0rp
 rekram1-node
 -spider-yamet clawdbot/llm psychosis, spam pinging the team
 thdxr
--OpenCodeEngineer bot that spams issues

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

@@ -3,6 +3,14 @@ description: "Setup Bun with caching and install dependencies"
 runs:
   using: "composite"
   steps:
+    - name: Cache Bun dependencies
+      uses: actions/cache@v4
+      with:
+        path: ~/.bun/install/cache
+        key: ${{ runner.os }}-bun-${{ hashFiles('**/bun.lockb') }}
+        restore-keys: |
+          ${{ runner.os }}-bun-
+
     - name: Get baseline download URL
       id: bun-url
       shell: bash
@@ -23,31 +31,6 @@ runs:
         bun-version-file: ${{ !steps.bun-url.outputs.url && 'package.json' || '' }}
         bun-download-url: ${{ steps.bun-url.outputs.url }}
 
-    - name: Get cache directory
-      id: cache
-      shell: bash
-      run: echo "dir=$(bun pm cache)" >> "$GITHUB_OUTPUT"
-
-    - name: Cache Bun dependencies
-      uses: actions/cache@v4
-      with:
-        path: ${{ steps.cache.outputs.dir }}
-        key: ${{ runner.os }}-bun-${{ hashFiles('**/bun.lock') }}
-        restore-keys: |
-          ${{ runner.os }}-bun-
-
-    - name: Install setuptools for distutils compatibility
-      run: python3 -m pip install setuptools || pip install setuptools || true
-      shell: bash
-
     - name: Install dependencies
-      run: |
-        # Workaround for patched peer variants
-        # e.g. ./patches/ for standard-openapi
-        # https://github.com/oven-sh/bun/issues/28147
-        if [ "$RUNNER_OS" = "Windows" ]; then
-          bun install --linker hoisted
-        else
-          bun install
-        fi
+      run: bun install
       shell: bash

.github/workflows/close-issues.yml

@@ -1,24 +0,0 @@
-name: close-issues
-
-on:
-  schedule:
-    - cron: "0 2 * * *" # Daily at 2:00 AM
-  workflow_dispatch:
-
-jobs:
-  close:
-    runs-on: ubuntu-latest
-    permissions:
-      contents: read
-      issues: write
-    steps:
-      - uses: actions/checkout@v4
-
-      - uses: oven-sh/setup-bun@v2
-        with:
-          bun-version: latest
-
-      - name: Close stale issues
-        env:
-          GITHUB_TOKEN: ${{ github.token }}
-        run: bun script/github/close-issues.ts

.github/workflows/deploy.yml

@@ -11,7 +11,7 @@ concurrency: ${{ github.workflow }}-${{ github.ref }}
 
 jobs:
   deploy:
-    runs-on: ubuntu-latest
+    runs-on: blacksmith-4vcpu-ubuntu-2404
     steps:
       - uses: actions/checkout@v3
 

.github/workflows/nix-hashes.yml

@@ -56,7 +56,7 @@ jobs:
           nix build ".#packages.${SYSTEM}.node_modules_updater" --no-link 2>&1 | tee "$BUILD_LOG" || true
 
           # Extract hash from build log with portability
-          HASH="$(nix run --inputs-from . nixpkgs#gnugrep -- -oP 'got:\s*\Ksha256-[A-Za-z0-9+/=]+' "$BUILD_LOG" | tail -n1 || true)"
+          HASH="$(grep -oE 'sha256-[A-Za-z0-9+/=]+' "$BUILD_LOG" | tail -n1 || true)"
 
           if [ -z "$HASH" ]; then
             echo "::error::Failed to compute hash for ${SYSTEM}"

.github/workflows/porter-app-5534-apn-relay.yml

@@ -1,27 +0,0 @@
-"on":
-    push:
-        branches:
-            - opencode-remote-voice
-name: Deploy to apn-relay
-jobs:
-    porter-deploy:
-        runs-on: ubuntu-latest
-        steps:
-            - name: Checkout code
-              uses: actions/checkout@v4
-            - name: Set Github tag
-              id: vars
-              run: echo "sha_short=$(git rev-parse --short HEAD)" >> $GITHUB_OUTPUT
-            - name: Setup porter
-              uses: porter-dev/setup-porter@v0.1.0
-            - name: Deploy stack
-              timeout-minutes: 30
-              run: porter apply
-              env:
-                PORTER_APP_NAME: apn-relay
-                PORTER_CLUSTER: "5534"
-                PORTER_DEPLOYMENT_TARGET_ID: d60e67f5-b0a6-4275-8ed6-3cebaf092147
-                PORTER_HOST: https://dashboard.porter.run
-                PORTER_PROJECT: "18525"
-                PORTER_TAG: ${{ steps.vars.outputs.sha_short }}
-                PORTER_TOKEN: ${{ secrets.PORTER_APP_18525_975734319 }}

.github/workflows/publish.yml

@@ -98,129 +98,15 @@ jobs:
       - uses: actions/upload-artifact@v4
         with:
           name: opencode-cli
-          path: |
-            packages/opencode/dist/opencode-darwin*
-            packages/opencode/dist/opencode-linux*
-
-      - uses: actions/upload-artifact@v4
-        with:
-          name: opencode-cli-windows
-          path: packages/opencode/dist/opencode-windows*
+          path: packages/opencode/dist
     outputs:
       version: ${{ needs.version.outputs.version }}
 
-  sign-cli-windows:
-    needs:
-      - build-cli
-      - version
-    runs-on: blacksmith-4vcpu-windows-2025
-    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
-
-      - name: Setup git committer
-        id: committer
-        uses: ./.github/actions/setup-git-committer
-        with:
-          opencode-app-id: ${{ vars.OPENCODE_APP_ID }}
-          opencode-app-secret: ${{ secrets.OPENCODE_APP_SECRET }}
-
-      - name: Azure login
-        uses: azure/login@v2
-        with:
-          client-id: ${{ env.AZURE_CLIENT_ID }}
-          tenant-id: ${{ env.AZURE_TENANT_ID }}
-          subscription-id: ${{ env.AZURE_SUBSCRIPTION_ID }}
-
-      - 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
-        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"
-          )
-
-          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
-        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
-        env:
-          GH_TOKEN: ${{ steps.committer.outputs.token }}
-        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 }}"
-
-      - 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
-
   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:
@@ -229,9 +115,6 @@ jobs:
             target: x86_64-apple-darwin
           - host: macos-latest
             target: aarch64-apple-darwin
-          # github-hosted: blacksmith lacks ARM64 MSVC cross-compilation toolchain
-          - host: windows-2025
-            target: aarch64-pc-windows-msvc
           - host: blacksmith-4vcpu-windows-2025
             target: x86_64-pc-windows-msvc
           - host: blacksmith-4vcpu-ubuntu-2404
@@ -266,18 +149,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"
-
       - name: Cache apt packages
         if: contains(matrix.settings.host, 'ubuntu')
         uses: actions/cache@v4
@@ -312,7 +183,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,34 +239,11 @@ 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
     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:
@@ -407,10 +254,6 @@ jobs:
           - host: macos-latest
             target: aarch64-apple-darwin
             platform_flag: --mac --arm64
-          # github-hosted: blacksmith lacks ARM64 MSVC cross-compilation toolchain
-          - host: "windows-2025"
-            target: aarch64-pc-windows-msvc
-            platform_flag: --win --arm64
           - host: "blacksmith-4vcpu-windows-2025"
             target: x86_64-pc-windows-msvc
             platform_flag: --win
@@ -438,14 +281,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 +315,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 +347,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 }}
@@ -544,7 +362,6 @@ jobs:
     needs:
       - version
       - build-cli
-      - sign-cli-windows
       - build-tauri
       - build-electron
     runs-on: blacksmith-4vcpu-ubuntu-2404
@@ -583,16 +400,6 @@ jobs:
           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
-          path: packages/opencode/dist
-
       - uses: actions/download-artifact@v4
         if: needs.version.outputs.release
         with:

.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/stale-issues.yml

@@ -0,0 +1,33 @@
+name: stale-issues
+
+on:
+  schedule:
+    - cron: "30 1 * * *" # Daily at 1:30 AM
+  workflow_dispatch:
+
+env:
+  DAYS_BEFORE_STALE: 90
+  DAYS_BEFORE_CLOSE: 7
+
+jobs:
+  stale:
+    runs-on: ubuntu-latest
+    permissions:
+      issues: write
+    steps:
+      - uses: actions/stale@v10
+        with:
+          days-before-stale: ${{ env.DAYS_BEFORE_STALE }}
+          days-before-close: ${{ env.DAYS_BEFORE_CLOSE }}
+          stale-issue-label: "stale"
+          close-issue-message: |
+            [automated] Closing due to ${{ env.DAYS_BEFORE_STALE }}+ days of inactivity.
+
+            Feel free to reopen if you still need this!
+          stale-issue-message: |
+            [automated] This issue has had no activity for ${{ env.DAYS_BEFORE_STALE }} days.
+
+            It will be closed in ${{ env.DAYS_BEFORE_CLOSE }} days if there's no new activity.
+          remove-stale-when-updated: true
+          exempt-issue-labels: "pinned,security,feature-request,on-hold"
+          start-date: "2025-12-27"

.github/workflows/storybook.yml

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

.github/workflows/test.yml

@@ -6,16 +6,6 @@ on:
       - dev
   pull_request:
   workflow_dispatch:
-
-concurrency:
-  # Keep every run on dev so cancelled checks do not pollute the default branch
-  # commit history. PRs and other branches still share a group and cancel stale runs.
-  group: ${{ case(github.ref == 'refs/heads/dev', format('{0}-{1}', github.workflow, github.run_id), format('{0}-{1}', github.workflow, github.event.pull_request.number || github.ref)) }}
-  cancel-in-progress: true
-
-permissions:
-  contents: read
-
 jobs:
   unit:
     name: unit (${{ matrix.settings.name }})
@@ -50,17 +40,20 @@ jobs:
 
   e2e:
     name: e2e (${{ matrix.settings.name }})
+    needs: unit
     strategy:
       fail-fast: false
       matrix:
         settings:
           - name: linux
             host: blacksmith-4vcpu-ubuntu-2404
+            playwright: bunx playwright install --with-deps
           - name: windows
             host: blacksmith-4vcpu-windows-2025
+            playwright: bunx playwright install
     runs-on: ${{ matrix.settings.host }}
     env:
-      PLAYWRIGHT_BROWSERS_PATH: ${{ github.workspace }}/.playwright-browsers
+      PLAYWRIGHT_BROWSERS_PATH: 0
     defaults:
       run:
         shell: bash
@@ -73,28 +66,9 @@ jobs:
       - name: Setup Bun
         uses: ./.github/actions/setup-bun
 
-      - name: Read Playwright version
-        id: playwright-version
-        run: |
-          version=$(node -e 'console.log(require("./packages/app/package.json").devDependencies["@playwright/test"])')
-          echo "version=$version" >> "$GITHUB_OUTPUT"
-
-      - name: Cache Playwright browsers
-        id: playwright-cache
-        uses: actions/cache@v4
-        with:
-          path: ${{ github.workspace }}/.playwright-browsers
-          key: ${{ runner.os }}-${{ runner.arch }}-playwright-${{ steps.playwright-version.outputs.version }}-chromium
-
-      - name: Install Playwright system dependencies
-        if: runner.os == 'Linux'
-        working-directory: packages/app
-        run: bunx playwright install-deps chromium
-
       - name: Install Playwright browsers
-        if: steps.playwright-cache.outputs.cache-hit != 'true'
         working-directory: packages/app
-        run: bunx playwright install chromium
+        run: ${{ matrix.settings.playwright }}
 
       - name: Run app e2e tests
         run: bun --cwd packages/app test:e2e:local
@@ -112,3 +86,18 @@ jobs:
           path: |
             packages/app/e2e/test-results
             packages/app/e2e/playwright-report
+
+  required:
+    name: test (linux)
+    runs-on: blacksmith-4vcpu-ubuntu-2404
+    needs:
+      - unit
+      - e2e
+    if: always()
+    steps:
+      - name: Verify upstream test jobs passed
+        run: |
+          echo "unit=${{ needs.unit.result }}"
+          echo "e2e=${{ needs.e2e.result }}"
+          test "${{ needs.unit.result }}" = "success"
+          test "${{ needs.e2e.result }}" = "success"

.github/workflows/vouch-manage-by-issue.yml

@@ -33,6 +33,6 @@ jobs:
         with:
           issue-id: ${{ github.event.issue.number }}
           comment-id: ${{ github.event.comment.id }}
-          roles: admin,maintain,write
+          roles: admin,maintain
         env:
           GITHUB_TOKEN: ${{ steps.committer.outputs.token }}

.gitignore

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

.opencode/.gitignore

@@ -1,6 +1,3 @@
-node_modules
-plans
-package.json
+plans/
 bun.lock
-.gitignore
-package-lock.json
+package.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/agent/translator.md

@@ -1,7 +1,7 @@
 ---
 description: Translate content for a specified locale while preserving technical terms
 mode: subagent
-model: opencode/gpt-5.4
+model: opencode/gemini-3-pro
 ---
 
 You are a professional translator and localization specialist.

.opencode/command/changelog.md

@@ -1,23 +0,0 @@
----
-model: opencode/kimi-k2.5
----
-
-create UPCOMING_CHANGELOG.md
-
-it should have sections
-
-```
-## TUI
-
-## Desktop
-
-## Core
-
-## Misc
-```
-
-fetch the latest github release for this repository to determine the last release version.
-
-find each PR that was merged since the last release
-
-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/opencode.jsonc

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

.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,861 +0,0 @@
-/** @jsxImportSource @opentui/solid */
-import { useKeyboard, useTerminalDimensions } 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 = (input: Cfg): TuiSlotPlugin => ({
-  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_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 = (input: Cfg): TuiSlotPlugin[] => [
-  home(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(value)) {
-    api.slots.register(item)
-  }
-}
-
-const plugin: TuiPluginModule & { id: string } = {
-  id: "tui-smoke",
-  tui,
-}
-
-export default plugin

.opencode/themes/.gitignore

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

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

@@ -1,5 +1,7 @@
 /// <reference path="../env.d.ts" />
 import { tool } from "@opencode-ai/plugin"
+import DESCRIPTION from "./github-pr-search.txt"
+
 async function githubFetch(endpoint: string, options: RequestInit = {}) {
   const response = await fetch(`https://api.github.com${endpoint}`, {
     ...options,
@@ -22,16 +24,7 @@ interface PR {
 }
 
 export default tool({
-  description: `Use this tool to search GitHub pull requests by title and description.
-
-This tool searches PRs in the anomalyco/opencode repository and returns LLM-friendly results including:
-- PR number and title
-- Author
-- State (open/closed/merged)
-- Labels
-- Description snippet
-
-Use the query parameter to search for keywords that might appear in PR titles or descriptions.`,
+  description: DESCRIPTION,
   args: {
     query: tool.schema.string().describe("Search query for PR titles and descriptions"),
     limit: tool.schema.number().describe("Maximum number of results to return").default(10),

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

@@ -0,0 +1,10 @@
+Use this tool to search GitHub pull requests by title and description.
+
+This tool searches PRs in the anomalyco/opencode repository and returns LLM-friendly results including:
+- PR number and title
+- Author
+- State (open/closed/merged)
+- Labels
+- Description snippet
+
+Use the query parameter to search for keywords that might appear in PR titles or descriptions.

.opencode/tool/github-triage.ts

@@ -1,10 +1,20 @@
 /// <reference path="../env.d.ts" />
 import { tool } from "@opencode-ai/plugin"
+import DESCRIPTION from "./github-triage.txt"
+
 const TEAM = {
   desktop: ["adamdotdevin", "iamdavidhill", "Brendonovich", "nexxeln"],
   zen: ["fwang", "MrMushrooooom"],
-  tui: ["thdxr", "kommander", "rekram1-node"],
-  core: ["thdxr", "rekram1-node", "jlongster"],
+  tui: [
+    "thdxr",
+    "kommander",
+    // "rekram1-node" (on vacation)
+  ],
+  core: [
+    "thdxr",
+    // "rekram1-node", (on vacation)
+    "jlongster",
+  ],
   docs: ["R44VC0RP"],
   windows: ["Hona"],
 } as const
@@ -38,17 +48,9 @@ async function githubFetch(endpoint: string, options: RequestInit = {}) {
 }
 
 export default tool({
-  description: `Use this tool to assign and/or label a GitHub issue.
-
-Choose labels and assignee using the current triage policy and ownership rules.
-Pick the most fitting labels for the issue and assign one owner.
-
-If unsure, choose the team/section with the most overlap with the issue and assign a member from that team at random.`,
+  description: DESCRIPTION,
   args: {
-    assignee: tool.schema
-      .enum(ASSIGNEES as [string, ...string[]])
-      .describe("The username of the assignee")
-      .default("rekram1-node"),
+    assignee: tool.schema.enum(ASSIGNEES as [string, ...string[]]).describe("The username of the assignee"),
     labels: tool.schema
       .array(tool.schema.enum(["nix", "opentui", "perf", "web", "desktop", "zen", "docs", "windows", "core"]))
       .describe("The labels(s) to add to the issue")
@@ -71,7 +73,8 @@ If unsure, choose the team/section with the most overlap with the issue and assi
       results.push("Dropped label: nix (issue does not mention nix)")
     }
 
-    const assignee = nix ? "rekram1-node" : web ? pick(TEAM.desktop) : args.assignee
+    // const assignee = nix ? "rekram1-node" : web ? pick(TEAM.desktop) : args.assignee
+    const assignee = web ? pick(TEAM.desktop) : args.assignee
 
     if (labels.includes("zen") && !zen) {
       throw new Error("Only add the zen label when issue title/body contains 'zen'")

.opencode/tool/github-triage.txt

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

.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"

AGENTS.md

@@ -1,162 +1,124 @@
-# OpenCode Monorepo Agent Guide
+- To regenerate the JavaScript SDK, run `./packages/sdk/js/script/build.ts`.
+- ALWAYS USE PARALLEL TOOLS WHEN APPLICABLE.
+- The default branch in this repo is `dev`.
+- Local `main` ref may not exist; use `dev` or `origin/dev` for diffs.
+- Prefer automation: execute requested actions without confirmation unless blocked by missing info or safety/irreversibility.
 
-This file is for coding agents working in `/Users/ryanvogel/dev/opencode`.
+## Style Guide
 
-## Scope And Precedence
+### General Principles
 
-- Start with this file for repo-wide defaults.
-- Then check package-local `AGENTS.md` files for stricter rules.
-- Existing local guides include `packages/opencode/AGENTS.md` and `packages/app/AGENTS.md`.
-- Package-specific guides override this file when they conflict.
-
-## Repo Facts
-
-- Package manager: `bun` (`bun@1.3.11`).
-- Monorepo tool: `turbo`.
-- Default branch: `dev`.
-- Root test script intentionally fails; do not run tests from root.
-
-## Cursor / Copilot Rules
-
-- No `.cursor/rules/` directory found.
-- No `.cursorrules` file found.
-- No `.github/copilot-instructions.md` file found.
-- If these files are added later, treat them as mandatory project policy.
-
-## High-Value Commands
-
-Run commands from the correct package directory unless noted.
-
-### Root
-
-- Install deps: `bun install`
-- Run all typechecks via turbo: `bun run typecheck`
-- OpenCode dev CLI entry: `bun run dev`
-- OpenCode serve (common): `bun run dev serve --hostname 0.0.0.0 --port 4096`
-
-### `packages/opencode`
-
-- Dev CLI: `bun run dev`
-- Typecheck: `bun run typecheck`
-- Tests (all): `bun test --timeout 30000`
-- Tests (single file): `bun test test/path/to/file.test.ts --timeout 30000`
-- Tests (single test name): `bun test test/path/to/file.test.ts -t "name fragment" --timeout 30000`
-- Build: `bun run build`
-- Drizzle helper: `bun run db`
-
-### `packages/app`
-
-- Dev server: `bun dev`
-- Build: `bun run build`
-- Typecheck: `bun run typecheck`
-- Unit tests (all): `bun run test:unit`
-- Unit tests (single file): `bun test --preload ./happydom.ts ./src/path/to/file.test.ts`
-- Unit tests (single test name): `bun test --preload ./happydom.ts ./src/path/to/file.test.ts -t "name fragment"`
-- E2E tests: `bun run test:e2e`
-
-### `packages/mobile-voice`
-
-- Start Expo: `bun run start`
-- Start Expo dev client: `bunx expo start --dev-client --clear --host lan`
-- iOS native run: `bun run ios`
-- Android native run: `bun run android`
-- Lint: `bun run lint`
-- Expo doctor: `bunx expo-doctor`
-- Dependency compatibility check: `bunx expo install --check`
-
-### `packages/apn-relay`
-
-- Start relay: `bun run dev`
-- Typecheck: `bun run typecheck`
-- DB connectivity check: `bun run db:check`
-
-## Build / Lint / Test Expectations
-
-- Always run the narrowest checks that prove your change.
-- For backend changes: run package typecheck + relevant tests.
-- For mobile changes: run `expo lint` and at least one `expo` compile-style command if possible.
-- Never claim tests passed unless you ran them in this workspace.
-
-## Single-Test Guidance
-
-- Prefer running one file first, then broaden scope.
-- For Bun tests, pass the file path directly.
-- For name filtering, use `-t "..."`.
-- Keep original timeouts when scripts define them.
-
-## Code Style Guidelines
-
-These conventions are already used heavily in this repo and should be preserved.
-
-### Formatting
-
-- Use Prettier defaults configured in root: `semi: false`, `printWidth: 120`.
-- Keep imports grouped and stable; avoid noisy reorder-only edits.
-- Avoid unrelated formatting churn in touched files.
-
-### Imports
-
-- Prefer explicit imports over dynamic imports unless runtime gating is required.
-- Prefer existing alias patterns (for example `@/...`) where already configured.
-- Do not introduce new dependency layers when a local util already exists.
-
-### Types
-
-- Avoid `any`.
-- Prefer inference for local variables.
-- Add explicit annotations for exported APIs and complex boundaries.
-- Prefer `zod` schemas for request/response validation and parsing.
+- Keep things in one function unless composable or reusable
+- Avoid `try`/`catch` where possible
+- Avoid using the `any` type
+- Prefer single word variable names where possible
+- Use Bun APIs when possible, like `Bun.file()`
+- Rely on type inference when possible; avoid explicit type annotations or interfaces unless necessary for exports or clarity
+- Prefer functional array methods (flatMap, filter, map) over for loops; use type guards on filter to maintain type inference downstream
 
 ### Naming
 
-- Follow existing repo preference for short, clear names.
-- Use single-word names when readable; use multi-word only for clarity.
-- Keep naming consistent with nearby code.
+Prefer single word names for variables and functions. Only use multiple words if necessary.
+
+### Naming Enforcement (Read This)
+
+THIS RULE IS MANDATORY FOR AGENT WRITTEN CODE.
+
+- Use single word names by default for new locals, params, and helper functions.
+- Multi-word names are allowed only when a single word would be unclear or ambiguous.
+- Do not introduce new camelCase compounds when a short single-word alternative is clear.
+- Before finishing edits, review touched lines and shorten newly introduced identifiers where possible.
+- Good short names to prefer: `pid`, `cfg`, `err`, `opts`, `dir`, `root`, `child`, `state`, `timeout`.
+- Examples to avoid unless truly required: `inputPID`, `existingClient`, `connectTimeout`, `workerPath`.
+
+```ts
+// Good
+const foo = 1
+function journal(dir: string) {}
+
+// Bad
+const fooBar = 1
+function prepareJournal(dir: string) {}
+```
+
+Reduce total variable count by inlining when a value is only used once.
+
+```ts
+// Good
+const journal = await Bun.file(path.join(dir, "journal.json")).json()
+
+// Bad
+const journalPath = path.join(dir, "journal.json")
+const journal = await Bun.file(journalPath).json()
+```
+
+### Destructuring
+
+Avoid unnecessary destructuring. Use dot notation to preserve context.
+
+```ts
+// Good
+obj.a
+obj.b
+
+// Bad
+const { a, b } = obj
+```
+
+### Variables
+
+Prefer `const` over `let`. Use ternaries or early returns instead of reassignment.
+
+```ts
+// Good
+const foo = condition ? 1 : 2
+
+// Bad
+let foo
+if (condition) foo = 1
+else foo = 2
+```
 
 ### Control Flow
 
-- Prefer early returns over nested `else` blocks.
-- Keep functions focused; split only when it improves reuse or readability.
+Avoid `else` statements. Prefer early returns.
 
-### Error Handling
+```ts
+// Good
+function foo() {
+  if (condition) return 1
+  return 2
+}
 
-- Fail with actionable messages.
-- Avoid swallowing errors silently.
-- Log enough context to debug production issues (IDs, env, status), but never secrets.
-- In UI code, degrade gracefully for missing capabilities.
+// Bad
+function foo() {
+  if (condition) return 1
+  else return 2
+}
+```
 
-### Data / DB
+### Schema Definitions (Drizzle)
 
-- For Drizzle schema, use snake_case fields and columns.
-- Keep migration and schema changes minimal and explicit.
-- Follow package-specific DB guidance in `packages/opencode/AGENTS.md`.
+Use snake_case for field names so column names don't need to be redefined as strings.
 
-### Testing Philosophy
+```ts
+// Good
+const table = sqliteTable("session", {
+  id: text().primaryKey(),
+  project_id: text().notNull(),
+  created_at: integer().notNull(),
+})
 
-- Prefer testing real behavior over mocks.
-- Add regression tests for bug fixes where practical.
-- Keep fixtures small and focused.
+// Bad
+const table = sqliteTable("session", {
+  id: text("id").primaryKey(),
+  projectID: text("project_id").notNull(),
+  createdAt: integer("created_at").notNull(),
+})
+```
 
-## Agent Workflow Tips
+## Testing
 
-- Read existing code paths before introducing new abstractions.
-- Match local patterns first; do not impose a new style per file.
-- If a package has its own `AGENTS.md`, review it before editing.
-- For OpenCode Effect services, follow `packages/opencode/AGENTS.md` strictly.
-
-## Known Operational Notes
-
-- `packages/app/AGENTS.md` says: never restart app/server processes during that package's debugging workflow.
-- `packages/app/AGENTS.md` also documents local backend+web split for UI work.
-- `packages/opencode/AGENTS.md` contains mandatory Effect and database conventions.
-
-## Regeneration / Special Scripts
-
-- Regenerate JS SDK with: `./packages/sdk/js/script/build.ts`
-
-## Quick Checklist Before Finishing
-
-- Ran relevant package checks.
-- Updated docs/config when behavior changed.
-- Avoided committing unrelated files.
-- Kept edits minimal and aligned with local conventions.
+- Avoid mocks as much as possible
+- Test actual implementation, do not duplicate logic into tests
+- Tests cannot run from repo root (guard: `do-not-run-tests-from-root`); run from package dirs like `packages/opencode`.

README.zh.md

@@ -137,4 +137,4 @@ OpenCode 内置两种 Agent，可用 `Tab` 键快速切换：
 
 ---
 
-**加入我们的社区** [飞书](https://applink.feishu.cn/client/chat/chatter/add_by_link?link_token=738j8655-cd59-4633-a30a-1124e0096789&qr_code=true) | [X.com](https://x.com/opencode)
+**加入我们的社区** [Discord](https://discord.gg/opencode) | [X.com](https://x.com/opencode)

README.zht.md

@@ -137,4 +137,4 @@ OpenCode 內建了兩種 Agent，您可以使用 `Tab` 鍵快速切換。
 
 ---
 
-**加入我們的社群** [飞书](https://applink.feishu.cn/client/chat/chatter/add_by_link?link_token=738j8655-cd59-4633-a30a-1124e0096789&qr_code=true) | [X.com](https://x.com/opencode)
+**加入我們的社群** [Discord](https://discord.gg/opencode) | [X.com](https://x.com/opencode)

flake.lock

@@ -2,11 +2,11 @@
   "nodes": {
     "nixpkgs": {
       "locked": {
-        "lastModified": 1773909469,
-        "narHash": "sha256-vglVrLfHjFIzIdV9A27Ugul6rh3I1qHbbitGW7dk420=",
+        "lastModified": 1772091128,
+        "narHash": "sha256-TnrYykX8Mf/Ugtkix6V+PjW7miU2yClA6uqWl/v6KWM=",
         "owner": "NixOS",
         "repo": "nixpkgs",
-        "rev": "7149c06513f335be57f26fcbbbe34afda923882b",
+        "rev": "3f0336406035444b4a24b942788334af5f906259",
         "type": "github"
       },
       "original": {

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

@@ -103,12 +103,6 @@ export const stripeWebhook = new stripe.WebhookEndpoint("StripeWebhookEndpoint",
 const zenLiteProduct = new stripe.Product("ZenLite", {
   name: "OpenCode Go",
 })
-const zenLiteCouponFirstMonth50 = new stripe.Coupon("ZenLiteCouponFirstMonth50", {
-  name: "First month 50% off",
-  percentOff: 50,
-  appliesToProducts: [zenLiteProduct.id],
-  duration: "once",
-})
 const zenLitePrice = new stripe.Price("ZenLitePrice", {
   product: zenLiteProduct.id,
   currency: "usd",
@@ -122,8 +116,6 @@ const ZEN_LITE_PRICE = new sst.Linkable("ZEN_LITE_PRICE", {
   properties: {
     product: zenLiteProduct.id,
     price: zenLitePrice.id,
-    priceInr: 92900,
-    firstMonth50Coupon: zenLiteCouponFirstMonth50.id,
   },
 })
 
@@ -202,10 +194,6 @@ const bucketNew = new sst.cloudflare.Bucket("ZenDataNew")
 const AWS_SES_ACCESS_KEY_ID = new sst.Secret("AWS_SES_ACCESS_KEY_ID")
 const AWS_SES_SECRET_ACCESS_KEY = new sst.Secret("AWS_SES_SECRET_ACCESS_KEY")
 
-const SALESFORCE_CLIENT_ID = new sst.Secret("SALESFORCE_CLIENT_ID")
-const SALESFORCE_CLIENT_SECRET = new sst.Secret("SALESFORCE_CLIENT_SECRET")
-const SALESFORCE_INSTANCE_URL = new sst.Secret("SALESFORCE_INSTANCE_URL")
-
 const logProcessor = new sst.cloudflare.Worker("LogProcessor", {
   handler: "packages/console/function/src/log-processor.ts",
   link: [new sst.Secret("HONEYCOMB_API_KEY")],
@@ -224,9 +212,6 @@ new sst.cloudflare.x.SolidStart("Console", {
     EMAILOCTOPUS_API_KEY,
     AWS_SES_ACCESS_KEY_ID,
     AWS_SES_SECRET_ACCESS_KEY,
-    SALESFORCE_CLIENT_ID,
-    SALESFORCE_CLIENT_SECRET,
-    SALESFORCE_INSTANCE_URL,
     ZEN_BLACK_PRICE,
     ZEN_LITE_PRICE,
     new sst.Secret("ZEN_LIMITS"),

nix/hashes.json

@@ -1,8 +1,8 @@
 {
   "nodeModules": {
-    "x86_64-linux": "sha256-5VHEo9GCBP+MeLMoWqSuJLAX/qwGLdFjZe20yatgogM=",
-    "aarch64-linux": "sha256-hn+V2UpoCj1ddKcq1ySGOMRVvsd3T8sqgpd6nHYfUoA=",
-    "aarch64-darwin": "sha256-Qctkv6AHDrl+qdB1L+DeqLREeWm6BQqtVCK4tibIMCc=",
-    "x86_64-darwin": "sha256-YHHnow2dqtKOsjQvbyKk6HQmTo8cAv8frgOfD5aS3h8="
+    "x86_64-linux": "sha256-4kjoJ06VNvHltPHfzQRBG0bC6R39jao10ffGzrNZ230=",
+    "aarch64-linux": "sha256-6Uio+S2rcyBWbBEeOZb9N1CCKgkbKi68lOIKi3Ws/pQ=",
+    "aarch64-darwin": "sha256-8ngN5KVN4vhdsk0QJ11BGgSVBrcaEbwSj23c77HBpgs=",
+    "x86_64-darwin": "sha256-v/ueYGb9a0Nymzy+mkO4uQr78DAuJnES1qOT0onFgnQ="
   }
 }

package.json

@@ -4,12 +4,11 @@
   "description": "AI-powered development tool",
   "private": true,
   "type": "module",
-  "packageManager": "bun@1.3.11",
+  "packageManager": "bun@1.3.10",
   "scripts": {
     "dev": "bun run --cwd packages/opencode --conditions=browser src/index.ts",
     "dev:desktop": "bun --cwd packages/desktop tauri dev",
     "dev:web": "bun --cwd packages/app dev",
-    "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",
     "prepare": "husky",
@@ -25,8 +24,7 @@
       "packages/slack"
     ],
     "catalog": {
-      "@effect/platform-node": "4.0.0-beta.42",
-      "@types/bun": "1.3.11",
+      "@types/bun": "1.3.9",
       "@octokit/rest": "22.0.0",
       "@hono/zod-validator": "0.4.2",
       "ulid": "3.0.1",
@@ -43,17 +41,15 @@
       "@tailwindcss/vite": "4.1.11",
       "diff": "8.0.2",
       "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.42",
-      "ai": "6.0.138",
+      "drizzle-kit": "1.0.0-beta.16-ea816b6",
+      "drizzle-orm": "1.0.0-beta.16-ea816b6",
+      "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.51.0",
       "typescript": "5.8.2",
       "@typescript/native-preview": "7.0.0-dev.20251207.1",
@@ -113,8 +109,6 @@
   },
   "patchedDependencies": {
     "@standard-community/standard-openapi@0.2.9": "patches/@standard-community%2Fstandard-openapi@0.2.9.patch",
-    "solid-js@1.9.10": "patches/solid-js@1.9.10.patch",
-    "@ai-sdk/provider-utils@4.0.21": "patches/@ai-sdk%2Fprovider-utils@4.0.21.patch",
-    "@ai-sdk/anthropic@3.0.64": "patches/@ai-sdk%2Fanthropic@3.0.64.patch"
+    "@openrouter/ai-sdk-provider@1.5.4": "patches/@openrouter%2Fai-sdk-provider@1.5.4.patch"
   }
 }

packages/apn-relay/.env.example

@@ -1,11 +0,0 @@
-PORT=8787
-
-DATABASE_HOST=
-DATABASE_USERNAME=
-DATABASE_PASSWORD=
-DATABASE_NAME=main
-
-APNS_TEAM_ID=
-APNS_KEY_ID=
-APNS_PRIVATE_KEY=
-APNS_DEFAULT_BUNDLE_ID=com.anomalyco.mobilevoice

packages/apn-relay/AGENTS.md

@@ -1,106 +0,0 @@
-# apn-relay Agent Guide
-
-This file defines package-specific guidance for agents working in `packages/apn-relay`.
-
-## Scope And Precedence
-
-- Follow root `AGENTS.md` first.
-- This file provides stricter package-level conventions for relay service work.
-- If future local guides are added, closest guide wins.
-
-## Project Overview
-
-- Minimal APNs relay service (Hono + Bun + PlanetScale via Drizzle).
-- Core routes:
-  - `GET /health`
-  - `GET /`
-  - `POST /v1/device/register`
-  - `POST /v1/device/unregister`
-  - `POST /v1/event`
-
-## Commands
-
-Run all commands from `packages/apn-relay`.
-
-- Install deps: `bun install`
-- Start relay locally: `bun run dev`
-- Typecheck: `bun run typecheck`
-- DB connectivity check: `bun run db:check`
-
-## Build / Test Expectations
-
-- There is no dedicated package test script currently.
-- Required validation for behavior changes:
-  - `bun run typecheck`
-  - `bun run db:check` when DB/env changes are involved
-  - manual endpoint verification against `/health`, `/v1/device/register`, `/v1/event`
-
-## Single-Test Guidance
-
-- No single-test command exists for this package today.
-- For focused checks, run endpoint-level manual tests against a local dev server.
-
-## Code Style Guidelines
-
-### Formatting / Structure
-
-- Keep handlers compact and explicit.
-- Prefer small local helpers for repeated route logic.
-- Avoid broad refactors when a targeted fix is enough.
-
-### Types / Validation
-
-- Validate request bodies with `zod` at route boundaries.
-- Keep payload and DB row shapes explicit and close to usage.
-- Avoid `any`; narrow unknown input immediately after parsing.
-
-### Naming
-
-- Follow existing concise naming in this package (`reg`, `unreg`, `evt`, `row`, `key`).
-- For DB columns, keep snake_case alignment with schema.
-
-### Error Handling
-
-- Return clear JSON errors for invalid input.
-- Keep handler failures observable via `app.onError` and structured logs.
-- Do not leak secrets in responses or logs.
-
-### Logging
-
-- Log delivery lifecycle at key checkpoints:
-  - registration/unregistration attempts
-  - event fanout start/end
-  - APNs send failures and retries
-- Mask sensitive values; prefer token suffixes and metadata.
-
-### APNs Environment Rules
-
-- Keep APNs env explicit per registration (`sandbox` / `production`).
-- For `BadEnvironmentKeyInToken`, retry once with flipped env and persist correction.
-- Avoid infinite retry loops; one retry max per delivery attempt.
-
-## Database Conventions
-
-- Schema is in `src/schema.sql.ts`.
-- Keep table/column names snake_case.
-- Maintain index naming consistency with existing schema.
-- For upserts, update only fields required by current behavior.
-
-## API Behavior Expectations
-
-- `register`/`unregister` must be idempotent.
-- `event` should return success envelope even when no devices are registered.
-- Delivery logs should capture per-attempt result and error payload.
-
-## Operational Notes
-
-- Ensure `APNS_PRIVATE_KEY` supports escaped newline format (`\n`) and raw multiline.
-- Validate that `APNS_DEFAULT_BUNDLE_ID` matches mobile app bundle identifier.
-- Avoid coupling route behavior to deployment platform specifics.
-
-## Before Finishing
-
-- Run `bun run typecheck`.
-- If DB/env behavior changed, run `bun run db:check`.
-- Manually exercise affected endpoints.
-- Confirm logs are useful and secret-safe.

packages/apn-relay/Dockerfile

@@ -1,14 +0,0 @@
-FROM oven/bun:1.3.11-alpine
-
-WORKDIR /app
-
-COPY package.json ./
-COPY tsconfig.json ./
-COPY drizzle.config.ts ./
-RUN bun install --production
-
-COPY src ./src
-
-EXPOSE 8787
-
-CMD ["bun", "run", "src/index.ts"]

packages/apn-relay/README.md

@@ -1,46 +0,0 @@
-# APN Relay
-
-Minimal APNs relay for OpenCode mobile background notifications.
-
-## What it does
-
-- Registers iOS device tokens for a shared secret.
-- Receives OpenCode event posts (`complete`, `permission`, `error`).
-- Sends APNs notifications to mapped devices.
-- Stores delivery rows in PlanetScale.
-
-## Routes
-
-- `GET /health`
-- `GET /` (simple dashboard)
-- `POST /v1/device/register`
-- `POST /v1/device/unregister`
-- `POST /v1/event`
-
-## Environment
-
-Use `.env.example` as a starting point.
-
-- `DATABASE_HOST`
-- `DATABASE_USERNAME`
-- `DATABASE_PASSWORD`
-- `APNS_TEAM_ID`
-- `APNS_KEY_ID`
-- `APNS_PRIVATE_KEY`
-- `APNS_DEFAULT_BUNDLE_ID`
-
-## Run locally
-
-```bash
-bun install
-bun run src/index.ts
-```
-
-## Docker
-
-Build from this directory:
-
-```bash
-docker build -t apn-relay .
-docker run --rm -p 8787:8787 --env-file .env apn-relay
-```

packages/apn-relay/drizzle.config.ts

@@ -1,17 +0,0 @@
-import { defineConfig } from "drizzle-kit"
-
-export default defineConfig({
-  out: "./migration",
-  strict: true,
-  schema: ["./src/**/*.sql.ts"],
-  dialect: "mysql",
-  dbCredentials: {
-    host: process.env.DATABASE_HOST ?? "",
-    user: process.env.DATABASE_USERNAME ?? "",
-    password: process.env.DATABASE_PASSWORD ?? "",
-    database: process.env.DATABASE_NAME ?? "main",
-    ssl: {
-      rejectUnauthorized: false,
-    },
-  },
-})

packages/apn-relay/package.json

@@ -1,27 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/package.json",
-  "name": "@opencode-ai/apn-relay",
-  "version": "0.0.0",
-  "private": true,
-  "type": "module",
-  "license": "MIT",
-  "scripts": {
-    "dev": "bun run src/index.ts",
-    "db:check": "bun run --env-file .env src/check.ts",
-    "typecheck": "tsgo --noEmit"
-  },
-  "dependencies": {
-    "@planetscale/database": "1.19.0",
-    "drizzle-orm": "1.0.0-beta.19-d95b7a4",
-    "hono": "4.10.7",
-    "jose": "6.0.11",
-    "zod": "4.1.8"
-  },
-  "devDependencies": {
-    "@tsconfig/bun": "1.0.9",
-    "@types/bun": "1.3.11",
-    "@typescript/native-preview": "7.0.0-dev.20251207.1",
-    "drizzle-kit": "1.0.0-beta.19-d95b7a4",
-    "typescript": "5.8.2"
-  }
-}

packages/apn-relay/src/apns.ts

@@ -1,148 +0,0 @@
-import { connect } from "node:http2"
-import { SignJWT, importPKCS8 } from "jose"
-import { env } from "./env"
-
-export type PushEnv = "sandbox" | "production"
-
-type PushInput = {
-  token: string
-  bundle: string
-  env: PushEnv
-  title: string
-  body: string
-  data: Record<string, unknown>
-}
-
-type PushResult = {
-  ok: boolean
-  code: number
-  error?: string
-}
-
-let jwt = ""
-let exp = 0
-let pk: Awaited<ReturnType<typeof importPKCS8>> | undefined
-
-function host(input: PushEnv) {
-  if (input === "sandbox") return "api.sandbox.push.apple.com"
-  return "api.push.apple.com"
-}
-
-function key() {
-  if (env.APNS_PRIVATE_KEY.includes("\\n")) return env.APNS_PRIVATE_KEY.replace(/\\n/g, "\n")
-  return env.APNS_PRIVATE_KEY
-}
-
-async function sign() {
-  if (!pk) pk = await importPKCS8(key(), "ES256")
-  const now = Math.floor(Date.now() / 1000)
-  if (jwt && now < exp) return jwt
-  jwt = await new SignJWT({})
-    .setProtectedHeader({ alg: "ES256", kid: env.APNS_KEY_ID })
-    .setIssuer(env.APNS_TEAM_ID)
-    .setIssuedAt(now)
-    .sign(pk)
-  exp = now + 50 * 60
-  return jwt
-}
-
-function post(input: {
-  host: string
-  token: string
-  auth: string
-  bundle: string
-  payload: string
-}): Promise<{ code: number; body: string }> {
-  return new Promise((resolve, reject) => {
-    const cli = connect(`https://${input.host}`)
-    let done = false
-    let code = 0
-    let body = ""
-
-    const stop = (fn: () => void) => {
-      if (done) return
-      done = true
-      fn()
-    }
-
-    cli.on("error", (err) => {
-      stop(() => reject(err))
-      cli.close()
-    })
-
-    const req = cli.request({
-      ":method": "POST",
-      ":path": `/3/device/${input.token}`,
-      authorization: `bearer ${input.auth}`,
-      "apns-topic": input.bundle,
-      "apns-push-type": "alert",
-      "apns-priority": "10",
-      "content-type": "application/json",
-    })
-
-    req.setEncoding("utf8")
-    req.on("response", (headers) => {
-      code = Number(headers[":status"] ?? 0)
-    })
-    req.on("data", (chunk) => {
-      body += chunk
-    })
-    req.on("end", () => {
-      stop(() => resolve({ code, body }))
-      cli.close()
-    })
-    req.on("error", (err) => {
-      stop(() => reject(err))
-      cli.close()
-    })
-    req.end(input.payload)
-  })
-}
-
-export async function send(input: PushInput): Promise<PushResult> {
-  const auth = await sign().catch((err) => {
-    return `error:${String(err)}`
-  })
-  if (auth.startsWith("error:")) {
-    return {
-      ok: false,
-      code: 0,
-      error: auth,
-    }
-  }
-
-  const payload = JSON.stringify({
-    aps: {
-      alert: {
-        title: input.title,
-        body: input.body,
-      },
-      sound: "default",
-    },
-    ...input.data,
-  })
-
-  const out = await post({
-    host: host(input.env),
-    token: input.token,
-    auth,
-    bundle: input.bundle,
-    payload,
-  }).catch((err) => ({
-    code: 0,
-    body: String(err),
-  }))
-
-  if (out.code === 200) {
-    return {
-      ok: true,
-      code: 200,
-    }
-  }
-
-  return {
-    ok: false,
-    code: out.code,
-    error: out.body,
-  }
-}

packages/apn-relay/src/check.ts

@@ -1,28 +0,0 @@
-import { sql } from "drizzle-orm"
-import { db } from "./db"
-import { env } from "./env"
-import { delivery_log, device_registration } from "./schema.sql"
-import { setup } from "./setup"
-
-async function run() {
-  console.log(`[apn-relay] DB host: ${env.DATABASE_HOST}`)
-
-  await db.execute(sql`SELECT 1`)
-  console.log("[apn-relay] DB connection OK")
-
-  await setup()
-  console.log("[apn-relay] Setup migration OK")
-
-  const [a] = await db.select({ value: sql<number>`count(*)` }).from(device_registration)
-  const [b] = await db.select({ value: sql<number>`count(*)` }).from(delivery_log)
-
-  console.log(`[apn-relay] device_registration rows: ${Number(a?.value ?? 0)}`)
-  console.log(`[apn-relay] delivery_log rows: ${Number(b?.value ?? 0)}`)
-  console.log("[apn-relay] DB check passed")
-}
-
-run().catch((err) => {
-  console.error("[apn-relay] DB check failed")
-  console.error(err)
-  process.exit(1)
-})

packages/apn-relay/src/db.ts

@@ -1,11 +0,0 @@
-import { Client } from "@planetscale/database"
-import { drizzle } from "drizzle-orm/planetscale-serverless"
-import { env } from "./env"
-
-const client = new Client({
-  host: env.DATABASE_HOST,
-  username: env.DATABASE_USERNAME,
-  password: env.DATABASE_PASSWORD,
-})
-
-export const db = drizzle({ client })

packages/apn-relay/src/env.ts

@@ -1,47 +0,0 @@
-import { z } from "zod"
-
-const bad = new Set(["undefined", "null"])
-const txt = z
-  .string()
-  .transform((input) => input.trim())
-  .refine((input) => input.length > 0 && !bad.has(input.toLowerCase()))
-
-const schema = z.object({
-  PORT: z.coerce.number().int().positive().default(8787),
-  DATABASE_HOST: txt,
-  DATABASE_USERNAME: txt,
-  DATABASE_PASSWORD: txt,
-  APNS_TEAM_ID: txt,
-  APNS_KEY_ID: txt,
-  APNS_PRIVATE_KEY: txt,
-  APNS_DEFAULT_BUNDLE_ID: txt,
-})
-
-const req = [
-  "DATABASE_HOST",
-  "DATABASE_USERNAME",
-  "DATABASE_PASSWORD",
-  "APNS_TEAM_ID",
-  "APNS_KEY_ID",
-  "APNS_PRIVATE_KEY",
-  "APNS_DEFAULT_BUNDLE_ID",
-] as const
-
-const out = schema.safeParse(process.env)
-
-if (!out.success) {
-  const miss = req.filter((key) => !process.env[key]?.trim())
-  const bad = out.error.issues
-    .map((item) => item.path[0])
-    .filter((key): key is string => typeof key === "string")
-    .filter((key) => !miss.includes(key as (typeof req)[number]))
-
-  console.error("[apn-relay] Invalid startup configuration")
-  if (miss.length) console.error(`[apn-relay] Missing required env vars: ${miss.join(", ")}`)
-  if (bad.length) console.error(`[apn-relay] Invalid env vars: ${Array.from(new Set(bad)).join(", ")}`)
-  console.error("[apn-relay] Check .env.example and restart")
-
-  throw new Error("Startup configuration invalid")
-}
-
-export const env = out.data

packages/apn-relay/src/hash.ts

@@ -1,5 +0,0 @@
-import { createHash } from "node:crypto"
-
-export function hash(input: string) {
-  return createHash("sha256").update(input).digest("hex")
-}

packages/apn-relay/src/index.ts

@@ -1,436 +0,0 @@
-import { randomUUID } from "node:crypto"
-import { and, desc, eq, sql } from "drizzle-orm"
-import { Hono } from "hono"
-import { z } from "zod"
-import { send } from "./apns"
-import { db } from "./db"
-import { env } from "./env"
-import { hash } from "./hash"
-import { delivery_log, device_registration } from "./schema.sql"
-import { setup } from "./setup"
-
-function bad(input?: string) {
-  if (!input) return false
-  return input.includes("BadEnvironmentKeyInToken")
-}
-
-function flip(input: "sandbox" | "production") {
-  if (input === "sandbox") return "production"
-  return "sandbox"
-}
-
-function tail(input: string) {
-  return input.slice(-8)
-}
-
-function esc(input: unknown) {
-  return String(input ?? "")
-    .replaceAll("&", "&")
-    .replaceAll("<", "&lt;")
-    .replaceAll(">", "&gt;")
-    .replaceAll('"', "&quot;")
-    .replaceAll("'", "&#39;")
-}
-
-function fmt(input: number) {
-  return new Date(input).toISOString()
-}
-
-const reg = z.object({
-  secret: z.string().min(1),
-  deviceToken: z.string().min(1),
-  bundleId: z.string().min(1).optional(),
-  apnsEnv: z.enum(["sandbox", "production"]).default("production"),
-})
-
-const unreg = z.object({
-  secret: z.string().min(1),
-  deviceToken: z.string().min(1),
-})
-
-const evt = z.object({
-  secret: z.string().min(1),
-  eventType: z.enum(["complete", "permission", "error"]),
-  sessionID: z.string().min(1),
-  title: z.string().min(1).optional(),
-  body: z.string().min(1).optional(),
-})
-
-function title(input: z.infer<typeof evt>["eventType"]) {
-  if (input === "complete") return "Session complete"
-  if (input === "permission") return "Action needed"
-  return "Session error"
-}
-
-function body(input: z.infer<typeof evt>["eventType"]) {
-  if (input === "complete") return "OpenCode finished your session."
-  if (input === "permission") return "OpenCode needs your permission decision."
-  return "OpenCode reported an error for your session."
-}
-
-const app = new Hono()
-
-app.onError((err, c) => {
-  return c.json(
-    {
-      ok: false,
-      error: err.message,
-    },
-    500,
-  )
-})
-
-app.notFound((c) => {
-  return c.json(
-    {
-      ok: false,
-      error: "Not found",
-    },
-    404,
-  )
-})
-
-app.get("/health", async (c) => {
-  const [a] = await db.select({ value: sql<number>`count(*)` }).from(device_registration)
-  const [b] = await db.select({ value: sql<number>`count(*)` }).from(delivery_log)
-  return c.json({
-    ok: true,
-    devices: Number(a?.value ?? 0),
-    deliveries: Number(b?.value ?? 0),
-  })
-})
-
-app.get("/", async (c) => {
-  const [a] = await db.select({ value: sql<number>`count(*)` }).from(device_registration)
-  const [b] = await db.select({ value: sql<number>`count(*)` }).from(delivery_log)
-  const devices = await db.select().from(device_registration).orderBy(desc(device_registration.updated_at)).limit(100)
-  const byBundle = await db
-    .select({
-      bundle: device_registration.bundle_id,
-      env: device_registration.apns_env,
-      value: sql<number>`count(*)`,
-    })
-    .from(device_registration)
-    .groupBy(device_registration.bundle_id, device_registration.apns_env)
-    .orderBy(desc(sql<number>`count(*)`))
-  const rows = await db.select().from(delivery_log).orderBy(desc(delivery_log.created_at)).limit(20)
-
-  const html = `<!doctype html>
-<html>
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>APN Relay</title>
-    <style>
-      body { font-family: ui-sans-serif, system-ui, sans-serif; margin: 24px; color: #111827; }
-      h1 { margin: 0 0 12px 0; }
-      h2 { margin: 22px 0 10px 0; font-size: 16px; }
-      .stats { display: flex; gap: 16px; margin: 0 0 18px 0; }
-      .card { border: 1px solid #e5e7eb; border-radius: 8px; padding: 10px 12px; min-width: 160px; }
-      .muted { color: #6b7280; font-size: 12px; }
-      .small { font-size: 11px; color: #6b7280; }
-      table { border-collapse: collapse; width: 100%; }
-      th, td { border: 1px solid #e5e7eb; text-align: left; padding: 8px; font-size: 12px; }
-      th { background: #f9fafb; }
-    </style>
-  </head>
-  <body>
-    <h1>APN Relay</h1>
-    <p class="muted">MVP dashboard</p>
-    <div class="stats">
-      <div class="card">
-        <div class="muted">Registered devices</div>
-        <div>${Number(a?.value ?? 0)}</div>
-      </div>
-      <div class="card">
-        <div class="muted">Delivery log rows</div>
-        <div>${Number(b?.value ?? 0)}</div>
-      </div>
-    </div>
-    <h2>Registered devices</h2>
-    <p class="small">Most recent 100 registrations. Token values are masked to suffix only.</p>
-    <table>
-      <thead>
-        <tr>
-          <th>updated</th>
-          <th>created</th>
-          <th>token suffix</th>
-          <th>env</th>
-          <th>bundle</th>
-          <th>secret hash</th>
-        </tr>
-      </thead>
-      <tbody>
-        ${
-          devices.length
-            ? devices
-                .map(
-                  (row) => `<tr>
-          <td>${esc(fmt(row.updated_at))}</td>
-          <td>${esc(fmt(row.created_at))}</td>
-          <td>${esc(tail(row.device_token))}</td>
-          <td>${esc(row.apns_env)}</td>
-          <td>${esc(row.bundle_id)}</td>
-          <td>${esc(`${row.secret_hash.slice(0, 12)}…`)}</td>
-        </tr>`,
-                )
-                .join("")
-            : `<tr><td colspan="6" class="muted">No devices registered.</td></tr>`
-        }
-      </tbody>
-    </table>
-    <h2>Bundle breakdown</h2>
-    <table>
-      <thead>
-        <tr>
-          <th>bundle</th>
-          <th>env</th>
-          <th>count</th>
-        </tr>
-      </thead>
-      <tbody>
-        ${
-          byBundle.length
-            ? byBundle
-                .map(
-                  (row) => `<tr>
-          <td>${esc(row.bundle)}</td>
-          <td>${esc(row.env)}</td>
-          <td>${esc(Number(row.value ?? 0))}</td>
-        </tr>`,
-                )
-                .join("")
-            : `<tr><td colspan="3" class="muted">No device data.</td></tr>`
-        }
-      </tbody>
-    </table>
-    <h2>Recent deliveries</h2>
-    <table>
-      <thead>
-        <tr>
-          <th>time</th>
-          <th>event</th>
-          <th>session</th>
-          <th>status</th>
-          <th>error</th>
-        </tr>
-      </thead>
-      <tbody>
-        ${rows
-          .map(
-            (row) => `<tr>
-          <td>${esc(fmt(row.created_at))}</td>
-          <td>${esc(row.event_type)}</td>
-          <td>${esc(row.session_id)}</td>
-          <td>${esc(row.status)}</td>
-          <td>${esc(row.error ?? "")}</td>
-        </tr>`,
-          )
-          .join("")}
-      </tbody>
-    </table>
-  </body>
-</html>`
-
-  return c.html(html)
-})
-
-app.post("/v1/device/register", async (c) => {
-  const raw = await c.req.json().catch(() => undefined)
-  const check = reg.safeParse(raw)
-  if (!check.success) {
-    return c.json(
-      {
-        ok: false,
-        error: "Invalid request body",
-      },
-      400,
-    )
-  }
-
-  const now = Date.now()
-  const key = hash(check.data.secret)
-  const row = {
-    id: randomUUID(),
-    secret_hash: key,
-    device_token: check.data.deviceToken,
-    bundle_id: check.data.bundleId ?? env.APNS_DEFAULT_BUNDLE_ID,
-    apns_env: check.data.apnsEnv,
-    created_at: now,
-    updated_at: now,
-  }
-
-  console.log("[relay] register", {
-    token: tail(row.device_token),
-    env: row.apns_env,
-    bundle: row.bundle_id,
-  })
-
-  await db
-    .insert(device_registration)
-    .values(row)
-    .onDuplicateKeyUpdate({
-      set: {
-        bundle_id: row.bundle_id,
-        apns_env: row.apns_env,
-        updated_at: now,
-      },
-    })
-
-  return c.json({ ok: true })
-})
-
-app.post("/v1/device/unregister", async (c) => {
-  const raw = await c.req.json().catch(() => undefined)
-  const check = unreg.safeParse(raw)
-  if (!check.success) {
-    return c.json(
-      {
-        ok: false,
-        error: "Invalid request body",
-      },
-      400,
-    )
-  }
-
-  console.log("[relay] unregister", {
-    token: tail(check.data.deviceToken),
-  })
-
-  await db
-    .delete(device_registration)
-    .where(
-      and(
-        eq(device_registration.secret_hash, hash(check.data.secret)),
-        eq(device_registration.device_token, check.data.deviceToken),
-      ),
-    )
-
-  return c.json({ ok: true })
-})
-
-app.post("/v1/event", async (c) => {
-  const raw = await c.req.json().catch(() => undefined)
-  const check = evt.safeParse(raw)
-  if (!check.success) {
-    return c.json(
-      {
-        ok: false,
-        error: "Invalid request body",
-      },
-      400,
-    )
-  }
-
-  const key = hash(check.data.secret)
-  const list = await db.select().from(device_registration).where(eq(device_registration.secret_hash, key))
-  console.log("[relay] event", {
-    type: check.data.eventType,
-    session: check.data.sessionID,
-    devices: list.length,
-  })
-  if (!list.length) {
-    return c.json({
-      ok: true,
-      sent: 0,
-      failed: 0,
-    })
-  }
-
-  const out = await Promise.all(
-    list.map(async (row) => {
-      const env = row.apns_env === "sandbox" ? "sandbox" : "production"
-      const payload = {
-        token: row.device_token,
-        bundle: row.bundle_id,
-        title: check.data.title ?? title(check.data.eventType),
-        body: check.data.body ?? body(check.data.eventType),
-        data: {
-          eventType: check.data.eventType,
-          sessionID: check.data.sessionID,
-        },
-      }
-      const first = await send({ ...payload, env })
-      if (first.ok || !bad(first.error)) {
-        if (!first.ok) {
-          console.log("[relay] send:error", {
-            token: tail(row.device_token),
-            env,
-            error: first.error,
-          })
-        }
-        return first
-      }
-
-      const alt = flip(env)
-      console.log("[relay] send:retry-env", {
-        token: tail(row.device_token),
-        from: env,
-        to: alt,
-      })
-      const second = await send({ ...payload, env: alt })
-      if (!second.ok) {
-        console.log("[relay] send:error", {
-          token: tail(row.device_token),
-          env: alt,
-          error: second.error,
-        })
-        return second
-      }
-
-      await db
-        .update(device_registration)
-        .set({ apns_env: alt, updated_at: Date.now() })
-        .where(
-          and(
-            eq(device_registration.secret_hash, row.secret_hash),
-            eq(device_registration.device_token, row.device_token),
-          ),
-        )
-
-      console.log("[relay] send:env-updated", {
-        token: tail(row.device_token),
-        env: alt,
-      })
-      return second
-    }),
-  )
-
-  const now = Date.now()
-  await db.insert(delivery_log).values(
-    out.map((item) => ({
-      id: randomUUID(),
-      secret_hash: key,
-      event_type: check.data.eventType,
-      session_id: check.data.sessionID,
-      status: item.ok ? "sent" : "failed",
-      error: item.error,
-      created_at: now,
-    })),
-  )
-
-  const sent = out.filter((item) => item.ok).length
-  console.log("[relay] event:done", {
-    type: check.data.eventType,
-    session: check.data.sessionID,
-    sent,
-    failed: out.length - sent,
-  })
-  return c.json({
-    ok: true,
-    sent,
-    failed: out.length - sent,
-  })
-})
-
-await setup()
-
-if (import.meta.main) {
-  Bun.serve({
-    port: env.PORT,
-    fetch: app.fetch,
-  })
-  console.log(`apn-relay listening on http://0.0.0.0:${env.PORT}`)
-}
-
-export { app }

packages/apn-relay/src/schema.sql.ts

@@ -1,35 +0,0 @@
-import { bigint, index, mysqlTable, uniqueIndex, varchar } from "drizzle-orm/mysql-core"
-
-export const device_registration = mysqlTable(
-  "device_registration",
-  {
-    id: varchar("id", { length: 36 }).primaryKey(),
-    secret_hash: varchar("secret_hash", { length: 64 }).notNull(),
-    device_token: varchar("device_token", { length: 255 }).notNull(),
-    bundle_id: varchar("bundle_id", { length: 255 }).notNull(),
-    apns_env: varchar("apns_env", { length: 16 }).notNull().default("production"),
-    created_at: bigint("created_at", { mode: "number" }).notNull(),
-    updated_at: bigint("updated_at", { mode: "number" }).notNull(),
-  },
-  (table) => [
-    uniqueIndex("device_registration_secret_token_idx").on(table.secret_hash, table.device_token),
-    index("device_registration_secret_hash_idx").on(table.secret_hash),
-  ],
-)
-
-export const delivery_log = mysqlTable(
-  "delivery_log",
-  {
-    id: varchar("id", { length: 36 }).primaryKey(),
-    secret_hash: varchar("secret_hash", { length: 64 }).notNull(),
-    event_type: varchar("event_type", { length: 32 }).notNull(),
-    session_id: varchar("session_id", { length: 255 }).notNull(),
-    status: varchar("status", { length: 16 }).notNull(),
-    error: varchar("error", { length: 1024 }),
-    created_at: bigint("created_at", { mode: "number" }).notNull(),
-  },
-  (table) => [
-    index("delivery_log_secret_hash_idx").on(table.secret_hash),
-    index("delivery_log_created_at_idx").on(table.created_at),
-  ],
-)

packages/apn-relay/src/setup.ts

@@ -1,34 +0,0 @@
-import { sql } from "drizzle-orm"
-import { db } from "./db"
-
-export async function setup() {
-  await db.execute(sql`
-    CREATE TABLE IF NOT EXISTS device_registration (
-      id varchar(36) NOT NULL,
-      secret_hash varchar(64) NOT NULL,
-      device_token varchar(255) NOT NULL,
-      bundle_id varchar(255) NOT NULL,
-      apns_env varchar(16) NOT NULL DEFAULT 'production',
-      created_at bigint NOT NULL,
-      updated_at bigint NOT NULL,
-      PRIMARY KEY (id),
-      UNIQUE KEY device_registration_secret_token_idx (secret_hash, device_token),
-      KEY device_registration_secret_hash_idx (secret_hash)
-    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
-  `)
-
-  await db.execute(sql`
-    CREATE TABLE IF NOT EXISTS delivery_log (
-      id varchar(36) NOT NULL,
-      secret_hash varchar(64) NOT NULL,
-      event_type varchar(32) NOT NULL,
-      session_id varchar(255) NOT NULL,
-      status varchar(16) NOT NULL,
-      error varchar(1024) NULL,
-      created_at bigint NOT NULL,
-      PRIMARY KEY (id),
-      KEY delivery_log_secret_hash_idx (secret_hash),
-      KEY delivery_log_created_at_idx (created_at)
-    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
-  `)
-}

packages/apn-relay/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/tsconfig",
-  "extends": "@tsconfig/bun/tsconfig.json",
-  "compilerOptions": {
-    "lib": ["ESNext", "DOM", "DOM.Iterable"],
-    "noUncheckedIndexedAccess": false
-  }
-}

packages/app/e2e/AGENTS.md

@@ -70,13 +70,8 @@ test("test description", async ({ page, sdk, gotoSession }) => {
 - `openSettings(page)` - Open settings dialog
 - `closeDialog(page, dialog)` - Close any dialog
 - `openSidebar(page)` / `closeSidebar(page)` - Toggle sidebar
-- `waitTerminalReady(page, { term? })` - Wait for a mounted terminal to connect and finish rendering output
-- `runTerminal(page, { cmd, token, term?, timeout? })` - Type into the terminal via the browser and wait for rendered output
 - `withSession(sdk, title, callback)` - Create temp session
 - `withProject(...)` - Create temp project/workspace
-- `sessionIDFromUrl(url)` - Read session ID from URL
-- `slugFromUrl(url)` - Read workspace slug from URL
-- `waitSlug(page, skip?)` - Wait for resolved workspace slug
 - `trackSession(sessionID, directory?)` - Register session for fixture cleanup
 - `trackDirectory(directory)` - Register directory for fixture cleanup
 - `clickListItem(container, filter)` - Click list item by key/text
@@ -169,51 +164,14 @@ await page.keyboard.press(`${modKey}+B`) // Toggle sidebar
 await page.keyboard.press(`${modKey}+Comma`) // Open settings
 ```
 
-### Terminal Tests
-
-- In terminal tests, type through the browser. Do not write to the PTY through the SDK.
-- Use `waitTerminalReady(page, { term? })` and `runTerminal(page, { cmd, token, term?, timeout? })` from `actions.ts`.
-- These helpers use the fixture-enabled test-only terminal driver and wait for output after the terminal writer settles.
-- 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
+4. Clean up any created resources
+5. Use specific selectors (avoid CSS classes)
+6. Test one feature per test file
 
 ## Local Development
 

packages/app/e2e/actions.ts

@@ -1,15 +1,12 @@
-import { base64Decode, base64Encode } from "@opencode-ai/util/encode"
 import { expect, type Locator, type Page } from "@playwright/test"
 import fs from "node:fs/promises"
 import os from "node:os"
 import path from "node:path"
 import { execSync } from "node:child_process"
-import { terminalAttr, type E2EWindow } from "../src/testing/terminal"
 import { createSdk, modKey, resolveDirectory, serverUrl } from "./utils"
 import {
   dropdownMenuTriggerSelector,
   dropdownMenuContentSelector,
-  projectSwitchSelector,
   projectMenuTriggerSelector,
   projectCloseMenuSelector,
   projectWorkspacesToggleSelector,
@@ -18,22 +15,10 @@ import {
   listItemSelector,
   listItemKeySelector,
   listItemKeyStartsWithSelector,
-  promptSelector,
-  terminalSelector,
   workspaceItemSelector,
   workspaceMenuTriggerSelector,
 } from "./selectors"
 
-const phase = new WeakMap<Page, "test" | "cleanup">()
-
-export function setHealthPhase(page: Page, value: "test" | "cleanup") {
-  phase.set(page, value)
-}
-
-export function healthPhase(page: Page) {
-  return phase.get(page) ?? "test"
-}
-
 export async function defocus(page: Page) {
   await page
     .evaluate(() => {
@@ -43,141 +28,9 @@ export async function defocus(page: Page) {
     .catch(() => undefined)
 }
 
-async function terminalID(term: Locator) {
-  const id = await term.getAttribute(terminalAttr)
-  if (id) return id
-  throw new Error(`Active terminal missing ${terminalAttr}`)
-}
-
-export async function terminalConnects(page: Page, input?: { term?: Locator }) {
-  const term = input?.term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(term)
-  return page.evaluate((id) => {
-    return (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id]?.connects ?? 0
-  }, id)
-}
-
-export async function disconnectTerminal(page: Page, input?: { term?: Locator }) {
-  const term = input?.term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(term)
-  await page.evaluate((id) => {
-    ;(window as E2EWindow).__opencode_e2e?.terminal?.controls?.[id]?.disconnect?.()
-  }, id)
-}
-
-async function terminalReady(page: Page, term?: Locator) {
-  const next = term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(next)
-  return page.evaluate((id) => {
-    const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id]
-    return !!state?.connected && (state.settled ?? 0) > 0
-  }, id)
-}
-
-async function terminalFocusIdle(page: Page, term?: Locator) {
-  const next = term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(next)
-  return page.evaluate((id) => {
-    const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id]
-    return (state?.focusing ?? 0) === 0
-  }, id)
-}
-
-async function terminalHas(page: Page, input: { term?: Locator; token: string }) {
-  const next = input.term ?? page.locator(terminalSelector).first()
-  const id = await terminalID(next)
-  return page.evaluate(
-    (input) => {
-      const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[input.id]
-      return state?.rendered.includes(input.token) ?? false
-    },
-    { id, token: input.token },
-  )
-}
-
-async function promptSlashActive(page: Page, id: string) {
-  return page.evaluate((id) => {
-    const state = (window as E2EWindow).__opencode_e2e?.prompt?.current
-    if (state?.popover !== "slash") return false
-    if (!state.slash.ids.includes(id)) return false
-    return state.slash.active === id
-  }, id)
-}
-
-async function promptSlashSelects(page: Page) {
-  return page.evaluate(() => {
-    return (window as E2EWindow).__opencode_e2e?.prompt?.current?.selects ?? 0
-  })
-}
-
-async function promptSlashSelected(page: Page, input: { id: string; count: number }) {
-  return page.evaluate((input) => {
-    const state = (window as E2EWindow).__opencode_e2e?.prompt?.current
-    if (!state) return false
-    return state.selected === input.id && state.selects >= input.count
-  }, input)
-}
-
-export async function waitTerminalReady(page: Page, input?: { term?: Locator; timeout?: number }) {
-  const term = input?.term ?? page.locator(terminalSelector).first()
-  const timeout = input?.timeout ?? 10_000
-  await expect(term).toBeVisible()
-  await expect(term.locator("textarea")).toHaveCount(1)
-  await expect.poll(() => terminalReady(page, term), { timeout }).toBe(true)
-}
-
-export async function waitTerminalFocusIdle(page: Page, input?: { term?: Locator; timeout?: number }) {
-  const term = input?.term ?? page.locator(terminalSelector).first()
-  const timeout = input?.timeout ?? 10_000
-  await waitTerminalReady(page, { term, timeout })
-  await expect.poll(() => terminalFocusIdle(page, term), { timeout }).toBe(true)
-}
-
-export async function showPromptSlash(
-  page: Page,
-  input: { id: string; text: string; prompt?: Locator; timeout?: number },
-) {
-  const prompt = input.prompt ?? page.locator(promptSelector)
-  const timeout = input.timeout ?? 10_000
-  await expect
-    .poll(
-      async () => {
-        await prompt.click().catch(() => false)
-        await prompt.fill(input.text).catch(() => false)
-        return promptSlashActive(page, input.id).catch(() => false)
-      },
-      { timeout },
-    )
-    .toBe(true)
-}
-
-export async function runPromptSlash(
-  page: Page,
-  input: { id: string; text: string; prompt?: Locator; timeout?: number },
-) {
-  const prompt = input.prompt ?? page.locator(promptSelector)
-  const timeout = input.timeout ?? 10_000
-  const count = await promptSlashSelects(page)
-  await showPromptSlash(page, input)
-  await prompt.press("Enter")
-  await expect.poll(() => promptSlashSelected(page, { id: input.id, count: count + 1 }), { timeout }).toBe(true)
-}
-
-export async function runTerminal(page: Page, input: { cmd: string; token: string; term?: Locator; timeout?: number }) {
-  const term = input.term ?? page.locator(terminalSelector).first()
-  const timeout = input.timeout ?? 10_000
-  await waitTerminalReady(page, { term, timeout })
-  const textarea = term.locator("textarea")
-  await term.click()
-  await expect(textarea).toBeFocused()
-  await page.keyboard.type(input.cmd)
-  await page.keyboard.press("Enter")
-  await expect.poll(() => terminalHas(page, { term, token: input.token }), { timeout }).toBe(true)
-}
-
-export async function openPalette(page: Page, key = "K") {
+export async function openPalette(page: Page) {
   await defocus(page)
-  await page.keyboard.press(`${modKey}+${key}`)
+  await page.keyboard.press(`${modKey}+P`)
 
   const dialog = page.getByRole("dialog")
   await expect(dialog).toBeVisible()
@@ -207,49 +60,9 @@ export async function closeDialog(page: Page, dialog: Locator) {
 }
 
 export async function isSidebarClosed(page: Page) {
-  const button = await waitSidebarButton(page, "isSidebarClosed")
-  return (await button.getAttribute("aria-expanded")) !== "true"
-}
-
-async function errorBoundaryText(page: Page) {
-  const title = page.getByRole("heading", { name: /something went wrong/i }).first()
-  if (!(await title.isVisible().catch(() => false))) return
-
-  const description = await page
-    .getByText(/an error occurred while loading the application\./i)
-    .first()
-    .textContent()
-    .catch(() => "")
-  const detail = await page
-    .getByRole("textbox", { name: /error details/i })
-    .first()
-    .inputValue()
-    .catch(async () =>
-      (
-        (await page
-          .getByRole("textbox", { name: /error details/i })
-          .first()
-          .textContent()
-          .catch(() => "")) ?? ""
-      ).trim(),
-    )
-
-  return [title ? "Error boundary" : "", description ?? "", detail ?? ""].filter(Boolean).join("\n")
-}
-
-export async function assertHealthy(page: Page, context: string) {
-  const text = await errorBoundaryText(page)
-  if (!text) return
-  console.log(`[e2e:error-boundary][${context}]\n${text}`)
-  throw new Error(`Error boundary during ${context}\n${text}`)
-}
-
-async function waitSidebarButton(page: Page, context: string) {
   const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
-  const boundary = page.getByRole("heading", { name: /something went wrong/i }).first()
-  await button.or(boundary).first().waitFor({ state: "visible", timeout: 10_000 })
-  await assertHealthy(page, context)
-  return button
+  await expect(button).toBeVisible()
+  return (await button.getAttribute("aria-expanded")) !== "true"
 }
 
 export async function toggleSidebar(page: Page) {
@@ -260,7 +73,7 @@ export async function toggleSidebar(page: Page) {
 export async function openSidebar(page: Page) {
   if (!(await isSidebarClosed(page))) return
 
-  const button = await waitSidebarButton(page, "openSidebar")
+  const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
   await button.click()
 
   const opened = await expect(button)
@@ -277,7 +90,7 @@ export async function openSidebar(page: Page) {
 export async function closeSidebar(page: Page) {
   if (await isSidebarClosed(page)) return
 
-  const button = await waitSidebarButton(page, "closeSidebar")
+  const button = page.getByRole("button", { name: /toggle sidebar/i }).first()
   await button.click()
 
   const closed = await expect(button)
@@ -292,7 +105,6 @@ export async function closeSidebar(page: Page) {
 }
 
 export async function openSettings(page: Page) {
-  await assertHealthy(page, "openSettings")
   await defocus(page)
 
   const dialog = page.getByRole("dialog")
@@ -305,8 +117,6 @@ export async function openSettings(page: Page) {
 
   if (opened) return dialog
 
-  await assertHealthy(page, "openSettings")
-
   await page.getByRole("button", { name: "Settings" }).first().click()
   await expect(dialog).toBeVisible()
   return dialog
@@ -368,12 +178,10 @@ export async function seedProjects(page: Page, input: { directory: string; extra
 
 export async function createTestProject() {
   const root = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-project-"))
-  const id = `e2e-${path.basename(root)}`
 
-  await fs.writeFile(path.join(root, "README.md"), `# e2e\n\n${id}\n`)
+  await fs.writeFile(path.join(root, "README.md"), "# e2e\n")
 
   execSync("git init", { cwd: root, stdio: "ignore" })
-  await fs.writeFile(path.join(root, ".git", "opencode"), id)
   execSync("git config core.fsmonitor false", { cwd: root, stdio: "ignore" })
   execSync("git add -A", { cwd: root, stdio: "ignore" })
   execSync('git -c user.name="e2e" -c user.email="e2e@example.com" commit -m "init" --allow-empty', {
@@ -391,136 +199,6 @@ export async function cleanupTestProject(directory: string) {
   await fs.rm(directory, { recursive: true, force: true, maxRetries: 5, retryDelay: 100 }).catch(() => undefined)
 }
 
-export function slugFromUrl(url: string) {
-  return /\/([^/]+)\/session(?:[/?#]|$)/.exec(url)?.[1] ?? ""
-}
-
-async function probeSession(page: Page) {
-  return page
-    .evaluate(() => {
-      const win = window as E2EWindow
-      const current = win.__opencode_e2e?.model?.current
-      if (!current) return null
-      return { dir: current.dir, sessionID: current.sessionID }
-    })
-    .catch(() => null as { dir?: string; sessionID?: string } | null)
-}
-
-export async function waitSlug(page: Page, skip: string[] = []) {
-  let prev = ""
-  let next = ""
-  await expect
-    .poll(
-      async () => {
-        await assertHealthy(page, "waitSlug")
-        const slug = slugFromUrl(page.url())
-        if (!slug) return ""
-        if (skip.includes(slug)) return ""
-        if (slug !== prev) {
-          prev = slug
-          next = ""
-          return ""
-        }
-        next = slug
-        return slug
-      },
-      { timeout: 45_000 },
-    )
-    .not.toBe("")
-  return next
-}
-
-export async function resolveSlug(slug: string) {
-  const directory = base64Decode(slug)
-  if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`)
-  const resolved = await resolveDirectory(directory)
-  return { directory: resolved, slug: base64Encode(resolved), raw: slug }
-}
-
-export async function waitDir(page: Page, directory: string) {
-  const target = await resolveDirectory(directory)
-  await expect
-    .poll(
-      async () => {
-        await assertHealthy(page, "waitDir")
-        const slug = slugFromUrl(page.url())
-        if (!slug) return ""
-        return resolveSlug(slug)
-          .then((item) => item.directory)
-          .catch(() => "")
-      },
-      { timeout: 45_000 },
-    )
-    .toBe(target)
-  return { directory: target, slug: base64Encode(target) }
-}
-
-export async function waitSession(page: Page, input: { directory: string; sessionID?: string }) {
-  const target = await resolveDirectory(input.directory)
-  await expect
-    .poll(
-      async () => {
-        await assertHealthy(page, "waitSession")
-        const slug = slugFromUrl(page.url())
-        if (!slug) return false
-        const resolved = await resolveSlug(slug).catch(() => undefined)
-        if (!resolved || resolved.directory !== target) return false
-        const current = sessionIDFromUrl(page.url())
-        if (input.sessionID && current !== input.sessionID) return false
-        if (!input.sessionID && current) return false
-
-        const state = await probeSession(page)
-        if (input.sessionID && (!state || state.sessionID !== input.sessionID)) return false
-        if (!input.sessionID && state?.sessionID) return false
-        if (state?.dir) {
-          const dir = await resolveDirectory(state.dir).catch(() => state.dir ?? "")
-          if (dir !== target) return false
-        }
-
-        return page
-          .locator(promptSelector)
-          .first()
-          .isVisible()
-          .catch(() => false)
-      },
-      { timeout: 45_000 },
-    )
-    .toBe(true)
-  return { directory: target, slug: base64Encode(target) }
-}
-
-export async function waitSessionSaved(directory: string, sessionID: string, timeout = 30_000) {
-  const sdk = createSdk(directory)
-  const target = await resolveDirectory(directory)
-
-  await expect
-    .poll(
-      async () => {
-        const data = await sdk.session
-          .get({ sessionID })
-          .then((x) => x.data)
-          .catch(() => undefined)
-        if (!data?.directory) return ""
-        return resolveDirectory(data.directory).catch(() => data.directory)
-      },
-      { timeout },
-    )
-    .toBe(target)
-
-  await expect
-    .poll(
-      async () => {
-        const items = await sdk.session
-          .messages({ sessionID, limit: 20 })
-          .then((x) => x.data ?? [])
-          .catch(() => [])
-        return items.some((item) => item.info.role === "user")
-      },
-      { timeout },
-    )
-    .toBe(true)
-}
-
 export function sessionIDFromUrl(url: string) {
   const match = /\/session\/([^/?#]+)/.exec(url)
   return match?.[1]
@@ -834,19 +512,12 @@ export async function seedSessionTask(
         .flatMap((message) => message.parts)
         .find((part) => {
           if (part.type !== "tool" || part.tool !== "task") return false
-          if (!("state" in part) || !part.state || typeof part.state !== "object") return false
-          if (!("input" in part.state) || !part.state.input || typeof part.state.input !== "object") return false
-          if (!("description" in part.state.input) || part.state.input.description !== input.description) return false
-          if (!("metadata" in part.state) || !part.state.metadata || typeof part.state.metadata !== "object")
-            return false
-          if (!("sessionId" in part.state.metadata)) return false
-          return typeof part.state.metadata.sessionId === "string" && part.state.metadata.sessionId.length > 0
+          if (part.state.input?.description !== input.description) return false
+          return typeof part.state.metadata?.sessionId === "string" && part.state.metadata.sessionId.length > 0
         })
 
-      if (!part || !("state" in part) || !part.state || typeof part.state !== "object") return
-      if (!("metadata" in part.state) || !part.state.metadata || typeof part.state.metadata !== "object") return
-      if (!("sessionId" in part.state.metadata)) return
-      const id = part.state.metadata.sessionId
+      if (!part) return
+      const id = part.state.metadata?.sessionId
       if (typeof id !== "string" || !id) return
       const child = await sdk.session
         .get({ sessionID: id })
@@ -932,14 +603,8 @@ export async function openStatusPopover(page: Page) {
 }
 
 export async function openProjectMenu(page: Page, projectSlug: string) {
-  await openSidebar(page)
-  const item = page.locator(projectSwitchSelector(projectSlug)).first()
-  await expect(item).toBeVisible()
-  await item.hover()
-
   const trigger = page.locator(projectMenuTriggerSelector(projectSlug)).first()
   await expect(trigger).toHaveCount(1)
-  await expect(trigger).toBeVisible()
 
   const menu = page
     .locator(dropdownMenuContentSelector)
@@ -948,7 +613,7 @@ export async function openProjectMenu(page: Page, projectSlug: string) {
   const close = menu.locator(projectCloseMenuSelector(projectSlug)).first()
 
   const clicked = await trigger
-    .click({ force: true, timeout: 1500 })
+    .click({ timeout: 1500 })
     .then(() => true)
     .catch(() => false)
 

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

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

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

@@ -1,5 +1,5 @@
 import { test, expect } from "../fixtures"
-import { closeDialog, openPalette } from "../actions"
+import { openPalette } from "../actions"
 
 test("search palette opens and closes", async ({ page, gotoSession }) => {
   await gotoSession()
@@ -9,12 +9,3 @@ test("search palette opens and closes", async ({ page, gotoSession }) => {
   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

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

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

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

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

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

packages/app/e2e/fixtures.ts

@@ -1,16 +1,6 @@
 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 { cleanupSession, cleanupTestProject, createTestProject, seedProjects, sessionIDFromUrl } from "./actions"
+import { promptSelector } from "./selectors"
 import { createSdk, dirSlug, getWorktree, sessionPath } from "./utils"
 
 export const settingsKey = "settings.v3"
@@ -36,29 +26,6 @@ type WorkerFixtures = {
 }
 
 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()
@@ -80,20 +47,21 @@ export const test = base.extend<TestFixtures, WorkerFixtures>({
 
     const gotoSession = async (sessionID?: string) => {
       await page.goto(sessionPath(directory, sessionID))
-      await waitSession(page, { directory, sessionID })
+      await expect(page.locator(promptSelector)).toBeVisible()
     }
     await use(gotoSession)
   },
   withProject: async ({ page }, use) => {
     await use(async (callback, options) => {
       const root = await createTestProject()
+      const slug = dirSlug(root)
       const sessions = new Map<string, string>()
       const dirs = new Set<string>()
       await seedStorage(page, { directory: root, extra: options?.extra })
 
       const gotoSession = async (sessionID?: string) => {
         await page.goto(sessionPath(root, sessionID))
-        await waitSession(page, { directory: root, sessionID })
+        await expect(page.locator(promptSelector)).toBeVisible()
         const current = sessionIDFromUrl(page.url())
         if (current) trackSession(current)
       }
@@ -108,16 +76,13 @@ export const test = base.extend<TestFixtures, WorkerFixtures>({
 
       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")
       }
     })
   },
@@ -126,20 +91,6 @@ export const test = base.extend<TestFixtures, WorkerFixtures>({
 async function seedStorage(page: Page, input: { directory: string; extra?: string[] }) {
   await seedProjects(page, input)
   await page.addInitScript(() => {
-    const win = window as E2EWindow
-    win.__opencode_e2e = {
-      ...win.__opencode_e2e,
-      model: {
-        enabled: true,
-      },
-      prompt: {
-        enabled: true,
-      },
-      terminal: {
-        enabled: true,
-        terminals: {},
-      },
-    }
     localStorage.setItem(
       "opencode.global.dat:model",
       JSON.stringify({

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

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

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

@@ -1,18 +1,44 @@
 import { base64Decode } from "@opencode-ai/util/encode"
+import type { Page } from "@playwright/test"
 import { test, expect } from "../fixtures"
-import {
-  defocus,
-  createTestProject,
-  cleanupTestProject,
-  openSidebar,
-  sessionIDFromUrl,
-  setWorkspacesEnabled,
-  waitSession,
-  waitSessionSaved,
-  waitSlug,
-} from "../actions"
+import { defocus, createTestProject, cleanupTestProject, openSidebar, sessionIDFromUrl } from "../actions"
 import { projectSwitchSelector, promptSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors"
-import { dirSlug, resolveDirectory } from "../utils"
+import { dirSlug } from "../utils"
+
+function slugFromUrl(url: string) {
+  return /\/([^/]+)\/session(?:\/|$)/.exec(url)?.[1] ?? ""
+}
+
+async function workspaces(page: Page, directory: string, enabled: boolean) {
+  await page.evaluate(
+    ({ directory, enabled }: { directory: string; enabled: boolean }) => {
+      const key = "opencode.global.dat:layout"
+      const raw = localStorage.getItem(key)
+      const data = raw ? JSON.parse(raw) : {}
+      const sidebar = data.sidebar && typeof data.sidebar === "object" ? data.sidebar : {}
+      const current =
+        sidebar.workspaces && typeof sidebar.workspaces === "object" && !Array.isArray(sidebar.workspaces)
+          ? sidebar.workspaces
+          : {}
+      const next = { ...current }
+
+      if (enabled) next[directory] = true
+      if (!enabled) delete next[directory]
+
+      localStorage.setItem(
+        key,
+        JSON.stringify({
+          ...data,
+          sidebar: {
+            ...sidebar,
+            workspaces: next,
+          },
+        }),
+      )
+    },
+    { directory, enabled },
+  )
+}
 
 test("can switch between projects from sidebar", async ({ page, withProject }) => {
   await page.setViewportSize({ width: 1400, height: 800 })
@@ -50,33 +76,46 @@ test("switching back to a project opens the latest workspace session", async ({
 
   const other = await createTestProject()
   const otherSlug = dirSlug(other)
+  let workspaceDir: string | undefined
   try {
     await withProject(
       async ({ directory, slug, trackSession, trackDirectory }) => {
         await defocus(page)
-        await setWorkspacesEnabled(page, slug, true)
+        await workspaces(page, directory, true)
+        await page.reload()
+        await expect(page.locator(promptSelector)).toBeVisible()
         await openSidebar(page)
         await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()
 
         await page.getByRole("button", { name: "New workspace" }).first().click()
 
-        const raw = await waitSlug(page, [slug])
-        const dir = base64Decode(raw)
-        if (!dir) throw new Error(`Failed to decode workspace slug: ${raw}`)
-        const space = await resolveDirectory(dir)
-        const next = dirSlug(space)
-        trackDirectory(space)
+        await expect
+          .poll(
+            () => {
+              const next = slugFromUrl(page.url())
+              if (!next) return ""
+              if (next === slug) return ""
+              return next
+            },
+            { timeout: 45_000 },
+          )
+          .not.toBe("")
+
+        const workspaceSlug = slugFromUrl(page.url())
+        workspaceDir = base64Decode(workspaceSlug)
+        if (!workspaceDir) throw new Error(`Failed to decode workspace slug: ${workspaceSlug}`)
+        trackDirectory(workspaceDir)
         await openSidebar(page)
 
-        const item = page.locator(`${workspaceItemSelector(next)}, ${workspaceItemSelector(raw)}`).first()
-        await expect(item).toBeVisible()
-        await item.hover()
+        const workspace = page.locator(workspaceItemSelector(workspaceSlug)).first()
+        await expect(workspace).toBeVisible()
+        await workspace.hover()
 
-        const btn = page.locator(`${workspaceNewSessionSelector(next)}, ${workspaceNewSessionSelector(raw)}`).first()
-        await expect(btn).toBeVisible()
-        await btn.click({ force: true })
+        const newSession = page.locator(workspaceNewSessionSelector(workspaceSlug)).first()
+        await expect(newSession).toBeVisible()
+        await newSession.click({ force: true })
 
-        await waitSession(page, { directory: space })
+        await expect(page).toHaveURL(new RegExp(`/${workspaceSlug}/session(?:[/?#]|$)`))
 
         // Create a session by sending a prompt
         const prompt = page.locator(promptSelector)
@@ -89,23 +128,22 @@ test("switching back to a project opens the latest workspace session", async ({
 
         const created = sessionIDFromUrl(page.url())
         if (!created) throw new Error(`Failed to get session ID from url: ${page.url()}`)
-        trackSession(created, space)
-        await waitSessionSaved(space, created)
+        trackSession(created, workspaceDir)
 
-        await expect(page).toHaveURL(new RegExp(`/${next}/session/${created}(?:[/?#]|$)`))
+        await expect(page).toHaveURL(new RegExp(`/${workspaceSlug}/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 })
+        await otherButton.click()
+        await expect(page).toHaveURL(new RegExp(`/${otherSlug}/session`))
 
         const rootButton = page.locator(projectSwitchSelector(slug)).first()
         await expect(rootButton).toBeVisible()
-        await rootButton.click({ force: true })
+        await rootButton.click()
 
-        await waitSession(page, { directory: space, sessionID: created })
+        await expect.poll(() => sessionIDFromUrl(page.url()) ?? "").toBe(created)
         await expect(page).toHaveURL(new RegExp(`/session/${created}(?:[/?#]|$)`))
       },
       { extra: [other] },

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

@@ -1,94 +1,133 @@
+import { base64Decode } from "@opencode-ai/util/encode"
 import type { Page } from "@playwright/test"
 import { test, expect } from "../fixtures"
-import {
-  openSidebar,
-  resolveSlug,
-  sessionIDFromUrl,
-  setWorkspacesEnabled,
-  waitDir,
-  waitSession,
-  waitSessionSaved,
-  waitSlug,
-} from "../actions"
+import { openSidebar, sessionIDFromUrl, setWorkspacesEnabled } 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 slugFromUrl(url: string) {
+  return /\/([^/]+)\/session(?:\/|$)/.exec(url)?.[1] ?? ""
 }
 
-function button(space: { slug: string; raw: string }) {
-  return `${workspaceNewSessionSelector(space.slug)}, ${workspaceNewSessionSelector(space.raw)}`
+async function waitSlug(page: Page, skip: string[] = []) {
+  let prev = ""
+  await expect
+    .poll(
+      () => {
+        const slug = slugFromUrl(page.url())
+        if (!slug) return ""
+        if (skip.includes(slug)) return ""
+        if (slug !== prev) {
+          prev = slug
+          return ""
+        }
+        return slug
+      },
+      { timeout: 45_000 },
+    )
+    .not.toBe("")
+  return slugFromUrl(page.url())
 }
 
-async function waitWorkspaceReady(page: Page, space: { slug: string; raw: string }) {
+async function waitWorkspaceReady(page: Page, slug: string) {
   await openSidebar(page)
-  await expect(page.locator(item(space)).first()).toBeVisible({ timeout: 60_000 })
+  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 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)
+  const slug = await waitSlug(page, [root, ...seen])
+  const directory = base64Decode(slug)
+  if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`)
+  return { slug, directory }
+}
+
+async function openWorkspaceNewSession(page: Page, slug: string) {
+  await waitWorkspaceReady(page, slug)
+
+  const item = page.locator(workspaceItemSelector(slug)).first()
+  await item.hover()
+
+  const button = page.locator(workspaceNewSessionSelector(slug)).first()
+  await expect(button).toBeVisible()
+  await button.click({ force: true })
+
+  const next = await waitSlug(page)
+  await expect(page).toHaveURL(new RegExp(`/${next}/session(?:[/?#]|$)`))
   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)
+async function createSessionFromWorkspace(page: Page, slug: string, text: string) {
+  const next = await openWorkspaceNewSession(page, slug)
 
   const prompt = page.locator(promptSelector)
   await expect(prompt).toBeVisible()
+  await expect(prompt).toBeEditable()
+  await prompt.click()
+  await expect(prompt).toBeFocused()
   await prompt.fill(text)
-  await page.keyboard.press("Enter")
+  await expect.poll(async () => ((await prompt.textContent()) ?? "").trim()).toContain(text)
+  await prompt.press("Enter")
+
+  await expect.poll(() => slugFromUrl(page.url())).toBe(next)
+  await expect.poll(() => sessionIDFromUrl(page.url()) ?? "", { timeout: 30_000 }).not.toBe("")
 
-  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 expect(page).toHaveURL(new RegExp(`/${next}/session/${sessionID}(?:[/?#]|$)`))
+  return { sessionID, slug: next }
+}
 
-  await waitSessionSaved(space.directory, sessionID)
-  await createSdk(space.directory)
-    .session.abort({ sessionID })
+async function sessionDirectory(directory: string, sessionID: string) {
+  const info = await createSdk(directory)
+    .session.get({ sessionID })
+    .then((x) => x.data)
     .catch(() => undefined)
-  return sessionID
+  if (!info) return ""
+  return info.directory
 }
 
 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 withProject(async ({ directory, slug: root, trackSession, trackDirectory }) => {
     await openSidebar(page)
     await setWorkspacesEnabled(page, root, true)
 
     const first = await createWorkspace(page, root, [])
     trackDirectory(first.directory)
-    await waitWorkspaceReady(page, first)
+    await waitWorkspaceReady(page, first.slug)
 
     const second = await createWorkspace(page, root, [first.slug])
     trackDirectory(second.directory)
-    await waitWorkspaceReady(page, second)
+    await waitWorkspaceReady(page, second.slug)
 
-    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)
+    const firstSession = await createSessionFromWorkspace(page, first.slug, `workspace one ${Date.now()}`)
+    trackSession(firstSession.sessionID, first.directory)
+
+    const secondSession = await createSessionFromWorkspace(page, second.slug, `workspace two ${Date.now()}`)
+    trackSession(secondSession.sessionID, second.directory)
+
+    const thirdSession = await createSessionFromWorkspace(page, first.slug, `workspace one again ${Date.now()}`)
+    trackSession(thirdSession.sessionID, first.directory)
+
+    await expect.poll(() => sessionDirectory(first.directory, firstSession.sessionID)).toBe(first.directory)
+    await expect.poll(() => sessionDirectory(second.directory, secondSession.sessionID)).toBe(second.directory)
+    await expect.poll(() => sessionDirectory(first.directory, thirdSession.sessionID)).toBe(first.directory)
   })
 })

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

@@ -1,7 +1,7 @@
+import { base64Decode } from "@opencode-ai/util/encode"
 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"
@@ -13,15 +13,35 @@ import {
   confirmDialog,
   openSidebar,
   openWorkspaceMenu,
-  resolveSlug,
   setWorkspacesEnabled,
-  slugFromUrl,
-  waitDir,
-  waitSlug,
 } from "../actions"
 import { dropdownMenuContentSelector, inlineInputSelector, workspaceItemSelector } from "../selectors"
 import { createSdk, dirSlug } from "../utils"
 
+function slugFromUrl(url: string) {
+  return /\/([^/]+)\/session(?:\/|$)/.exec(url)?.[1] ?? ""
+}
+
+async function waitSlug(page: Page, skip: string[] = []) {
+  let prev = ""
+  await expect
+    .poll(
+      () => {
+        const slug = slugFromUrl(page.url())
+        if (!slug) return ""
+        if (skip.includes(slug)) return ""
+        if (slug !== prev) {
+          prev = slug
+          return ""
+        }
+        return slug
+      },
+      { timeout: 45_000 },
+    )
+    .not.toBe("")
+  return slugFromUrl(page.url())
+}
+
 async function setupWorkspaceTest(page: Page, project: { slug: string }) {
   const rootSlug = project.slug
   await openSidebar(page)
@@ -29,15 +49,15 @@ async function setupWorkspaceTest(page: Page, project: { slug: string }) {
   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)
+  const slug = await waitSlug(page, [rootSlug])
+  const dir = base64Decode(slug)
 
   await openSidebar(page)
 
   await expect
     .poll(
       async () => {
-        const item = page.locator(workspaceItemSelector(next.slug)).first()
+        const item = page.locator(workspaceItemSelector(slug)).first()
         try {
           await item.hover({ timeout: 500 })
           return true
@@ -49,7 +69,7 @@ async function setupWorkspaceTest(page: Page, project: { slug: string }) {
     )
     .toBe(true)
 
-  return { rootSlug, slug: next.slug, directory: next.directory }
+  return { rootSlug, slug, directory: dir }
 }
 
 test("can enable and disable workspaces from project menu", async ({ page, withProject }) => {
@@ -81,15 +101,15 @@ test("can create a workspace", async ({ page, withProject }) => {
     await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible()
 
     await page.getByRole("button", { name: "New workspace" }).first().click()
-    const next = await resolveSlug(await waitSlug(page, [slug]))
-    await waitDir(page, next.directory)
+    const workspaceSlug = await waitSlug(page, [slug])
+    const workspaceDir = base64Decode(workspaceSlug)
 
     await openSidebar(page)
 
     await expect
       .poll(
         async () => {
-          const item = page.locator(workspaceItemSelector(next.slug)).first()
+          const item = page.locator(workspaceItemSelector(workspaceSlug)).first()
           try {
             await item.hover({ timeout: 500 })
             return true
@@ -101,9 +121,9 @@ test("can create a workspace", async ({ page, withProject }) => {
       )
       .toBe(true)
 
-    await expect(page.locator(workspaceItemSelector(next.slug)).first()).toBeVisible()
+    await expect(page.locator(workspaceItemSelector(workspaceSlug)).first()).toBeVisible()
 
-    await cleanupTestProject(next.directory)
+    await cleanupTestProject(workspaceDir)
   })
 })
 
@@ -121,7 +141,7 @@ test("non-git projects keep workspace mode disabled", async ({ page, withProject
 
       await expect.poll(() => slugFromUrl(page.url()), { timeout: 30_000 }).not.toBe("")
 
-      const activeDir = await resolveSlug(slugFromUrl(page.url())).then((item) => item.directory)
+      const activeDir = base64Decode(slugFromUrl(page.url()))
       expect(path.basename(activeDir)).toContain("opencode-e2e-project-nongit-")
 
       await openSidebar(page)
@@ -333,9 +353,19 @@ test("can reorder workspaces by drag and drop", async ({ page, withProject }) =>
       for (const _ of [0, 1]) {
         const prev = slugFromUrl(page.url())
         await page.getByRole("button", { name: "New workspace" }).first().click()
-        const next = await resolveSlug(await waitSlug(page, [rootSlug, prev]))
-        await waitDir(page, next.directory)
-        workspaces.push(next)
+        await expect
+          .poll(
+            () => {
+              const slug = slugFromUrl(page.url())
+              return slug.length > 0 && slug !== rootSlug && slug !== prev
+            },
+            { timeout: 45_000 },
+          )
+          .toBe(true)
+
+        const slug = slugFromUrl(page.url())
+        const dir = base64Decode(slug)
+        workspaces.push({ slug, directory: dir })
 
         await openSidebar(page)
       }

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

@@ -108,10 +108,7 @@ test("prompt history restores unsent draft with arrow navigation", async ({ page
     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 edge(page, "start")
     await page.keyboard.press("ArrowUp")
     await wait(page, second)
 
@@ -122,7 +119,7 @@ test("prompt history restores unsent draft with arrow navigation", async ({ page
     await wait(page, second)
 
     await page.keyboard.press("ArrowDown")
-    await wait(page, "")
+    await wait(page, draft)
   })
 })
 

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

@@ -7,18 +7,12 @@ test("shift+enter inserts a newline without submitting", async ({ page, gotoSess
   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 prompt.click()
+  await page.keyboard.type("line one")
+  await page.keyboard.press("Shift+Enter")
+  await page.keyboard.type("line two")
 
   await expect(page).toHaveURL(/\/session\/?$/)
-  await expect.poll(() => prompt.evaluate((el) => el.innerText)).toBe("line one\nline two")
+  await expect(prompt).toContainText("line one")
+  await expect(prompt).toContainText("line two")
 })

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

@@ -1,5 +1,4 @@
 import { test, expect } from "../fixtures"
-import { runPromptSlash, waitTerminalFocusIdle } from "../actions"
 import { promptSelector, terminalSelector } from "../selectors"
 
 test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => {
@@ -10,9 +9,15 @@ test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => {
 
   await expect(terminal).not.toBeVisible()
 
-  await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" })
-  await waitTerminalFocusIdle(page, { term: terminal })
+  await prompt.click()
+  await page.keyboard.type("/terminal")
+  await expect(page.locator('[data-slash-id="terminal.toggle"]').first()).toBeVisible()
+  await page.keyboard.press("Enter")
+  await expect(terminal).toBeVisible()
 
-  await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" })
+  await prompt.click()
+  await page.keyboard.type("/terminal")
+  await expect(page.locator('[data-slash-id="terminal.toggle"]').first()).toBeVisible()
+  await page.keyboard.press("Enter")
   await expect(terminal).not.toBeVisible()
 })

packages/app/e2e/selectors.ts

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

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

@@ -1,16 +1,12 @@
 import { test, expect } from "../fixtures"
-import {
-  composerEvent,
-  type ComposerDriverState,
-  type ComposerProbeState,
-  type ComposerWindow,
-} from "../../src/testing/session-composer"
-import { cleanupSession, clearSessionDockSeed, seedSessionQuestion } from "../actions"
+import { cleanupSession, clearSessionDockSeed, seedSessionQuestion, seedSessionTodos } from "../actions"
 import {
   permissionDockSelector,
   promptSelector,
   questionDockSelector,
   sessionComposerDockSelector,
+  sessionTodoDockSelector,
+  sessionTodoListSelector,
   sessionTodoToggleButtonSelector,
 } from "../selectors"
 
@@ -46,8 +42,12 @@ async function withDockSeed<T>(sdk: Sdk, sessionID: string, fn: () => Promise<T>
 
 async function clearPermissionDock(page: any, label: RegExp) {
   const dock = page.locator(permissionDockSelector)
-  await expect(dock).toBeVisible()
-  await dock.getByRole("button", { name: label }).click()
+  for (let i = 0; i < 3; i++) {
+    const count = await dock.count()
+    if (count === 0) return
+    await dock.getByRole("button", { name: label }).click()
+    await page.waitForTimeout(150)
+  }
 }
 
 async function setAutoAccept(page: any, enabled: boolean) {
@@ -59,120 +59,6 @@ async function setAutoAccept(page: any, enabled: boolean) {
   await expect(button).toHaveAttribute("aria-pressed", enabled ? "true" : "false")
 }
 
-async function expectQuestionBlocked(page: any) {
-  await expect(page.locator(questionDockSelector)).toBeVisible()
-  await expect(page.locator(promptSelector)).toHaveCount(0)
-}
-
-async function expectQuestionOpen(page: any) {
-  await expect(page.locator(questionDockSelector)).toHaveCount(0)
-  await expect(page.locator(promptSelector)).toBeVisible()
-}
-
-async function expectPermissionBlocked(page: any) {
-  await expect(page.locator(permissionDockSelector)).toBeVisible()
-  await expect(page.locator(promptSelector)).toHaveCount(0)
-}
-
-async function expectPermissionOpen(page: any) {
-  await expect(page.locator(permissionDockSelector)).toHaveCount(0)
-  await expect(page.locator(promptSelector)).toBeVisible()
-}
-
-async function todoDock(page: any, sessionID: string) {
-  await page.addInitScript(() => {
-    const win = window as ComposerWindow
-    win.__opencode_e2e = {
-      ...win.__opencode_e2e,
-      composer: {
-        enabled: true,
-        sessions: {},
-      },
-    }
-  })
-
-  const write = async (driver: ComposerDriverState | undefined) => {
-    await page.evaluate(
-      (input: { event: string; sessionID: string; driver: ComposerDriverState | undefined }) => {
-        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: string) => {
-      const win = window as ComposerWindow
-      return win.__opencode_e2e?.composer?.sessions?.[sessionID]?.probe ?? null
-    }, sessionID) as Promise<ComposerProbeState | null>
-
-  const api = {
-    async clear() {
-      await write(undefined)
-      return api
-    },
-    async open(todos: NonNullable<ComposerDriverState["todos"]>) {
-      await write({ live: true, todos })
-      return api
-    },
-    async finish(todos: NonNullable<ComposerDriverState["todos"]>) {
-      await write({ live: false, todos })
-      return api
-    },
-    async expectOpen(states: ComposerProbeState["states"]) {
-      await expect.poll(read, { timeout: 10_000 }).toMatchObject({
-        mounted: true,
-        collapsed: false,
-        hidden: false,
-        count: states.length,
-        states,
-      })
-      return api
-    },
-    async expectCollapsed(states: ComposerProbeState["states"]) {
-      await expect.poll(read, { timeout: 10_000 }).toMatchObject({
-        mounted: true,
-        collapsed: true,
-        hidden: true,
-        count: states.length,
-        states,
-      })
-      return api
-    },
-    async expectClosed() {
-      await expect.poll(read, { timeout: 10_000 }).toMatchObject({ mounted: false })
-      return api
-    },
-    async collapse() {
-      await page.locator(sessionTodoToggleButtonSelector).click()
-      return api
-    },
-    async expand() {
-      await page.locator(sessionTodoToggleButtonSelector).click()
-      return api
-    },
-  }
-
-  return api
-}
-
 async function withMockPermission<T>(
   page: any,
   request: {
@@ -184,10 +70,8 @@ async function withMockPermission<T>(
     always?: string[]
   },
   opts: { child?: any } | undefined,
-  fn: (state: { resolved: () => Promise<void> }) => Promise<T>,
+  fn: () => Promise<T>,
 ) {
-  const listUrl = /\/permission(?:\?.*)?$/
-  const replyUrls = [/\/session\/[^/]+\/permissions\/[^/?]+(?:\?.*)?$/, /\/permission\/[^/]+\/reply(?:\?.*)?$/]
   let pending = [
     {
       ...request,
@@ -206,8 +90,7 @@ async function withMockPermission<T>(
 
   const reply = async (route: any) => {
     const url = new URL(route.request().url())
-    const parts = url.pathname.split("/").filter(Boolean)
-    const id = parts.at(-1) === "reply" ? parts.at(-2) : parts.at(-1)
+    const id = url.pathname.split("/").pop()
     pending = pending.filter((item) => item.id !== id)
     await route.fulfill({
       status: 200,
@@ -216,10 +99,8 @@ async function withMockPermission<T>(
     })
   }
 
-  await page.route(listUrl, list)
-  for (const item of replyUrls) {
-    await page.route(item, reply)
-  }
+  await page.route("**/permission", list)
+  await page.route("**/session/*/permissions/*", reply)
 
   const sessionList = opts?.child
     ? async (route: any) => {
@@ -238,19 +119,11 @@ async function withMockPermission<T>(
 
   if (sessionList) await page.route("**/session?*", sessionList)
 
-  const state = {
-    async resolved() {
-      await expect.poll(() => pending.length, { timeout: 10_000 }).toBe(0)
-    },
-  }
-
   try {
-    return await fn(state)
+    return await fn()
   } finally {
-    await page.unroute(listUrl, list)
-    for (const item of replyUrls) {
-      await page.unroute(item, reply)
-    }
+    await page.unroute("**/permission", list)
+    await page.unroute("**/session/*/permissions/*", reply)
     if (sessionList) await page.unroute("**/session?*", sessionList)
   }
 }
@@ -300,12 +173,14 @@ test("blocked question flow unblocks after submit", async ({ page, sdk, gotoSess
       })
 
       const dock = page.locator(questionDockSelector)
-      await expectQuestionBlocked(page)
+      await expect.poll(() => dock.count(), { timeout: 10_000 }).toBe(1)
+      await expect(page.locator(promptSelector)).toHaveCount(0)
 
       await dock.locator('[data-slot="question-option"]').first().click()
       await dock.getByRole("button", { name: /submit/i }).click()
 
-      await expectQuestionOpen(page)
+      await expect.poll(() => page.locator(questionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+      await expect(page.locator(promptSelector)).toBeVisible()
     })
   })
 })
@@ -324,14 +199,15 @@ test("blocked permission flow supports allow once", async ({ page, sdk, gotoSess
         metadata: { description: "Need permission for command" },
       },
       undefined,
-      async (state) => {
+      async () => {
         await page.goto(page.url())
-        await expectPermissionBlocked(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await clearPermissionDock(page, /allow once/i)
-        await state.resolved()
         await page.goto(page.url())
-        await expectPermissionOpen(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       },
     )
   })
@@ -350,14 +226,15 @@ test("blocked permission flow supports reject", async ({ page, sdk, gotoSession
         patterns: ["/tmp/opencode-e2e-perm-reject"],
       },
       undefined,
-      async (state) => {
+      async () => {
         await page.goto(page.url())
-        await expectPermissionBlocked(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await clearPermissionDock(page, /deny/i)
-        await state.resolved()
         await page.goto(page.url())
-        await expectPermissionOpen(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       },
     )
   })
@@ -377,14 +254,15 @@ test("blocked permission flow supports allow always", async ({ page, sdk, gotoSe
         metadata: { description: "Need permission for command" },
       },
       undefined,
-      async (state) => {
+      async () => {
         await page.goto(page.url())
-        await expectPermissionBlocked(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await clearPermissionDock(page, /allow always/i)
-        await state.resolved()
         await page.goto(page.url())
-        await expectPermissionOpen(page)
+        await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       },
     )
   })
@@ -423,12 +301,14 @@ test("child session question request blocks parent dock and unblocks after submi
         })
 
         const dock = page.locator(questionDockSelector)
-        await expectQuestionBlocked(page)
+        await expect.poll(() => dock.count(), { timeout: 10_000 }).toBe(1)
+        await expect(page.locator(promptSelector)).toHaveCount(0)
 
         await dock.locator('[data-slot="question-option"]').first().click()
         await dock.getByRole("button", { name: /submit/i }).click()
 
-        await expectQuestionOpen(page)
+        await expect.poll(() => page.locator(questionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+        await expect(page.locator(promptSelector)).toBeVisible()
       })
     } finally {
       await cleanupSession({ sdk, sessionID: child.id })
@@ -464,15 +344,17 @@ test("child session permission request blocks parent dock and supports allow onc
           metadata: { description: "Need child permission" },
         },
         { child },
-        async (state) => {
+        async () => {
           await page.goto(page.url())
-          await expectPermissionBlocked(page)
+          const dock = page.locator(permissionDockSelector)
+          await expect.poll(() => dock.count(), { timeout: 10_000 }).toBe(1)
+          await expect(page.locator(promptSelector)).toHaveCount(0)
 
           await clearPermissionDock(page, /allow once/i)
-          await state.resolved()
           await page.goto(page.url())
 
-          await expectPermissionOpen(page)
+          await expect.poll(() => page.locator(permissionDockSelector).count(), { timeout: 10_000 }).toBe(0)
+          await expect(page.locator(promptSelector)).toBeVisible()
         },
       )
     } finally {
@@ -483,31 +365,36 @@ test("child session permission request blocks parent dock and supports allow onc
 
 test("todo dock transitions and collapse behavior", async ({ page, sdk, gotoSession }) => {
   await withDockSession(sdk, "e2e composer dock todo", async (session) => {
-    const dock = await todoDock(page, session.id)
-    await gotoSession(session.id)
-    await expect(page.locator(sessionComposerDockSelector)).toBeVisible()
+    await withDockSeed(sdk, session.id, async () => {
+      await gotoSession(session.id)
 
-    try {
-      await dock.open([
-        { content: "first task", status: "pending", priority: "high" },
-        { content: "second task", status: "in_progress", priority: "medium" },
-      ])
-      await dock.expectOpen(["pending", "in_progress"])
+      await seedSessionTodos(sdk, {
+        sessionID: session.id,
+        todos: [
+          { content: "first task", status: "pending", priority: "high" },
+          { content: "second task", status: "in_progress", priority: "medium" },
+        ],
+      })
 
-      await dock.collapse()
-      await dock.expectCollapsed(["pending", "in_progress"])
+      await expect.poll(() => page.locator(sessionTodoDockSelector).count(), { timeout: 10_000 }).toBe(1)
+      await expect(page.locator(sessionTodoListSelector)).toBeVisible()
 
-      await dock.expand()
-      await dock.expectOpen(["pending", "in_progress"])
+      await page.locator(sessionTodoToggleButtonSelector).click()
+      await expect(page.locator(sessionTodoListSelector)).toBeHidden()
 
-      await dock.finish([
-        { content: "first task", status: "completed", priority: "high" },
-        { content: "second task", status: "cancelled", priority: "medium" },
-      ])
-      await dock.expectClosed()
-    } finally {
-      await dock.clear()
-    }
+      await page.locator(sessionTodoToggleButtonSelector).click()
+      await expect(page.locator(sessionTodoListSelector)).toBeVisible()
+
+      await seedSessionTodos(sdk, {
+        sessionID: session.id,
+        todos: [
+          { content: "first task", status: "completed", priority: "high" },
+          { content: "second task", status: "cancelled", priority: "medium" },
+        ],
+      })
+
+      await expect.poll(() => page.locator(sessionTodoDockSelector).count(), { timeout: 10_000 }).toBe(0)
+    })
   })
 })
 
@@ -527,7 +414,8 @@ test("keyboard focus stays off prompt while blocked", async ({ page, sdk, gotoSe
         ],
       })
 
-      await expectQuestionBlocked(page)
+      await expect.poll(() => page.locator(questionDockSelector).count(), { timeout: 10_000 }).toBe(1)
+      await expect(page.locator(promptSelector)).toHaveCount(0)
 
       await page.locator("main").click({ position: { x: 5, y: 5 } })
       await page.keyboard.type("abc")

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

@@ -1,405 +0,0 @@
-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
-  agent?: string
-  model?: { providerID: string; modelID: string; name?: string }
-  variant?: string | null
-  pick?: {
-    agent?: string
-    model?: { providerID: string; modelID: string }
-    variant?: string | null
-  }
-  variants?: string[]
-  models?: Array<{ providerID: string; modelID: string; name: string }>
-  agents?: Array<{ name: 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 currentModel(page: Page) {
-  await expect.poll(() => probe(page).then(modelKey), { timeout: 30_000 }).not.toBe(null)
-  const value = await probe(page).then(modelKey)
-  if (!value) throw new Error("Failed to resolve current model key")
-  return value
-}
-
-async function waitControl(page: Page, key: "setAgent" | "setModel" | "setVariant") {
-  await expect
-    .poll(
-      () =>
-        page.evaluate((key) => {
-          const win = window as Window & {
-            __opencode_e2e?: {
-              model?: {
-                controls?: Record<string, unknown>
-              }
-            }
-          }
-          return !!win.__opencode_e2e?.model?.controls?.[key]
-        }, key),
-      { timeout: 30_000 },
-    )
-    .toBe(true)
-}
-
-async function pickAgent(page: Page, value: string) {
-  await waitControl(page, "setAgent")
-  await page.evaluate((value) => {
-    const win = window as Window & {
-      __opencode_e2e?: {
-        model?: {
-          controls?: {
-            setAgent?: (value: string | undefined) => void
-          }
-        }
-      }
-    }
-    const fn = win.__opencode_e2e?.model?.controls?.setAgent
-    if (!fn) throw new Error("Model e2e agent control is not enabled")
-    fn(value)
-  }, value)
-}
-
-async function pickModel(page: Page, value: { providerID: string; modelID: string }) {
-  await waitControl(page, "setModel")
-  await page.evaluate((value) => {
-    const win = window as Window & {
-      __opencode_e2e?: {
-        model?: {
-          controls?: {
-            setModel?: (value: { providerID: string; modelID: string } | undefined) => void
-          }
-        }
-      }
-    }
-    const fn = win.__opencode_e2e?.model?.controls?.setModel
-    if (!fn) throw new Error("Model e2e model control is not enabled")
-    fn(value)
-  }, value)
-}
-
-async function pickVariant(page: Page, value: string) {
-  await waitControl(page, "setVariant")
-  await page.evaluate((value) => {
-    const win = window as Window & {
-      __opencode_e2e?: {
-        model?: {
-          controls?: {
-            setVariant?: (value: string | undefined) => void
-          }
-        }
-      }
-    }
-    const fn = win.__opencode_e2e?.model?.controls?.setVariant
-    if (!fn) throw new Error("Model e2e variant control is not enabled")
-    fn(value)
-  }, value)
-}
-
-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 pickAgent(page, value)
-}
-
-async function variantCount(page: Page) {
-  return (await probe(page))?.variants?.length ?? 0
-}
-
-async function agents(page: Page) {
-  return ((await probe(page))?.agents ?? []).map((item) => item.name).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 next = (await probe(page))?.variants?.find((item) => item !== current.variant)
-  if (!next) throw new Error("Current model has no alternate variant to select")
-
-  await pickVariant(page, next)
-  return waitFooter(page, { agent: current.agent, model: current.model, variant: next })
-}
-
-async function chooseOtherModel(page: Page, skip: string[] = []): Promise<Footer> {
-  const current = await currentModel(page)
-  const next = (await probe(page))?.models?.find((item) => {
-    const key = `${item.providerID}:${item.modelID}`
-    return key !== current && !skip.includes(key)
-  })
-  if (!next) throw new Error("Failed to choose a different model")
-  await pickModel(page, { providerID: next.providerID, modelID: next.modelID })
-  await expect.poll(async () => (await read(page)).model, { timeout: 30_000 }).toBe(next.name)
-  return read(page)
-}
-
-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 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()
-
-    const firstState = await chooseOtherModel(page)
-    const firstKey = await currentModel(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 read(page)
-    expect(fresh.model).not.toBe(firstState.model)
-
-    const secondState = await chooseOtherModel(page, [firstKey])
-    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()
-
-    const firstState = await chooseOtherModel(page)
-    const firstKey = await currentModel(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, [firstKey])
-    const secondKey = await currentModel(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)
-
-    const thirdState = await chooseOtherModel(page, [firstKey, secondKey])
-    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

@@ -1,426 +0,0 @@
-import { waitSessionIdle, withSession } from "../actions"
-import { test, expect } from "../fixtures"
-import { createSdk } from "../utils"
-
-const count = 14
-
-function body(mark: string) {
-  return [
-    `title ${mark}`,
-    `mark ${mark}`,
-    ...Array.from({ length: 32 }, (_, i) => `line ${String(i + 1).padStart(2, "0")} ${mark}`),
-  ]
-}
-
-function files(tag: string) {
-  return Array.from({ length: count }, (_, i) => {
-    const id = String(i).padStart(2, "0")
-    return {
-      file: `review-scroll-${id}.txt`,
-      mark: `${tag}-${id}`,
-    }
-  })
-}
-
-function seed(list: ReturnType<typeof files>) {
-  const out = ["*** Begin Patch"]
-
-  for (const item of list) {
-    out.push(`*** Add File: ${item.file}`)
-    for (const line of body(item.mark)) out.push(`+${line}`)
-  }
-
-  out.push("*** End Patch")
-  return out.join("\n")
-}
-
-function edit(file: string, prev: string, next: string) {
-  return ["*** Begin Patch", `*** Update File: ${file}`, "@@", `-mark ${prev}`, `+mark ${next}`, "*** End Patch"].join(
-    "\n",
-  )
-}
-
-async function patch(sdk: ReturnType<typeof createSdk>, sessionID: string, patchText: string) {
-  await sdk.session.promptAsync({
-    sessionID,
-    agent: "build",
-    system: [
-      "You are seeding deterministic e2e UI state.",
-      "Your only valid response is one apply_patch tool call.",
-      `Use this JSON input: ${JSON.stringify({ patchText })}`,
-      "Do not call any other tools.",
-      "Do not output plain text.",
-    ].join("\n"),
-    parts: [{ type: "text", text: "Apply the provided patch exactly once." }],
-  })
-
-  await waitSessionIdle(sdk, sessionID, 120_000)
-}
-
-async function show(page: Parameters<typeof test>[0]["page"]) {
-  const btn = page.getByRole("button", { name: "Toggle review" }).first()
-  await expect(btn).toBeVisible()
-  if ((await btn.getAttribute("aria-expanded")) !== "true") await btn.click()
-  await expect(btn).toHaveAttribute("aria-expanded", "true")
-}
-
-async function expand(page: Parameters<typeof test>[0]["page"]) {
-  const close = page.getByRole("button", { name: /^Collapse all$/i }).first()
-  const open = await close
-    .isVisible()
-    .then((value) => value)
-    .catch(() => false)
-
-  const btn = page.getByRole("button", { name: /^Expand all$/i }).first()
-  if (open) {
-    await close.click()
-    await expect(btn).toBeVisible()
-  }
-
-  await expect(btn).toBeVisible()
-  await btn.click()
-  await expect(close).toBeVisible()
-}
-
-async function waitMark(page: Parameters<typeof test>[0]["page"], file: string, mark: string) {
-  await page.waitForFunction(
-    ({ file, mark }) => {
-      const view = document.querySelector('[data-slot="session-review-scroll"] .scroll-view__viewport')
-      if (!(view instanceof HTMLElement)) return false
-
-      const head = Array.from(view.querySelectorAll("h3")).find(
-        (node) => node instanceof HTMLElement && node.textContent?.includes(file),
-      )
-      if (!(head instanceof HTMLElement)) return false
-
-      return Array.from(head.parentElement?.querySelectorAll("diffs-container") ?? []).some((host) => {
-        if (!(host instanceof HTMLElement)) return false
-        const root = host.shadowRoot
-        return root?.textContent?.includes(`mark ${mark}`) ?? false
-      })
-    },
-    { file, mark },
-    { timeout: 60_000 },
-  )
-}
-
-async function spot(page: Parameters<typeof test>[0]["page"], file: string) {
-  return page.evaluate((file) => {
-    const view = document.querySelector('[data-slot="session-review-scroll"] .scroll-view__viewport')
-    if (!(view instanceof HTMLElement)) return null
-
-    const row = Array.from(view.querySelectorAll("h3")).find(
-      (node) => node instanceof HTMLElement && node.textContent?.includes(file),
-    )
-    if (!(row instanceof HTMLElement)) return null
-
-    const a = row.getBoundingClientRect()
-    const b = view.getBoundingClientRect()
-    return {
-      top: a.top - b.top,
-      y: view.scrollTop,
-    }
-  }, file)
-}
-
-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

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

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

@@ -1,5 +1,5 @@
 import { test, expect } from "../fixtures"
-import { openSettings, closeDialog, waitTerminalFocusIdle, withSession } from "../actions"
+import { openSettings, closeDialog, withSession } from "../actions"
 import { keybindButtonSelector, terminalSelector } from "../selectors"
 import { modKey } from "../utils"
 
@@ -241,7 +241,7 @@ test("changing file open keybind works", async ({ page, gotoSession }) => {
   await expect(keybindButton).toBeVisible()
 
   const initialKeybind = await keybindButton.textContent()
-  expect(initialKeybind).toContain("K")
+  expect(initialKeybind).toContain("P")
 
   await keybindButton.click()
   await expect(keybindButton).toHaveText(/press/i)
@@ -302,7 +302,7 @@ test("changing terminal toggle keybind works", async ({ page, gotoSession }) =>
   await expect(terminal).not.toBeVisible()
 
   await page.keyboard.press(`${modKey}+Y`)
-  await waitTerminalFocusIdle(page, { term: terminal })
+  await expect(terminal).toBeVisible()
 
   await page.keyboard.press(`${modKey}+Y`)
   await expect(terminal).not.toBeVisible()

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

@@ -2,7 +2,7 @@ import { test, expect, settingsKey } from "../fixtures"
 import { closeDialog, openSettings } from "../actions"
 import {
   settingsColorSchemeSelector,
-  settingsCodeFontSelector,
+  settingsFontSelector,
   settingsLanguageSelectSelector,
   settingsNotificationsAgentSelector,
   settingsNotificationsErrorsSelector,
@@ -12,7 +12,6 @@ import {
   settingsSoundsErrorsSelector,
   settingsSoundsPermissionsSelector,
   settingsThemeSelector,
-  settingsUIFontSelector,
   settingsUpdatesStartupSelector,
 } from "../selectors"
 
@@ -84,23 +83,16 @@ test("changing theme persists in localStorage", async ({ page, gotoSession }) =>
   const select = dialog.locator(settingsThemeSelector)
   await expect(select).toBeVisible()
 
-  const currentThemeId = await page.evaluate(() => {
-    return document.documentElement.getAttribute("data-theme")
-  })
-  const currentTheme = (await select.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? ""
-
   await select.locator('[data-slot="select-select-trigger"]').click()
 
   const items = page.locator('[data-slot="select-select-item"]')
   const count = await items.count()
   expect(count).toBeGreaterThan(1)
 
-  const nextTheme = (await items.locator('[data-slot="select-select-item-label"]').allTextContents())
-    .map((x) => x.trim())
-    .find((x) => x && x !== currentTheme)
-  expect(nextTheme).toBeTruthy()
+  const firstTheme = await items.nth(1).locator('[data-slot="select-select-item-label"]').textContent()
+  expect(firstTheme).toBeTruthy()
 
-  await items.filter({ hasText: nextTheme! }).first().click()
+  await items.nth(1).click()
 
   await page.keyboard.press("Escape")
 
@@ -109,7 +101,7 @@ test("changing theme persists in localStorage", async ({ page, gotoSession }) =>
   })
 
   expect(storedThemeId).not.toBeNull()
-  expect(storedThemeId).not.toBe(currentThemeId)
+  expect(storedThemeId).not.toBe("oc-1")
 
   const dataTheme = await page.evaluate(() => {
     return document.documentElement.getAttribute("data-theme")
@@ -117,235 +109,39 @@ test("changing theme persists in localStorage", async ({ page, gotoSession }) =>
   expect(dataTheme).toBe(storedThemeId)
 })
 
-test("legacy oc-1 theme migrates to oc-2", async ({ page, gotoSession }) => {
-  await page.addInitScript(() => {
-    localStorage.setItem("opencode-theme-id", "oc-1")
-    localStorage.setItem("opencode-theme-css-light", "--background-base:#fff;")
-    localStorage.setItem("opencode-theme-css-dark", "--background-base:#000;")
+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 gotoSession()
+  await select.locator('[data-slot="select-select-trigger"]').click()
 
-  await expect(page.locator("html")).toHaveAttribute("data-theme", "oc-2")
+  const items = page.locator('[data-slot="select-select-item"]')
+  await items.nth(2).click()
 
-  await expect
-    .poll(async () => {
-      return await page.evaluate(() => {
-        return localStorage.getItem("opencode-theme-id")
-      })
-    })
-    .toBe("oc-2")
+  await page.waitForTimeout(100)
 
-  await expect
-    .poll(async () => {
-      return await page.evaluate(() => {
-        return localStorage.getItem("opencode-theme-css-light")
-      })
-    })
-    .toBeNull()
+  const stored = 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 localStorage.getItem("opencode-theme-css-dark")
-      })
-    })
-    .toBeNull()
-})
+  expect(stored?.appearance?.font).not.toBe("ibm-plex-mono")
 
-test("typing a code font with spaces persists and updates CSS variable", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  const dialog = await openSettings(page)
-  const input = dialog.locator(settingsCodeFontSelector)
-  await expect(input).toBeVisible()
-  await expect(input).toHaveAttribute("placeholder", "System Mono")
-
-  const initialFontFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  const initialUIFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
-  expect(initialFontFamily).toContain("ui-monospace")
-
-  const next = "Test Mono"
-
-  await input.click()
-  await input.clear()
-  await input.pressSequentially(next)
-  await expect(input).toHaveValue(next)
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate((key) => {
-        const raw = localStorage.getItem(key)
-        return raw ? JSON.parse(raw) : null
-      }, settingsKey)
-    })
-    .toMatchObject({
-      appearance: {
-        mono: next,
-      },
-    })
-
-  const newFontFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  const newUIFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
-  expect(newFontFamily).toContain(next)
+  const newFontFamily = await page.evaluate(() => {
+    return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono")
+  })
   expect(newFontFamily).not.toBe(initialFontFamily)
-  expect(newUIFamily).toBe(initialUIFamily)
 })
 
-test("typing a UI font with spaces persists and updates CSS variable", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  const dialog = await openSettings(page)
-  const input = dialog.locator(settingsUIFontSelector)
-  await expect(input).toBeVisible()
-  await expect(input).toHaveAttribute("placeholder", "System Sans")
-
-  const initialFontFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
-  const initialCodeFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  expect(initialFontFamily).toContain("ui-sans-serif")
-
-  const next = "Test Sans"
-
-  await input.click()
-  await input.clear()
-  await input.pressSequentially(next)
-  await expect(input).toHaveValue(next)
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate((key) => {
-        const raw = localStorage.getItem(key)
-        return raw ? JSON.parse(raw) : null
-      }, settingsKey)
-    })
-    .toMatchObject({
-      appearance: {
-        sans: next,
-      },
-    })
-
-  const newFontFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
-  const newCodeFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  expect(newFontFamily).toContain(next)
-  expect(newFontFamily).not.toBe(initialFontFamily)
-  expect(newCodeFamily).toBe(initialCodeFamily)
-})
-
-test("clearing the code font field restores the default placeholder and stack", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  const dialog = await openSettings(page)
-  const input = dialog.locator(settingsCodeFontSelector)
-  await expect(input).toBeVisible()
-
-  await input.click()
-  await input.clear()
-  await input.pressSequentially("Reset Mono")
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate((key) => {
-        const raw = localStorage.getItem(key)
-        return raw ? JSON.parse(raw) : null
-      }, settingsKey)
-    })
-    .toMatchObject({
-      appearance: {
-        mono: "Reset Mono",
-      },
-    })
-
-  await input.clear()
-  await input.press("Space")
-  await expect(input).toHaveValue("")
-  await expect(input).toHaveAttribute("placeholder", "System Mono")
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate((key) => {
-        const raw = localStorage.getItem(key)
-        return raw ? JSON.parse(raw) : null
-      }, settingsKey)
-    })
-    .toMatchObject({
-      appearance: {
-        mono: "",
-      },
-    })
-
-  const fontFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  expect(fontFamily).toContain("ui-monospace")
-  expect(fontFamily).not.toContain("Reset Mono")
-})
-
-test("clearing the UI font field restores the default placeholder and stack", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  const dialog = await openSettings(page)
-  const input = dialog.locator(settingsUIFontSelector)
-  await expect(input).toBeVisible()
-
-  await input.click()
-  await input.clear()
-  await input.pressSequentially("Reset Sans")
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate((key) => {
-        const raw = localStorage.getItem(key)
-        return raw ? JSON.parse(raw) : null
-      }, settingsKey)
-    })
-    .toMatchObject({
-      appearance: {
-        sans: "Reset Sans",
-      },
-    })
-
-  await input.clear()
-  await input.press("Space")
-  await expect(input).toHaveValue("")
-  await expect(input).toHaveAttribute("placeholder", "System Sans")
-
-  await expect
-    .poll(async () => {
-      return await page.evaluate((key) => {
-        const raw = localStorage.getItem(key)
-        return raw ? JSON.parse(raw) : null
-      }, settingsKey)
-    })
-    .toMatchObject({
-      appearance: {
-        sans: "",
-      },
-    })
-
-  const fontFamily = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
-  expect(fontFamily).toContain("ui-sans-serif")
-  expect(fontFamily).not.toContain("Reset Sans")
-})
-
-test("color scheme, code font, and UI font rehydrate after reload", async ({ page, gotoSession }) => {
+test("color scheme and font rehydrate after reload", async ({ page, gotoSession }) => {
   await gotoSession()
 
   const dialog = await openSettings(page)
@@ -356,35 +152,31 @@ test("color scheme, code font, and UI font rehydrate after reload", async ({ pag
   await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Dark" }).click()
   await expect(page.locator("html")).toHaveAttribute("data-color-scheme", "dark")
 
-  const code = dialog.locator(settingsCodeFontSelector)
-  const ui = dialog.locator(settingsUIFontSelector)
-  await expect(code).toBeVisible()
-  await expect(ui).toBeVisible()
+  const fontSelect = dialog.locator(settingsFontSelector)
+  await expect(fontSelect).toBeVisible()
 
-  const initialMono = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  const initialSans = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
+  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 mono = initialSettings?.appearance?.mono === "Reload Mono" ? "Reload Mono 2" : "Reload Mono"
-  const sans = initialSettings?.appearance?.sans === "Reload Sans" ? "Reload Sans 2" : "Reload Sans"
+  const currentFont =
+    (await fontSelect.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? ""
+  await fontSelect.locator('[data-slot="select-select-trigger"]').click()
 
-  await code.click()
-  await code.clear()
-  await code.pressSequentially(mono)
-  await expect(code).toHaveValue(mono)
+  const fontItems = page.locator('[data-slot="select-select-item"]')
+  expect(await fontItems.count()).toBeGreaterThan(1)
 
-  await ui.click()
-  await ui.clear()
-  await ui.pressSequentially(sans)
-  await expect(ui).toHaveValue(sans)
+  if (currentFont) {
+    await fontItems.filter({ hasNotText: currentFont }).first().click()
+  }
+  if (!currentFont) {
+    await fontItems.nth(1).click()
+  }
 
   await expect
     .poll(async () => {
@@ -395,8 +187,7 @@ test("color scheme, code font, and UI font rehydrate after reload", async ({ pag
     })
     .toMatchObject({
       appearance: {
-        mono,
-        sans,
+        font: expect.any(String),
       },
     })
 
@@ -405,18 +196,11 @@ test("color scheme, code font, and UI font rehydrate after reload", async ({ pag
     return raw ? JSON.parse(raw) : null
   }, settingsKey)
 
-  const updatedMono = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  const updatedSans = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
-  expect(updatedMono).toContain(mono)
-  expect(updatedMono).not.toBe(initialMono)
-  expect(updatedSans).toContain(sans)
-  expect(updatedSans).not.toBe(initialSans)
-  expect(updatedSettings?.appearance?.mono).toBe(mono)
-  expect(updatedSettings?.appearance?.sans).toBe(sans)
+  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()
@@ -432,8 +216,7 @@ test("color scheme, code font, and UI font rehydrate after reload", async ({ pag
     })
     .toMatchObject({
       appearance: {
-        mono,
-        sans,
+        font: updatedSettings?.appearance?.font,
       },
     })
 
@@ -444,32 +227,17 @@ test("color scheme, code font, and UI font rehydrate after reload", async ({ pag
 
   await expect
     .poll(async () => {
-      return await page.evaluate(() =>
-        getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-      )
+      return await page.evaluate(() => {
+        return getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim()
+      })
     })
-    .toContain(mono)
+    .not.toBe(initialFontFamily)
 
-  await expect
-    .poll(async () => {
-      return await page.evaluate(() =>
-        getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-      )
-    })
-    .toContain(sans)
-
-  const rehydratedMono = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(),
-  )
-  const rehydratedSans = await page.evaluate(() =>
-    getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(),
-  )
-  expect(rehydratedMono).toContain(mono)
-  expect(rehydratedMono).not.toBe(initialMono)
-  expect(rehydratedSans).toContain(sans)
-  expect(rehydratedSans).not.toBe(initialSans)
-  expect(rehydratedSettings?.appearance?.mono).toBe(mono)
-  expect(rehydratedSettings?.appearance?.sans).toBe(sans)
+  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 }) => {

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

@@ -1,16 +1,6 @@
 import { test, expect } from "../fixtures"
-import {
-  defocus,
-  cleanupSession,
-  cleanupTestProject,
-  closeSidebar,
-  createTestProject,
-  hoverSessionItem,
-  openSidebar,
-  waitSession,
-} from "../actions"
+import { cleanupSession, closeSidebar, hoverSessionItem } 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()
@@ -47,72 +37,3 @@ test("collapsed sidebar popover stays open when archiving a session", async ({ p
     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/terminal/terminal-init.spec.ts

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

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

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

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

@@ -1,7 +1,6 @@
 import type { Page } from "@playwright/test"
-import { runTerminal, waitTerminalReady } from "../actions"
 import { test, expect } from "../fixtures"
-import { dropdownMenuContentSelector, terminalSelector } from "../selectors"
+import { terminalSelector } from "../selectors"
 import { terminalToggleKey, workspacePersistKey } from "../utils"
 
 type State = {
@@ -18,7 +17,16 @@ 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 })
+  await expect(terminal).toBeVisible()
+  await expect(terminal.locator("textarea")).toHaveCount(1)
+}
+
+async function run(page: Page, cmd: string) {
+  const terminal = page.locator(terminalSelector)
+  await expect(terminal).toBeVisible()
+  await terminal.click()
+  await page.keyboard.type(cmd)
+  await page.keyboard.press("Enter")
 }
 
 async function store(page: Page, key: string) {
@@ -36,27 +44,27 @@ async function store(page: Page, key: string) {
   }, key)
 }
 
-test("inactive terminal tab buffers persist across tab switches", async ({ page, withProject }) => {
+test("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 run(page, `echo ${one}`)
 
     await page.getByRole("button", { name: /new terminal/i }).click()
     await expect(tabs).toHaveCount(2)
 
-    await runTerminal(page, { cmd: `echo ${two}`, token: two })
+    await run(page, `echo ${two}`)
 
-    await first.click()
-    await expect(first).toHaveAttribute("aria-selected", "true")
+    await tabs
+      .filter({ hasText: /Terminal 1/ })
+      .first()
+      .click()
 
     await expect
       .poll(
@@ -64,31 +72,11 @@ test("inactive terminal tab buffers persist across tab switches", async ({ page,
           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),
-          }
+          return first.includes(one) && second.includes(two)
         },
-        { timeout: 5_000 },
+        { timeout: 30_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 })
+      .toBe(true)
   })
 })
 
@@ -130,39 +118,3 @@ test("closing the active terminal tab falls back to the previous tab", async ({
       .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

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

packages/app/e2e/tsconfig.json

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

packages/app/e2e/utils.ts

@@ -7,22 +7,6 @@ export const serverPort = process.env.PLAYWRIGHT_SERVER_PORT ?? "4096"
 export const serverUrl = `http://${serverHost}:${serverPort}`
 export const serverName = `${serverHost}:${serverPort}`
 
-const localHosts = ["127.0.0.1", "localhost"]
-
-const serverLabels = (() => {
-  const url = new URL(serverUrl)
-  if (!localHosts.includes(url.hostname)) return [serverName]
-  return localHosts.map((host) => `${host}:${url.port}`)
-})()
-
-export const serverNames = [...new Set(serverLabels)]
-
-export const serverUrls = serverNames.map((name) => `http://${name}`)
-
-const escape = (value: string) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")
-
-export const serverNamePattern = new RegExp(`(?:${serverNames.map(escape).join("|")})`)
-
 export const modKey = process.platform === "darwin" ? "Meta" : "Control"
 export const terminalToggleKey = "Control+Backquote"
 
@@ -57,7 +41,7 @@ export function sessionPath(directory: string, sessionID?: string) {
 }
 
 export function workspacePersistKey(directory: string, key: string) {
-  const head = (directory.slice(0, 12) || "workspace").replace(/[^a-zA-Z0-9._-]/g, "-")
+  const head = directory.slice(0, 12) || "workspace"
   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.3.3",
+  "version": "1.2.20",
   "description": "",
   "type": "module",
   "exports": {
@@ -45,20 +45,17 @@
     "@shikijs/transformers": "3.9.2",
     "@solid-primitives/active-element": "2.1.3",
     "@solid-primitives/audio": "1.4.2",
-    "@solid-primitives/event-bus": "1.1.2",
     "@solid-primitives/i18n": "2.2.1",
+    "@solid-primitives/event-bus": "1.1.2",
     "@solid-primitives/media": "2.3.3",
     "@solid-primitives/resize-observer": "2.1.3",
     "@solid-primitives/scroll": "2.1.3",
     "@solid-primitives/storage": "catalog:",
-    "@solid-primitives/timer": "1.4.4",
     "@solid-primitives/websocket": "1.3.1",
     "@solidjs/meta": "catalog:",
     "@solidjs/router": "catalog:",
-    "@tanstack/solid-query": "5.91.4",
     "@thisbeyond/solid-dnd": "0.7.5",
     "diff": "catalog:",
-    "effect": "catalog:",
     "fuzzysort": "catalog:",
     "ghostty-web": "github:anomalyco/ghostty-web#main",
     "luxon": "catalog:",

packages/app/playwright.config.ts

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

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

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

packages/app/script/e2e-local.ts

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

packages/app/src/app.tsx

@@ -1,63 +1,50 @@
 import "@/index.css"
+import { File } from "@opencode-ai/ui/file"
 import { I18nProvider } from "@opencode-ai/ui/context"
 import { DialogProvider } from "@opencode-ai/ui/context/dialog"
 import { FileComponentProvider } from "@opencode-ai/ui/context/file"
 import { MarkedProvider } from "@opencode-ai/ui/context/marked"
-import { File } from "@opencode-ai/ui/file"
 import { Font } from "@opencode-ai/ui/font"
-import { Splash } from "@opencode-ai/ui/logo"
-import { ThemeProvider } from "@opencode-ai/ui/theme/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"
-import { type Duration, Effect } from "effect"
-import {
-  type Component,
-  createMemo,
-  createResource,
-  createSignal,
-  ErrorBoundary,
-  For,
-  type JSX,
-  lazy,
-  onCleanup,
-  type ParentProps,
-  Show,
-  Suspense,
-} from "solid-js"
-import { Dynamic } from "solid-js/web"
+import { BaseRouterProps, Navigate, Route, Router } from "@solidjs/router"
+import { Component, ErrorBoundary, type JSX, lazy, type ParentProps, Show, Suspense } from "solid-js"
 import { CommandProvider } from "@/context/command"
 import { CommentsProvider } from "@/context/comments"
 import { FileProvider } from "@/context/file"
 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 { type ServerConnection, ServerProvider, useServer } from "@/context/server"
 import { SettingsProvider } from "@/context/settings"
 import { TerminalProvider } from "@/context/terminal"
 import DirectoryLayout from "@/pages/directory-layout"
 import Layout from "@/pages/layout"
 import { ErrorPage } from "./pages/error"
-import { useCheckServerHealth } from "./utils/server-health"
+import { Dynamic } from "solid-js/web"
 
-const HomeRoute = lazy(() => import("@/pages/home"))
-const loadSession = () => import("@/pages/session")
-const Session = lazy(loadSession)
+const Home = lazy(() => import("@/pages/home"))
+const Session = lazy(() => import("@/pages/session"))
 const Loading = () => <div class="size-full" />
 
-if (typeof location === "object" && /\/session(?:\/|$)/.test(location.pathname)) {
-  void loadSession()
-}
+const HomeRoute = () => (
+  <Suspense fallback={<Loading />}>
+    <Home />
+  </Suspense>
+)
 
 const SessionRoute = () => (
   <SessionProviders>
-    <Session />
+    <Suspense fallback={<Loading />}>
+      <Session />
+    </Suspense>
   </SessionProviders>
 )
 
@@ -65,7 +52,7 @@ const SessionIndexRoute = () => <Navigate href="session" />
 
 function UiI18nBridge(props: ParentProps) {
   const language = useLanguage()
-  return <I18nProvider value={{ locale: language.intl, t: language.t }}>{props.children}</I18nProvider>
+  return <I18nProvider value={{ locale: language.locale, t: language.t }}>{props.children}</I18nProvider>
 }
 
 declare global {
@@ -75,15 +62,12 @@ declare global {
       deepLinks?: string[]
       wsl?: boolean
     }
-    api?: {
-      setTitlebar?: (theme: { mode: "light" | "dark" }) => Promise<void>
-    }
   }
 }
 
-function QueryProvider(props: ParentProps) {
-  const client = new QueryClient()
-  return <QueryClientProvider client={client}>{props.children}</QueryClientProvider>
+function MarkedProviderWithNativeParser(props: ParentProps) {
+  const platform = usePlatform()
+  return <MarkedProvider nativeParser={platform.parseMarkdown}>{props.children}</MarkedProvider>
 }
 
 function AppShellProviders(props: ParentProps) {
@@ -121,33 +105,25 @@ function SessionProviders(props: ParentProps) {
 function RouterRoot(props: ParentProps<{ appChildren?: JSX.Element }>) {
   return (
     <AppShellProviders>
-      <Suspense fallback={<Loading />}>
-        {props.appChildren}
-        {props.children}
-      </Suspense>
+      {props.appChildren}
+      {props.children}
     </AppShellProviders>
   )
 }
 
-export function AppBaseProviders(props: ParentProps<{ locale?: Locale }>) {
+export function AppBaseProviders(props: ParentProps) {
   return (
     <MetaProvider>
       <Font />
-      <ThemeProvider
-        onThemeApplied={(_, mode) => {
-          void window.api?.setTitlebar?.({ mode })
-        }}
-      >
-        <LanguageProvider locale={props.locale}>
+      <ThemeProvider>
+        <LanguageProvider>
           <UiI18nBridge>
             <ErrorBoundary fallback={(error) => <ErrorPage error={error} />}>
-              <QueryProvider>
-                <DialogProvider>
-                  <MarkedProvider>
-                    <FileComponentProvider component={File}>{props.children}</FileComponentProvider>
-                  </MarkedProvider>
-                </DialogProvider>
-              </QueryProvider>
+              <DialogProvider>
+                <MarkedProviderWithNativeParser>
+                  <FileComponentProvider component={File}>{props.children}</FileComponentProvider>
+                </MarkedProviderWithNativeParser>
+              </DialogProvider>
             </ErrorBoundary>
           </UiI18nBridge>
         </LanguageProvider>
@@ -156,116 +132,6 @@ export function AppBaseProviders(props: ParentProps<{ locale?: Locale }>) {
   )
 }
 
-const effectMinDuration =
-  (duration: Duration.Input) =>
-  <A, E, R>(e: Effect.Effect<A, E, R>) =>
-    Effect.all([e, Effect.sleep(duration)], { concurrency: "unbounded" }).pipe(Effect.map((v) => v[0]))
-
-function ConnectionGate(props: ParentProps<{ disableHealthCheck?: boolean }>) {
-  const server = useServer()
-  const checkServerHealth = useCheckServerHealth()
-
-  const [checkMode, setCheckMode] = createSignal<"blocking" | "background">("blocking")
-
-  // performs repeated health check with a grace period for
-  // non-http connections, otherwise fails instantly
-  const [startupHealthCheck, healthCheckActions] = createResource(() =>
-    props.disableHealthCheck
-      ? true
-      : Effect.gen(function* () {
-          if (!server.current) return true
-          const { http, type } = server.current
-
-          while (true) {
-            const res = yield* Effect.promise(() => checkServerHealth(http))
-            if (res.healthy) return true
-            if (checkMode() === "background" || type === "http") return false
-          }
-        }).pipe(
-          effectMinDuration(checkMode() === "blocking" ? "1.2 seconds" : 0),
-          Effect.timeoutOrElse({ duration: "10 seconds", orElse: () => Effect.succeed(false) }),
-          Effect.ensuring(Effect.sync(() => setCheckMode("background"))),
-          Effect.runPromise,
-        ),
-  )
-
-  return (
-    <Show
-      when={checkMode() === "blocking" ? !startupHealthCheck.loading : startupHealthCheck.state !== "pending"}
-      fallback={
-        <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base">
-          <Splash class="w-16 h-20 opacity-50 animate-pulse" />
-        </div>
-      }
-    >
-      <Show
-        when={startupHealthCheck()}
-        fallback={
-          <ConnectionError
-            onRetry={() => {
-              if (checkMode() === "background") healthCheckActions.refetch()
-            }}
-            onServerSelected={(key) => {
-              setCheckMode("blocking")
-              server.setActive(key)
-              healthCheckActions.refetch()
-            }}
-          />
-        }
-      >
-        {props.children}
-      </Show>
-    </Show>
-  )
-}
-
-function ConnectionError(props: { onRetry?: () => void; onServerSelected?: (key: ServerConnection.Key) => void }) {
-  const language = useLanguage()
-  const server = useServer()
-  const others = () => server.list.filter((s) => ServerConnection.key(s) !== server.key)
-  const name = createMemo(() => server.name || server.key)
-  const serverToken = "\u0000server\u0000"
-  const unreachable = createMemo(() => language.t("app.server.unreachable", { server: serverToken }).split(serverToken))
-
-  const timer = setInterval(() => props.onRetry?.(), 1000)
-  onCleanup(() => clearInterval(timer))
-
-  return (
-    <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base gap-6 p-6">
-      <div class="flex flex-col items-center max-w-md text-center">
-        <Splash class="w-12 h-15 mb-4" />
-        <p class="text-14-regular text-text-base">
-          {unreachable()[0]}
-          <span class="text-text-strong font-medium">{name()}</span>
-          {unreachable()[1]}
-        </p>
-        <p class="mt-1 text-12-regular text-text-weak">{language.t("app.server.retrying")}</p>
-      </div>
-      <Show when={others().length > 0}>
-        <div class="flex flex-col gap-2 w-full max-w-sm">
-          <span class="text-12-regular text-text-base text-center">{language.t("app.server.otherServers")}</span>
-          <div class="flex flex-col gap-1 bg-surface-base rounded-lg p-2">
-            <For each={others()}>
-              {(conn) => {
-                const key = ServerConnection.key(conn)
-                return (
-                  <button
-                    type="button"
-                    class="flex items-center gap-3 w-full px-3 py-2 rounded-md hover:bg-surface-raised-base-hover transition-colors text-left"
-                    onClick={() => props.onServerSelected?.(key)}
-                  >
-                    <span class="text-14-regular text-text-strong truncate">{serverName(conn)}</span>
-                  </button>
-                )
-              }}
-            </For>
-          </div>
-        </div>
-      </Show>
-    </div>
-  )
-}
-
 function ServerKey(props: ParentProps) {
   const server = useServer()
   return (
@@ -280,32 +146,25 @@ export function AppInterface(props: {
   defaultServer: ServerConnection.Key
   servers?: Array<ServerConnection.Any>
   router?: Component<BaseRouterProps>
-  disableHealthCheck?: boolean
 }) {
   return (
-    <ServerProvider
-      defaultServer={props.defaultServer}
-      disableHealthCheck={props.disableHealthCheck}
-      servers={props.servers}
-    >
-      <ConnectionGate disableHealthCheck={props.disableHealthCheck}>
-        <ServerKey>
-          <GlobalSDKProvider>
-            <GlobalSyncProvider>
-              <Dynamic
-                component={props.router ?? Router}
-                root={(routerProps) => <RouterRoot appChildren={props.children}>{routerProps.children}</RouterRoot>}
-              >
-                <Route path="/" component={HomeRoute} />
-                <Route path="/:dir" component={DirectoryLayout}>
-                  <Route path="/" component={SessionIndexRoute} />
-                  <Route path="/session/:id?" component={SessionRoute} />
-                </Route>
-              </Dynamic>
-            </GlobalSyncProvider>
-          </GlobalSDKProvider>
-        </ServerKey>
-      </ConnectionGate>
+    <ServerProvider defaultServer={props.defaultServer} servers={props.servers}>
+      <ServerKey>
+        <GlobalSDKProvider>
+          <GlobalSyncProvider>
+            <Dynamic
+              component={props.router ?? Router}
+              root={(routerProps) => <RouterRoot appChildren={props.children}>{routerProps.children}</RouterRoot>}
+            >
+              <Route path="/" component={HomeRoute} />
+              <Route path="/:dir" component={DirectoryLayout}>
+                <Route path="/" component={SessionIndexRoute} />
+                <Route path="/session/:id?" component={SessionRoute} />
+              </Route>
+            </Dynamic>
+          </GlobalSyncProvider>
+        </GlobalSDKProvider>
+      </ServerKey>
     </ServerProvider>
   )
 }

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

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

packages/app/src/components/dialog-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,22 @@ 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 { useLanguage } from "@/context/language"
 import { useGlobalSDK } from "@/context/global-sdk"
 import { useGlobalSync } from "@/context/global-sync"
-import { useLanguage } from "@/context/language"
-import { useProviders } from "@/hooks/use-providers"
+import { usePlatform } from "@/context/platform"
+import { DialogSelectModel } from "./dialog-select-model"
+import { DialogSelectProvider } from "./dialog-select-provider"
 
 export function DialogConnectProvider(props: { provider: string }) {
   const dialog = useDialog()
   const globalSync = useGlobalSync()
   const globalSDK = useGlobalSDK()
+  const platform = usePlatform()
   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,41 +36,26 @@ 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,
-    state: "pending" as undefined | "pending" | "complete" | "error" | "prompt",
+    state: "pending" as undefined | "pending" | "complete" | "error",
     error: undefined as string | undefined,
   })
 
   type Action =
     | { type: "method.select"; index: number }
     | { type: "method.reset" }
-    | { type: "auth.prompt" }
     | { type: "auth.pending" }
     | { type: "auth.complete"; authorization: ProviderAuthAuthorization }
     | { type: "auth.error"; error: string }
@@ -96,11 +77,6 @@ export function DialogConnectProvider(props: { provider: string }) {
           draft.error = undefined
           return
         }
-        if (action.type === "auth.prompt") {
-          draft.state = "prompt"
-          draft.error = undefined
-          return
-        }
         if (action.type === "auth.pending") {
           draft.state = "pending"
           draft.error = undefined
@@ -144,7 +120,7 @@ export function DialogConnectProvider(props: { provider: string }) {
     return fallback
   }
 
-  async function selectMethod(index: number, inputs?: Record<string, string>) {
+  async function selectMethod(index: number) {
     if (timer.current !== undefined) {
       clearTimeout(timer.current)
       timer.current = undefined
@@ -154,10 +130,6 @@ export function DialogConnectProvider(props: { provider: string }) {
     dispatch({ type: "method.select", index })
 
     if (method.type === "oauth") {
-      if (method.prompts?.length && !inputs) {
-        dispatch({ type: "auth.prompt" })
-        return
-      }
       dispatch({ type: "auth.pending" })
       const start = Date.now()
       await globalSDK.client.provider.oauth
@@ -165,7 +137,6 @@ export function DialogConnectProvider(props: { provider: string }) {
           {
             providerID: props.provider,
             method: index,
-            inputs,
           },
           { throwOnError: true },
         )
@@ -192,126 +163,6 @@ export function DialogConnectProvider(props: { provider: string }) {
     }
   }
 
-  function OAuthPromptsView() {
-    const [formStore, setFormStore] = createStore({
-      value: {} as Record<string, string>,
-      index: 0,
-    })
-
-    const prompts = createMemo<NonNullable<ProviderAuthMethod["prompts"]>>(() => {
-      const value = method()
-      if (value?.type !== "oauth") return []
-      return value.prompts ?? []
-    })
-    const matches = (prompt: NonNullable<ReturnType<typeof prompts>[number]>, value: Record<string, string>) => {
-      if (!prompt.when) return true
-      const actual = value[prompt.when.key]
-      if (actual === undefined) return false
-      return prompt.when.op === "eq" ? actual === prompt.when.value : actual !== prompt.when.value
-    }
-    const current = createMemo(() => {
-      const all = prompts()
-      const index = all.findIndex((prompt, index) => index >= formStore.index && matches(prompt, formStore.value))
-      if (index === -1) return
-      return {
-        index,
-        prompt: all[index],
-      }
-    })
-    const valid = createMemo(() => {
-      const item = current()
-      if (!item || item.prompt.type !== "text") return false
-      const value = formStore.value[item.prompt.key] ?? ""
-      return value.trim().length > 0
-    })
-
-    async function next(index: number, value: Record<string, string>) {
-      if (store.methodIndex === undefined) return
-      const next = prompts().findIndex((prompt, i) => i > index && matches(prompt, value))
-      if (next !== -1) {
-        setFormStore("index", next)
-        return
-      }
-      await selectMethod(store.methodIndex, value)
-    }
-
-    async function handleSubmit(e: SubmitEvent) {
-      e.preventDefault()
-      const item = current()
-      if (!item || item.prompt.type !== "text") return
-      if (!valid()) return
-      await next(item.index, formStore.value)
-    }
-
-    const item = () => current()
-    const text = createMemo(() => {
-      const prompt = item()?.prompt
-      if (!prompt || prompt.type !== "text") return
-      return prompt
-    })
-    const select = createMemo(() => {
-      const prompt = item()?.prompt
-      if (!prompt || prompt.type !== "select") return
-      return prompt
-    })
-
-    return (
-      <form onSubmit={handleSubmit} class="flex flex-col items-start gap-4">
-        <Switch>
-          <Match when={item()?.prompt.type === "text"}>
-            <TextField
-              type="text"
-              label={text()?.message ?? ""}
-              placeholder={text()?.placeholder}
-              value={text() ? (formStore.value[text()!.key] ?? "") : ""}
-              onChange={(value) => {
-                const prompt = text()
-                if (!prompt) return
-                setFormStore("value", prompt.key, value)
-              }}
-            />
-            <Button class="w-auto" type="submit" size="large" variant="primary" disabled={!valid()}>
-              {language.t("common.continue")}
-            </Button>
-          </Match>
-          <Match when={item()?.prompt.type === "select"}>
-            <div class="w-full flex flex-col gap-1.5">
-              <div class="text-14-regular text-text-base">{select()?.message}</div>
-              <div>
-                <List
-                  items={select()?.options ?? []}
-                  key={(x) => x.value}
-                  current={select()?.options.find((x) => x.value === formStore.value[select()!.key])}
-                  onSelect={(value) => {
-                    if (!value) return
-                    const prompt = select()
-                    if (!prompt) return
-                    const nextValue = {
-                      ...formStore.value,
-                      [prompt.key]: value.value,
-                    }
-                    setFormStore("value", prompt.key, value.value)
-                    void next(item()!.index, nextValue)
-                  }}
-                >
-                  {(option) => (
-                    <div class="w-full flex items-center gap-x-2">
-                      <div class="w-4 h-2 rounded-[1px] bg-input-base shadow-xs-border-base flex items-center justify-center">
-                        <div class="w-2.5 h-0.5 ml-0 bg-icon-strong-base hidden" data-slot="list-item-extra-icon" />
-                      </div>
-                      <span>{option.label}</span>
-                      <span class="text-14-regular text-text-weak">{option.hint}</span>
-                    </div>
-                  )}
-                </List>
-              </div>
-            </div>
-          </Match>
-        </Switch>
-      </form>
-    )
-  }
-
   let listRef: ListRef | undefined
   function handleKey(e: KeyboardEvent) {
     if (e.key === "Enter" && e.target instanceof HTMLInputElement) {
@@ -321,12 +172,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 +191,7 @@ export function DialogConnectProvider(props: { provider: string }) {
 
   function goBack() {
     if (methods().length === 1) {
-      all()
+      dialog.show(() => <DialogSelectProvider />)
       return
     }
     if (store.authorization) {
@@ -355,7 +202,7 @@ export function DialogConnectProvider(props: { provider: string }) {
       dispatch({ type: "method.reset" })
       return
     }
-    all()
+    dialog.show(() => <DialogSelectProvider />)
   }
 
   function MethodSelection() {
@@ -454,7 +301,7 @@ export function DialogConnectProvider(props: { provider: string }) {
             error={formStore.error}
           />
           <Button class="w-auto" type="submit" size="large" variant="primary">
-            {language.t("common.continue")}
+            {language.t("common.submit")}
           </Button>
         </form>
       </div>
@@ -467,6 +314,12 @@ export function DialogConnectProvider(props: { provider: string }) {
       error: undefined as string | undefined,
     })
 
+    onMount(() => {
+      if (store.authorization?.method === "code" && store.authorization?.url) {
+        platform.openLink(store.authorization.url)
+      }
+    })
+
     async function handleSubmit(e: SubmitEvent) {
       e.preventDefault()
 
@@ -515,7 +368,7 @@ export function DialogConnectProvider(props: { provider: string }) {
             error={formStore.error}
           />
           <Button class="w-auto" type="submit" size="large" variant="primary">
-            {language.t("common.continue")}
+            {language.t("common.submit")}
           </Button>
         </form>
       </div>
@@ -533,6 +386,10 @@ export function DialogConnectProvider(props: { provider: string }) {
 
     onMount(() => {
       void (async () => {
+        if (store.authorization?.url) {
+          platform.openLink(store.authorization.url)
+        }
+
         const result = await globalSDK.client.provider.oauth
           .callback({
             providerID: props.provider,
@@ -602,14 +459,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>
@@ -621,9 +470,6 @@ export function DialogConnectProvider(props: { provider: string }) {
                   </div>
                 </div>
               </Match>
-              <Match when={store.state === "prompt"}>
-                <OAuthPromptsView />
-              </Match>
               <Match when={store.state === "error"}>
                 <div class="text-14-regular text-text-base">
                   <div class="flex items-center gap-x-2">

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

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

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

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

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

@@ -3,18 +3,160 @@ import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { Dialog } from "@opencode-ai/ui/dialog"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
-import { useMutation } from "@tanstack/solid-query"
 import { TextField } from "@opencode-ai/ui/text-field"
 import { showToast } from "@opencode-ai/ui/toast"
-import { batch, For } from "solid-js"
-import { createStore, produce } from "solid-js/store"
+import { For } from "solid-js"
+import { createStore } from "solid-js/store"
 import { Link } from "@/components/link"
 import { useGlobalSDK } from "@/context/global-sdk"
 import { useGlobalSync } from "@/context/global-sync"
 import { useLanguage } from "@/context/language"
-import { type FormState, headerRow, modelRow, validateCustomProvider } from "./dialog-custom-provider-form"
 import { DialogSelectProvider } from "./dialog-select-provider"
 
+const PROVIDER_ID = /^[a-z0-9][a-z0-9-_]*$/
+const OPENAI_COMPATIBLE = "@ai-sdk/openai-compatible"
+
+type Translator = ReturnType<typeof useLanguage>["t"]
+
+type ModelRow = {
+  id: string
+  name: string
+}
+
+type HeaderRow = {
+  key: string
+  value: string
+}
+
+type FormState = {
+  providerID: string
+  name: string
+  baseURL: string
+  apiKey: string
+  models: ModelRow[]
+  headers: HeaderRow[]
+  saving: boolean
+}
+
+type FormErrors = {
+  providerID: string | undefined
+  name: string | undefined
+  baseURL: string | undefined
+  models: Array<{ id?: string; name?: string }>
+  headers: Array<{ key?: string; value?: string }>
+}
+
+type ValidateArgs = {
+  form: FormState
+  t: Translator
+  disabledProviders: string[]
+  existingProviderIDs: Set<string>
+}
+
+function validateCustomProvider(input: ValidateArgs) {
+  const providerID = input.form.providerID.trim()
+  const name = input.form.name.trim()
+  const baseURL = input.form.baseURL.trim()
+  const apiKey = input.form.apiKey.trim()
+
+  const env = apiKey.match(/^\{env:([^}]+)\}$/)?.[1]?.trim()
+  const key = apiKey && !env ? apiKey : undefined
+
+  const idError = !providerID
+    ? input.t("provider.custom.error.providerID.required")
+    : !PROVIDER_ID.test(providerID)
+      ? input.t("provider.custom.error.providerID.format")
+      : undefined
+
+  const nameError = !name ? input.t("provider.custom.error.name.required") : undefined
+  const urlError = !baseURL
+    ? input.t("provider.custom.error.baseURL.required")
+    : !/^https?:\/\//.test(baseURL)
+      ? input.t("provider.custom.error.baseURL.format")
+      : undefined
+
+  const disabled = input.disabledProviders.includes(providerID)
+  const existsError = idError
+    ? undefined
+    : input.existingProviderIDs.has(providerID) && !disabled
+      ? input.t("provider.custom.error.providerID.exists")
+      : undefined
+
+  const seenModels = new Set<string>()
+  const modelErrors = input.form.models.map((m) => {
+    const id = m.id.trim()
+    const modelIdError = !id
+      ? input.t("provider.custom.error.required")
+      : seenModels.has(id)
+        ? input.t("provider.custom.error.duplicate")
+        : (() => {
+            seenModels.add(id)
+            return undefined
+          })()
+    const modelNameError = !m.name.trim() ? input.t("provider.custom.error.required") : undefined
+    return { id: modelIdError, name: modelNameError }
+  })
+  const modelsValid = modelErrors.every((m) => !m.id && !m.name)
+  const models = Object.fromEntries(input.form.models.map((m) => [m.id.trim(), { name: m.name.trim() }]))
+
+  const seenHeaders = new Set<string>()
+  const headerErrors = input.form.headers.map((h) => {
+    const key = h.key.trim()
+    const value = h.value.trim()
+
+    if (!key && !value) return {}
+    const keyError = !key
+      ? input.t("provider.custom.error.required")
+      : seenHeaders.has(key.toLowerCase())
+        ? input.t("provider.custom.error.duplicate")
+        : (() => {
+            seenHeaders.add(key.toLowerCase())
+            return undefined
+          })()
+    const valueError = !value ? input.t("provider.custom.error.required") : undefined
+    return { key: keyError, value: valueError }
+  })
+  const headersValid = headerErrors.every((h) => !h.key && !h.value)
+  const headers = Object.fromEntries(
+    input.form.headers
+      .map((h) => ({ key: h.key.trim(), value: h.value.trim() }))
+      .filter((h) => !!h.key && !!h.value)
+      .map((h) => [h.key, h.value]),
+  )
+
+  const errors: FormErrors = {
+    providerID: idError ?? existsError,
+    name: nameError,
+    baseURL: urlError,
+    models: modelErrors,
+    headers: headerErrors,
+  }
+
+  const ok = !idError && !existsError && !nameError && !urlError && modelsValid && headersValid
+  if (!ok) return { errors }
+
+  const options = {
+    baseURL,
+    ...(Object.keys(headers).length ? { headers } : {}),
+  }
+
+  return {
+    errors,
+    result: {
+      providerID,
+      name,
+      key,
+      config: {
+        npm: OPENAI_COMPATIBLE,
+        name,
+        ...(env ? { env: [env] } : {}),
+        options,
+        models,
+      },
+    },
+  }
+}
+
 type Props = {
   back?: "providers" | "close"
 }
@@ -30,9 +172,17 @@ export function DialogCustomProvider(props: Props) {
     name: "",
     baseURL: "",
     apiKey: "",
-    models: [modelRow()],
-    headers: [headerRow()],
-    err: {},
+    models: [{ id: "", name: "" }],
+    headers: [{ key: "", value: "" }],
+    saving: false,
+  })
+
+  const [errors, setErrors] = createStore<FormErrors>({
+    providerID: undefined,
+    name: undefined,
+    baseURL: undefined,
+    models: [{}],
+    headers: [{}],
   })
 
   const goBack = () => {
@@ -44,61 +194,25 @@ export function DialogCustomProvider(props: Props) {
   }
 
   const addModel = () => {
-    setForm(
-      "models",
-      produce((rows) => {
-        rows.push(modelRow())
-      }),
-    )
+    setForm("models", (v) => [...v, { id: "", name: "" }])
+    setErrors("models", (v) => [...v, {}])
   }
 
   const removeModel = (index: number) => {
     if (form.models.length <= 1) return
-    setForm(
-      "models",
-      produce((rows) => {
-        rows.splice(index, 1)
-      }),
-    )
+    setForm("models", (v) => v.filter((_, i) => i !== index))
+    setErrors("models", (v) => v.filter((_, i) => i !== index))
   }
 
   const addHeader = () => {
-    setForm(
-      "headers",
-      produce((rows) => {
-        rows.push(headerRow())
-      }),
-    )
+    setForm("headers", (v) => [...v, { key: "", value: "" }])
+    setErrors("headers", (v) => [...v, {}])
   }
 
   const removeHeader = (index: number) => {
     if (form.headers.length <= 1) return
-    setForm(
-      "headers",
-      produce((rows) => {
-        rows.splice(index, 1)
-      }),
-    )
-  }
-
-  const setField = (key: "providerID" | "name" | "baseURL" | "apiKey", value: string) => {
-    setForm(key, value)
-    if (key === "apiKey") return
-    setForm("err", key, undefined)
-  }
-
-  const setModel = (index: number, key: "id" | "name", value: string) => {
-    batch(() => {
-      setForm("models", index, key, value)
-      setForm("models", index, "err", key, undefined)
-    })
-  }
-
-  const setHeader = (index: number, key: "key" | "value", value: string) => {
-    batch(() => {
-      setForm("headers", index, key, value)
-      setForm("headers", index, "err", key, undefined)
-    })
+    setForm("headers", (v) => v.filter((_, i) => i !== index))
+    setErrors("headers", (v) => v.filter((_, i) => i !== index))
   }
 
   const validate = () => {
@@ -108,57 +222,52 @@ export function DialogCustomProvider(props: Props) {
       disabledProviders: globalSync.data.config.disabled_providers ?? [],
       existingProviderIDs: new Set(globalSync.data.provider.all.map((p) => p.id)),
     })
-    batch(() => {
-      setForm("err", output.err)
-      output.models.forEach((err, index) => setForm("models", index, "err", err))
-      output.headers.forEach((err, index) => setForm("headers", index, "err", err))
-    })
+    setErrors(output.errors)
     return output.result
   }
 
-  const saveMutation = useMutation(() => ({
-    mutationFn: async (result: NonNullable<ReturnType<typeof validate>>) => {
-      const disabledProviders = globalSync.data.config.disabled_providers ?? []
-      const nextDisabled = disabledProviders.filter((id) => id !== result.providerID)
+  const save = async (e: SubmitEvent) => {
+    e.preventDefault()
+    if (form.saving) return
 
-      if (result.key) {
-        await globalSDK.client.auth.set({
+    const result = validate()
+    if (!result) return
+
+    setForm("saving", true)
+
+    const disabledProviders = globalSync.data.config.disabled_providers ?? []
+    const nextDisabled = disabledProviders.filter((id) => id !== result.providerID)
+
+    const auth = result.key
+      ? globalSDK.client.auth.set({
           providerID: result.providerID,
           auth: {
             type: "api",
             key: result.key,
           },
         })
-      }
+      : Promise.resolve()
 
-      await globalSync.updateConfig({
-        provider: { [result.providerID]: result.config },
-        disabled_providers: nextDisabled,
+    auth
+      .then(() =>
+        globalSync.updateConfig({ provider: { [result.providerID]: result.config }, disabled_providers: nextDisabled }),
+      )
+      .then(() => {
+        dialog.close()
+        showToast({
+          variant: "success",
+          icon: "circle-check",
+          title: language.t("provider.connect.toast.connected.title", { provider: result.name }),
+          description: language.t("provider.connect.toast.connected.description", { provider: result.name }),
+        })
       })
-      return result
-    },
-    onSuccess: (result) => {
-      dialog.close()
-      showToast({
-        variant: "success",
-        icon: "circle-check",
-        title: language.t("provider.connect.toast.connected.title", { provider: result.name }),
-        description: language.t("provider.connect.toast.connected.description", { provider: result.name }),
+      .catch((err: unknown) => {
+        const message = err instanceof Error ? err.message : String(err)
+        showToast({ title: language.t("common.requestFailed"), description: message })
+      })
+      .finally(() => {
+        setForm("saving", false)
       })
-    },
-    onError: (err) => {
-      const message = err instanceof Error ? err.message : String(err)
-      showToast({ title: language.t("common.requestFailed"), description: message })
-    },
-  }))
-
-  const save = (e: SubmitEvent) => {
-    e.preventDefault()
-    if (saveMutation.isPending) return
-
-    const result = validate()
-    if (!result) return
-    saveMutation.mutate(result)
   }
 
   return (
@@ -196,32 +305,32 @@ export function DialogCustomProvider(props: Props) {
               placeholder={language.t("provider.custom.field.providerID.placeholder")}
               description={language.t("provider.custom.field.providerID.description")}
               value={form.providerID}
-              onChange={(v) => setField("providerID", v)}
-              validationState={form.err.providerID ? "invalid" : undefined}
-              error={form.err.providerID}
+              onChange={(v) => setForm("providerID", v)}
+              validationState={errors.providerID ? "invalid" : undefined}
+              error={errors.providerID}
             />
             <TextField
               label={language.t("provider.custom.field.name.label")}
               placeholder={language.t("provider.custom.field.name.placeholder")}
               value={form.name}
-              onChange={(v) => setField("name", v)}
-              validationState={form.err.name ? "invalid" : undefined}
-              error={form.err.name}
+              onChange={(v) => setForm("name", v)}
+              validationState={errors.name ? "invalid" : undefined}
+              error={errors.name}
             />
             <TextField
               label={language.t("provider.custom.field.baseURL.label")}
               placeholder={language.t("provider.custom.field.baseURL.placeholder")}
               value={form.baseURL}
-              onChange={(v) => setField("baseURL", v)}
-              validationState={form.err.baseURL ? "invalid" : undefined}
-              error={form.err.baseURL}
+              onChange={(v) => setForm("baseURL", v)}
+              validationState={errors.baseURL ? "invalid" : undefined}
+              error={errors.baseURL}
             />
             <TextField
               label={language.t("provider.custom.field.apiKey.label")}
               placeholder={language.t("provider.custom.field.apiKey.placeholder")}
               description={language.t("provider.custom.field.apiKey.description")}
               value={form.apiKey}
-              onChange={(v) => setField("apiKey", v)}
+              onChange={(v) => setForm("apiKey", v)}
             />
           </div>
 
@@ -229,16 +338,16 @@ export function DialogCustomProvider(props: Props) {
             <label class="text-12-medium text-text-weak">{language.t("provider.custom.models.label")}</label>
             <For each={form.models}>
               {(m, i) => (
-                <div class="flex gap-2 items-start" data-row={m.row}>
+                <div class="flex gap-2 items-start">
                   <div class="flex-1">
                     <TextField
                       label={language.t("provider.custom.models.id.label")}
                       hideLabel
                       placeholder={language.t("provider.custom.models.id.placeholder")}
                       value={m.id}
-                      onChange={(v) => setModel(i(), "id", v)}
-                      validationState={m.err.id ? "invalid" : undefined}
-                      error={m.err.id}
+                      onChange={(v) => setForm("models", i(), "id", v)}
+                      validationState={errors.models[i()]?.id ? "invalid" : undefined}
+                      error={errors.models[i()]?.id}
                     />
                   </div>
                   <div class="flex-1">
@@ -247,9 +356,9 @@ export function DialogCustomProvider(props: Props) {
                       hideLabel
                       placeholder={language.t("provider.custom.models.name.placeholder")}
                       value={m.name}
-                      onChange={(v) => setModel(i(), "name", v)}
-                      validationState={m.err.name ? "invalid" : undefined}
-                      error={m.err.name}
+                      onChange={(v) => setForm("models", i(), "name", v)}
+                      validationState={errors.models[i()]?.name ? "invalid" : undefined}
+                      error={errors.models[i()]?.name}
                     />
                   </div>
                   <IconButton
@@ -273,16 +382,16 @@ export function DialogCustomProvider(props: Props) {
             <label class="text-12-medium text-text-weak">{language.t("provider.custom.headers.label")}</label>
             <For each={form.headers}>
               {(h, i) => (
-                <div class="flex gap-2 items-start" data-row={h.row}>
+                <div class="flex gap-2 items-start">
                   <div class="flex-1">
                     <TextField
                       label={language.t("provider.custom.headers.key.label")}
                       hideLabel
                       placeholder={language.t("provider.custom.headers.key.placeholder")}
                       value={h.key}
-                      onChange={(v) => setHeader(i(), "key", v)}
-                      validationState={h.err.key ? "invalid" : undefined}
-                      error={h.err.key}
+                      onChange={(v) => setForm("headers", i(), "key", v)}
+                      validationState={errors.headers[i()]?.key ? "invalid" : undefined}
+                      error={errors.headers[i()]?.key}
                     />
                   </div>
                   <div class="flex-1">
@@ -291,9 +400,9 @@ export function DialogCustomProvider(props: Props) {
                       hideLabel
                       placeholder={language.t("provider.custom.headers.value.placeholder")}
                       value={h.value}
-                      onChange={(v) => setHeader(i(), "value", v)}
-                      validationState={h.err.value ? "invalid" : undefined}
-                      error={h.err.value}
+                      onChange={(v) => setForm("headers", i(), "value", v)}
+                      validationState={errors.headers[i()]?.value ? "invalid" : undefined}
+                      error={errors.headers[i()]?.value}
                     />
                   </div>
                   <IconButton
@@ -313,14 +422,8 @@ export function DialogCustomProvider(props: Props) {
             </Button>
           </div>
 
-          <Button
-            class="w-auto self-start"
-            type="submit"
-            size="large"
-            variant="primary"
-            disabled={saveMutation.isPending}
-          >
-            {saveMutation.isPending ? language.t("common.saving") : language.t("common.submit")}
+          <Button class="w-auto self-start" type="submit" size="large" variant="primary" disabled={form.saving}>
+            {form.saving ? language.t("common.saving") : language.t("common.submit")}
           </Button>
         </form>
       </div>

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

@@ -2,7 +2,6 @@ import { Button } from "@opencode-ai/ui/button"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { Dialog } from "@opencode-ai/ui/dialog"
 import { TextField } from "@opencode-ai/ui/text-field"
-import { useMutation } from "@tanstack/solid-query"
 import { Icon } from "@opencode-ai/ui/icon"
 import { createMemo, For, Show } from "solid-js"
 import { createStore } from "solid-js/store"
@@ -29,6 +28,7 @@ export function DialogEditProject(props: { project: LocalProject }) {
     color: props.project.icon?.color || "pink",
     iconUrl: props.project.icon?.override || "",
     startup: props.project.commands?.start ?? "",
+    saving: false,
     dragOver: false,
     iconHover: false,
   })
@@ -71,37 +71,38 @@ export function DialogEditProject(props: { project: LocalProject }) {
     setStore("iconUrl", "")
   }
 
-  const saveMutation = useMutation(() => ({
-    mutationFn: async () => {
-      const name = store.name.trim() === folderName() ? "" : store.name.trim()
-      const start = store.startup.trim()
-
-      if (props.project.id && props.project.id !== "global") {
-        await globalSDK.client.project.update({
-          projectID: props.project.id,
-          directory: props.project.worktree,
-          name,
-          icon: { color: store.color, override: store.iconUrl },
-          commands: { start },
-        })
-        globalSync.project.icon(props.project.worktree, store.iconUrl || undefined)
-        dialog.close()
-        return
-      }
-
-      globalSync.project.meta(props.project.worktree, {
-        name,
-        icon: { color: store.color, override: store.iconUrl || undefined },
-        commands: { start: start || undefined },
-      })
-      dialog.close()
-    },
-  }))
-
-  function handleSubmit(e: SubmitEvent) {
+  async function handleSubmit(e: SubmitEvent) {
     e.preventDefault()
-    if (saveMutation.isPending) return
-    saveMutation.mutate()
+
+    await Promise.resolve()
+      .then(async () => {
+        setStore("saving", true)
+        const name = store.name.trim() === folderName() ? "" : store.name.trim()
+        const start = store.startup.trim()
+
+        if (props.project.id && props.project.id !== "global") {
+          await globalSDK.client.project.update({
+            projectID: props.project.id,
+            directory: props.project.worktree,
+            name,
+            icon: { color: store.color, override: store.iconUrl },
+            commands: { start },
+          })
+          globalSync.project.icon(props.project.worktree, store.iconUrl || undefined)
+          dialog.close()
+          return
+        }
+
+        globalSync.project.meta(props.project.worktree, {
+          name,
+          icon: { color: store.color, override: store.iconUrl || undefined },
+          commands: { start: start || undefined },
+        })
+        dialog.close()
+      })
+      .finally(() => {
+        setStore("saving", false)
+      })
   }
 
   return (
@@ -245,8 +246,8 @@ export function DialogEditProject(props: { project: LocalProject }) {
           <Button type="button" variant="ghost" size="large" onClick={() => dialog.close()}>
             {language.t("common.cancel")}
           </Button>
-          <Button type="submit" variant="primary" size="large" disabled={saveMutation.isPending}>
-            {saveMutation.isPending ? language.t("common.saving") : language.t("common.save")}
+          <Button type="submit" variant="primary" size="large" disabled={store.saving}>
+            {store.saving ? language.t("common.saving") : language.t("common.save")}
           </Button>
         </div>
       </form>

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

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

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

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

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

@@ -1,12 +1,9 @@
-import { useMutation } from "@tanstack/solid-query"
-import { Component, createEffect, createMemo, on, Show } from "solid-js"
-import { createStore } from "solid-js/store"
+import { Component, createMemo, createSignal, 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 +17,7 @@ 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 [loading, setLoading] = createSignal<string | null>(null)
 
   const items = createMemo(() =>
     Object.entries(sync.data.mcp ?? {})
@@ -69,8 +25,10 @@ export const DialogSelectMcp: Component = () => {
       .sort((a, b) => a.name.localeCompare(b.name)),
   )
 
-  const toggle = useMutation(() => ({
-    mutationFn: async (name: string) => {
+  const toggle = async (name: string) => {
+    if (loading()) return
+    setLoading(name)
+    try {
       const status = sync.data.mcp[name]
       if (status?.status === "connected") {
         await sdk.client.mcp.disconnect({ name })
@@ -80,8 +38,10 @@ export const DialogSelectMcp: Component = () => {
 
       const result = await sdk.client.mcp.status()
       if (result.data) sync.set("mcp", result.data)
-    },
-  }))
+    } finally {
+      setLoading(null)
+    }
+  }
 
   const enabledCount = createMemo(() => items().filter((i) => i.status === "connected").length)
   const totalCount = createMemo(() => items().length)
@@ -99,8 +59,7 @@ export const DialogSelectMcp: Component = () => {
         filterKeys={["name", "status"]}
         sortBy={(a, b) => a.name.localeCompare(b.name)}
         onSelect={(x) => {
-          if (!x || toggle.isPending) return
-          toggle.mutate(x.name)
+          if (x) toggle(x.name)
         }}
       >
         {(i) => {
@@ -124,7 +83,7 @@ export const DialogSelectMcp: Component = () => {
                   <Show when={statusLabel()}>
                     <span class="text-11-regular text-text-weaker">{statusLabel()}</span>
                   </Show>
-                  <Show when={toggle.isPending && toggle.variables === i.name}>
+                  <Show when={loading() === i.name}>
                     <span class="text-11-regular text-text-weak">{language.t("common.loading.ellipsis")}</span>
                   </Show>
                 </div>
@@ -133,14 +92,7 @@ export const DialogSelectMcp: Component = () => {
                 </Show>
               </div>
               <div onClick={(e) => e.stopPropagation()}>
-                <Switch
-                  checked={enabled()}
-                  disabled={toggle.isPending && toggle.variables === i.name}
-                  onChange={() => {
-                    if (toggle.isPending) return
-                    toggle.mutate(i.name)
-                  }}
-                />
+                <Switch checked={enabled()} disabled={loading() === i.name} onChange={() => toggle(i.name)} />
               </div>
             </div>
           )

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

@@ -8,29 +8,17 @@ 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"
 
-type ModelState = ReturnType<typeof useLocal>["model"]
-
-export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props) => {
-  const model = props.model ?? useLocal().model
+export const DialogSelectModelUnpaid: Component = () => {
+  const local = useLocal()
   const dialog = useDialog()
   const providers = useProviders()
   const language = useLanguage()
 
-  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
@@ -47,8 +35,8 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
         <List
           class="[&_[data-slot=list-scroll]]:overflow-visible"
           ref={(ref) => (listRef = ref)}
-          items={model.list}
-          current={model.current()}
+          items={local.model.list}
+          current={local.model.current()}
           key={(x) => `${x.provider.id}:${x.id}`}
           itemWrapper={(item, node) => (
             <Tooltip
@@ -67,7 +55,7 @@ export const DialogSelectModelUnpaid: Component<{ model?: ModelState }> = (props
             </Tooltip>
           )}
           onSelect={(x) => {
-            model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
+            local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
               recent: true,
             })
             dialog.close()
@@ -101,7 +89,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 +120,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,28 +10,27 @@ 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"
 
 const isFree = (provider: string, cost: { input: number } | undefined) =>
   provider === "opencode" && (!cost || cost.input === 0)
 
-type ModelState = ReturnType<typeof useLocal>["model"]
-
 const ModelList: Component<{
   provider?: string
   class?: string
   onSelect: () => void
   action?: JSX.Element
-  model?: ModelState
 }> = (props) => {
-  const model = props.model ?? useLocal().model
+  const local = useLocal()
   const language = useLanguage()
 
   const models = createMemo(() =>
-    model
+    local.model
       .list()
-      .filter((m) => model.visible({ modelID: m.id, providerID: m.provider.id }))
+      .filter((m) => local.model.visible({ modelID: m.id, providerID: m.provider.id }))
       .filter((m) => (props.provider ? m.provider.id === props.provider : true)),
   )
 
@@ -42,7 +41,7 @@ const ModelList: Component<{
       emptyMessage={language.t("dialog.model.empty")}
       key={(x) => `${x.provider.id}:${x.id}`}
       items={models}
-      current={model.current()}
+      current={local.model.current()}
       filterKeys={["provider.name", "name", "id"]}
       sortBy={(a, b) => a.name.localeCompare(b.name)}
       groupBy={(x) => x.provider.name}
@@ -64,7 +63,7 @@ const ModelList: Component<{
         </Tooltip>
       )}
       onSelect={(x) => {
-        model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
+        local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
           recent: true,
         })
         props.onSelect()
@@ -89,7 +88,6 @@ type ModelSelectorTriggerProps = Omit<ComponentProps<typeof Kobalte.Trigger>, "a
 
 export function ModelSelectorPopover(props: {
   provider?: string
-  model?: ModelState
   children?: JSX.Element
   triggerAs?: ValidComponent
   triggerProps?: ModelSelectorTriggerProps
@@ -105,16 +103,12 @@ export function ModelSelectorPopover(props: {
 
   const handleManage = () => {
     setStore("open", false)
-    void import("./dialog-manage-models").then((x) => {
-      dialog.show(() => <x.DialogManageModels />)
-    })
+    dialog.show(() => <DialogManageModels />)
   }
 
   const handleConnectProvider = () => {
     setStore("open", false)
-    void import("./dialog-select-provider").then((x) => {
-      dialog.show(() => <x.DialogSelectProvider />)
-    })
+    dialog.show(() => <DialogSelectProvider />)
   }
   const language = useLanguage()
 
@@ -157,7 +151,6 @@ export function ModelSelectorPopover(props: {
           <Kobalte.Title class="sr-only">{language.t("dialog.model.select.title")}</Kobalte.Title>
           <ModelList
             provider={props.provider}
-            model={props.model}
             onSelect={() => setStore("open", false)}
             class="p-1"
             action={
@@ -191,33 +184,30 @@ export function ModelSelectorPopover(props: {
   )
 }
 
-export const DialogSelectModel: Component<{ provider?: string; model?: ModelState }> = (props) => {
+export const DialogSelectModel: Component<{ provider?: string }> = (props) => {
   const dialog = useDialog()
   const language = useLanguage()
 
-  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}>
+      <ModelList provider={props.provider} onSelect={() => dialog.close()} />
+      <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/dialog-select-server.tsx

@@ -6,7 +6,6 @@ import { Icon } from "@opencode-ai/ui/icon"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { List } from "@opencode-ai/ui/list"
 import { TextField } from "@opencode-ai/ui/text-field"
-import { useMutation } from "@tanstack/solid-query"
 import { showToast } from "@opencode-ai/ui/toast"
 import { useNavigate } from "@solidjs/router"
 import { createEffect, createMemo, createResource, onCleanup, Show } from "solid-js"
@@ -15,9 +14,7 @@ import { ServerHealthIndicator, ServerRow } from "@/components/server/server-row
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
 import { normalizeServerUrl, ServerConnection, useServer } from "@/context/server"
-import { type ServerHealth, useCheckServerHealth } from "@/utils/server-health"
-
-const DEFAULT_USERNAME = "opencode"
+import { checkServerHealth, type ServerHealth } from "@/utils/server-health"
 
 interface ServerFormProps {
   value: string
@@ -44,15 +41,13 @@ function showRequestError(language: ReturnType<typeof useLanguage>, err: unknown
   })
 }
 
-function useDefaultServer() {
-  const language = useLanguage()
-  const platform = usePlatform()
-  const [defaultKey, defaultUrlActions] = createResource(
+function useDefaultServer(platform: ReturnType<typeof usePlatform>, language: ReturnType<typeof useLanguage>) {
+  const [defaultUrl, defaultUrlActions] = createResource(
     async () => {
       try {
-        const key = await platform.getDefaultServer?.()
-        if (!key) return null
-        return key
+        const url = await platform.getDefaultServerUrl?.()
+        if (!url) return null
+        return normalizeServerUrl(url) ?? null
       } catch (err) {
         showRequestError(language, err)
         return null
@@ -61,22 +56,20 @@ function useDefaultServer() {
     { initialValue: null },
   )
 
-  const canDefault = createMemo(() => !!platform.getDefaultServer && !!platform.setDefaultServer)
-  const setDefault = async (key: ServerConnection.Key | null) => {
+  const canDefault = createMemo(() => !!platform.getDefaultServerUrl && !!platform.setDefaultServerUrl)
+  const setDefault = async (url: string | null) => {
     try {
-      await platform.setDefaultServer?.(key)
-      defaultUrlActions.mutate(key)
+      await platform.setDefaultServerUrl?.(url)
+      defaultUrlActions.mutate(url)
     } catch (err) {
       showRequestError(language, err)
     }
   }
 
-  return { defaultKey, canDefault, setDefault }
+  return { defaultUrl, canDefault, setDefault }
 }
 
-function useServerPreview() {
-  const checkServerHealth = useCheckServerHealth()
-
+function useServerPreview(fetcher: typeof fetch) {
   const looksComplete = (value: string) => {
     const normalized = normalizeServerUrl(value)
     if (!normalized) return false
@@ -99,7 +92,7 @@ function useServerPreview() {
     const http: ServerConnection.HttpBase = { url: normalized }
     if (username) http.username = username
     if (password) http.password = password
-    const result = await checkServerHealth(http)
+    const result = await checkServerHealth(http, fetcher)
     setStatus(result.healthy)
   }
 
@@ -122,7 +115,7 @@ function ServerForm(props: ServerFormProps) {
 
   return (
     <div class="px-5">
-      <div class="bg-surface-base rounded-md p-5 flex flex-col gap-3">
+      <div class="bg-surface-raised-base rounded-md p-5 flex flex-col gap-3">
         <div class="flex-1 min-w-0 [&_[data-slot=input-wrapper]]:relative">
           <TextField
             type="text"
@@ -150,7 +143,7 @@ function ServerForm(props: ServerFormProps) {
           <TextField
             type="text"
             label={language.t("dialog.server.add.username")}
-            placeholder={language.t("dialog.server.add.usernamePlaceholder")}
+            placeholder="username"
             value={props.username}
             disabled={props.busy}
             onChange={props.onUsernameChange}
@@ -159,7 +152,7 @@ function ServerForm(props: ServerFormProps) {
           <TextField
             type="password"
             label={language.t("dialog.server.add.password")}
-            placeholder={language.t("dialog.server.add.passwordPlaceholder")}
+            placeholder="password"
             value={props.password}
             disabled={props.busy}
             onChange={props.onPasswordChange}
@@ -177,16 +170,17 @@ export function DialogSelectServer() {
   const server = useServer()
   const platform = usePlatform()
   const language = useLanguage()
-  const { defaultKey, canDefault, setDefault } = useDefaultServer()
-  const { previewStatus } = useServerPreview()
-  const checkServerHealth = useCheckServerHealth()
+  const fetcher = platform.fetch ?? globalThis.fetch
+  const { defaultUrl, canDefault, setDefault } = useDefaultServer(platform, language)
+  const { previewStatus } = useServerPreview(fetcher)
   const [store, setStore] = createStore({
     status: {} as Record<ServerConnection.Key, ServerHealth | undefined>,
     addServer: {
       url: "",
       name: "",
-      username: DEFAULT_USERNAME,
+      username: "",
       password: "",
+      adding: false,
       error: "",
       showForm: false,
       status: undefined as boolean | undefined,
@@ -198,6 +192,7 @@ export function DialogSelectServer() {
       username: "",
       password: "",
       error: "",
+      busy: false,
       status: undefined as boolean | undefined,
     },
   })
@@ -206,8 +201,9 @@ export function DialogSelectServer() {
     setStore("addServer", {
       url: "",
       name: "",
-      username: DEFAULT_USERNAME,
+      username: "",
       password: "",
+      adding: false,
       error: "",
       showForm: false,
       status: undefined,
@@ -222,78 +218,10 @@ export function DialogSelectServer() {
       password: "",
       error: "",
       status: undefined,
+      busy: false,
     })
   }
 
-  const addMutation = useMutation(() => ({
-    mutationFn: async (value: string) => {
-      const normalized = normalizeServerUrl(value)
-      if (!normalized) {
-        resetAdd()
-        return
-      }
-
-      const conn: ServerConnection.Http = {
-        type: "http",
-        http: { url: normalized },
-      }
-      if (store.addServer.name.trim()) conn.displayName = store.addServer.name.trim()
-      if (store.addServer.password) conn.http.password = store.addServer.password
-      if (store.addServer.password && store.addServer.username) conn.http.username = store.addServer.username
-      const result = await checkServerHealth(conn.http)
-      if (!result.healthy) {
-        setStore("addServer", { error: language.t("dialog.server.add.error") })
-        return
-      }
-
-      resetAdd()
-      await select(conn, true)
-    },
-  }))
-
-  const editMutation = useMutation(() => ({
-    mutationFn: async (input: { original: ServerConnection.Any; value: string }) => {
-      if (input.original.type !== "http") return
-      const normalized = normalizeServerUrl(input.value)
-      if (!normalized) {
-        resetEdit()
-        return
-      }
-
-      const name = store.editServer.name.trim() || undefined
-      const username = store.editServer.username || undefined
-      const password = store.editServer.password || undefined
-      const existingName = input.original.displayName
-      if (
-        normalized === input.original.http.url &&
-        name === existingName &&
-        username === input.original.http.username &&
-        password === input.original.http.password
-      ) {
-        resetEdit()
-        return
-      }
-
-      const conn: ServerConnection.Http = {
-        type: "http",
-        displayName: name,
-        http: { url: normalized, username, password },
-      }
-      const result = await checkServerHealth(conn.http)
-      if (!result.healthy) {
-        setStore("editServer", { error: language.t("dialog.server.add.error") })
-        return
-      }
-      if (normalized === input.original.http.url) {
-        server.add(conn)
-      } else {
-        replaceServer(input.original, conn)
-      }
-
-      resetEdit()
-    },
-  }))
-
   const replaceServer = (original: ServerConnection.Http, next: ServerConnection.Http) => {
     const active = server.key
     const newConn = server.add(next)
@@ -336,7 +264,7 @@ export function DialogSelectServer() {
     const results: Record<ServerConnection.Key, ServerHealth> = {}
     await Promise.all(
       items().map(async (conn) => {
-        results[ServerConnection.key(conn)] = await checkServerHealth(conn.http)
+        results[ServerConnection.key(conn)] = await checkServerHealth(conn.http, fetcher)
       }),
     )
     setStore("status", reconcile(results))
@@ -357,12 +285,12 @@ export function DialogSelectServer() {
       navigate("/")
       return
     }
+    server.setActive(ServerConnection.key(conn))
     navigate("/")
-    queueMicrotask(() => server.setActive(ServerConnection.key(conn)))
   }
 
   const handleAddChange = (value: string) => {
-    if (addMutation.isPending) return
+    if (store.addServer.adding) return
     setStore("addServer", { url: value, error: "" })
     void previewStatus(value, store.addServer.username, store.addServer.password, (next) =>
       setStore("addServer", { status: next }),
@@ -370,12 +298,12 @@ export function DialogSelectServer() {
   }
 
   const handleAddNameChange = (value: string) => {
-    if (addMutation.isPending) return
+    if (store.addServer.adding) return
     setStore("addServer", { name: value, error: "" })
   }
 
   const handleAddUsernameChange = (value: string) => {
-    if (addMutation.isPending) return
+    if (store.addServer.adding) return
     setStore("addServer", { username: value, error: "" })
     void previewStatus(store.addServer.url, value, store.addServer.password, (next) =>
       setStore("addServer", { status: next }),
@@ -383,7 +311,7 @@ export function DialogSelectServer() {
   }
 
   const handleAddPasswordChange = (value: string) => {
-    if (addMutation.isPending) return
+    if (store.addServer.adding) return
     setStore("addServer", { password: value, error: "" })
     void previewStatus(store.addServer.url, store.addServer.username, value, (next) =>
       setStore("addServer", { status: next }),
@@ -391,7 +319,7 @@ export function DialogSelectServer() {
   }
 
   const handleEditChange = (value: string) => {
-    if (editMutation.isPending) return
+    if (store.editServer.busy) return
     setStore("editServer", { value, error: "" })
     void previewStatus(value, store.editServer.username, store.editServer.password, (next) =>
       setStore("editServer", { status: next }),
@@ -399,12 +327,12 @@ export function DialogSelectServer() {
   }
 
   const handleEditNameChange = (value: string) => {
-    if (editMutation.isPending) return
+    if (store.editServer.busy) return
     setStore("editServer", { name: value, error: "" })
   }
 
   const handleEditUsernameChange = (value: string) => {
-    if (editMutation.isPending) return
+    if (store.editServer.busy) return
     setStore("editServer", { username: value, error: "" })
     void previewStatus(store.editServer.value, value, store.editServer.password, (next) =>
       setStore("editServer", { status: next }),
@@ -412,13 +340,85 @@ export function DialogSelectServer() {
   }
 
   const handleEditPasswordChange = (value: string) => {
-    if (editMutation.isPending) return
+    if (store.editServer.busy) return
     setStore("editServer", { password: value, error: "" })
     void previewStatus(store.editServer.value, store.editServer.username, value, (next) =>
       setStore("editServer", { status: next }),
     )
   }
 
+  async function handleAdd(value: string) {
+    if (store.addServer.adding) return
+    const normalized = normalizeServerUrl(value)
+    if (!normalized) {
+      resetAdd()
+      return
+    }
+
+    setStore("addServer", { adding: true, error: "" })
+
+    const conn: ServerConnection.Http = {
+      type: "http",
+      http: { url: normalized },
+    }
+    if (store.addServer.name.trim()) conn.displayName = store.addServer.name.trim()
+    if (store.addServer.username) conn.http.username = store.addServer.username
+    if (store.addServer.password) conn.http.password = store.addServer.password
+    const result = await checkServerHealth(conn.http, fetcher)
+    setStore("addServer", { adding: false })
+    if (!result.healthy) {
+      setStore("addServer", { error: language.t("dialog.server.add.error") })
+      return
+    }
+
+    resetAdd()
+    await select(conn, true)
+  }
+
+  async function handleEdit(original: ServerConnection.Any, value: string) {
+    if (store.editServer.busy || original.type !== "http") return
+    const normalized = normalizeServerUrl(value)
+    if (!normalized) {
+      resetEdit()
+      return
+    }
+
+    const name = store.editServer.name.trim() || undefined
+    const username = store.editServer.username || undefined
+    const password = store.editServer.password || undefined
+    const existingName = original.displayName
+    if (
+      normalized === original.http.url &&
+      name === existingName &&
+      username === original.http.username &&
+      password === original.http.password
+    ) {
+      resetEdit()
+      return
+    }
+
+    setStore("editServer", { busy: true, error: "" })
+
+    const conn: ServerConnection.Http = {
+      type: "http",
+      displayName: name,
+      http: { url: normalized, username, password },
+    }
+    const result = await checkServerHealth(conn.http, fetcher)
+    setStore("editServer", { busy: false })
+    if (!result.healthy) {
+      setStore("editServer", { error: language.t("dialog.server.add.error") })
+      return
+    }
+    if (normalized === original.http.url) {
+      server.add(conn)
+    } else {
+      replaceServer(original, conn)
+    }
+
+    resetEdit()
+  }
+
   const mode = createMemo<"list" | "add" | "edit">(() => {
     if (store.editServer.id) return "edit"
     if (store.addServer.showForm) return "add"
@@ -441,7 +441,7 @@ export function DialogSelectServer() {
       showForm: true,
       url: "",
       name: "",
-      username: DEFAULT_USERNAME,
+      username: "",
       password: "",
       error: "",
       status: undefined,
@@ -458,26 +458,23 @@ export function DialogSelectServer() {
       password: conn.http.password ?? "",
       error: "",
       status: store.status[ServerConnection.key(conn)]?.healthy,
+      busy: false,
     })
   }
 
   const submitForm = () => {
     if (mode() === "add") {
-      if (addMutation.isPending) return
-      setStore("addServer", { error: "" })
-      addMutation.mutate(store.addServer.url)
+      void handleAdd(store.addServer.url)
       return
     }
     const original = editing()
     if (!original) return
-    if (editMutation.isPending) return
-    setStore("editServer", { error: "" })
-    editMutation.mutate({ original, value: store.editServer.value })
+    void handleEdit(original, store.editServer.value)
   }
 
   const isFormMode = createMemo(() => mode() !== "list")
   const isAddMode = createMemo(() => mode() === "add")
-  const formBusy = createMemo(() => (isAddMode() ? addMutation.isPending : editMutation.isPending))
+  const formBusy = createMemo(() => (isAddMode() ? store.addServer.adding : store.editServer.busy))
 
   const formTitle = createMemo(() => {
     if (!isFormMode()) return language.t("dialog.server.title")
@@ -497,8 +494,8 @@ export function DialogSelectServer() {
 
   async function handleRemove(url: ServerConnection.Key) {
     server.remove(url)
-    if ((await platform.getDefaultServer?.()) === url) {
-      platform.setDefaultServer?.(null)
+    if ((await platform.getDefaultServerUrl?.()) === url) {
+      platform.setDefaultServerUrl?.(null)
     }
   }
 
@@ -539,7 +536,7 @@ export function DialogSelectServer() {
               if (x) select(x)
             }}
             divider={true}
-            class="px-5 [&_[data-slot=list-search-wrapper]]:w-full [&_[data-slot=list-scroll]]h-[300px] [&_[data-slot=list-scroll]]:overflow-y-auto [&_[data-slot=list-items]]:bg-surface-base [&_[data-slot=list-items]]:rounded-md [&_[data-slot=list-item]]:min-h-14 [&_[data-slot=list-item]]:p-3 [&_[data-slot=list-item]]:!bg-transparent"
+            class="px-5 [&_[data-slot=list-search-wrapper]]:w-full [&_[data-slot=list-scroll]]h-[300px] [&_[data-slot=list-scroll]]:overflow-y-auto [&_[data-slot=list-items]]:bg-surface-raised-base [&_[data-slot=list-items]]:rounded-md [&_[data-slot=list-item]]:min-h-14 [&_[data-slot=list-item]]:p-3 [&_[data-slot=list-item]]:!bg-transparent"
           >
             {(i) => {
               const key = ServerConnection.key(i)
@@ -554,7 +551,7 @@ export function DialogSelectServer() {
                     status={store.status[key]}
                     class="flex items-center gap-3 min-w-0 flex-1"
                     badge={
-                      <Show when={defaultKey() === ServerConnection.key(i)}>
+                      <Show when={defaultUrl() === i.http.url}>
                         <span class="text-text-base bg-surface-base text-14-regular px-1.5 rounded-xs">
                           {language.t("dialog.server.status.default")}
                         </span>
@@ -587,14 +584,14 @@ export function DialogSelectServer() {
                             >
                               <DropdownMenu.ItemLabel>{language.t("dialog.server.menu.edit")}</DropdownMenu.ItemLabel>
                             </DropdownMenu.Item>
-                            <Show when={canDefault() && defaultKey() !== key}>
-                              <DropdownMenu.Item onSelect={() => setDefault(key)}>
+                            <Show when={canDefault() && defaultUrl() !== i.http.url}>
+                              <DropdownMenu.Item onSelect={() => setDefault(i.http.url)}>
                                 <DropdownMenu.ItemLabel>
                                   {language.t("dialog.server.menu.default")}
                                 </DropdownMenu.ItemLabel>
                               </DropdownMenu.Item>
                             </Show>
-                            <Show when={canDefault() && defaultKey() === key}>
+                            <Show when={canDefault() && defaultUrl() === i.http.url}>
                               <DropdownMenu.Item onSelect={() => setDefault(null)}>
                                 <DropdownMenu.ItemLabel>
                                   {language.t("dialog.server.menu.defaultRemove")}

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

@@ -1,7 +1,8 @@
 import { useFilteredList } from "@opencode-ai/ui/hooks"
 import { useSpring } from "@opencode-ai/ui/motion-spring"
-import { createEffect, on, Component, Show, onCleanup, createMemo, createSignal } from "solid-js"
+import { createEffect, on, Component, Show, onCleanup, Switch, Match, createMemo, createSignal } from "solid-js"
 import { createStore } from "solid-js/store"
+import { createFocusSignal } from "@solid-primitives/active-element"
 import { useLocal } from "@/context/local"
 import { selectionFromLines, type SelectedLineRange, useFile } from "@/context/file"
 import {
@@ -16,6 +17,7 @@ import {
 } from "@/context/prompt"
 import { useLayout } from "@/context/layout"
 import { useSDK } from "@/context/sdk"
+import { useParams } from "@solidjs/router"
 import { useSync } from "@/context/sync"
 import { useComments } from "@/context/comments"
 import { Button } from "@opencode-ai/ui/button"
@@ -25,20 +27,18 @@ import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
 import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Select } from "@opencode-ai/ui/select"
+import { RadioGroup } from "@opencode-ai/ui/radio-group"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { ModelSelectorPopover } from "@/components/dialog-select-model"
+import { DialogSelectModelUnpaid } from "@/components/dialog-select-model-unpaid"
 import { useProviders } from "@/hooks/use-providers"
 import { useCommand } from "@/context/command"
 import { Persist, persisted } from "@/utils/persist"
 import { usePermission } from "@/context/permission"
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
-import { useSessionLayout } from "@/pages/session/session-layout"
-import { createSessionTabs } from "@/pages/session/helpers"
-import { 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"
+import { createPromptAttachments, ACCEPTED_FILE_TYPES } from "./prompt-input/attachments"
 import {
   canNavigateHistoryAtCursor,
   navigatePromptHistory,
@@ -48,7 +48,7 @@ import {
   type PromptHistoryStoredEntry,
   promptLength,
 } from "./prompt-input/history"
-import { createPromptSubmit, type FollowupDraft } from "./prompt-input/submit"
+import { createPromptSubmit } from "./prompt-input/submit"
 import { PromptPopover, type AtOption, type SlashCommand } from "./prompt-input/slash-popover"
 import { PromptContextItems } from "./prompt-input/context-items"
 import { PromptImageAttachments } from "./prompt-input/image-attachments"
@@ -61,11 +61,6 @@ interface PromptInputProps {
   ref?: (el: HTMLDivElement) => void
   newSessionWorktree?: string
   onNewSessionWorktreeReset?: () => void
-  edit?: { id: string; prompt: Prompt; context: FollowupDraft["context"] }
-  onEditLoaded?: () => void
-  shouldQueue?: () => boolean
-  onQueue?: (draft: FollowupDraft) => void
-  onAbort?: () => void
   onSubmit?: () => void
 }
 
@@ -107,21 +102,20 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
   const prompt = usePrompt()
   const layout = useLayout()
   const comments = useComments()
+  const params = useParams()
   const dialog = useDialog()
   const providers = useProviders()
   const command = useCommand()
   const permission = usePermission()
   const language = useLanguage()
   const platform = usePlatform()
-  const { params, tabs, view } = useSessionLayout()
   let editorRef!: HTMLDivElement
   let fileInputRef: HTMLInputElement | undefined
   let scrollRef!: HTMLDivElement
   let slashPopoverRef!: HTMLDivElement
 
   const mirror = { input: false }
-  const inset = 56
-  const space = `${inset}px`
+  const inset = 44
 
   const scrollCursorIntoView = () => {
     const container = scrollRef
@@ -156,18 +150,13 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     }
   }
 
-  const queueScroll = (count = 2) => {
-    requestAnimationFrame(() => {
-      scrollCursorIntoView()
-      if (count > 1) queueScroll(count - 1)
-    })
+  const queueScroll = () => {
+    requestAnimationFrame(scrollCursorIntoView)
   }
 
-  const activeFileTab = createSessionTabs({
-    tabs,
-    pathFromTab: files.pathFromTab,
-    normalizeTab: (tab) => (tab.startsWith("file://") ? files.tab(tab) : tab),
-  }).activeFileTab
+  const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`)
+  const tabs = createMemo(() => layout.tabs(sessionKey))
+  const view = createMemo(() => layout.view(sessionKey))
 
   const commentInReview = (path: string) => {
     const sessionID = params.id
@@ -220,7 +209,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
 
   const recent = createMemo(() => {
     const all = tabs().all()
-    const active = activeFileTab()
+    const active = tabs().active()
     const order = active ? [active, ...all.filter((x) => x !== active)] : all
     const seen = new Set<string>()
     const paths: string[] = []
@@ -243,23 +232,6 @@ 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"),
   )
@@ -283,15 +255,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
   })
 
   const buttonsSpring = useSpring(() => (store.mode === "normal" ? 1 : 0), { visualDuration: 0.2, bounce: 0 })
-  const motion = (value: number) => ({
-    opacity: value,
-    transform: `scale(${0.95 + value * 0.05})`,
-    filter: `blur(${(1 - value) * 2}px)`,
-    "pointer-events": value > 0.5 ? ("auto" as const) : ("none" as const),
-  })
-  const buttons = createMemo(() => motion(buttonsSpring()))
-  const shell = createMemo(() => motion(1 - buttonsSpring()))
-  const control = createMemo(() => ({ height: "28px", ...buttons() }))
 
   const commentCount = createMemo(() => {
     if (store.mode === "shell") return 0
@@ -427,6 +390,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     }
   }
 
+  const isFocused = createFocusSignal(() => editorRef)
   const escBlur = () => platform.platform === "desktop" && platform.os === "macos"
 
   const pick = () => fileInputRef?.click()
@@ -526,18 +490,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     setComposing(false)
   }
 
-  const handleCompositionStart = () => {
-    setComposing(true)
-  }
-
-  const handleCompositionEnd = () => {
-    setComposing(false)
-    requestAnimationFrame(() => {
-      if (composing()) return
-      reconcile(prompt.current().filter((part) => part.type !== "image"))
-    })
-  }
-
   const agentList = createMemo(() =>
     sync.data.agent
       .filter((agent) => !agent.hidden && agent.mode !== "primary")
@@ -571,7 +523,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))
@@ -622,7 +573,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
 
   const handleSlashSelect = (cmd: SlashCommand | undefined) => {
     if (!cmd) return
-    promptProbe.select(cmd.id)
     closePopover()
 
     if (cmd.type === "custom") {
@@ -711,20 +661,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     })
   })
 
-  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()
@@ -744,27 +680,24 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     }
   }
 
-  const reconcile = (input: Prompt) => {
-    if (mirror.input) {
-      mirror.input = false
-      if (isNormalizedEditor()) return
-
-      renderEditorWithCursor(input)
-      return
-    }
-
-    const dom = parseFromDOM()
-    if (isNormalizedEditor() && isPromptEqual(input, dom)) return
-
-    renderEditorWithCursor(input)
-  }
-
   createEffect(
     on(
       () => prompt.current(),
-      (parts) => {
-        if (composing()) return
-        reconcile(parts.filter((part) => part.type !== "image"))
+      (currentParts) => {
+        const inputParts = currentParts.filter((part) => part.type !== "image")
+
+        if (mirror.input) {
+          mirror.input = false
+          if (isNormalizedEditor()) return
+
+          renderEditorWithCursor(inputParts)
+          return
+        }
+
+        const domParts = parseFromDOM()
+        if (isNormalizedEditor() && isPromptEqual(inputParts, domParts)) return
+
+        renderEditorWithCursor(inputParts)
       },
     ),
   )
@@ -988,45 +921,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     setCurrentHistory("entries", next)
   }
 
-  createEffect(
-    on(
-      () => props.edit?.id,
-      (id) => {
-        const edit = props.edit
-        if (!id || !edit) return
-
-        for (const item of prompt.context.items()) {
-          prompt.context.remove(item.key)
-        }
-
-        for (const item of edit.context) {
-          prompt.context.add({
-            type: item.type,
-            path: item.path,
-            selection: item.selection,
-            comment: item.comment,
-            commentID: item.commentID,
-            commentOrigin: item.commentOrigin,
-            preview: item.preview,
-          })
-        }
-
-        setStore("mode", "normal")
-        setStore("popover", null)
-        setStore("historyIndex", -1)
-        setStore("savedPrompt", null)
-        prompt.set(edit.prompt, promptLength(edit.prompt))
-        requestAnimationFrame(() => {
-          editorRef.focus()
-          setCursorPosition(editorRef, promptLength(edit.prompt))
-          queueScroll()
-        })
-        props.onEditLoaded?.()
-      },
-      { defer: true },
-    ),
-  )
-
   const navigateHistory = (direction: "up" | "down") => {
     const result = navigatePromptHistory({
       direction,
@@ -1043,8 +937,9 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     return true
   }
 
-  const { addAttachments, removeAttachment, handlePaste } = createPromptAttachments({
+  const { addImageAttachment, removeImageAttachment, handlePaste } = createPromptAttachments({
     editor: () => editorRef,
+    isFocused,
     isDialogActive: () => !!dialog.active,
     setDraggingType: (type) => setStore("draggingType", type),
     focusEditor: () => {
@@ -1061,17 +956,6 @@ 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,
@@ -1091,9 +975,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
     setPopover: (popover) => setStore("popover", popover),
     newSessionWorktree: () => props.newSessionWorktree,
     onNewSessionWorktreeReset: props.onNewSessionWorktreeReset,
-    shouldQueue: props.shouldQueue,
-    onQueue: props.onQueue,
-    onAbort: props.onAbort,
     onSubmit: props.onSubmit,
   })
 
@@ -1241,20 +1122,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
 
     // Note: Shift+Enter is handled earlier, before IME check
     if (event.key === "Enter" && !event.shiftKey) {
-      event.preventDefault()
-      if (event.repeat) return
-      if (
-        working() &&
-        prompt
-          .current()
-          .map((part) => ("content" in part ? part.content : ""))
-          .join("")
-          .trim().length === 0 &&
-        imageAttachments().length === 0 &&
-        commentCount() === 0
-      ) {
-        return
-      }
       handleSubmit(event)
     }
   }
@@ -1307,7 +1174,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
           onOpen={(attachment) =>
             dialog.show(() => <ImagePreview src={attachment.dataUrl} alt={attachment.filename} />)
           }
-          onRemove={removeAttachment}
+          onRemove={removeImageAttachment}
           removeLabel={language.t("prompt.attachment.remove")}
         />
         <div
@@ -1325,11 +1192,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
             editorRef?.focus()
           }}
         >
-          <div
-            class="relative max-h-[240px] overflow-y-auto no-scrollbar"
-            ref={(el) => (scrollRef = el)}
-            style={{ "scroll-padding-bottom": space }}
-          >
+          <div class="relative max-h-[240px] overflow-y-auto no-scrollbar" ref={(el) => (scrollRef = el)}>
             <div
               data-component="prompt-input"
               ref={(el) => {
@@ -1345,75 +1208,44 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
               spellcheck={store.mode === "normal"}
               onInput={handleInput}
               onPaste={handlePaste}
-              onCompositionStart={handleCompositionStart}
-              onCompositionEnd={handleCompositionEnd}
+              onCompositionStart={() => setComposing(true)}
+              onCompositionEnd={() => setComposing(false)}
               onBlur={handleBlur}
               onKeyDown={handleKeyDown}
               classList={{
                 "select-text": true,
-                "w-full pl-3 pr-2 pt-2 text-14-regular text-text-strong focus:outline-none whitespace-pre-wrap": true,
+                "w-full pl-3 pr-2 pt-2 pb-11 text-14-regular text-text-strong focus:outline-none whitespace-pre-wrap": true,
                 "[&_[data-type=file]]:text-syntax-property": true,
                 "[&_[data-type=agent]]:text-syntax-type": true,
                 "font-mono!": store.mode === "shell",
               }}
-              style={{ "padding-bottom": space }}
             />
             <Show when={!prompt.dirty()}>
               <div
-                class="absolute top-0 inset-x-0 pl-3 pr-2 pt-2 text-14-regular text-text-weak pointer-events-none whitespace-nowrap truncate"
+                class="absolute top-0 inset-x-0 pl-3 pr-2 pt-2 pb-11 text-14-regular text-text-weak pointer-events-none whitespace-nowrap truncate"
                 classList={{ "font-mono!": store.mode === "shell" }}
-                style={{ "padding-bottom": space }}
               >
                 {placeholder()}
               </div>
             </Show>
           </div>
 
-          <div
-            aria-hidden="true"
-            class="pointer-events-none absolute inset-x-0 bottom-0"
-            style={{
-              height: space,
-              background:
-                "linear-gradient(to top, var(--surface-raised-stronger-non-alpha) calc(100% - 20px), transparent)",
-            }}
-          />
-
           <div class="pointer-events-none absolute bottom-2 right-2 flex items-center gap-2">
             <input
               ref={fileInputRef}
               type="file"
-              multiple
               accept={ACCEPTED_FILE_TYPES.join(",")}
               class="hidden"
               onChange={(e) => {
-                const list = e.currentTarget.files
-                if (list) void addAttachments(Array.from(list))
+                const file = e.currentTarget.files?.[0]
+                if (file) addImageAttachment(file)
                 e.currentTarget.value = ""
               }}
             />
 
-            <div class="flex items-center gap-1 pointer-events-auto">
-              <Tooltip placement="top" inactive={!prompt.dirty() && !working()} value={tip()}>
-                <IconButton
-                  data-action="prompt-submit"
-                  type="submit"
-                  disabled={store.mode !== "normal" || (!prompt.dirty() && !working() && commentCount() === 0)}
-                  tabIndex={store.mode === "normal" ? undefined : -1}
-                  icon={working() ? "stop" : "arrow-up"}
-                  variant="primary"
-                  class="size-8"
-                  style={buttons()}
-                  aria-label={working() ? language.t("prompt.action.stop") : language.t("prompt.action.send")}
-                />
-              </Tooltip>
-            </div>
-          </div>
-
-          <div class="pointer-events-none absolute bottom-2 left-2">
             <div
               aria-hidden={store.mode !== "normal"}
-              class="pointer-events-auto"
+              class="flex items-center gap-1"
               style={{
                 "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
               }}
@@ -1428,7 +1260,11 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                   type="button"
                   variant="ghost"
                   class="size-8 p-0"
-                  style={buttons()}
+                  style={{
+                    opacity: buttonsSpring(),
+                    transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                    filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                  }}
                   onClick={pick}
                   disabled={store.mode !== "normal"}
                   tabIndex={store.mode === "normal" ? undefined : -1}
@@ -1437,6 +1273,85 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                   <Icon name="plus" class="size-4.5" />
                 </Button>
               </TooltipKeybind>
+
+              <Tooltip
+                placement="top"
+                inactive={!prompt.dirty() && !working()}
+                value={
+                  <Switch>
+                    <Match when={working()}>
+                      <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>
+                    </Match>
+                    <Match when={true}>
+                      <div class="flex items-center gap-2">
+                        <span>{language.t("prompt.action.send")}</span>
+                        <Icon name="enter" size="small" class="text-icon-base" />
+                      </div>
+                    </Match>
+                  </Switch>
+                }
+              >
+                <IconButton
+                  data-action="prompt-submit"
+                  type="submit"
+                  disabled={store.mode !== "normal" || (!prompt.dirty() && !working() && commentCount() === 0)}
+                  tabIndex={store.mode === "normal" ? undefined : -1}
+                  icon={working() ? "stop" : "arrow-up"}
+                  variant="primary"
+                  class="size-8"
+                  style={{
+                    opacity: buttonsSpring(),
+                    transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                    filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                  }}
+                  aria-label={working() ? language.t("prompt.action.stop") : language.t("prompt.action.send")}
+                />
+              </Tooltip>
+            </div>
+          </div>
+
+          <div class="pointer-events-none absolute bottom-2 left-2">
+            <div class="pointer-events-auto">
+              <TooltipKeybind
+                placement="top"
+                gutter={8}
+                title={language.t(
+                  accepting() ? "command.permissions.autoaccept.disable" : "command.permissions.autoaccept.enable",
+                )}
+                keybind={command.keybind("permissions.autoaccept")}
+              >
+                <Button
+                  data-action="prompt-permissions"
+                  variant="ghost"
+                  onClick={() => {
+                    if (!params.id) {
+                      permission.toggleAutoAcceptDirectory(sdk.directory)
+                      return
+                    }
+                    permission.toggleAutoAccept(params.id, sdk.directory)
+                  }}
+                  classList={{
+                    "size-6 flex items-center justify-center": true,
+                    "text-text-base": !accepting(),
+                    "hover:bg-surface-success-base": accepting(),
+                  }}
+                  aria-label={
+                    accepting()
+                      ? language.t("command.permissions.autoaccept.disable")
+                      : language.t("command.permissions.autoaccept.enable")
+                  }
+                  aria-pressed={accepting()}
+                >
+                  <Icon
+                    name="chevron-double-right"
+                    size="small"
+                    classList={{ "text-icon-success-base": accepting() }}
+                  />
+                </Button>
+              </TooltipKeybind>
             </div>
           </div>
         </div>
@@ -1449,91 +1364,65 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                 class="h-7 flex items-center gap-1.5 max-w-[160px] min-w-0 absolute inset-y-0 left-0"
                 style={{
                   padding: "0 4px 0 8px",
-                  ...shell(),
+                  opacity: 1 - buttonsSpring(),
+                  transform: `scale(${0.95 + (1 - buttonsSpring()) * 0.05})`,
+                  filter: `blur(${buttonsSpring() * 2}px)`,
+                  "pointer-events": buttonsSpring() < 0.5 ? "auto" : "none",
                 }}
               >
                 <span class="truncate text-13-medium text-text-strong">{language.t("prompt.mode.shell")}</span>
                 <div class="size-4 shrink-0" />
               </div>
               <div class="flex items-center gap-1.5 min-w-0 flex-1">
-                <div data-component="prompt-agent-control">
-                  <TooltipKeybind
-                    placement="top"
-                    gutter={4}
-                    title={language.t("command.agent.cycle")}
-                    keybind={command.keybind("agent.cycle")}
-                  >
-                    <Select
-                      size="normal"
-                      options={agentNames()}
-                      current={local.agent.current()?.name ?? ""}
-                      onSelect={local.agent.set}
-                      class="capitalize max-w-[160px] text-text-base"
-                      valueClass="truncate text-13-regular text-text-base"
-                      triggerStyle={control()}
-                      triggerProps={{ "data-action": "prompt-agent" }}
-                      variant="ghost"
-                    />
-                  </TooltipKeybind>
-                </div>
-                <div data-component="prompt-model-control">
-                  <Show
-                    when={providers.paid().length > 0}
-                    fallback={
-                      <TooltipKeybind
-                        placement="top"
-                        gutter={4}
-                        title={language.t("command.model.choose")}
-                        keybind={command.keybind("model.choose")}
-                      >
-                        <Button
-                          data-action="prompt-model"
-                          as="div"
-                          variant="ghost"
-                          size="normal"
-                          class="min-w-0 max-w-[320px] text-13-regular text-text-base group"
-                          style={control()}
-                          onClick={() => {
-                            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>
-                    }
-                  >
+                <TooltipKeybind
+                  placement="top"
+                  gutter={4}
+                  title={language.t("command.agent.cycle")}
+                  keybind={command.keybind("agent.cycle")}
+                >
+                  <Select
+                    size="normal"
+                    options={agentNames()}
+                    current={local.agent.current()?.name ?? ""}
+                    onSelect={local.agent.set}
+                    class="capitalize max-w-[160px]"
+                    valueClass="truncate text-13-regular"
+                    triggerStyle={{
+                      height: "28px",
+                      opacity: buttonsSpring(),
+                      transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                      filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                      "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
+                    }}
+                    variant="ghost"
+                  />
+                </TooltipKeybind>
+                <Show
+                  when={providers.paid().length > 0}
+                  fallback={
                     <TooltipKeybind
                       placement="top"
                       gutter={4}
                       title={language.t("command.model.choose")}
                       keybind={command.keybind("model.choose")}
                     >
-                      <ModelSelectorPopover
-                        model={local.model}
-                        triggerAs={Button}
-                        triggerProps={{
-                          variant: "ghost",
-                          size: "normal",
-                          style: control(),
-                          class: "min-w-0 max-w-[320px] text-13-regular text-text-base group",
-                          "data-action": "prompt-model",
+                      <Button
+                        as="div"
+                        variant="ghost"
+                        size="normal"
+                        class="min-w-0 max-w-[320px] text-13-regular group"
+                        style={{
+                          height: "28px",
+                          opacity: buttonsSpring(),
+                          transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                          filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                          "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
                         }}
+                        onClick={() => dialog.show(() => <DialogSelectModelUnpaid />)}
                       >
                         <Show when={local.model.current()?.provider?.id}>
                           <ProviderIcon
-                            id={local.model.current()?.provider?.id ?? ""}
+                            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)" }}
                           />
@@ -1542,55 +1431,101 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                           {local.model.current()?.name ?? language.t("dialog.model.select.title")}
                         </span>
                         <Icon name="chevron-down" size="small" class="shrink-0" />
-                      </ModelSelectorPopover>
+                      </Button>
                     </TooltipKeybind>
-                  </Show>
-                </div>
-                <div data-component="prompt-variant-control">
+                  }
+                >
                   <TooltipKeybind
                     placement="top"
                     gutter={4}
-                    title={language.t("command.model.variant.cycle")}
-                    keybind={command.keybind("model.variant.cycle")}
+                    title={language.t("command.model.choose")}
+                    keybind={command.keybind("model.choose")}
                   >
-                    <Select
-                      size="normal"
-                      options={variants()}
-                      current={local.model.variant.current() ?? "default"}
-                      label={(x) => (x === "default" ? language.t("common.default") : x)}
-                      onSelect={(x) => local.model.variant.set(x === "default" ? undefined : x)}
-                      class="capitalize max-w-[160px] text-text-base"
-                      valueClass="truncate text-13-regular text-text-base"
-                      triggerStyle={control()}
-                      triggerProps={{ "data-action": "prompt-model-variant" }}
-                      variant="ghost"
-                    />
+                    <ModelSelectorPopover
+                      triggerAs={Button}
+                      triggerProps={{
+                        variant: "ghost",
+                        size: "normal",
+                        style: {
+                          height: "28px",
+                          opacity: buttonsSpring(),
+                          transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                          filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                          "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
+                        },
+                        class: "min-w-0 max-w-[320px] text-13-regular group",
+                      }}
+                    >
+                      <Show when={local.model.current()?.provider?.id}>
+                        <ProviderIcon
+                          id={local.model.current()!.provider.id}
+                          class="size-4 shrink-0 opacity-40 group-hover:opacity-100 transition-opacity duration-150"
+                          style={{ "will-change": "opacity", transform: "translateZ(0)" }}
+                        />
+                      </Show>
+                      <span class="truncate">
+                        {local.model.current()?.name ?? language.t("dialog.model.select.title")}
+                      </span>
+                      <Icon name="chevron-down" size="small" class="shrink-0" />
+                    </ModelSelectorPopover>
                   </TooltipKeybind>
-                </div>
+                </Show>
                 <TooltipKeybind
                   placement="top"
-                  gutter={8}
-                  title={acceptLabel()}
-                  keybind={command.keybind("permissions.autoaccept")}
+                  gutter={4}
+                  title={language.t("command.model.variant.cycle")}
+                  keybind={command.keybind("model.variant.cycle")}
                 >
-                  <Button
-                    data-action="prompt-permissions"
-                    variant="ghost"
-                    onClick={toggleAccept}
-                    classList={{
-                      "h-7 w-7 p-0 shrink-0 flex items-center justify-center": true,
-                      "text-text-base": !accepting(),
-                      "hover:bg-surface-success-base": accepting(),
+                  <Select
+                    size="normal"
+                    options={variants()}
+                    current={local.model.variant.current() ?? "default"}
+                    label={(x) => (x === "default" ? language.t("common.default") : x)}
+                    onSelect={(x) => local.model.variant.set(x === "default" ? undefined : x)}
+                    class="capitalize max-w-[160px]"
+                    valueClass="truncate text-13-regular"
+                    triggerStyle={{
+                      height: "28px",
+                      opacity: buttonsSpring(),
+                      transform: `scale(${0.95 + buttonsSpring() * 0.05})`,
+                      filter: `blur(${(1 - buttonsSpring()) * 2}px)`,
+                      "pointer-events": buttonsSpring() > 0.5 ? "auto" : "none",
                     }}
-                    style={control()}
-                    aria-label={acceptLabel()}
-                    aria-pressed={accepting()}
-                  >
-                    <Icon name="shield" size="small" classList={{ "text-icon-success-base": accepting() }} />
-                  </Button>
+                    variant="ghost"
+                  />
                 </TooltipKeybind>
               </div>
             </div>
+            <div class="shrink-0">
+              <RadioGroup
+                options={["shell", "normal"] as const}
+                current={store.mode}
+                value={(mode) => mode}
+                label={(mode) => (
+                  <TooltipKeybind
+                    placement="top"
+                    gutter={4}
+                    openDelay={2000}
+                    title={language.t(mode === "shell" ? "prompt.mode.shell" : "prompt.mode.normal")}
+                    keybind={command.keybind(mode === "shell" ? "prompt.mode.shell" : "prompt.mode.normal")}
+                    class="size-full flex items-center justify-center"
+                  >
+                    <Icon
+                      name={mode === "shell" ? "console" : "prompt"}
+                      class="size-[18px]"
+                      classList={{
+                        "text-icon-strong-base": store.mode === mode,
+                        "text-icon-weak": store.mode !== mode,
+                      }}
+                    />
+                  </TooltipKeybind>
+                )}
+                onSelect={(mode) => mode && setMode(mode)}
+                fill
+                pad="none"
+                class="w-[68px]"
+              />
+            </div>
           </div>
         </DockTray>
       </Show>

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

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