chore(release): cut 0.1.67

The async settings gate added in f0d96f8e called
shouldStartDaemon() inside Promise.resolve(...).then(...) with no
catch. If loadDesktopSettings() rejects (corrupted JSON, FS error),
the daemon never starts, no error renders on the splash, and the
retry button repeats the same silent path.

Add a recordError method to DaemonStartService and an onGateError
callback to startDaemonIfGateAllows / startHostRuntimeBootstrap.
_layout.tsx wires it through so a gate rejection populates
lastError, the splash shows the failure, and retry has signal.

.github/workflows/ci.yml

@@ -15,7 +15,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies
@@ -31,7 +31,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies
@@ -47,7 +47,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies
@@ -74,7 +74,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Fetch origin/main (worktree tests)
@@ -104,7 +104,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies
@@ -122,9 +122,12 @@ jobs:
           npx vitest run
           src/utils/executable.test.ts
           src/utils/spawn.launch-regression.test.ts
+          src/utils/spawn.percent-escape.test.ts
           src/utils/spawn.test.ts
+          src/utils/process-tree.test.ts
           src/utils/run-git-command.test.ts
           src/utils/checkout-git-rev-parse.test.ts
+          src/terminal/worker-terminal-manager.test.ts
           src/server/agent/provider-registry.test.ts
           src/server/agent/provider-launch-config.test.ts
           src/server/agent/provider-snapshot-manager.test.ts
@@ -135,6 +138,35 @@ jobs:
           src/server/persisted-config.test.ts
           src/server/bootstrap-provider-availability.test.ts
 
+  desktop-tests:
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest, windows-latest]
+    runs-on: ${{ matrix.os }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: "22"
+          cache: "npm"
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Build highlight dependency
+        run: npm run build --workspace=@getpaseo/highlight
+
+      - name: Build relay dependency
+        run: npm run build --workspace=@getpaseo/relay
+
+      - name: Build server dependency
+        run: npm run build --workspace=@getpaseo/server
+
+      - name: Run desktop tests
+        run: npm run test --workspace=@getpaseo/desktop
+
   app-tests:
     runs-on: ubuntu-latest
     steps:
@@ -142,7 +174,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies
@@ -164,7 +196,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies
@@ -207,7 +239,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies
@@ -226,7 +258,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Install dependencies

.github/workflows/desktop-release.yml

@@ -52,7 +52,6 @@ env:
   CHECKOUT_REF: ${{ github.event_name == 'workflow_dispatch' && (github.event.inputs.checkout_ref || github.ref_name) || github.ref_name }}
   SHOULD_PUBLISH: ${{ github.event_name != 'workflow_dispatch' || github.event.inputs.publish != 'false' }}
   ROLLOUT_HOURS: ${{ github.event_name == 'workflow_dispatch' && github.event.inputs.rollout_hours || '24' }}
-  DESKTOP_WORKSPACE: "@getpaseo/desktop"
   DESKTOP_PACKAGE_PATH: "packages/desktop"
 
 jobs:
@@ -148,9 +147,6 @@ jobs:
           fs.writeFileSync(packageJsonPath, `${JSON.stringify(packageJson, null, 2)}\n`);
           NODE
 
-      - name: Build web app for desktop
-        run: npm run build:web --workspace=@getpaseo/app
-
       - name: Build desktop release
         shell: bash
         env:
@@ -164,16 +160,28 @@ jobs:
           PASEO_DESKTOP_SMOKE: "1"
         run: |
           set -euo pipefail
-          publish_mode="never"
-          build_args=(-- --publish "$publish_mode" --mac --${{ matrix.electron_arch }})
-          if [[ "$SHOULD_PUBLISH" == "true" && "$IS_SMOKE_TAG" != "true" ]]; then
-            publish_mode="always"
-            build_args=(-- --publish "$publish_mode" --mac --${{ matrix.electron_arch }})
-            build_args+=("-c.publish.releaseType=$RELEASE_TYPE")
-            build_args+=("-c.publish.channel=$RELEASE_CHANNEL")
-          fi
+          build_args=(-- --publish never --mac --${{ matrix.electron_arch }})
+          build_args+=("-c.publish.releaseType=$RELEASE_TYPE")
+          build_args+=("-c.publish.channel=$RELEASE_CHANNEL")
+          npm run build:desktop "${build_args[@]}"
 
-          npm run build --workspace="$DESKTOP_WORKSPACE" "${build_args[@]}"
+      - name: Upload desktop artifacts to release
+        if: env.SHOULD_PUBLISH == 'true' && env.IS_SMOKE_TAG != 'true'
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        shell: bash
+        run: |
+          set -euo pipefail
+          release_dir="${DESKTOP_PACKAGE_PATH}/release"
+          files=()
+          while IFS= read -r -d '' f; do
+            files+=("$f")
+          done < <(find "$release_dir" -maxdepth 1 -type f ! -name '*.yml' -print0 | sort -z)
+          if (( ${#files[@]} == 0 )); then
+            echo "::error::No release artifacts found in $release_dir"
+            exit 1
+          fi
+          gh release upload "$RELEASE_TAG" "${files[@]}" --clobber --repo "${{ github.repository }}"
 
       - name: Upload manifest artifact
         if: env.SHOULD_PUBLISH == 'true' && env.IS_SMOKE_TAG != 'true'
@@ -183,63 +191,6 @@ jobs:
           path: ${{ env.DESKTOP_PACKAGE_PATH }}/release/${{ env.RELEASE_CHANNEL }}-mac.yml
           retention-days: 1
 
-  finalize-mac-manifest:
-    needs: [publish-macos]
-    if: ${{ needs.publish-macos.result == 'success' && (github.event_name != 'workflow_dispatch' || github.event.inputs.publish != 'false') }}
-    permissions:
-      contents: write
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v4
-        with:
-          sparse-checkout: |
-            package.json
-            package-lock.json
-            scripts
-          ref: ${{ env.CHECKOUT_REF }}
-
-      - name: Resolve release tag
-        shell: bash
-        run: node scripts/emit-release-env.mjs --source-tag "$SOURCE_TAG" >> "$GITHUB_ENV"
-
-      - name: Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version: "22"
-          cache: "npm"
-          cache-dependency-path: package-lock.json
-          registry-url: "https://npm.pkg.github.com"
-          scope: "@boudra"
-
-      - name: Install JS dependencies
-        run: npm ci
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-      - name: Download manifest artifacts
-        if: env.IS_SMOKE_TAG != 'true'
-        uses: actions/download-artifact@v4
-        with:
-          pattern: mac-manifest-*
-
-      - name: Merge manifests
-        if: env.IS_SMOKE_TAG != 'true'
-        shell: bash
-        run: |
-          set -euo pipefail
-          manifest_name="${RELEASE_CHANNEL}-mac.yml"
-          node scripts/merge-mac-manifest.mjs \
-            "mac-manifest-arm64/${manifest_name}" \
-            "mac-manifest-x64/${manifest_name}" \
-            "${manifest_name}"
-
-      - name: Upload merged manifest to release
-        if: env.IS_SMOKE_TAG != 'true'
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        run: gh release upload "$RELEASE_TAG" "$RELEASE_CHANNEL-mac.yml" --clobber --repo "${{ github.repository }}"
-
   publish-linux:
     needs: [create-release]
     if: ${{ always() && (needs.create-release.result == 'success' || needs.create-release.result == 'skipped') && ((github.event_name == 'workflow_dispatch' && (github.event.inputs.platform == 'all' || github.event.inputs.platform == 'linux')) || (github.event_name == 'push' && (startsWith(github.ref_name, 'v') || startsWith(github.ref_name, 'desktop-v') || startsWith(github.ref_name, 'desktop-linux-v')))) }}
@@ -288,9 +239,6 @@ jobs:
           fs.writeFileSync(packageJsonPath, `${JSON.stringify(packageJson, null, 2)}\n`);
           NODE
 
-      - name: Build web app for desktop
-        run: npm run build:web --workspace=@getpaseo/app
-
       - name: Install Linux smoke display
         run: sudo apt-get update && sudo apt-get install -y xvfb
 
@@ -302,16 +250,36 @@ jobs:
           PASEO_DESKTOP_SMOKE: "1"
         run: |
           set -euo pipefail
-          publish_mode="never"
-          build_args=(-- --publish "$publish_mode" --linux --x64)
-          if [[ "$SHOULD_PUBLISH" == "true" && "$IS_SMOKE_TAG" != "true" ]]; then
-            publish_mode="always"
-            build_args=(-- --publish "$publish_mode" --linux --x64)
-            build_args+=("-c.publish.releaseType=$RELEASE_TYPE")
-            build_args+=("-c.publish.channel=$RELEASE_CHANNEL")
-          fi
+          build_args=(-- --publish never --linux --x64)
+          build_args+=("-c.publish.releaseType=$RELEASE_TYPE")
+          build_args+=("-c.publish.channel=$RELEASE_CHANNEL")
+          npm run build:desktop "${build_args[@]}"
 
-          npm run build --workspace="$DESKTOP_WORKSPACE" "${build_args[@]}"
+      - name: Upload desktop artifacts to release
+        if: env.SHOULD_PUBLISH == 'true' && env.IS_SMOKE_TAG != 'true'
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        shell: bash
+        run: |
+          set -euo pipefail
+          release_dir="${DESKTOP_PACKAGE_PATH}/release"
+          files=()
+          while IFS= read -r -d '' f; do
+            files+=("$f")
+          done < <(find "$release_dir" -maxdepth 1 -type f ! -name '*.yml' -print0 | sort -z)
+          if (( ${#files[@]} == 0 )); then
+            echo "::error::No release artifacts found in $release_dir"
+            exit 1
+          fi
+          gh release upload "$RELEASE_TAG" "${files[@]}" --clobber --repo "${{ github.repository }}"
+
+      - name: Upload manifest artifact
+        if: env.SHOULD_PUBLISH == 'true' && env.IS_SMOKE_TAG != 'true'
+        uses: actions/upload-artifact@v4
+        with:
+          name: linux-manifest
+          path: ${{ env.DESKTOP_PACKAGE_PATH }}/release/${{ env.RELEASE_CHANNEL }}-linux.yml
+          retention-days: 1
 
   publish-windows:
     needs: [create-release]
@@ -361,17 +329,6 @@ jobs:
           fs.writeFileSync(packageJsonPath, `${JSON.stringify(packageJson, null, 2)}\n`);
           NODE
 
-      - name: Build workspace dependencies
-        run: npm run build:workspace-deps --workspace=@getpaseo/app
-
-      - name: Build web app for desktop
-        shell: pwsh
-        run: |
-          $patchPath = (Get-Item "$env:GITHUB_WORKSPACE/scripts/metro-config-windows-loader-patch.cjs").FullName
-          $env:NODE_OPTIONS = "--require=$patchPath"
-          npx expo export --platform web
-        working-directory: packages/app
-
       - name: Build desktop release
         shell: bash
         env:
@@ -380,20 +337,40 @@ jobs:
           PASEO_DESKTOP_SMOKE: "1"
         run: |
           set -euo pipefail
-          publish_mode="never"
-          build_args=(-- --publish "$publish_mode" --win --x64)
-          if [[ "$SHOULD_PUBLISH" == "true" && "$IS_SMOKE_TAG" != "true" ]]; then
-            publish_mode="always"
-            build_args=(-- --publish "$publish_mode" --win --x64)
-            build_args+=("-c.publish.releaseType=$RELEASE_TYPE")
-            build_args+=("-c.publish.channel=$RELEASE_CHANNEL")
-          fi
+          build_args=(-- --publish never --win --x64 --arm64)
+          build_args+=("-c.publish.releaseType=$RELEASE_TYPE")
+          build_args+=("-c.publish.channel=$RELEASE_CHANNEL")
+          npm run build:desktop "${build_args[@]}"
 
-          npm run build --workspace="$DESKTOP_WORKSPACE" "${build_args[@]}"
+      - name: Upload desktop artifacts to release
+        if: env.SHOULD_PUBLISH == 'true' && env.IS_SMOKE_TAG != 'true'
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        shell: bash
+        run: |
+          set -euo pipefail
+          release_dir="${DESKTOP_PACKAGE_PATH}/release"
+          files=()
+          while IFS= read -r -d '' f; do
+            files+=("$f")
+          done < <(find "$release_dir" -maxdepth 1 -type f ! -name '*.yml' -print0 | sort -z)
+          if (( ${#files[@]} == 0 )); then
+            echo "::error::No release artifacts found in $release_dir"
+            exit 1
+          fi
+          gh release upload "$RELEASE_TAG" "${files[@]}" --clobber --repo "${{ github.repository }}"
+
+      - name: Upload manifest artifact
+        if: env.SHOULD_PUBLISH == 'true' && env.IS_SMOKE_TAG != 'true'
+        uses: actions/upload-artifact@v4
+        with:
+          name: windows-manifest
+          path: ${{ env.DESKTOP_PACKAGE_PATH }}/release/${{ env.RELEASE_CHANNEL }}.yml
+          retention-days: 1
 
   finalize-rollout:
-    needs: [publish-macos, finalize-mac-manifest, publish-linux, publish-windows]
-    if: ${{ always() && (needs.publish-macos.result == 'success' || needs.publish-macos.result == 'skipped') && (needs.finalize-mac-manifest.result == 'success' || needs.finalize-mac-manifest.result == 'skipped') && (needs.publish-linux.result == 'success' || needs.publish-linux.result == 'skipped') && (needs.publish-windows.result == 'success' || needs.publish-windows.result == 'skipped') && (github.event_name != 'workflow_dispatch' || github.event.inputs.publish != 'false') }}
+    needs: [publish-macos, publish-linux, publish-windows]
+    if: ${{ always() && (needs.publish-macos.result == 'success' || needs.publish-macos.result == 'skipped') && (needs.publish-linux.result == 'success' || needs.publish-linux.result == 'skipped') && (needs.publish-windows.result == 'success' || needs.publish-windows.result == 'skipped') && (github.event_name != 'workflow_dispatch' || github.event.inputs.publish != 'false') }}
     permissions:
       contents: write
     runs-on: ubuntu-latest
@@ -428,20 +405,58 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
-      - name: Stamp rollout metadata
+      - name: Download mac manifest artifacts
+        if: env.IS_SMOKE_TAG != 'true' && needs.publish-macos.result == 'success'
+        uses: actions/download-artifact@v4
+        with:
+          pattern: mac-manifest-*
+          path: release-manifests
+
+      - name: Download Linux manifest artifact
+        if: env.IS_SMOKE_TAG != 'true' && needs.publish-linux.result == 'success'
+        uses: actions/download-artifact@v4
+        with:
+          name: linux-manifest
+          path: release-manifests/linux-manifest
+
+      - name: Download Windows manifest artifact
+        if: env.IS_SMOKE_TAG != 'true' && needs.publish-windows.result == 'success'
+        uses: actions/download-artifact@v4
+        with:
+          name: windows-manifest
+          path: release-manifests/windows-manifest
+
+      - name: Assemble and upload stamped manifests
         if: env.IS_SMOKE_TAG != 'true'
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         shell: bash
         run: |
           set -euo pipefail
-          mkdir release-manifests
           cd release-manifests
-          gh release download "$RELEASE_TAG" --repo "${{ github.repository }}" --pattern "${RELEASE_CHANNEL}*.yml"
+          manifests_dir="$PWD/final"
+          mkdir -p "$manifests_dir"
+
+          if [[ "${{ needs.publish-macos.result }}" == "success" ]]; then
+            manifest_name="${RELEASE_CHANNEL}-mac.yml"
+            node ../scripts/merge-mac-manifest.mjs \
+              "mac-manifest-arm64/${manifest_name}" \
+              "mac-manifest-x64/${manifest_name}" \
+              "$manifests_dir/${manifest_name}"
+          fi
+
+          if [[ "${{ needs.publish-linux.result }}" == "success" ]]; then
+            cp "linux-manifest/${RELEASE_CHANNEL}-linux.yml" "$manifests_dir/"
+          fi
+
+          if [[ "${{ needs.publish-windows.result }}" == "success" ]]; then
+            cp "windows-manifest/${RELEASE_CHANNEL}.yml" "$manifests_dir/"
+          fi
+
           shopt -s nullglob
-          files=( ./*.yml )
+          files=( "$manifests_dir"/*.yml )
           if (( ${#files[@]} == 0 )); then
-            echo "::error::No manifests matched ${RELEASE_CHANNEL}*.yml on $RELEASE_TAG"
+            echo "::error::No manifest artifacts were available to publish"
             exit 1
           fi
           timestamp="$(date -u +"%Y-%m-%dT%H:%M:%S.000Z")"

.github/workflows/server-ci.yml

@@ -27,7 +27,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: "22"
           cache: "npm"
 
       - name: Fetch origin/main (worktree tests)

CHANGELOG.md

@@ -1,5 +1,71 @@
 # Changelog
 
+## 0.1.67 - 2026-05-03
+
+### Fixed
+
+- Archiving a worktree or workspace feels instant instead of waiting on the daemon, with automatic rollback if it fails.
+- The built-in daemon toggle in desktop settings now actually takes effect.
+- Desktop settings no longer reset on app launch after a legacy migration.
+- Desktop daemon startup failures now surface on the splash screen and respond to retry, instead of leaving the app silently stuck.
+- Internal LLM calls (branch names, commit messages, PR text) no longer leave behind ephemeral agent sessions in your provider history.
+
+## 0.1.66 - 2026-05-03
+
+### Fixed
+
+- Streaming markdown preserves trailing newlines so paragraph spacing stays correct while the agent is still typing.
+- Agent initialization failures surface within 30 seconds instead of 5 minutes.
+- Terminals reply to ANSI cursor-position queries, so tools that ask for cursor location no longer hang.
+
+## 0.1.65 - 2026-05-03
+
+### Added
+
+- **In-app browser** — open a real web browser in any workspace to test your app. ([#670](https://github.com/getpaseo/paseo/pull/670) by [@jasonkneen](https://github.com/jasonkneen))
+- Inline review comments in the git diff pane. Tap a line number to start a comment. ([#530](https://github.com/getpaseo/paseo/pull/530))
+- Sub-agent activity is now shown for Codex, OpenCode, and Claude. ([#672](https://github.com/getpaseo/paseo/pull/672), [#658](https://github.com/getpaseo/paseo/pull/658) by [@thisisryanswift](https://github.com/thisisryanswift))
+- Pull and push your branch in one step from the git actions menu in the changes pane.
+- Resume existing agent sessions with `paseo import --provider <name> <id>`. ([#632](https://github.com/getpaseo/paseo/pull/632))
+- Password authentication and SSL support for daemon connections. ([#635](https://github.com/getpaseo/paseo/pull/635))
+- Connect to a daemon via relay using a pairing offer URL from the CLI. ([#639](https://github.com/getpaseo/paseo/pull/639))
+- **Windows:** Native ARM64 builds are now available.
+- Bundled Paseo skills now refresh automatically on desktop app launch.
+
+### Improved
+
+- Codex streaming feels more responsive — message boundaries are preserved and output arrives sooner.
+- Terminal sessions run in a dedicated worker process for better stability.
+- New worktree branch names are derived from your prompt and attachments instead of a generic placeholder.
+- Review comment UI is cleaner and easier to scan.
+- The daemon's `/api/status` endpoint is now protected by password auth when one is configured.
+
+### Fixed
+
+- **Apple Silicon Mac:** The desktop update pipeline now publishes manifests atomically, closing a race that could install the Intel build on Apple Silicon Macs and cause 100%+ renderer CPU usage. Affected users will self-heal — electron-updater's Rosetta detection migrates back to arm64 on the next update poll. ([#555](https://github.com/getpaseo/paseo/issues/555))
+- **Linux:** `.deb` and `.rpm` packages now show as `Paseo` in the dock and process list instead of `Paseo.bin`. `--no-sandbox` is now scoped to AppImage only, matching VS Code's sandbox handling. ([#602](https://github.com/getpaseo/paseo/issues/602))
+- **Windows:** Git diff commands no longer break on paths with special characters. ([#629](https://github.com/getpaseo/paseo/pull/629))
+- Cursor CLI and other ACP custom providers launch reliably. ([#628](https://github.com/getpaseo/paseo/pull/628))
+- Daemon stays up when WebSocket clients disconnect mid-stream, and crashes now write a fatal log entry instead of disappearing silently. ([#613](https://github.com/getpaseo/paseo/pull/613) by [@yuruiz](https://github.com/yuruiz))
+- Long agent timelines reconnect cleanly over the relay instead of looping through disconnects while catching up. ([#657](https://github.com/getpaseo/paseo/pull/657) by [@fireblue](https://github.com/fireblue))
+- Agent timelines refresh with smaller catch-up requests when you reopen an agent.
+- Terminal snapshots flush reliably before clients reconnect.
+- Workspace reconnects avoid unnecessary refresh work when the focused workspace is already current.
+- Voice dictation keeps recording when the agent tab loses focus.
+- OpenCode mode picker now lists agents available in every mode. ([#606](https://github.com/getpaseo/paseo/pull/606) by [@thisisryanswift](https://github.com/thisisryanswift))
+- Codex plan approval panels no longer duplicate.
+- Imported agents display the correct title immediately.
+- OpenCode surfaces invalid mode/model errors instead of hanging.
+- Archived worktrees stay hidden without flashing back into the list. ([#640](https://github.com/getpaseo/paseo/pull/640))
+- Web dropdown menus no longer resize unexpectedly.
+- The visible changes pane keeps in sync with the working tree diff.
+- Tool detail rows on the timeline are selectable again.
+- `paseo.json` parse errors in setup, teardown, and terminal actions now surface a clear error instead of failing silently.
+- Diff gutter line numbers were shifted one row out of alignment in some cases on web.
+- Streamed agent output reconciles cleanly when the timeline hydrates mid-turn. ([#663](https://github.com/getpaseo/paseo/pull/663))
+- Images in assistant messages show a loading spinner while they load and an "Image unavailable" fallback if they fail, instead of a blank space.
+- Isolated bottom sheet modals close and re-open without getting stuck.
+
 ## 0.1.64 - 2026-04-28
 
 ### Added
@@ -189,7 +255,7 @@
 
 ### Added
 
-- Provider profiles — define custom providers in your Paseo config that appear alongside built-ins. Override a built-in's binary, env, or models, or create entirely new providers. See the [configuration guide](https://github.com/getpaseo/paseo/blob/main/docs/CUSTOM-PROVIDERS.md).
+- Provider profiles — define custom providers in your Paseo config that appear alongside built-ins. Override a built-in's binary, env, or models, or create entirely new providers. See the [configuration guide](https://github.com/getpaseo/paseo/blob/main/docs/custom-providers.md).
 - ACP agent support — add any ACP-compatible agent to Paseo with `extends: "acp"` in your provider config. No code changes needed.
 - Choose provider and model when creating scheduled agents.
 - Max reasoning effort option for Opus 4.6 models.

CLAUDE.md

@@ -19,14 +19,14 @@ This is an npm workspace monorepo:
 
 | Doc                                                  | What's in it                                                                      |
 | ---------------------------------------------------- | --------------------------------------------------------------------------------- |
-| [docs/ARCHITECTURE.md](docs/ARCHITECTURE.md)         | System design, package layering, WebSocket protocol, agent lifecycle, data flow   |
-| [docs/CODING_STANDARDS.md](docs/CODING_STANDARDS.md) | Type hygiene, error handling, state design, React patterns, file organization     |
-| [docs/TESTING.md](docs/TESTING.md)                   | TDD workflow, determinism, real dependencies over mocks, test organization        |
-| [docs/DEVELOPMENT.md](docs/DEVELOPMENT.md)           | Dev server, build sync gotchas, CLI reference, agent state, Playwright MCP        |
-| [docs/RELEASE.md](docs/RELEASE.md)                   | Release playbook, draft releases, completion checklist                            |
-| [docs/CUSTOM-PROVIDERS.md](docs/CUSTOM-PROVIDERS.md) | Custom provider config: Z.AI, Alibaba/Qwen, ACP agents, profiles, custom binaries |
-| [docs/ANDROID.md](docs/ANDROID.md)                   | App variants, local/cloud builds, EAS workflows                                   |
-| [docs/DESIGN.md](docs/DESIGN.md)                     | How to design features before implementation                                      |
+| [docs/architecture.md](docs/architecture.md)         | System design, package layering, WebSocket protocol, agent lifecycle, data flow   |
+| [docs/coding-standards.md](docs/coding-standards.md) | Type hygiene, error handling, state design, React patterns, file organization     |
+| [docs/testing.md](docs/testing.md)                   | TDD workflow, determinism, real dependencies over mocks, test organization        |
+| [docs/development.md](docs/development.md)           | Dev server, build sync gotchas, CLI reference, agent state, Playwright MCP        |
+| [docs/release.md](docs/release.md)                   | Release playbook, draft releases, completion checklist                            |
+| [docs/custom-providers.md](docs/custom-providers.md) | Custom provider config: Z.AI, Alibaba/Qwen, ACP agents, profiles, custom binaries |
+| [docs/android.md](docs/android.md)                   | App variants, local/cloud builds, EAS workflows                                   |
+| [docs/design.md](docs/design.md)                     | How to design features before implementation                                      |
 | [SECURITY.md](SECURITY.md)                           | Relay threat model, E2E encryption, DNS rebinding, agent auth                     |
 
 ## Quick start
@@ -41,7 +41,7 @@ npm run format                       # Auto-format with Biome
 npm run format:check                 # Check formatting without writing
 ```
 
-See [docs/DEVELOPMENT.md](docs/DEVELOPMENT.md) for full setup, build sync requirements, and debugging.
+See [docs/development.md](docs/development.md) for full setup, build sync requirements, and debugging.
 
 ## Critical rules
 
@@ -55,6 +55,9 @@ See [docs/DEVELOPMENT.md](docs/DEVELOPMENT.md) for full setup, build sync requir
   - Never re-run a test suite that another agent already ran and reported green — trust the result.
   - For full suite verification, push to CI and check GitHub Actions instead.
 - **Always run typecheck and lint after every change.**
+- **Build workspace packages before diagnosing cross-package type errors.** This repo consumes generated declarations across workspaces. If typecheck fails in a package that depends on another workspace (especially CLI depending on server/daemon types), rebuild the owning package first so `dist` declarations are current:
+  - `npm run build:daemon` — rebuild highlight, relay, server, and CLI when daemon/server/CLI types may be stale.
+  - Do not patch inferred callback parameters or add local duplicate types just to silence stale declaration errors.
 - **Run `npm run format` before committing.** This repo uses Biome for formatting. Do not manually fix formatting — let the formatter handle it.
 - **Always use npm scripts for linting and formatting.** Do not run tools directly with `npx eslint`, `npx oxfmt`, `npx oxlint`, or package-local binaries. For targeted checks, pass file paths through the npm script:
   - `npm run lint -- packages/app/src/components/message.tsx`
@@ -100,6 +103,14 @@ The app runs on iOS, Android, web (browser), and web (Electron desktop). Code is
     use-audio-recorder.native.ts ← uses expo-audio
   ```
   Import as `@/hooks/use-audio-recorder` — Metro picks the right file automatically.
+- **Use `.electron.ts` / `.electron.tsx` for Electron-only web modules.** Electron is still the Metro `web` platform, but desktop dev/build sets `PASEO_WEB_PLATFORM=electron`, so Metro first looks for `.electron.*` files and falls back to normal `.web.*` files. Use this when the implementation depends on Electron-only behavior such as `webviewTag`, desktop preload APIs, or the Electron bridge. Keep plain browser web in `.web.*`, and keep native fallbacks in the base file or `.native.*`.
+  ```
+  components/
+    browser-pane.electron.tsx ← Electron <webview> implementation
+    browser-pane.web.tsx      ← plain web fallback
+    browser-pane.tsx          ← native fallback
+  ```
+  Import as `@/components/browser-pane` — Electron desktop gets the `.electron.tsx` file, browser web gets `.web.tsx`, and native gets the native/base implementation.
 - **NEVER use raw DOM APIs without `isWeb` guard.** DOM APIs crash native. Casting a RN ref to `HTMLElement` is a red flag — ensure the block is web-only.
 - **NEVER use `onPointerEnter`/`onPointerLeave`.** They don't fire on native iOS.
 - **Hover only works on web.** React Native's `onHoverIn`/`onHoverOut` on `Pressable` does NOT fire on native iOS/iPad — the underlying W3C pointer events are behind disabled experimental flags. For hover-to-show UI (kebab menus, action buttons), use `isHovered || isNative || isCompact` so the controls are always visible on native and hover-to-show on web.

CONTRIBUTING.md

@@ -27,10 +27,10 @@ If you want to propose a direction change, start a conversation.
 Please read these first:
 
 - [README.md](README.md)
-- [docs/ARCHITECTURE.md](docs/ARCHITECTURE.md)
-- [docs/DEVELOPMENT.md](docs/DEVELOPMENT.md)
-- [docs/CODING_STANDARDS.md](docs/CODING_STANDARDS.md)
-- [docs/TESTING.md](docs/TESTING.md)
+- [docs/architecture.md](docs/architecture.md)
+- [docs/development.md](docs/development.md)
+- [docs/coding-standards.md](docs/coding-standards.md)
+- [docs/testing.md](docs/testing.md)
 - [CLAUDE.md](CLAUDE.md)
 
 ## What is most helpful
@@ -105,7 +105,7 @@ npm run dev:website
 npm run cli -- ls -a -g
 ```
 
-Read [docs/DEVELOPMENT.md](docs/DEVELOPMENT.md) for build-sync gotchas, local state, ports, and daemon details.
+Read [docs/development.md](docs/development.md) for build-sync gotchas, local state, ports, and daemon details.
 
 ## Multi-platform testing
 
@@ -132,7 +132,7 @@ If you touch protocol or shared client/server behavior, read the compatibility n
 
 Paseo has explicit standards. Follow them.
 
-The full guide lives in [docs/CODING_STANDARDS.md](docs/CODING_STANDARDS.md).
+The full guide lives in [docs/coding-standards.md](docs/coding-standards.md).
 
 ## PR checklist
 

README.md

@@ -146,7 +146,11 @@ npm run typecheck
 
 <p align="center">
   <a href="https://star-history.com/#getpaseo/paseo&Date">
-    <img src="https://api.star-history.com/svg?repos=getpaseo/paseo&type=Date" alt="Star history chart for getpaseo/paseo" width="100%">
+    <picture>
+      <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=getpaseo/paseo&type=Date&theme=dark">
+      <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=getpaseo/paseo&type=Date">
+      <img src="https://api.star-history.com/svg?repos=getpaseo/paseo&type=Date" alt="Star history chart for getpaseo/paseo" width="600" style="max-width: 100%;">
+    </picture>
   </a>
 </p>
 

docs/ATTACHMENT_BASED_REVIEW_CONTEXT_PLAN.md

@@ -1,158 +0,0 @@
-# Attachment-Based Review Context Plan
-
-## Goal
-
-Use structured attachments as the source of truth for review context during agent creation.
-
-This covers two related behaviors:
-
-1. Provider-facing context for the agent prompt
-2. Worktree checkout behavior when creating a worktree from a review item
-
-The design should stay compatible with future forge support such as GitLab.
-
-## Core Direction
-
-- Do not parse the prompt to discover issue/PR intent.
-- Do not introduce deeply nested transport objects for this flow.
-- Make the attachment itself the discriminated union.
-- Keep forge-specific checkout logic below the attachment layer.
-- Let each agent provider translate attachments into its own prompt/input format.
-
-## Initial Attachment Types
-
-Two initial structured attachment types:
-
-- `github_pr`
-- `github_issue`
-
-With separate MIME types:
-
-- `application/github-pr`
-- `application/github-issue`
-
-Proposed wire shape:
-
-```ts
-type AgentAttachment =
-  | {
-      type: "github_pr";
-      mimeType: "application/github-pr";
-      number: number;
-      title: string;
-      url: string;
-      body?: string | null;
-      baseRefName?: string | null;
-      headRefName?: string | null;
-    }
-  | {
-      type: "github_issue";
-      mimeType: "application/github-issue";
-      number: number;
-      title: string;
-      url: string;
-      body?: string | null;
-    };
-```
-
-## Backward Compatibility
-
-- Add new optional `attachments` fields; keep existing `images` fields.
-- Unknown attachment discriminators must be dropped during schema normalization instead of failing the full request.
-- Malformed attachment entries should also be ignored safely.
-- Old clients continue working because `attachments` is optional.
-- New clients can send `attachments` without breaking older flows that still rely on `images`.
-
-## Request-Level Changes
-
-Add optional `attachments` to:
-
-- `create_agent_request`
-- `send_agent_message_request`
-
-Existing `initialPrompt` remains plain user text.
-
-The selected GitHub PR/issue becomes a structured attachment instead of being injected into prompt text as the primary source of truth.
-
-## App Responsibilities
-
-When the user selects a GitHub item:
-
-- If it is a PR, create a `github_pr` attachment
-- If it is an issue, create a `github_issue` attachment
-- Include the attachment in the create-agent request
-
-The UI can still render friendly labels and previews from the same data.
-
-The app should stop treating PR/issue context as prompt-only metadata.
-
-## Worktree Creation Behavior
-
-During agent creation, if worktree creation is requested:
-
-- Inspect normalized attachments
-- If a `github_pr` attachment is present, use it to drive checkout for the worktree
-
-The important rule:
-
-- attachment type identifies the review object
-- server-side git logic decides how to check it out
-
-This keeps the attachment contract simple while allowing fork-safe implementation details.
-
-## Checkout Resolution
-
-The attachment itself should not encode the full checkout strategy.
-
-Instead, the server should resolve checkout from the `github_pr` attachment using forge-aware logic.
-
-Examples of possible implementation strategies:
-
-- `gh pr checkout`
-- `git fetch origin refs/pull/<number>/head:<local-branch>`
-- another GitHub-aware resolver if needed later
-
-This is intentionally a server implementation detail, not part of the attachment schema.
-
-## Provider Responsibilities
-
-Each provider adapter should receive normalized attachments and decide how to represent them for the model.
-
-Examples:
-
-- Claude: render attachment into text blocks
-- Codex: inject as blocks or text
-- OpenCode: send as file/resource-like input where appropriate
-- ACP: convert to resource/text forms as supported
-
-The session layer should not hardcode one translation strategy for all providers.
-
-## Suggested Implementation Order
-
-1. Add tolerant attachment schema and normalization in shared/server message handling.
-2. Thread `attachments` through app -> daemon client -> session layer.
-3. Update create-agent UI flows to emit `github_pr` / `github_issue` attachments from GitHub selection.
-4. Teach worktree creation to inspect attachments and special-case `github_pr`.
-5. Update provider adapters to translate attachments into provider-specific prompt/input forms.
-6. Optionally migrate image transport into the same attachment mechanism later.
-
-## Files Likely Involved
-
-- `packages/server/src/shared/messages.ts`
-- `packages/server/src/client/daemon-client.ts`
-- `packages/server/src/server/session.ts`
-- `packages/server/src/server/worktree-session.ts`
-- `packages/server/src/server/agent/agent-sdk-types.ts`
-- `packages/server/src/server/agent/providers/claude-agent.ts`
-- `packages/server/src/server/agent/providers/codex-app-server-agent.ts`
-- `packages/server/src/server/agent/providers/opencode-agent.ts`
-- `packages/server/src/server/agent/providers/acp-agent.ts`
-- `packages/app/src/screens/new-workspace-screen.tsx`
-- `packages/app/src/screens/agent/draft-agent-screen.tsx`
-- `packages/app/src/contexts/session-context.tsx`
-
-## Notes
-
-- The current image path can remain in place initially.
-- The plan intentionally keeps checkout concerns separate from provider prompt translation.
-- Future forge support should add new attachment discriminators rather than expanding GitHub-only nested fields.

docs/architecture.md

@@ -137,6 +137,21 @@ Terminal I/O and agent streaming share the same connection via `BinaryMuxFrame`:
 - Channel 1: terminal data
 - 1-byte channel ID + 1-byte flags + variable payload
 
+### Compatibility rules
+
+- WebSocket schemas are append-only. Add fields, do not remove fields, and never make optional fields required.
+- New wire enum values must be gated at serialization with `session.supports(CLIENT_CAPS.someCapability)`.
+- `Session` stores client capabilities from the `hello` handshake and rehydrates them on reconnect, so the wire boundary can ask one question: `session.supports(...)`.
+
+Example: adding a new enum value
+
+```ts
+// 1. Add CLIENT_CAPS.newThing = "new_thing"
+// 2. Let new clients advertise it in WS hello
+// 3. Keep the shared producer schema strict
+// 4. Gate the new emitted value: session.supports(CLIENT_CAPS.newThing) ? "new_value" : "old_value"
+```
+
 ## Agent lifecycle
 
 ```

docs/design-system.md

@@ -1,4 +1,4 @@
-# DESIGN-SYSTEM.md
+# Design system
 
 Tokens — every color, font size, weight, spacing step, radius, icon size — live in `packages/app/src/styles/theme.ts`.
 

docs/design.md

@@ -17,7 +17,7 @@ Before designing anything new, understand what exists:
 
 - Where does similar functionality live?
 - What patterns does the codebase already use?
-- What layers exist? (See [ARCHITECTURE.md](./ARCHITECTURE.md))
+- What layers exist? (See [architecture.md](./architecture.md))
 - What types and data shapes are already defined?
 
 New features rarely mean only new code. Usually they require modifying existing interfaces, extending existing types, or refactoring to accommodate the new functionality. Identify what needs to change, not just what needs to be added.
@@ -38,7 +38,7 @@ If you can't define verification, you don't understand the feature well enough y
 
 - What types are needed?
 - Use discriminated unions — make impossible states impossible
-- One canonical type per concept (see [CODING_STANDARDS.md](./CODING_STANDARDS.md))
+- One canonical type per concept (see [coding-standards.md](./coding-standards.md))
 
 ### Layers
 

docs/mobile-testing.md

@@ -261,4 +261,4 @@ xcrun simctl ui booted appearance dark     # set dark
 xcrun simctl ui booted appearance light    # set light
 ```
 
-Expo dev server logs are in the tmux pane running `npm run dev`. Daemon logs are at `$PASEO_HOME/daemon.log` (see [DEVELOPMENT.md](DEVELOPMENT.md)).
+Expo dev server logs are in the tmux pane running `npm run dev`. Daemon logs are at `$PASEO_HOME/daemon.log` (see [development.md](development.md)).

docs/plan-approval-normalization.md

@@ -1,68 +0,0 @@
-# Plan Approval Normalization
-
-## Goal
-
-Normalize plan approval across providers so the UI renders one consistent plan approval card and action row, while each provider keeps its own execution quirks behind the session permission interface.
-
-## Compatibility Constraints
-
-- Older clients must remain compatible with newer daemons.
-- All new wire fields must be optional.
-- Existing plan permissions without action metadata must still render and work.
-- Existing question permissions must keep their current behavior.
-
-## Design
-
-### Shared abstraction
-
-Add optional permission action definitions to the shared permission request/response types.
-
-- Permission requests may include `actions`.
-- Permission responses may include `selectedActionId`.
-- `kind: "plan"` remains the normalized concept for plan approval.
-- The UI renders actions from the permission request instead of hardcoding provider-specific buttons.
-
-### Claude
-
-Keep Claude's plan permission flow, but enrich it with explicit action definitions.
-
-- Always expose `Reject`.
-- Always expose `Implement`.
-- If the agent entered plan mode from a more permissive mode like `bypassPermissions`, also expose `Implement with <previous mode>`.
-- Resolve the selected action entirely inside `respondToPermission()`.
-
-### Codex
-
-Synthesize a normalized `kind: "plan"` permission after a Codex plan-mode turn completes with a plan result.
-
-- Emit a plan permission with `Reject` and `Implement` actions.
-- On `Implement`, disable `plan_mode`, disable `fast_mode`, and automatically start a follow-up implementation turn.
-- On `Reject`, resolve without starting a follow-up turn.
-- Keep the implementation prompt and state transitions inside the Codex provider.
-
-### Manager and state sync
-
-After permission resolution, refresh provider-derived state so the UI sees internal mode/feature changes without knowing provider quirks.
-
-- Refresh current mode
-- Refresh pending permissions
-- Refresh runtime info
-- Refresh features
-- Persist refreshed state
-
-### UI
-
-Render plan permissions through the existing plan card, but generate buttons from normalized permission actions.
-
-- If `actions` are absent, fall back to legacy buttons.
-- Plan cards should use `Implement` as the default primary label.
-- Do not add provider-specific rendering branches.
-
-## Verification
-
-1. Shared schema/type tests for optional `actions` and `selectedActionId`
-2. App tests for generic plan-action rendering
-3. Claude tests for third action when resuming from a more permissive mode
-4. Codex tests for synthetic plan approval and automatic implementation follow-up
-5. Manager tests for post-permission state refresh
-6. `npm run typecheck`

docs/release.md

@@ -61,10 +61,17 @@ Use the beta path when you need to:
 
 ## Staged rollout (stable channel)
 
-Stable desktop releases go out via a linear time-based rollout: 0% admitted at publish, 100% admitted 24 hours later, linear ramp in between. Beta releases bypass the rollout entirely — beta users always receive updates immediately.
+Stable desktop releases go out via a linear time-based rollout: 0% admitted when the updater manifests appear, 100% admitted 24 hours later, linear ramp in between. Beta releases bypass the rollout entirely — beta users always receive updates immediately.
 
 The rollout is driven by a `rolloutHours` field stamped into the GitHub Release manifests (`latest-mac.yml`, `latest-linux.yml`, `latest.yml`) by the `finalize-rollout` job in `desktop-release.yml`.
 
+Desktop release builds now publish in two phases:
+
+- Platform build jobs upload the installers/packages (`.dmg`, `.zip`, `.exe`, `.AppImage`, etc.) to the GitHub release.
+- The final job merges/stamps the manifests and uploads all `.yml` files only after they already contain the final `releaseDate` and `rolloutHours`.
+
+Updater clients only discover a release through those `.yml` manifests, so there is no silent 100% admission window before rollout metadata is present.
+
 ### Default behavior
 
 `npm run release:patch` → tag push → 24h ramp. No extra action needed.
@@ -85,7 +92,7 @@ gh workflow run desktop-rollout.yml \
   -f rollout_hours=0
 ```
 
-**Why this is gap-free:** `desktop-release.yml`'s `finalize-rollout` job and `desktop-rollout.yml` share the concurrency group `desktop-rollout-<tag>`. Dispatching `desktop-rollout.yml` while the tag-push pipeline is still running queues it safely behind `finalize-rollout`. The release manifest goes from `rolloutHours=24` to `rolloutHours=0` within ~30s of publish, and the renderer polls every 30 minutes — so no stable user can admit during the gap.
+**Why this is gap-free:** `desktop-release.yml`'s `finalize-rollout` job and `desktop-rollout.yml` share the concurrency group `desktop-rollout-<tag>`. Dispatching `desktop-rollout.yml` while the tag-push pipeline is still running queues it safely behind `finalize-rollout`. The first public manifests already carry `rolloutHours=24`, then `desktop-rollout.yml` flips them to `rolloutHours=0` shortly afterward. The renderer polls every 30 minutes, so active stable users pick up the new manifest on their next check.
 
 Run the dispatch right after `release:patch` returns. Don't wait for the tag-push CI to finish.
 
@@ -221,6 +228,8 @@ The changelog is shown on the Paseo homepage. Write it for **end users**, not de
 - **Never mention component names, internal modules, or implementation details.** No `WorkingIndicator`, no `accumulatedUsage`, no `reconcileAndEmitWorkspaceUpdates`.
 - **Collapse internal iterations.** If a feature was added and then fixed within the same release, just list the feature as working. Users never saw the broken version.
 - **Only list changes relative to the previous stable release.** The diff is `v(previous)..HEAD`. If something was introduced and fixed between those two tags, it never shipped — don't mention the fix.
+  - **Common trap:** when drafting from `git log`, every commit looks like a separate bullet — including the "fix X" commits that landed on top of a brand-new feature in the same release window. Before listing a Fixed entry, check whether the thing being fixed was itself added in this same release. If so, drop the fix and fold it into the feature bullet.
+  - **Example:** if the release adds an in-app browser and also contains a commit "fix: browser pane keyboard handling no longer steals shortcuts", do **not** list the keyboard fix under Fixed. The browser is shipping for the first time, so users will only ever see the working version. The Added entry covers it.
 - **Cut low-signal entries.** "Toolbar buttons have consistent sizing" is too granular. Combine small polish items or drop them.
 
 ## Changelog conciseness
@@ -250,7 +259,17 @@ Rules:
 - **One bullet = one user-facing change**, regardless of how many PRs went into it. Group related PRs on the same bullet.
 - **De-duplicate contributors.** If the same person authored multiple PRs in one bullet, list them once.
 - **Only credit external contributors.** Skip attribution for [@boudra](https://github.com/boudra). The changelog credits community contributions — core team work is the default.
-- **Use `git log` to find PR numbers and authors.** PR numbers are typically in the commit message as `(#N)`. Use `gh pr view N --json author` if the commit doesn't include the GitHub username.
+- **Credit the commit author, not the PR opener.** A maintainer often opens a PR that lands work authored by someone else (cherry-pick, rebase of a contributor's branch, manual extraction from a stacked PR). The squash commit preserves the original commit's author, but `gh pr view N --json author` returns the PR opener — using that field will silently mis-credit the work to the maintainer (and then the "skip @boudra" rule drops the attribution entirely). Always resolve attribution from commit authors.
+
+  Use this command to get the GitHub logins for each PR:
+
+  ```bash
+  gh pr view N --json commits --jq '[.commits[].authors[].login] | unique | .[]'
+  ```
+
+  This returns every distinct GitHub login that authored or co-authored a commit in the PR. Use those logins for attribution. Fall back to `gh pr view N --json author` only if the commits command returns nothing (which should not happen for merged PRs).
+
+  When listing PR numbers, `git log --format='%H %s' v<previous>..HEAD | grep -E '\(#[0-9]+\)$'` pulls the PR number out of squash commit subjects.
 
 ## Changelog ordering
 

nix/package.nix

@@ -42,7 +42,7 @@ buildNpmPackage rec {
 
   # To update: run `nix build` with lib.fakeHash, copy the `got:` hash.
   # CI auto-updates this when package-lock.json changes (see .github/workflows/).
-  npmDepsHash = "sha256-BEZxYUs3aqHTToxljhmDdDkw7udMDOLBwyPK08JA9w8=";
+  npmDepsHash = "sha256-Pjfl4RV+2keXdYWMPonsPkwPAbVNSgczmwSeQRwNSu4=";
 
   # Prevent onnxruntime-node's install script from running during automatic
   # npm rebuild (it tries to download from api.nuget.org, which fails in the sandbox).

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "paseo",
-  "version": "0.1.64",
+  "version": "0.1.67",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "paseo",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "hasInstallScript": true,
       "license": "AGPL-3.0-or-later",
       "workspaces": [
@@ -23,6 +23,7 @@
         "@types/ws": "^8.5.14",
         "@typescript/native-preview": "7.0.0-dev.20260423.1",
         "concurrently": "^9.2.1",
+        "cross-env": "^10.1.0",
         "get-port-cli": "^3.0.0",
         "js-yaml": "^4.1.1",
         "knip": "^5.82.1",
@@ -16691,6 +16692,15 @@
         "node": ">=10.0.0"
       }
     },
+    "node_modules/bcryptjs": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/bcryptjs/-/bcryptjs-3.0.3.tgz",
+      "integrity": "sha512-GlF5wPWnSa/X5LKM1o0wz0suXIINz1iHRLvTS+sLyi7XPbe5ycmYI3DlZqVGZZtDgl4DmasFg7gOB3JYbphV5g==",
+      "license": "BSD-3-Clause",
+      "bin": {
+        "bcrypt": "bin/bcrypt"
+      }
+    },
     "node_modules/better-opn": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/better-opn/-/better-opn-3.0.2.tgz",
@@ -24751,6 +24761,12 @@
         "node": ">=6"
       }
     },
+    "node_modules/github-slugger": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/github-slugger/-/github-slugger-2.0.0.tgz",
+      "integrity": "sha512-IaOQ9puYtjrkq7Y0Ygl9KDZnrf/aiUJYUpVf89y8kyaxbRG7Y1SrX/jaumrv81vc61+kiMempujsM3Yw7w5qcw==",
+      "license": "ISC"
+    },
     "node_modules/glob": {
       "version": "10.5.0",
       "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
@@ -25192,6 +25208,32 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/hast-util-heading-rank": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/hast-util-heading-rank/-/hast-util-heading-rank-3.0.0.tgz",
+      "integrity": "sha512-EJKb8oMUXVHcWZTDepnr+WNbfnXKFNf9duMesmr4S8SXTJBJ9M4Yok08pu9vxdJwdlGRhVumk9mEhkEvKGifwA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/hast-util-is-element": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/hast-util-is-element/-/hast-util-is-element-3.0.0.tgz",
+      "integrity": "sha512-Val9mnv2IWpLbNPqc/pUem+a7Ipj2aHacCwgNfTiK0vJKl0LF+4Ba4+v1oPHFpf3bLYmreq0/l3Gud9S5OH42g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/hast-util-to-jsx-runtime": {
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/hast-util-to-jsx-runtime/-/hast-util-to-jsx-runtime-2.3.6.tgz",
@@ -25219,6 +25261,19 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/hast-util-to-string": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/hast-util-to-string/-/hast-util-to-string-3.0.1.tgz",
+      "integrity": "sha512-XelQVTDWvqcl3axRfI0xSeoVKzyIFPwsAGSLIsKdJKQMXDYJS4WYrBNF/8J7RdhIcFI2BOHgAifggsvsxp/3+A==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/hast-util-whitespace": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/hast-util-whitespace/-/hast-util-whitespace-3.0.0.tgz",
@@ -33566,6 +33621,41 @@
         "regjsparser": "bin/parser"
       }
     },
+    "node_modules/rehype-autolink-headings": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/rehype-autolink-headings/-/rehype-autolink-headings-7.1.0.tgz",
+      "integrity": "sha512-rItO/pSdvnvsP4QRB1pmPiNHUskikqtPojZKJPPPAVx9Hj8i8TwMBhofrrAYRhYOOBZH9tgmG5lPqDLuIWPWmw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@ungap/structured-clone": "^1.0.0",
+        "hast-util-heading-rank": "^3.0.0",
+        "hast-util-is-element": "^3.0.0",
+        "unified": "^11.0.0",
+        "unist-util-visit": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/rehype-slug": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/rehype-slug/-/rehype-slug-6.0.0.tgz",
+      "integrity": "sha512-lWyvf/jwu+oS5+hL5eClVd3hNdmwM1kAC0BUvEGD19pajQMIzcNUd/k9GsfQ+FfECvX+JE+e9/btsKH0EjJT6A==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "github-slugger": "^2.0.0",
+        "hast-util-heading-rank": "^3.0.0",
+        "hast-util-to-string": "^3.0.0",
+        "unist-util-visit": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/remark-parse": {
       "version": "11.0.0",
       "resolved": "https://registry.npmjs.org/remark-parse/-/remark-parse-11.0.0.tgz",
@@ -38355,7 +38445,7 @@
     },
     "packages/app": {
       "name": "@getpaseo/app",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "dependencies": {
         "@dnd-kit/core": "^6.3.1",
         "@dnd-kit/sortable": "^10.0.0",
@@ -38481,10 +38571,10 @@
     },
     "packages/cli": {
       "name": "@getpaseo/cli",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "dependencies": {
         "@clack/prompts": "^1.0.0",
-        "@getpaseo/server": "0.1.64",
+        "@getpaseo/server": "0.1.67",
         "chalk": "^5.3.0",
         "commander": "^12.0.0",
         "mime-types": "^2.1.35",
@@ -38526,7 +38616,7 @@
     },
     "packages/desktop": {
       "name": "@getpaseo/desktop",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "license": "AGPL-3.0-or-later",
       "dependencies": {
         "@getpaseo/cli": "*",
@@ -38575,7 +38665,7 @@
     },
     "packages/expo-two-way-audio": {
       "name": "@getpaseo/expo-two-way-audio",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "license": "MIT",
       "devDependencies": {
         "@types/react": "^18.0.25",
@@ -38611,7 +38701,7 @@
     },
     "packages/highlight": {
       "name": "@getpaseo/highlight",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "dependencies": {
         "@lezer/common": "^1.5.0",
         "@lezer/cpp": "^1.1.5",
@@ -38637,7 +38727,7 @@
     },
     "packages/relay": {
       "name": "@getpaseo/relay",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "dependencies": {
         "base64-js": "^1.5.1",
         "tweetnacl": "^1.0.3",
@@ -38652,12 +38742,12 @@
     },
     "packages/server": {
       "name": "@getpaseo/server",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "dependencies": {
         "@agentclientprotocol/sdk": "^0.17.1",
         "@anthropic-ai/claude-agent-sdk": "^0.2.11",
-        "@getpaseo/highlight": "0.1.64",
-        "@getpaseo/relay": "0.1.64",
+        "@getpaseo/highlight": "0.1.67",
+        "@getpaseo/relay": "0.1.67",
         "@isaacs/ttlcache": "^2.1.4",
         "@mariozechner/pi-agent-core": "^0.70.2",
         "@mariozechner/pi-ai": "^0.70.2",
@@ -38668,9 +38758,11 @@
         "@xterm/headless": "^6.0.0",
         "ai": "5.0.78",
         "ajv": "^8.17.1",
+        "bcryptjs": "^3.0.3",
         "dotenv": "^17.2.3",
         "express": "^4.18.2",
         "fast-deep-equal": "^3.1.3",
+        "mnemonic-id": "^3.2.7",
         "node-pty": "1.2.0-beta.11",
         "onnxruntime-node": "^1.23.0",
         "openai": "^4.20.0",
@@ -39108,7 +39200,7 @@
     },
     "packages/website": {
       "name": "@getpaseo/website",
-      "version": "0.1.64",
+      "version": "0.1.67",
       "dependencies": {
         "@cloudflare/vite-plugin": "^1.20.3",
         "@cloudflare/workers-types": "^4.20260114.0",
@@ -39119,6 +39211,8 @@
         "react": "^19.1.4",
         "react-dom": "^19.1.4",
         "react-markdown": "^10.1.0",
+        "rehype-autolink-headings": "^7.1.0",
+        "rehype-slug": "^6.0.0",
         "wrangler": "^4.59.1"
       },
       "devDependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "paseo",
-  "version": "0.1.64",
+  "version": "0.1.67",
   "private": true,
   "description": "Paseo: voice-controlled development environment with OpenAI Realtime API",
   "keywords": [
@@ -63,7 +63,7 @@
     "web": "npm run web --workspace=@getpaseo/app",
     "dev:desktop": "npm run dev --workspace=@getpaseo/desktop",
     "dev:win:desktop": "npm run dev:win --workspace=@getpaseo/desktop",
-    "build:desktop": "npm run version:sync-internal && npm run build:web --workspace=@getpaseo/app && npm run build --workspace=@getpaseo/desktop",
+    "build:desktop": "npm run build:workspace-deps --workspace=@getpaseo/app && cd packages/app && cross-env PASEO_WEB_PLATFORM=electron npx expo export --platform web && cd ../.. && npm run build --workspace=@getpaseo/desktop --",
     "db:query": "npm run db:query --workspace=@getpaseo/server --",
     "cli": "npx tsx packages/cli/src/index.js",
     "version": "npm run version:sync-internal && npm run release:prepare && git add -A",
@@ -94,6 +94,7 @@
     "@types/ws": "^8.5.14",
     "@typescript/native-preview": "7.0.0-dev.20260423.1",
     "concurrently": "^9.2.1",
+    "cross-env": "^10.1.0",
     "get-port-cli": "^3.0.0",
     "js-yaml": "^4.1.1",
     "knip": "^5.82.1",

packages/app/.eas/workflows/release-mobile.yml

@@ -5,6 +5,7 @@ on:
     tags:
       - "v*"
       - "!v*-rc.*"
+      - "!v*-beta.*"
   workflow_dispatch: {}
 
 jobs:
@@ -42,11 +43,10 @@ jobs:
     name: Submit iOS for App Store review
     needs: [submit_ios]
     environment: production
+    runs_on: macos-medium
     steps:
       - uses: eas/checkout
       - name: Install fastlane
-        working_directory: ./packages/app
         run: bundle install
       - name: Submit for review
-        working_directory: ./packages/app
         run: bundle exec fastlane ios submit_review

packages/app/e2e/codex-plan-approval.spec.ts

@@ -0,0 +1,61 @@
+import { expect, test } from "./fixtures";
+import { buildHostWorkspaceRoute } from "@/utils/host-routes";
+import { allowPermission, waitForPermissionPrompt } from "./helpers/app";
+import { connectTerminalClient } from "./helpers/terminal-perf";
+import { createTempGitRepo } from "./helpers/workspace";
+
+function getServerId(): string {
+  const serverId = process.env.E2E_SERVER_ID;
+  if (!serverId) {
+    throw new Error("E2E_SERVER_ID is not set.");
+  }
+  return serverId;
+}
+
+test.describe("Codex plan approval", () => {
+  test("shows a single actionable plan panel and removes it after implementation starts", async ({
+    page,
+  }) => {
+    test.setTimeout(180_000);
+
+    const repo = await createTempGitRepo("codex-plan-approval-");
+    const client = await connectTerminalClient();
+
+    try {
+      const workspaceResult = await client.openProject(repo.path);
+      if (!workspaceResult.workspace) {
+        throw new Error(workspaceResult.error ?? `Failed to open project ${repo.path}`);
+      }
+
+      const agent = await client.createAgent({
+        provider: "mock",
+        cwd: repo.path,
+        title: "Codex plan approval e2e",
+        modeId: "load-test",
+        model: "ten-second-stream",
+        initialPrompt: "Emit synthetic plan approval.",
+      });
+
+      const agentUrl = `${buildHostWorkspaceRoute(
+        getServerId(),
+        repo.path,
+      )}?open=${encodeURIComponent(`agent:${agent.id}`)}`;
+      await page.goto(agentUrl);
+
+      await waitForPermissionPrompt(page, 120_000);
+
+      await expect(page.getByTestId("permission-plan-card")).toHaveCount(1);
+      await expect(page.getByTestId("timeline-plan-card")).toHaveCount(0);
+
+      await allowPermission(page);
+
+      await expect(page.getByTestId("permission-plan-card")).toHaveCount(0, {
+        timeout: 30_000,
+      });
+      await expect(page.getByTestId("timeline-plan-card")).toHaveCount(0);
+    } finally {
+      await client.close();
+      await repo.cleanup();
+    }
+  });
+});

packages/app/e2e/global-setup.ts

@@ -585,6 +585,7 @@ function startDaemon(args: DaemonSpawnArgs): ChildProcess {
       PASEO_CORS_ORIGINS: `http://localhost:${args.metroPort}`,
       PASEO_DICTATION_ENABLED: openAiUsable ? "1" : "0",
       PASEO_VOICE_MODE_ENABLED: openAiUsable ? "1" : "0",
+      PASEO_NODE_ENV: "development",
       ...(openAiUsable
         ? {
             PASEO_DICTATION_STT_PROVIDER: "openai",

packages/app/e2e/helpers/startup-dsl.ts

@@ -140,7 +140,6 @@ class StartupAssertions {
 
   async expectsReconnectWelcome(): Promise<this> {
     await expect(this.page.getByTestId("welcome-screen")).toBeVisible({ timeout: 15_000 });
-    await expect(this.page.getByText("Connecting…", { exact: true })).toBeVisible();
     await expect(this.page.getByTestId("welcome-open-settings")).toBeVisible();
     await expect(this.page.getByTestId("welcome-direct-connection")).toBeVisible();
     await expect(this.page.getByTestId("welcome-paste-pairing-link")).toBeVisible();

packages/app/e2e/helpers/terminal-perf.ts

@@ -24,6 +24,10 @@ export interface TerminalPerfDaemonClient {
     cwd: string;
     title?: string;
     modeId?: string;
+    model?: string;
+    thinkingOptionId?: string;
+    featureValues?: Record<string, unknown>;
+    initialPrompt?: string;
   }): Promise<{ id: string; status: string }>;
   sendAgentMessage(agentId: string, text: string): Promise<void>;
   subscribeTerminal(

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

@@ -59,6 +59,35 @@ test.describe("Settings sidebar navigation", () => {
     await expect(page.getByRole("button", { name: "Paste pairing link" })).toBeVisible();
   });
 
+  test("direct connection advanced URI round-trips SSL and password into the form", async ({
+    page,
+  }) => {
+    await gotoAppShell(page);
+    await openSettings(page);
+
+    await page.getByTestId("settings-add-host").click();
+    await page.getByRole("button", { name: "Direct connection" }).click();
+
+    await page.getByTestId("direct-host-advanced-toggle").click();
+    await page
+      .getByTestId("direct-host-uri-input")
+      .fill("tcp://example.paseo.test:7443?ssl=true&password=shared-secret");
+    await page.getByTestId("direct-host-advanced-toggle").click();
+
+    await expect(page.getByTestId("direct-host-input")).toHaveValue("example.paseo.test");
+    await expect(page.getByTestId("direct-port-input")).toHaveValue("7443");
+    await expect(page.getByTestId("direct-ssl-toggle-checked")).toBeVisible();
+    await expect(page.getByTestId("direct-password-input")).toHaveValue("shared-secret");
+    await expect(page.getByTestId("direct-host-uri-input")).toHaveCount(0);
+
+    await page.getByTestId("direct-host-advanced-toggle").click();
+    await expect(page.getByTestId("direct-host-uri-input")).toHaveValue(
+      "tcp://example.paseo.test:7443?ssl=true&password=shared-secret",
+    );
+    await page.getByTestId("direct-host-advanced-toggle").click();
+    await expect(page.getByTestId("direct-host-uri-input")).toHaveCount(0);
+  });
+
   test("sidebar shows a Back to workspace row that leaves /settings", async ({ page }) => {
     await gotoAppShell(page);
     await openSettings(page);

packages/app/e2e/terminal-keystroke-stress.spec.ts

@@ -68,6 +68,22 @@ terminalPerfDescribe("Terminal keystroke stress", () => {
     expect(appBaselineReport.outputFramePayloadBytes).toBeGreaterThanOrEqual(INPUT_TEXT.length);
     expect(appBaselineReport.keydownToXtermCommitMs?.count ?? 0).toBeGreaterThan(0);
 
+    const appObserveNodeBurstReport = await measureAppObservingNodeBurstEcho({
+      page,
+      harness,
+      terminalName: "app-observe-node-burst",
+    });
+    await attachJson(testInfo, "app-observe-node-burst", appObserveNodeBurstReport);
+    console.log(
+      "[terminal-stress-app-observe-node-burst]",
+      JSON.stringify(appObserveNodeBurstReport),
+    );
+
+    expect(appObserveNodeBurstReport.outputFramePayloadBytes).toBeGreaterThanOrEqual(
+      INPUT_TEXT.length,
+    );
+    expect(appObserveNodeBurstReport.xtermWriteCount).toBeGreaterThan(0);
+
     const appSmallChunksReport = await measureAppBurstEcho({
       page,
       harness,
@@ -172,6 +188,34 @@ async function measureAppBurstEcho(input: {
   }
 }
 
+async function measureAppObservingNodeBurstEcho(input: {
+  page: Page;
+  harness: TerminalE2EHarness;
+  terminalName: string;
+}) {
+  const appTerminal = await input.harness.createTerminal({ name: input.terminalName });
+  try {
+    await input.harness.openTerminal(input.page, { terminalId: appTerminal.id });
+    await input.harness.setupPrompt(input.page);
+
+    await resetTerminalKeystrokeStressProbe(input.page);
+
+    for (const char of INPUT_TEXT) {
+      input.harness.client.sendTerminalInput(appTerminal.id, {
+        type: "input",
+        data: char,
+      });
+    }
+
+    await waitForAppStressEcho(input.page, INPUT_TEXT);
+    await waitForAppProbePayload(input.page, INPUT_TEXT.length);
+
+    return readTerminalKeystrokeStressReport(input.page, INPUT_TEXT);
+  } finally {
+    await input.harness.killTerminal(appTerminal.id);
+  }
+}
+
 async function emitRapidAgentStreamUpdates(
   harness: TerminalE2EHarness,
   input: { agentId: string; count: number },

packages/app/e2e/workspace-navigation-regression.spec.ts

@@ -1,5 +1,6 @@
-import { buildHostWorkspaceRoute } from "@/utils/host-routes";
-import { expect, test } from "./fixtures";
+import { buildHostAgentDetailRoute, buildHostWorkspaceRoute } from "@/utils/host-routes";
+import type { WebSocketRoute } from "@playwright/test";
+import { expect, test, type Page } from "./fixtures";
 import { gotoAppShell } from "./helpers/app";
 import {
   archiveAgentFromDaemon,
@@ -27,9 +28,213 @@ import {
   waitForSidebarHydration,
 } from "./helpers/workspace-ui";
 
+const LOADING_WORKSPACE_TEXT_PATTERN = /Loading workspace/i;
+
+function escapeRegex(value: string): string {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+
+async function expectNoLoadingWorkspacePane(
+  page: Page,
+  input: { label: string; durationMs?: number },
+): Promise<void> {
+  const durationMs = input.durationMs ?? 2000;
+  const startedAt = Date.now();
+  const samples: string[] = [];
+
+  while (Date.now() - startedAt < durationMs) {
+    const url = page.url();
+    const text = await page
+      .locator("body")
+      .innerText({ timeout: 250 })
+      .catch((error) => `[body unavailable: ${error instanceof Error ? error.message : error}]`);
+    samples.push(`${Date.now() - startedAt}ms ${url}\n${text.slice(0, 1000)}`);
+
+    if (LOADING_WORKSPACE_TEXT_PATTERN.test(text)) {
+      throw new Error(
+        `${input.label}: loading workspace pane appeared during reconnect window.\n\n${samples.join(
+          "\n\n---\n\n",
+        )}`,
+      );
+    }
+
+    await page.waitForTimeout(100);
+  }
+}
+
+async function installDaemonWebSocketGate(page: Page, daemonPort: string) {
+  let acceptingConnections = true;
+  const activeSockets = new Set<WebSocketRoute>();
+
+  await page.routeWebSocket(new RegExp(`:${escapeRegex(daemonPort)}\\b`), (ws) => {
+    if (!acceptingConnections) {
+      void ws.close({ code: 1008, reason: "Blocked by workspace reconnect regression test." });
+      return;
+    }
+
+    activeSockets.add(ws);
+    const server = ws.connectToServer();
+
+    ws.onMessage((message) => {
+      if (!acceptingConnections) {
+        return;
+      }
+      try {
+        server.send(message);
+      } catch {
+        activeSockets.delete(ws);
+      }
+    });
+
+    server.onMessage((message) => {
+      if (!acceptingConnections) {
+        return;
+      }
+      try {
+        ws.send(message);
+      } catch {
+        activeSockets.delete(ws);
+      }
+    });
+  });
+
+  return {
+    async drop(): Promise<void> {
+      acceptingConnections = false;
+      const sockets = Array.from(activeSockets);
+      activeSockets.clear();
+      await Promise.all(
+        sockets.map((ws) =>
+          ws
+            .close({ code: 1008, reason: "Dropped by workspace reconnect regression test." })
+            .catch(() => undefined),
+        ),
+      );
+    },
+    restore(): void {
+      acceptingConnections = true;
+    },
+  };
+}
+
 test.describe("Workspace navigation regression", () => {
   test.describe.configure({ timeout: 240_000 });
 
+  test("keeps the workspace rendered while reconnecting to the host", async ({ page }) => {
+    const serverId = process.env.E2E_SERVER_ID;
+    const daemonPort = process.env.E2E_DAEMON_PORT;
+    if (!serverId) {
+      throw new Error("E2E_SERVER_ID is not set.");
+    }
+    if (!daemonPort) {
+      throw new Error("E2E_DAEMON_PORT is not set.");
+    }
+
+    const daemonGate = await installDaemonWebSocketGate(page, daemonPort);
+
+    const workspaceClient = await connectNewWorkspaceDaemonClient();
+    const archiveClient = await connectArchiveTabDaemonClient();
+    const workspaceIds = new Set<string>();
+    const agentIds: string[] = [];
+    const repo = await createTempGitRepo("workspace-reconnect-");
+
+    try {
+      const workspace = await openProjectViaDaemon(workspaceClient, repo.path);
+      workspaceIds.add(workspace.workspaceId);
+
+      const agent = await createIdleAgent(archiveClient, {
+        cwd: repo.path,
+        title: `workspace-reconnect-${Date.now()}`,
+      });
+      agentIds.push(agent.id);
+
+      await gotoAppShell(page);
+      await waitForSidebarHydration(page);
+      await page.goto(buildHostAgentDetailRoute(serverId, agent.id, agent.cwd));
+      await page.waitForURL(
+        (url) => url.pathname.includes("/workspace/") && !url.searchParams.has("open"),
+        { timeout: 60_000 },
+      );
+      await expectWorkspaceHeader(page, {
+        title: workspace.workspaceName,
+        subtitle: workspace.projectDisplayName,
+      });
+      await expect(page.getByTestId("workspace-tabs-row")).toBeVisible({ timeout: 30_000 });
+      await expectWorkspaceTabVisible(page, agent.id);
+
+      await daemonGate.drop();
+      await expect(page.getByTestId("agent-reconnecting-toast")).toBeVisible({
+        timeout: 30_000,
+      });
+      await expectWorkspaceHeader(page, {
+        title: workspace.workspaceName,
+        subtitle: workspace.projectDisplayName,
+      });
+      await expect(page.getByTestId("workspace-tabs-row")).toBeVisible();
+      await expect(page.getByRole("textbox", { name: "Message agent..." })).toBeVisible();
+      await expect(page.getByText(LOADING_WORKSPACE_TEXT_PATTERN)).toHaveCount(0);
+
+      const monitorReconnect = expectNoLoadingWorkspacePane(page, {
+        label: "host reconnect",
+      });
+      daemonGate.restore();
+      await expect(page.getByTestId("agent-reconnecting-toast")).toHaveCount(0, {
+        timeout: 30_000,
+      });
+      await monitorReconnect;
+      await expectWorkspaceHeader(page, {
+        title: workspace.workspaceName,
+        subtitle: workspace.projectDisplayName,
+      });
+      await expect(page.getByTestId("workspace-tabs-row")).toBeVisible();
+      await expect(page.getByRole("textbox", { name: "Message agent..." })).toBeVisible();
+    } finally {
+      daemonGate.restore();
+      for (const agentId of agentIds) {
+        await archiveAgentFromDaemon(archiveClient, agentId).catch(() => undefined);
+      }
+      for (const workspaceId of workspaceIds) {
+        await archiveLocalWorkspaceFromDaemon(workspaceClient, workspaceId).catch(() => undefined);
+      }
+      await archiveClient.close().catch(() => undefined);
+      await workspaceClient.close().catch(() => undefined);
+      await repo.cleanup();
+    }
+  });
+
+  test("cold offline workspace route gates the screen interior but keeps settings reachable", async ({
+    page,
+  }) => {
+    const serverId = process.env.E2E_SERVER_ID;
+    const daemonPort = process.env.E2E_DAEMON_PORT;
+    if (!serverId) {
+      throw new Error("E2E_SERVER_ID is not set.");
+    }
+    if (!daemonPort) {
+      throw new Error("E2E_DAEMON_PORT is not set.");
+    }
+
+    await page.routeWebSocket(new RegExp(`:${escapeRegex(daemonPort)}\\b`), async (ws) => {
+      await ws.close({ code: 1008, reason: "Blocked cold offline workspace route test." });
+    });
+
+    await page.goto(
+      `/h/${encodeURIComponent(serverId)}/workspace/${encodeURIComponent("/tmp/paseo-missing-workspace")}`,
+    );
+
+    await expect(
+      page.getByText(/^Connecting$|localhost is offline|Cannot reach localhost/i),
+    ).toBeVisible({ timeout: 30_000 });
+    await expect(page.getByTestId("menu-button")).toBeVisible();
+    await expect(page.getByTestId("workspace-header-title")).toHaveCount(0);
+    await expect(page.getByTestId("workspace-tabs-row")).toHaveCount(0);
+
+    const settingsButton = page.locator('[data-testid="sidebar-settings"]:visible').first();
+    await expect(settingsButton).toBeVisible({ timeout: 30_000 });
+    await settingsButton.click();
+    await expect(page).toHaveURL(/\/settings\/general$/);
+  });
+
   test("sidebar navigation and reload keep workspace selection and tabs aligned", async ({
     page,
   }) => {

packages/app/e2e/workspace-setup-streaming.spec.ts

@@ -1,7 +1,6 @@
 import { test, expect } from "./fixtures";
 import { createTempGitRepo } from "./helpers/workspace";
 import { waitForWorkspaceTabsVisible } from "./helpers/workspace-tabs";
-import { waitForTerminalContent } from "./helpers/terminal-perf";
 import {
   connectWorkspaceSetupClient,
   createWorkspaceThroughDaemon,
@@ -279,7 +278,7 @@ test.describe("Workspace setup streaming", () => {
       await page.getByTestId("workspace-scripts-button").click();
       await expect(page.getByTestId("workspace-scripts-menu")).toBeVisible({ timeout: 10_000 });
       await page.getByTestId("workspace-scripts-start-web").click();
-      await page.keyboard.press("Escape");
+      await page.getByTestId("workspace-scripts-menu-backdrop").click();
 
       const terminalTab = page.locator('[data-testid^="workspace-tab-terminal_"]').first();
       await expect(terminalTab).toBeVisible({ timeout: 30_000 });
@@ -300,9 +299,7 @@ test.describe("Workspace setup streaming", () => {
 
       await terminalSurface.click();
 
-      // Verify the terminal output contains "listening on" via xterm buffer API.
-      // The .xterm-rows CSS selector is fragile; reading the buffer directly is reliable.
-      await waitForTerminalContent(page, (text) => text.includes("listening on"), 60_000);
+      await expect(terminalTab).toContainText("web");
     } finally {
       await client.close();
       await repo.cleanup();

packages/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getpaseo/app",
-  "version": "0.1.64",
+  "version": "0.1.67",
   "private": true,
   "main": "index.ts",
   "scripts": {

packages/app/src/app/_layout.tsx

@@ -26,7 +26,7 @@ import { Gesture, GestureDetector, GestureHandlerRootView } from "react-native-g
 import { KeyboardProvider } from "react-native-keyboard-controller";
 import { Extrapolation, interpolate, runOnJS, useSharedValue } from "react-native-reanimated";
 import { SafeAreaProvider } from "react-native-safe-area-context";
-import { UnistylesRuntime, useUnistyles } from "react-native-unistyles";
+import { StyleSheet, UnistylesRuntime, useUnistyles } from "react-native-unistyles";
 import { CommandCenter } from "@/components/command-center";
 import { WorktreeSetupCalloutSource } from "@/components/worktree-setup-callout-source";
 import { DownloadToast } from "@/components/download-toast";
@@ -50,16 +50,18 @@ import {
 import { SidebarCalloutProvider } from "@/contexts/sidebar-callout-context";
 import { ToastProvider } from "@/contexts/toast-context";
 import { VoiceProvider } from "@/contexts/voice-context";
-import { startHostRuntimeBootstrap } from "@/app/host-runtime-bootstrap";
+import { startDaemonIfGateAllows, startHostRuntimeBootstrap } from "@/app/host-runtime-bootstrap";
 import { shouldUseDesktopDaemon } from "@/desktop/daemon/desktop-daemon";
 import { listenToDesktopEvent } from "@/desktop/electron/events";
 import { updateDesktopWindowControls } from "@/desktop/electron/window";
 import { getDesktopHost } from "@/desktop/host";
+import { loadDesktopSettings } from "@/desktop/settings/desktop-settings";
+import { RosettaCalloutSource } from "@/desktop/updates/rosetta-callout-source";
 import { UpdateCalloutSource } from "@/desktop/updates/update-callout-source";
 import { useActiveWorktreeNewAction } from "@/hooks/use-active-worktree-new-action";
-import { useColorScheme } from "@/hooks/use-color-scheme";
 import { useFaviconStatus } from "@/hooks/use-favicon-status";
 import { useKeyboardShortcuts } from "@/hooks/use-keyboard-shortcuts";
+import { useLatchedBoolean } from "@/hooks/use-latched-boolean";
 import { useOpenProject } from "@/hooks/use-open-project";
 import { useAppSettings } from "@/hooks/use-settings";
 import { useStableEvent } from "@/hooks/use-stable-event";
@@ -311,6 +313,14 @@ function useDaemonStartIsRunning(): boolean {
 
 const STARTUP_GIVE_UP_TIMEOUT_MS = 5_000;
 
+async function shouldStartBuiltInDaemon(): Promise<boolean> {
+  if (!shouldUseDesktopDaemon()) {
+    return false;
+  }
+  const settings = await loadDesktopSettings();
+  return settings.daemon.manageBuiltInDaemon;
+}
+
 function HostRuntimeBootstrapProvider({ children }: { children: ReactNode }) {
   useEffect(() => {
     const store = getHostRuntimeStore();
@@ -318,7 +328,8 @@ function HostRuntimeBootstrapProvider({ children }: { children: ReactNode }) {
     startHostRuntimeBootstrap({
       store,
       daemonStartService,
-      shouldStartDaemon: shouldUseDesktopDaemon(),
+      shouldStartDaemon: shouldStartBuiltInDaemon,
+      onGateError: (message) => daemonStartService.recordError(message),
     });
   }, []);
 
@@ -345,12 +356,18 @@ function HostRuntimeBootstrapProvider({ children }: { children: ReactNode }) {
   }, [anyOnlineHostServerId, daemonStartError, daemonStartIsRunning, hasGivenUpWaitingForHost]);
 
   const retry = useCallback(() => {
-    void getDaemonStartService({ store: getHostRuntimeStore() }).start();
+    const daemonStartService = getDaemonStartService({ store: getHostRuntimeStore() });
+    startDaemonIfGateAllows({
+      daemonStartService,
+      shouldStartDaemon: shouldStartBuiltInDaemon,
+      onGateError: (message) => daemonStartService.recordError(message),
+    });
   }, []);
 
   const splashError = !anyOnlineHostServerId ? daemonStartError : null;
-  const storeReady =
+  const isCurrentlyStoreReady =
     Boolean(anyOnlineHostServerId) || Boolean(splashError) || hasGivenUpWaitingForHost;
+  const storeReady = useLatchedBoolean(isCurrentlyStoreReady);
 
   const state = useMemo<HostRuntimeBootstrapState>(
     () => ({ splashError, retry, hasGivenUpWaitingForHost, storeReady }),
@@ -392,7 +409,6 @@ function AppContainer({
   selectedAgentId,
   chromeEnabled: chromeEnabledOverride,
 }: AppContainerProps) {
-  const { theme } = useUnistyles();
   const daemons = useHosts();
   const { settings, updateSettings } = useAppSettings();
   const toggleMobileAgentList = usePanelStore((state) => state.toggleMobileAgentList);
@@ -449,13 +465,8 @@ function AppContainer({
 
   useActiveWorktreeNewAction();
 
-  const containerStyle = useMemo(
-    () => ({ flex: 1 as const, backgroundColor: theme.colors.surface0 }),
-    [theme.colors.surface0],
-  );
-
   const content = (
-    <View style={containerStyle}>
+    <View style={layoutStyles.surfaceFill}>
       <View style={rowStyle}>
         {!isCompactLayout && chromeEnabled && !isFocusModeEnabled && (
           <LeftSidebar selectedAgentId={selectedAgentId} />
@@ -464,6 +475,7 @@ function AppContainer({
       </View>
       {isCompactLayout && chromeEnabled && <LeftSidebar selectedAgentId={selectedAgentId} />}
       <DownloadToast />
+      <RosettaCalloutSource />
       <UpdateCalloutSource />
       <WorktreeSetupCalloutSource />
       <CommandCenter />
@@ -592,9 +604,6 @@ function MobileGestureWrapper({
 function ProvidersWrapper({ children }: { children: ReactNode }) {
   const { settings, isLoading: settingsLoading } = useAppSettings();
   const { upsertConnectionFromOfferUrl } = useHostMutations();
-  const systemColorScheme = useColorScheme();
-  const { theme } = useUnistyles();
-  const resolvedTheme = settings.theme === "auto" ? (systemColorScheme ?? "light") : settings.theme;
 
   // Apply theme setting on mount and when it changes
   useEffect(() => {
@@ -607,21 +616,9 @@ function ProvidersWrapper({ children }: { children: ReactNode }) {
     }
   }, [settingsLoading, settings.theme]);
 
-  useEffect(() => {
-    if (settingsLoading || isNative) {
-      return;
-    }
-
-    void updateDesktopWindowControls({
-      backgroundColor: theme.colors.surface0,
-      foregroundColor: theme.colors.foreground,
-    }).catch((error) => {
-      console.warn("[DesktopWindow] Failed to update window controls overlay", error);
-    });
-  }, [settingsLoading, resolvedTheme, theme.colors.foreground, theme.colors.surface0]);
-
   return (
     <VoiceProvider>
+      <DesktopWindowControlsSync enabled={!settingsLoading} />
       <OfferLinkListener upsertDaemonFromOfferUrl={upsertConnectionFromOfferUrl} />
       <HostSessionManager />
       <FaviconStatusSync />
@@ -630,6 +627,24 @@ function ProvidersWrapper({ children }: { children: ReactNode }) {
   );
 }
 
+function DesktopWindowControlsSync({ enabled }: { enabled: boolean }) {
+  const { theme } = useUnistyles();
+  const surface0 = theme.colors.surface0;
+  const foreground = theme.colors.foreground;
+
+  useEffect(() => {
+    if (!enabled || isNative) return;
+    void updateDesktopWindowControls({
+      backgroundColor: surface0,
+      foregroundColor: foreground,
+    }).catch((error) => {
+      console.warn("[DesktopWindow] Failed to update window controls overlay", error);
+    });
+  }, [enabled, surface0, foreground]);
+
+  return null;
+}
+
 function OfferLinkListener({
   upsertDaemonFromOfferUrl,
 }: {
@@ -909,20 +924,23 @@ function RootProviders({ children }: { children: ReactNode }) {
 }
 
 export default function RootLayout() {
-  const { theme } = useUnistyles();
-  const gestureRootStyle = useMemo(
-    () => ({ flex: 1, backgroundColor: theme.colors.surface0 }),
-    [theme.colors.surface0],
-  );
-
   return (
-    <GestureHandlerRootView style={gestureRootStyle}>
-      <NavigationActiveWorkspaceObserver />
-      <RootProviders>
-        <RuntimeProviders>
-          <AppShell />
-        </RuntimeProviders>
-      </RootProviders>
+    <GestureHandlerRootView style={flexStyle}>
+      <View style={layoutStyles.surfaceFill}>
+        <NavigationActiveWorkspaceObserver />
+        <RootProviders>
+          <RuntimeProviders>
+            <AppShell />
+          </RuntimeProviders>
+        </RootProviders>
+      </View>
     </GestureHandlerRootView>
   );
 }
+
+const layoutStyles = StyleSheet.create((theme) => ({
+  surfaceFill: {
+    flex: 1,
+    backgroundColor: theme.colors.surface0,
+  },
+}));

packages/app/src/app/host-runtime-bootstrap.test.ts

@@ -55,6 +55,42 @@ describe("startHostRuntimeBootstrap", () => {
     expect(daemonStartService.start).not.toHaveBeenCalled();
   });
 
+  it("skips daemon-start when the startup gate resolves false", async () => {
+    const store = createFakeStore();
+    const daemonStartService = createFakeDaemonStartService();
+
+    startHostRuntimeBootstrap({
+      store,
+      daemonStartService,
+      shouldStartDaemon: async () => false,
+    });
+    await Promise.resolve();
+
+    expect(store.boot).toHaveBeenCalledTimes(1);
+    expect(daemonStartService.start).not.toHaveBeenCalled();
+  });
+
+  it("surfaces gate rejection to onGateError without starting the daemon", async () => {
+    const store = createFakeStore();
+    const daemonStartService = createFakeDaemonStartService();
+    const onGateError = vi.fn();
+
+    startHostRuntimeBootstrap({
+      store,
+      daemonStartService,
+      shouldStartDaemon: async () => {
+        throw new Error("settings file unreadable");
+      },
+      onGateError,
+    });
+    await vi.waitFor(() => {
+      expect(onGateError).toHaveBeenCalledTimes(1);
+    });
+
+    expect(daemonStartService.start).not.toHaveBeenCalled();
+    expect(onGateError).toHaveBeenCalledWith(expect.stringContaining("settings file unreadable"));
+  });
+
   it("does not await the daemon-start promise", () => {
     const store = createFakeStore();
     let resolveStart: ((value: { ok: true }) => void) | undefined;

packages/app/src/app/host-runtime-bootstrap.ts

@@ -11,17 +11,49 @@ export interface HostRuntimeBootstrapDaemonStartService {
   start: () => Promise<DaemonStartResult>;
 }
 
+type HostRuntimeBootstrapStartGate = boolean | (() => boolean | Promise<boolean>);
+
 export interface StartHostRuntimeBootstrapInput {
   store: HostRuntimeBootstrapStore;
   daemonStartService: HostRuntimeBootstrapDaemonStartService;
-  shouldStartDaemon: boolean;
+  shouldStartDaemon: HostRuntimeBootstrapStartGate;
+  onGateError?: (message: string) => void;
 }
 
 export function startHostRuntimeBootstrap(input: StartHostRuntimeBootstrapInput): void {
   input.store.boot();
-  if (input.shouldStartDaemon) {
-    void input.daemonStartService.start();
+  startDaemonIfGateAllows({
+    daemonStartService: input.daemonStartService,
+    shouldStartDaemon: input.shouldStartDaemon,
+    onGateError: input.onGateError,
+  });
+}
+
+export function startDaemonIfGateAllows(input: {
+  daemonStartService: HostRuntimeBootstrapDaemonStartService;
+  shouldStartDaemon: HostRuntimeBootstrapStartGate;
+  onGateError?: (message: string) => void;
+}): void {
+  const gate = input.shouldStartDaemon;
+  if (typeof gate === "boolean") {
+    if (gate) {
+      void input.daemonStartService.start();
+    }
+    return;
   }
+
+  void Promise.resolve()
+    .then(() => gate())
+    .then((shouldStartDaemon) => {
+      if (shouldStartDaemon) {
+        void input.daemonStartService.start();
+      }
+      return null;
+    })
+    .catch((error) => {
+      const message = error instanceof Error ? error.message : String(error);
+      input.onGateError?.(`Failed to evaluate desktop daemon settings: ${message}`);
+    });
 }
 
 export const WELCOME_ROUTE: Href = "/welcome";

packages/app/src/attachments/composer-workspace-attachments.tsx

@@ -0,0 +1,337 @@
+import { useCallback, useEffect, useMemo, useState, type ReactElement } from "react";
+import { Text, View } from "react-native";
+import { StyleSheet, withUnistyles } from "react-native-unistyles";
+import { MessageSquareCode, MousePointer2 } from "lucide-react-native";
+import type {
+  ComposerAttachment,
+  UserComposerAttachment,
+  WorkspaceComposerAttachment,
+} from "@/attachments/types";
+import { AttachmentPill } from "@/components/attachment-pill";
+import { useWorkspaceAttachmentsStore } from "@/attachments/workspace-attachments-store";
+import { ICON_SIZE, type Theme } from "@/styles/theme";
+import type { AgentAttachment } from "@server/shared/messages";
+import { useClearReviewDraft } from "@/review/store";
+
+interface WorkspaceAttachmentBindingInput {
+  normalAttachments: UserComposerAttachment[];
+  workspaceAttachments: readonly WorkspaceComposerAttachment[];
+  onOpenWorkspaceAttachment?: (attachment: WorkspaceComposerAttachment) => void;
+}
+
+interface RemoveWorkspaceAttachmentInput {
+  selectedAttachments: readonly ComposerAttachment[];
+  index: number;
+}
+
+interface OpenWorkspaceAttachmentInput {
+  attachment: ComposerAttachment;
+}
+
+interface CompleteSubmitInput {
+  result: "noop" | "queued" | "submitted" | "failed";
+  outgoingAttachments: readonly ComposerAttachment[];
+}
+
+interface ComposerWorkspaceAttachmentBinding {
+  selectedAttachments: ComposerAttachment[];
+  buildOutgoingAttachments: (normalAttachments: UserComposerAttachment[]) => ComposerAttachment[];
+  removeAttachment: (input: RemoveWorkspaceAttachmentInput) => boolean;
+  openAttachment: (input: OpenWorkspaceAttachmentInput) => boolean;
+  clearSentAttachments: (attachments: readonly ComposerAttachment[]) => void;
+  completeSubmit: (input: CompleteSubmitInput) => void;
+  resetSuppression: () => void;
+}
+
+function getAttachmentKey(attachment: WorkspaceComposerAttachment): string {
+  if (attachment.kind === "browser_element") {
+    return JSON.stringify({
+      type: "browser_element",
+      url: attachment.attachment.url,
+      selector: attachment.attachment.selector,
+      tag: attachment.attachment.tag,
+      text: attachment.attachment.text,
+      html: attachment.attachment.outerHTML,
+    });
+  }
+  return JSON.stringify({
+    type: "review",
+    cwd: attachment.attachment.cwd,
+    mode: attachment.attachment.mode,
+    baseRef: attachment.attachment.baseRef ?? null,
+    reviewDraftKey: attachment.reviewDraftKey,
+    comments: attachment.attachment.comments.map((comment) => ({
+      filePath: comment.filePath,
+      side: comment.side,
+      lineNumber: comment.lineNumber,
+      body: comment.body,
+    })),
+  });
+}
+
+function isWorkspaceAttachment(
+  attachment: ComposerAttachment | undefined,
+): attachment is WorkspaceComposerAttachment {
+  return attachment?.kind === "review" || attachment?.kind === "browser_element";
+}
+
+function userAttachmentsOnly(attachments: readonly ComposerAttachment[]): UserComposerAttachment[] {
+  return attachments.filter(
+    (attachment): attachment is UserComposerAttachment =>
+      attachment.kind !== "review" && attachment.kind !== "browser_element",
+  );
+}
+
+function toSubmitAttachment(attachment: ComposerAttachment): AgentAttachment | null {
+  if (attachment.kind === "browser_element") {
+    return {
+      type: "text",
+      mimeType: "text/plain",
+      title: `Browser element · ${attachment.attachment.tag}`,
+      text: attachment.attachment.formatted,
+    };
+  }
+  return attachment.kind === "review" ? attachment.attachment : null;
+}
+
+function renderPill(args: RenderWorkspaceAttachmentPillArgs): ReactElement {
+  return (
+    <WorkspaceAttachmentPill
+      key={`workspace:${getAttachmentKey(args.attachment)}`}
+      {...args}
+      attachment={args.attachment}
+    />
+  );
+}
+
+function useWorkspaceAttachmentBinding({
+  normalAttachments,
+  workspaceAttachments,
+  onOpenWorkspaceAttachment,
+}: WorkspaceAttachmentBindingInput): ComposerWorkspaceAttachmentBinding {
+  const clearReviewDraft = useClearReviewDraft();
+  const setWorkspaceAttachments = useWorkspaceAttachmentsStore(
+    (state) => state.setWorkspaceAttachments,
+  );
+  const [suppressedKeys, setSuppressedKeys] = useState<readonly string[]>([]);
+  const workspaceAttachmentKeys = useMemo(
+    () => workspaceAttachments.map(getAttachmentKey),
+    [workspaceAttachments],
+  );
+  const activeWorkspaceAttachments = useMemo(
+    () =>
+      workspaceAttachments.filter(
+        (attachment, index) => !suppressedKeys.includes(workspaceAttachmentKeys[index] ?? ""),
+      ),
+    [suppressedKeys, workspaceAttachmentKeys, workspaceAttachments],
+  );
+
+  const selectedAttachments = useMemo<ComposerAttachment[]>(
+    () =>
+      activeWorkspaceAttachments.length > 0
+        ? [...normalAttachments, ...activeWorkspaceAttachments]
+        : normalAttachments,
+    [activeWorkspaceAttachments, normalAttachments],
+  );
+
+  useEffect(() => {
+    setSuppressedKeys((current) => {
+      const next = current.filter((suppressedKey) =>
+        workspaceAttachmentKeys.includes(suppressedKey),
+      );
+      return next.length === current.length ? current : next;
+    });
+  }, [workspaceAttachmentKeys]);
+
+  const buildOutgoingAttachments = useCallback(
+    (attachments: UserComposerAttachment[]): ComposerAttachment[] =>
+      activeWorkspaceAttachments.length > 0
+        ? [...attachments, ...activeWorkspaceAttachments]
+        : attachments,
+    [activeWorkspaceAttachments],
+  );
+
+  const suppressWorkspaceAttachment = useCallback((attachment: WorkspaceComposerAttachment) => {
+    const key = getAttachmentKey(attachment);
+    setSuppressedKeys((current) => (current.includes(key) ? current : [...current, key]));
+  }, []);
+
+  const clearSentAttachments = useCallback(
+    (attachments: readonly ComposerAttachment[]) => {
+      for (const attachment of attachments) {
+        if (attachment.kind === "review") {
+          clearReviewDraft({ key: attachment.reviewDraftKey });
+        }
+      }
+    },
+    [clearReviewDraft],
+  );
+
+  const removeAttachment = useCallback(
+    ({ selectedAttachments: current, index }: RemoveWorkspaceAttachmentInput) => {
+      const selected = current[index];
+      if (isWorkspaceAttachment(selected)) {
+        if (selected.kind === "browser_element") {
+          const selectedKey = getAttachmentKey(selected);
+          const { attachmentsByScope } = useWorkspaceAttachmentsStore.getState();
+          for (const [scopeKey, attachments] of Object.entries(attachmentsByScope)) {
+            const nextAttachments = attachments.filter(
+              (attachment) => getAttachmentKey(attachment) !== selectedKey,
+            );
+            if (nextAttachments.length !== attachments.length) {
+              setWorkspaceAttachments({ scopeKey, attachments: nextAttachments });
+            }
+          }
+          return true;
+        }
+        suppressWorkspaceAttachment(selected);
+        return true;
+      }
+      return false;
+    },
+    [setWorkspaceAttachments, suppressWorkspaceAttachment],
+  );
+
+  const openAttachment = useCallback(
+    ({ attachment }: OpenWorkspaceAttachmentInput) => {
+      if (!isWorkspaceAttachment(attachment) || attachment.kind !== "review") {
+        return false;
+      }
+      onOpenWorkspaceAttachment?.(attachment);
+      return true;
+    },
+    [onOpenWorkspaceAttachment],
+  );
+
+  const resetSuppression = useCallback(() => {
+    setSuppressedKeys([]);
+  }, []);
+
+  const completeSubmit = useCallback(
+    ({ result, outgoingAttachments }: CompleteSubmitInput) => {
+      if (result === "submitted") {
+        clearSentAttachments(outgoingAttachments);
+      }
+      if (result === "queued" || result === "submitted") {
+        resetSuppression();
+      }
+    },
+    [clearSentAttachments, resetSuppression],
+  );
+
+  return {
+    selectedAttachments,
+    buildOutgoingAttachments,
+    removeAttachment,
+    openAttachment,
+    clearSentAttachments,
+    completeSubmit,
+    resetSuppression,
+  };
+}
+
+interface RenderWorkspaceAttachmentPillArgs {
+  attachment: WorkspaceComposerAttachment;
+  index: number;
+  disabled: boolean;
+  onOpen: (attachment: ComposerAttachment) => void;
+  onRemove: (index: number) => void;
+}
+
+interface WorkspaceAttachmentPillProps extends Omit<
+  RenderWorkspaceAttachmentPillArgs,
+  "attachment"
+> {
+  attachment: WorkspaceComposerAttachment;
+}
+
+function WorkspaceAttachmentPill({
+  attachment,
+  index,
+  disabled,
+  onOpen,
+  onRemove,
+}: WorkspaceAttachmentPillProps) {
+  let label: string;
+  if (attachment.kind === "browser_element") {
+    label = `Element · ${attachment.attachment.tag}`;
+  } else {
+    label =
+      attachment.commentCount === 1
+        ? "Review · 1 comment"
+        : `Review · ${attachment.commentCount} comments`;
+  }
+  const handleOpen = useCallback(() => {
+    onOpen(attachment);
+  }, [onOpen, attachment]);
+  const handleRemove = useCallback(() => {
+    onRemove(index);
+  }, [onRemove, index]);
+  return (
+    <AttachmentPill
+      testID="composer-review-attachment-pill"
+      onOpen={handleOpen}
+      onRemove={handleRemove}
+      openAccessibilityLabel={
+        attachment.kind === "browser_element"
+          ? "Open browser element attachment"
+          : "Open review attachment"
+      }
+      removeAccessibilityLabel={
+        attachment.kind === "browser_element"
+          ? "Remove browser element attachment"
+          : "Remove review attachment"
+      }
+      disabled={disabled}
+    >
+      <View style={styles.pillBody}>
+        <View style={styles.pillIcon}>
+          {attachment.kind === "browser_element" ? (
+            <ThemedMousePointer2 size={ICON_SIZE.sm} uniProps={iconForegroundMutedMapping} />
+          ) : (
+            <ThemedMessageSquareCode size={ICON_SIZE.sm} uniProps={iconForegroundMutedMapping} />
+          )}
+        </View>
+        <Text style={styles.pillText} numberOfLines={1}>
+          {label}
+        </Text>
+      </View>
+    </AttachmentPill>
+  );
+}
+
+export const composerWorkspaceAttachment = {
+  is: isWorkspaceAttachment,
+  renderPill,
+  toSubmitAttachment,
+  userAttachmentsOnly,
+  useBinding: useWorkspaceAttachmentBinding,
+};
+
+const styles = StyleSheet.create((theme: Theme) => ({
+  pillBody: {
+    minHeight: 48,
+    maxWidth: 260,
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[2],
+    paddingHorizontal: theme.spacing[3],
+    paddingVertical: theme.spacing[2],
+    backgroundColor: theme.colors.surface1,
+  },
+  pillIcon: {
+    width: 18,
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  pillText: {
+    minWidth: 0,
+    flexShrink: 1,
+    color: theme.colors.foreground,
+    fontSize: theme.fontSize.sm,
+  },
+})) as unknown as Record<string, object>;
+
+const ThemedMousePointer2 = withUnistyles(MousePointer2);
+const ThemedMessageSquareCode = withUnistyles(MessageSquareCode);
+const iconForegroundMutedMapping = (theme: Theme) => ({ color: theme.colors.foregroundMuted });

packages/app/src/attachments/local-file-attachment-store.test.ts

@@ -14,6 +14,21 @@ const fileSystemMock = vi.hoisted(() => ({
   readAsStringAsync: vi.fn(async () => "AAECAw=="),
   deleteAsync: vi.fn(async () => {}),
   readDirectoryAsync: vi.fn(async () => []),
+  fileWrite: vi.fn((_uri: string, _content: Uint8Array) => {}),
+}));
+
+vi.mock("expo-file-system", () => ({
+  File: class {
+    uri: string;
+
+    constructor(uri: string) {
+      this.uri = uri;
+    }
+
+    write(content: Uint8Array) {
+      fileSystemMock.fileWrite(this.uri, content);
+    }
+  },
 }));
 
 vi.mock("expo-file-system/legacy", () => ({
@@ -37,9 +52,10 @@ describe("local file attachment store", () => {
     fileSystemMock.readAsStringAsync.mockClear();
     fileSystemMock.deleteAsync.mockClear();
     fileSystemMock.readDirectoryAsync.mockClear();
+    fileSystemMock.fileWrite.mockClear();
   });
 
-  it("writes raw base64 sources directly to the managed file path", async () => {
+  it("writes raw byte sources directly to the managed file path", async () => {
     const store = createLocalFileAttachmentStore({
       storageType: "native-file",
       baseDirectoryName: "preview-assets",
@@ -50,14 +66,14 @@ describe("local file attachment store", () => {
       id: "preview_8_test",
       mimeType: "image/png",
       fileName: "result.png",
-      source: { kind: "base64", base64: "AAECAw==" },
+      source: { kind: "bytes", bytes: new Uint8Array([0, 1, 2, 3]) },
     });
 
-    expect(fileSystemMock.writeAsStringAsync).toHaveBeenCalledWith(
+    expect(fileSystemMock.fileWrite).toHaveBeenCalledWith(
       "file:///cache/preview-assets/preview_8_test.png",
-      "AAECAw==",
-      { encoding: "base64" },
+      new Uint8Array([0, 1, 2, 3]),
     );
+    expect(fileSystemMock.writeAsStringAsync).not.toHaveBeenCalled();
     expect(attachment).toMatchObject({
       id: "preview_8_test",
       mimeType: "image/png",

packages/app/src/attachments/local-file-attachment-store.ts

@@ -1,3 +1,4 @@
+import { File } from "expo-file-system";
 import * as FileSystem from "expo-file-system/legacy";
 import {
   type AttachmentStore,
@@ -6,7 +7,6 @@ import {
   type SaveAttachmentInput,
 } from "@/attachments/types";
 import {
-  blobToBase64,
   fileUriToPath,
   generateAttachmentId,
   getFileExtensionFromName,
@@ -45,6 +45,15 @@ async function ensureDirectory(uri: string): Promise<void> {
   await FileSystem.makeDirectoryAsync(uri, { intermediates: true });
 }
 
+async function dataUrlToBytes(dataUrl: string): Promise<Uint8Array> {
+  const response = await fetch(dataUrl);
+  return new Uint8Array(await response.arrayBuffer());
+}
+
+async function blobToBytes(blob: Blob): Promise<Uint8Array> {
+  return new Uint8Array(await blob.arrayBuffer());
+}
+
 async function writeFromSource(input: {
   source: SaveAttachmentInput["source"];
   targetUri: string;
@@ -59,30 +68,16 @@ async function writeFromSource(input: {
     return;
   }
 
+  let bytes: Uint8Array;
   if (input.source.kind === "data_url") {
-    const parsed = parseDataUrl(input.source.dataUrl);
-    const mimeType = normalizeMimeType(parsed.mimeType || input.mimeType);
-    const base64 = parsed.base64;
-    await FileSystem.writeAsStringAsync(input.targetUri, base64, {
-      encoding: FileSystem.EncodingType.Base64,
-    });
-    if (mimeType !== input.mimeType) {
-      return;
-    }
-    return;
+    bytes = await dataUrlToBytes(input.source.dataUrl);
+  } else if (input.source.kind === "blob") {
+    bytes = await blobToBytes(input.source.blob);
+  } else {
+    bytes = input.source.bytes;
   }
 
-  if (input.source.kind === "base64") {
-    await FileSystem.writeAsStringAsync(input.targetUri, input.source.base64, {
-      encoding: FileSystem.EncodingType.Base64,
-    });
-    return;
-  }
-
-  const base64 = await blobToBase64(input.source.blob);
-  await FileSystem.writeAsStringAsync(input.targetUri, base64, {
-    encoding: FileSystem.EncodingType.Base64,
-  });
+  new File(input.targetUri).write(bytes);
 }
 
 function attachmentUri(metadata: AttachmentMetadata): string {

packages/app/src/attachments/service.test.ts

@@ -1,7 +1,7 @@
 import { afterEach, describe, expect, it } from "vitest";
 import type { AttachmentMetadata, AttachmentStore, SaveAttachmentInput } from "@/attachments/types";
 import { __setAttachmentStoreForTests } from "./store";
-import { encodeAttachmentsForSend, persistAttachmentFromBase64 } from "./service";
+import { encodeAttachmentsForSend, persistAttachmentFromBytes } from "./service";
 
 function createAttachment(input: Partial<AttachmentMetadata> = {}): AttachmentMetadata {
   return {
@@ -54,19 +54,20 @@ describe("attachment service", () => {
     __setAttachmentStoreForTests(null);
   });
 
-  it("persists raw base64 without requiring a data URL wrapper", async () => {
+  it("persists raw bytes without requiring a base64 wrapper", async () => {
     const store = createRecordingStore();
     __setAttachmentStoreForTests(store);
+    const bytes = new Uint8Array([0, 1, 2, 3]);
 
-    const attachment = await persistAttachmentFromBase64({
-      id: "att_base64",
-      base64: "AAECAw==",
+    const attachment = await persistAttachmentFromBytes({
+      id: "att_bytes",
+      bytes,
       mimeType: "image/png",
       fileName: "image.png",
     });
 
     expect(attachment).toEqual({
-      id: "att_base64",
+      id: "att_bytes",
       mimeType: "image/png",
       storageType: "web-indexeddb",
       storageKey: "att_1",
@@ -76,10 +77,10 @@ describe("attachment service", () => {
     });
     expect(store.savedSources).toEqual([
       {
-        id: "att_base64",
+        id: "att_bytes",
         mimeType: "image/png",
         fileName: "image.png",
-        source: { kind: "base64", base64: "AAECAw==" },
+        source: { kind: "bytes", bytes },
       },
     ]);
   });

packages/app/src/attachments/service.ts

@@ -31,8 +31,8 @@ export async function persistAttachmentFromDataUrl(input: {
   });
 }
 
-export async function persistAttachmentFromBase64(input: {
-  base64: string;
+export async function persistAttachmentFromBytes(input: {
+  bytes: Uint8Array;
   mimeType?: string;
   fileName?: string | null;
   id?: string;
@@ -42,7 +42,7 @@ export async function persistAttachmentFromBase64(input: {
     id: input.id,
     mimeType: input.mimeType,
     fileName: input.fileName,
-    source: { kind: "base64", base64: input.base64 },
+    source: { kind: "bytes", bytes: input.bytes },
   });
 }
 

packages/app/src/attachments/types.ts

@@ -1,4 +1,4 @@
-import type { GitHubSearchItem } from "@server/shared/messages";
+import type { AgentAttachment, GitHubSearchItem } from "@server/shared/messages";
 
 export type AttachmentStorageType = "web-indexeddb" | "desktop-file" | "native-file";
 
@@ -17,13 +17,57 @@ export interface AttachmentMetadata {
   createdAt: number;
 }
 
+export interface BrowserElementAttachment {
+  url: string;
+  selector: string;
+  tag: string;
+  text: string;
+  outerHTML: string;
+  computedStyles: Record<string, string>;
+  boundingRect: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+  };
+  reactSource: {
+    fileName: string | null;
+    lineNumber: number | null;
+    columnNumber: number | null;
+    componentName: string | null;
+  } | null;
+  parentChain: string[];
+  children: string[];
+  formatted: string;
+}
+
 export type ComposerAttachment =
   | { kind: "image"; metadata: AttachmentMetadata }
   | { kind: "github_issue"; item: GitHubSearchItem }
-  | { kind: "github_pr"; item: GitHubSearchItem };
+  | { kind: "github_pr"; item: GitHubSearchItem }
+  | {
+      kind: "browser_element";
+      attachment: BrowserElementAttachment;
+    }
+  | {
+      kind: "review";
+      attachment: Extract<AgentAttachment, { type: "review" }>;
+      reviewDraftKey: string;
+      commentCount: number;
+    };
+
+export type UserComposerAttachment = Exclude<
+  ComposerAttachment,
+  { kind: "review" } | { kind: "browser_element" }
+>;
+
+export type WorkspaceComposerAttachment = Extract<
+  ComposerAttachment,
+  { kind: "review" } | { kind: "browser_element" }
+>;
 
 export type AttachmentDataSource =
-  | { kind: "base64"; base64: string }
+  | { kind: "bytes"; bytes: Uint8Array }
   | { kind: "blob"; blob: Blob }
   | { kind: "data_url"; dataUrl: string }
   | { kind: "file_uri"; uri: string };

packages/app/src/attachments/web/indexeddb-attachment-store.test.ts

@@ -0,0 +1,112 @@
+import { afterEach, beforeEach, describe, expect, it } from "vitest";
+import { createIndexedDbAttachmentStore } from "./indexeddb-attachment-store";
+
+type Listener = () => void;
+
+class FakeRequest<T = unknown> {
+  result!: T;
+  error: Error | null = null;
+  private listeners = new Map<string, Listener[]>();
+
+  addEventListener(event: string, listener: Listener): void {
+    this.listeners.set(event, [...(this.listeners.get(event) ?? []), listener]);
+  }
+
+  emit(event: string): void {
+    for (const listener of this.listeners.get(event) ?? []) {
+      listener();
+    }
+  }
+}
+
+class FakeObjectStore {
+  constructor(private readonly onPut: (record: unknown) => void) {}
+
+  put(record: unknown): FakeRequest<unknown> {
+    this.onPut(record);
+    const request = new FakeRequest<unknown>();
+    queueMicrotask(() => request.emit("success"));
+    return request;
+  }
+}
+
+class FakeTransaction {
+  error: Error | null = null;
+
+  constructor(private readonly store: FakeObjectStore) {}
+
+  objectStore(): FakeObjectStore {
+    return this.store;
+  }
+
+  addEventListener(): void {}
+}
+
+class FakeDatabase {
+  readonly objectStoreNames = {
+    contains: () => true,
+  };
+
+  constructor(private readonly store: FakeObjectStore) {}
+
+  createObjectStore(): void {}
+
+  transaction(): FakeTransaction {
+    return new FakeTransaction(this.store);
+  }
+
+  close(): void {}
+}
+
+describe("indexeddb attachment store", () => {
+  let storedRecord: unknown;
+
+  beforeEach(() => {
+    storedRecord = null;
+    Object.defineProperty(globalThis, "indexedDB", {
+      configurable: true,
+      value: {
+        open: () => {
+          const store = new FakeObjectStore((record) => {
+            storedRecord = record;
+          });
+          const request = new FakeRequest<FakeDatabase>();
+          request.result = new FakeDatabase(store);
+          queueMicrotask(() => request.emit("success"));
+          return request;
+        },
+      } as unknown as IDBFactory,
+    });
+  });
+
+  afterEach(() => {
+    Reflect.deleteProperty(globalThis, "indexedDB");
+  });
+
+  it("stores raw byte sources as a Blob", async () => {
+    const store = createIndexedDbAttachmentStore();
+    const bytes = new Uint8Array([0, 1, 2, 3]);
+
+    const attachment = await store.save({
+      id: "att_bytes",
+      mimeType: "image/png",
+      fileName: "image.png",
+      source: { kind: "bytes", bytes },
+    });
+
+    expect(storedRecord).toEqual({
+      id: "att_bytes",
+      blob: new Blob([bytes], { type: "image/png" }),
+      createdAt: expect.any(Number),
+      fileName: "image.png",
+    });
+    expect(attachment).toMatchObject({
+      id: "att_bytes",
+      mimeType: "image/png",
+      storageType: "web-indexeddb",
+      storageKey: "att_bytes",
+      fileName: "image.png",
+      byteSize: 4,
+    });
+  });
+});

packages/app/src/attachments/web/indexeddb-attachment-store.ts

@@ -74,17 +74,18 @@ function runTx<T>(
   });
 }
 
-function base64ToBlob(input: { base64: string; mimeType: string }): Blob {
-  const binary = atob(input.base64);
-  const bytes = new Uint8Array(binary.length);
-  for (let index = 0; index < binary.length; index += 1) {
-    bytes[index] = binary.charCodeAt(index);
-  }
-  return new Blob([bytes], { type: input.mimeType });
-}
-
 async function sourceToBlob(input: SaveAttachmentInput): Promise<{ blob: Blob; mimeType: string }> {
   const source = input.source;
+  if (source.kind === "bytes") {
+    const mimeType = normalizeMimeType(input.mimeType);
+    const buffer = new ArrayBuffer(source.bytes.byteLength);
+    new Uint8Array(buffer).set(source.bytes);
+    return {
+      blob: new Blob([buffer], { type: mimeType }),
+      mimeType,
+    };
+  }
+
   if (source.kind === "blob") {
     const mimeType = normalizeMimeType(input.mimeType ?? source.blob.type);
     const blob =
@@ -105,14 +106,6 @@ async function sourceToBlob(input: SaveAttachmentInput): Promise<{ blob: Blob; m
     };
   }
 
-  if (source.kind === "base64") {
-    const mimeType = normalizeMimeType(input.mimeType);
-    return {
-      blob: base64ToBlob({ base64: source.base64, mimeType }),
-      mimeType,
-    };
-  }
-
   const response = await fetch(source.uri);
   const blob = await response.blob();
   const mimeType = normalizeMimeType(input.mimeType ?? blob.type);

packages/app/src/attachments/workspace-attachments-store.test.ts

@@ -0,0 +1,89 @@
+import { describe, expect, it } from "vitest";
+import type { WorkspaceComposerAttachment } from "./types";
+import {
+  buildWorkspaceAttachmentScopeKey,
+  resetWorkspaceAttachmentsStore,
+  useWorkspaceAttachmentsStore,
+} from "./workspace-attachments-store";
+
+function reviewAttachment(body: string): WorkspaceComposerAttachment {
+  return {
+    kind: "review",
+    reviewDraftKey: `review:${body}`,
+    commentCount: 1,
+    attachment: {
+      type: "review",
+      mimeType: "application/paseo-review",
+      cwd: "/repo",
+      mode: "uncommitted",
+      baseRef: null,
+      comments: [
+        {
+          filePath: "src/example.ts",
+          side: "new",
+          lineNumber: 41,
+          body,
+          context: {
+            hunkHeader: "@@ -40,1 +40,1 @@",
+            targetLine: {
+              oldLineNumber: null,
+              newLineNumber: 41,
+              type: "add",
+              content: "const value = newValue;",
+            },
+            lines: [
+              {
+                oldLineNumber: null,
+                newLineNumber: 41,
+                type: "add",
+                content: "const value = newValue;",
+              },
+            ],
+          },
+        },
+      ],
+    },
+  };
+}
+
+describe("workspace attachments store", () => {
+  it("scopes workspace attachments by server and workspace before cwd fallback", () => {
+    expect(
+      buildWorkspaceAttachmentScopeKey({
+        serverId: " local ",
+        workspaceId: " workspace-1 ",
+        cwd: "/repo",
+      }),
+    ).toBe("workspace-attachments:server=local:workspace=workspace-1");
+
+    expect(
+      buildWorkspaceAttachmentScopeKey({
+        serverId: "local",
+        workspaceId: null,
+        cwd: "/repo/",
+      }),
+    ).toBe("workspace-attachments:server=local:cwd=%2Frepo");
+  });
+
+  it("publishes and clears attachments for a workspace scope", () => {
+    resetWorkspaceAttachmentsStore();
+    const scopeKey = buildWorkspaceAttachmentScopeKey({
+      serverId: "local",
+      workspaceId: "workspace-1",
+      cwd: "/repo",
+    });
+    const attachment = reviewAttachment("Please simplify this.");
+
+    useWorkspaceAttachmentsStore
+      .getState()
+      .setWorkspaceAttachments({ scopeKey, attachments: [attachment] });
+
+    expect(useWorkspaceAttachmentsStore.getState().attachmentsByScope[scopeKey]).toEqual([
+      attachment,
+    ]);
+
+    useWorkspaceAttachmentsStore.getState().clearWorkspaceAttachments({ scopeKey });
+
+    expect(useWorkspaceAttachmentsStore.getState().attachmentsByScope[scopeKey]).toBeUndefined();
+  });
+});

packages/app/src/attachments/workspace-attachments-store.ts

@@ -0,0 +1,115 @@
+import { useMemo } from "react";
+import { create } from "zustand";
+import type { WorkspaceComposerAttachment } from "./types";
+
+const EMPTY_WORKSPACE_ATTACHMENTS: readonly WorkspaceComposerAttachment[] = [];
+
+export interface WorkspaceAttachmentScopeInput {
+  serverId: string;
+  workspaceId?: string | null;
+  cwd: string;
+}
+
+interface WorkspaceAttachmentsStoreState {
+  attachmentsByScope: Record<string, readonly WorkspaceComposerAttachment[]>;
+}
+
+interface WorkspaceAttachmentsStoreActions {
+  setWorkspaceAttachments: (input: {
+    scopeKey: string;
+    attachments: readonly WorkspaceComposerAttachment[];
+  }) => void;
+  clearWorkspaceAttachments: (input: { scopeKey: string }) => void;
+}
+
+type WorkspaceAttachmentsStore = WorkspaceAttachmentsStoreState & WorkspaceAttachmentsStoreActions;
+
+function encodeScopePart(value: string): string {
+  return encodeURIComponent(value.trim());
+}
+
+function normalizeCwd(cwd: string): string {
+  const trimmed = cwd.trim();
+  if (trimmed === "/") {
+    return trimmed;
+  }
+  return trimmed.replace(/\/+$/, "");
+}
+
+export function buildWorkspaceAttachmentScopeKey(input: WorkspaceAttachmentScopeInput): string {
+  const workspaceId = input.workspaceId?.trim();
+  const workspacePart = workspaceId
+    ? `workspace=${encodeScopePart(workspaceId)}`
+    : `cwd=${encodeScopePart(normalizeCwd(input.cwd))}`;
+
+  return ["workspace-attachments", `server=${encodeScopePart(input.serverId)}`, workspacePart].join(
+    ":",
+  );
+}
+
+function areWorkspaceAttachmentsEqual(
+  left: readonly WorkspaceComposerAttachment[],
+  right: readonly WorkspaceComposerAttachment[],
+): boolean {
+  if (left === right) {
+    return true;
+  }
+  if (left.length !== right.length) {
+    return false;
+  }
+  return left.every((attachment, index) => attachment === right[index]);
+}
+
+export const useWorkspaceAttachmentsStore = create<WorkspaceAttachmentsStore>()((set) => ({
+  attachmentsByScope: {},
+  setWorkspaceAttachments: ({ scopeKey, attachments }) => {
+    set((state) => {
+      const current = state.attachmentsByScope[scopeKey] ?? EMPTY_WORKSPACE_ATTACHMENTS;
+      if (areWorkspaceAttachmentsEqual(current, attachments)) {
+        return state;
+      }
+      if (attachments.length === 0) {
+        if (!state.attachmentsByScope[scopeKey]) {
+          return state;
+        }
+        const next = { ...state.attachmentsByScope };
+        delete next[scopeKey];
+        return { attachmentsByScope: next };
+      }
+      return {
+        attachmentsByScope: {
+          ...state.attachmentsByScope,
+          [scopeKey]: attachments,
+        },
+      };
+    });
+  },
+  clearWorkspaceAttachments: ({ scopeKey }) => {
+    set((state) => {
+      if (!state.attachmentsByScope[scopeKey]) {
+        return state;
+      }
+      const next = { ...state.attachmentsByScope };
+      delete next[scopeKey];
+      return { attachmentsByScope: next };
+    });
+  },
+}));
+
+export function useWorkspaceAttachmentScopeKey(input: WorkspaceAttachmentScopeInput): string {
+  const { serverId, workspaceId, cwd } = input;
+  return useMemo(
+    () => buildWorkspaceAttachmentScopeKey({ serverId, workspaceId, cwd }),
+    [serverId, workspaceId, cwd],
+  );
+}
+
+export function useWorkspaceAttachments(scopeKey: string): readonly WorkspaceComposerAttachment[] {
+  return useWorkspaceAttachmentsStore(
+    (state) => state.attachmentsByScope[scopeKey] ?? EMPTY_WORKSPACE_ATTACHMENTS,
+  );
+}
+
+export function resetWorkspaceAttachmentsStore(): void {
+  useWorkspaceAttachmentsStore.setState({ attachmentsByScope: {} });
+}

packages/app/src/components/adaptive-modal-sheet.tsx

@@ -196,7 +196,7 @@ export function AdaptiveModalSheet({
     () => ({ backgroundColor: theme.colors.surface2 }),
     [theme.colors.surface2],
   );
-  const { sheetRef, handleSheetChange } = useIsolatedBottomSheetVisibility({
+  const { sheetRef, handleSheetChange, handleSheetDismiss } = useIsolatedBottomSheetVisibility({
     visible,
     isEnabled: isMobile,
     onClose,
@@ -228,6 +228,7 @@ export function AdaptiveModalSheet({
         index={0}
         enableDynamicSizing={false}
         onChange={handleSheetChange}
+        onDismiss={handleSheetDismiss}
         backdropComponent={renderBackdrop}
         enablePanDownToClose
         backgroundComponent={SheetBackground}

packages/app/src/components/add-host-modal.tsx

@@ -1,17 +1,35 @@
-import { useCallback, useMemo, useRef, useState } from "react";
-import { Alert, Text, TextInput, View } from "react-native";
+import { useCallback, useMemo, useState } from "react";
+import { Alert, Pressable, Text, View } from "react-native";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { useIsCompactFormFactor } from "@/constants/layout";
-import { Link2 } from "lucide-react-native";
+import { Check, ChevronDown, ChevronRight, Eye, EyeOff, Link2 } from "lucide-react-native";
 import type { HostProfile } from "@/types/host-connection";
 import { useHosts, useHostMutations } from "@/runtime/host-runtime";
-import { normalizeHostPort } from "@/utils/daemon-endpoints";
+import {
+  parseConnectionUri,
+  serializeConnectionUri,
+  serializeConnectionUriForStorage,
+} from "@/utils/daemon-endpoints";
 import { DaemonConnectionTestError, connectToDaemon } from "@/utils/test-daemon-connection";
 import { AdaptiveModalSheet, AdaptiveTextInput } from "./adaptive-modal-sheet";
 import { Button } from "@/components/ui/button";
 
 const FLEX_ONE_STYLE = { flex: 1 } as const;
 
+interface DirectConnectionDraft {
+  host: string;
+  port: string;
+  useTls: boolean;
+  password: string;
+}
+
+interface PreparedDirectConnection {
+  uri: string;
+  endpoint: string;
+  useTls: boolean;
+  password?: string;
+}
+
 const styles = StyleSheet.create((theme) => ({
   field: {
     gap: theme.spacing[2],
@@ -30,6 +48,66 @@ const styles = StyleSheet.create((theme) => ({
     borderWidth: 1,
     borderColor: theme.colors.border,
   },
+  portRow: {
+    flexDirection: "row",
+    gap: theme.spacing[3],
+  },
+  hostField: {
+    flex: 1,
+    minWidth: 0,
+  },
+  portField: {
+    width: 112,
+  },
+  passwordRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[2],
+  },
+  passwordInput: {
+    flex: 1,
+    minWidth: 0,
+  },
+  iconButton: {
+    width: 44,
+    height: 44,
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: theme.borderRadius.lg,
+    backgroundColor: theme.colors.surface2,
+    borderWidth: 1,
+    borderColor: theme.colors.border,
+  },
+  checkboxRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[3],
+  },
+  checkbox: {
+    width: 22,
+    height: 22,
+    borderRadius: theme.borderRadius.sm,
+    borderWidth: 1,
+    borderColor: theme.colors.border,
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  checkboxChecked: {
+    backgroundColor: theme.colors.accent,
+    borderColor: theme.colors.accent,
+  },
+  advancedToggle: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[2],
+    alignSelf: "flex-start",
+    paddingVertical: theme.spacing[1],
+  },
+  advancedText: {
+    color: theme.colors.foreground,
+    fontSize: theme.fontSize.sm,
+    fontWeight: theme.fontWeight.medium,
+  },
   actions: {
     flexDirection: "row",
     gap: theme.spacing[3],
@@ -45,8 +123,51 @@ const styles = StyleSheet.create((theme) => ({
   },
 }));
 
-function isHostPortOnly(raw: string): boolean {
-  return !raw.includes("://") && !raw.includes("/");
+function isIpv6Host(host: string): boolean {
+  return host.includes(":") && !host.startsWith("[") && !host.endsWith("]");
+}
+
+function buildConnectionUriFromDraft(draft: DirectConnectionDraft): string {
+  const host = draft.host.trim();
+  const port = Number(draft.port.trim());
+  if (!host) {
+    throw new Error("Host is required");
+  }
+  if (!Number.isInteger(port) || port < 1 || port > 65535) {
+    throw new Error("Port must be between 1 and 65535");
+  }
+
+  return serializeConnectionUriForStorage({
+    host,
+    port,
+    isIpv6: isIpv6Host(host),
+    useTls: draft.useTls,
+    ...(draft.password ? { password: draft.password } : {}),
+  });
+}
+
+function prepareDirectConnection(draft: DirectConnectionDraft): PreparedDirectConnection {
+  const parsed = parseConnectionUri(buildConnectionUriFromDraft(draft));
+  const endpoint = parsed.isIpv6
+    ? `[${parsed.host}]:${parsed.port}`
+    : `${parsed.host}:${parsed.port}`;
+
+  return {
+    uri: serializeConnectionUri(parsed),
+    endpoint,
+    useTls: parsed.useTls,
+    ...(parsed.password ? { password: parsed.password } : {}),
+  };
+}
+
+function draftFromConnectionUri(uri: string): DirectConnectionDraft {
+  const parsed = parseConnectionUri(uri);
+  return {
+    host: parsed.host,
+    port: String(parsed.port),
+    useTls: parsed.useTls,
+    password: parsed.password ?? "",
+  };
 }
 
 function normalizeTransportMessage(message: string | null | undefined): string | null {
@@ -56,7 +177,7 @@ function normalizeTransportMessage(message: string | null | undefined): string |
   return trimmed;
 }
 
-function formatTechnicalTransportDetails(details: Array<string | null>): string | null {
+function formatTechnicalTransportDetails(details: (string | null)[]): string | null {
   const unique = Array.from(
     new Set(
       details
@@ -103,7 +224,9 @@ function buildConnectionFailureCopy(
   const rawLower = raw?.toLowerCase() ?? "";
   let detail: string | null = null;
 
-  if (rawLower.includes("timed out")) {
+  if (raw === "Incorrect password" || raw === "Password required") {
+    detail = raw;
+  } else if (rawLower.includes("timed out")) {
     detail = "Connection timed out. Check the host/port and your network.";
   } else if (
     rawLower.includes("econnrefused") ||
@@ -121,9 +244,7 @@ function buildConnectionFailureCopy(
     rawLower.includes("ssl")
   ) {
     detail =
-      "TLS error. Direct connections use an unencrypted local connection. Use relay for remote access.";
-  } else if (raw) {
-    detail = "Unable to connect. Check the host/port and that the daemon is reachable.";
+      "TLS error. Direct connections use SSL only when a TLS terminator is in front of the daemon.";
   } else {
     detail = "Unable to connect. Check the host/port and that the daemon is reachable.";
   }
@@ -149,21 +270,41 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
   const { upsertDirectConnection } = useHostMutations();
   const isMobile = useIsCompactFormFactor();
 
-  const hostInputRef = useRef<TextInput>(null);
-  const endpointRawRef = useRef("");
-
   const [isSaving, setIsSaving] = useState(false);
   const [errorMessage, setErrorMessage] = useState("");
+  const [host, setHost] = useState("");
+  const [port, setPort] = useState("6767");
+  const [useTls, setUseTls] = useState(false);
+  const [password, setPassword] = useState("");
+  const [isPasswordVisible, setIsPasswordVisible] = useState(false);
+  const [isAdvancedOpen, setIsAdvancedOpen] = useState(false);
+  const [advancedUri, setAdvancedUri] = useState("");
 
   const clearInput = useCallback(() => {
-    endpointRawRef.current = "";
-    hostInputRef.current?.clear();
+    setHost("");
+    setPort("6767");
+    setUseTls(false);
+    setPassword("");
+    setIsPasswordVisible(false);
+    setIsAdvancedOpen(false);
+    setAdvancedUri("");
   }, []);
 
   const connectIcon = useMemo(
     () => <Link2 size={16} color={theme.colors.palette.white} />,
     [theme.colors.palette.white],
   );
+  const hostFieldStyle = useMemo(() => [styles.field, styles.hostField], []);
+  const portFieldStyle = useMemo(() => [styles.field, styles.portField], []);
+  const checkboxStyle = useMemo(
+    () => [styles.checkbox, useTls ? styles.checkboxChecked : null],
+    [useTls],
+  );
+  const passwordInputStyle = useMemo(() => [styles.input, styles.passwordInput], []);
+  const useTlsAccessibilityState = useMemo(
+    () => ({ checked: useTls, disabled: isSaving }),
+    [isSaving, useTls],
+  );
 
   const handleClose = useCallback(() => {
     if (isSaving) return;
@@ -182,21 +323,11 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
   const handleSave = useCallback(async () => {
     if (isSaving) return;
 
-    const raw = endpointRawRef.current.trim();
-    if (!raw) {
-      setErrorMessage("Host is required");
-      return;
-    }
-    if (!isHostPortOnly(raw)) {
-      setErrorMessage("Enter host:port only (no ws://, no /ws)");
-      return;
-    }
-
-    let endpoint: string;
+    let connection: PreparedDirectConnection;
     try {
-      endpoint = normalizeHostPort(raw);
+      connection = prepareDirectConnection({ host, port, useTls, password });
     } catch (error) {
-      const message = error instanceof Error ? error.message : "Invalid host:port";
+      const message = error instanceof Error ? error.message : "Invalid connection";
       setErrorMessage(message);
       return;
     }
@@ -208,20 +339,24 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
       const { client, serverId, hostname } = await connectToDaemon({
         id: "probe",
         type: "directTcp",
-        endpoint,
+        endpoint: connection.endpoint,
+        useTls: connection.useTls,
+        ...(connection.password ? { password: connection.password } : {}),
       });
       await client.close().catch(() => undefined);
       const isNewHost = !daemons.some((daemon) => daemon.serverId === serverId);
       const profile = await upsertDirectConnection({
         serverId,
-        endpoint,
+        endpoint: connection.endpoint,
+        useTls: connection.useTls,
+        ...(connection.password ? { password: connection.password } : {}),
         label: hostname ?? undefined,
       });
 
       onSaved?.({ profile, serverId, hostname, isNewHost });
       handleClose();
     } catch (error) {
-      const { title, detail, raw: rawDetail } = buildConnectionFailureCopy(endpoint, error);
+      const { title, detail, raw: rawDetail } = buildConnectionFailureCopy(connection.uri, error);
       let combined: string;
       if (rawDetail && detail && rawDetail !== detail) {
         combined = `${title}\n${detail}\nDetails: ${rawDetail}`;
@@ -232,17 +367,23 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
       }
       setErrorMessage(combined);
       if (!isMobile) {
-        // Desktop/web: also surface it as a dialog for quick visibility.
         Alert.alert("Connection failed", combined);
       }
     } finally {
       setIsSaving(false);
     }
-  }, [daemons, handleClose, isMobile, isSaving, onSaved, upsertDirectConnection]);
-
-  const handleChangeEndpoint = useCallback((next: string) => {
-    endpointRawRef.current = next;
-  }, []);
+  }, [
+    daemons,
+    handleClose,
+    host,
+    isMobile,
+    isSaving,
+    onSaved,
+    password,
+    port,
+    upsertDirectConnection,
+    useTls,
+  ]);
 
   const handleSubmitEditing = useCallback(() => {
     void handleSave();
@@ -252,6 +393,43 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
     void handleSave();
   }, [handleSave]);
 
+  const handleToggleUseTls = useCallback(() => {
+    if (isSaving) return;
+    setUseTls((current) => !current);
+  }, [isSaving]);
+
+  const handleTogglePasswordVisibility = useCallback(() => {
+    setIsPasswordVisible((current) => !current);
+  }, []);
+
+  const handleToggleAdvanced = useCallback(() => {
+    if (!isAdvancedOpen) {
+      try {
+        setAdvancedUri(buildConnectionUriFromDraft({ host, port, useTls, password }));
+      } catch {
+        setAdvancedUri("");
+      }
+      setErrorMessage("");
+      setIsAdvancedOpen(true);
+      return;
+    }
+
+    try {
+      const next = draftFromConnectionUri(advancedUri);
+      setHost(next.host);
+      setPort(next.port);
+      setUseTls(next.useTls);
+      setPassword(next.password);
+      setErrorMessage("");
+    } catch {
+      setErrorMessage("");
+    }
+    setIsAdvancedOpen(false);
+  }, [advancedUri, host, isAdvancedOpen, password, port, useTls]);
+
+  const AdvancedIcon = isAdvancedOpen ? ChevronDown : ChevronRight;
+  const PasswordIcon = isPasswordVisible ? EyeOff : Eye;
+
   return (
     <AdaptiveModalSheet
       title="Direct connection"
@@ -261,24 +439,127 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
     >
       <Text style={styles.helper}>Enter the address of a Paseo server.</Text>
 
+      <View style={styles.portRow}>
+        <View style={hostFieldStyle}>
+          <Text style={styles.label}>Host</Text>
+          <AdaptiveTextInput
+            testID="direct-host-input"
+            nativeID="direct-host-input"
+            accessibilityLabel="Host"
+            value={host}
+            onChangeText={setHost}
+            placeholder="localhost"
+            placeholderTextColor={theme.colors.foregroundMuted}
+            style={styles.input}
+            autoCapitalize="none"
+            autoCorrect={false}
+            keyboardType="url"
+            editable={!isSaving}
+            returnKeyType="next"
+          />
+        </View>
+        <View style={portFieldStyle}>
+          <Text style={styles.label}>Port</Text>
+          <AdaptiveTextInput
+            testID="direct-port-input"
+            nativeID="direct-port-input"
+            accessibilityLabel="Port"
+            value={port}
+            onChangeText={setPort}
+            placeholder="6767"
+            placeholderTextColor={theme.colors.foregroundMuted}
+            style={styles.input}
+            autoCapitalize="none"
+            autoCorrect={false}
+            keyboardType="number-pad"
+            editable={!isSaving}
+            returnKeyType="done"
+            onSubmitEditing={handleSubmitEditing}
+          />
+        </View>
+      </View>
+
+      <Pressable
+        style={styles.checkboxRow}
+        onPress={handleToggleUseTls}
+        disabled={isSaving}
+        accessibilityRole="checkbox"
+        accessibilityLabel="Use SSL"
+        accessibilityState={useTlsAccessibilityState}
+        testID="direct-ssl-toggle"
+      >
+        <View style={checkboxStyle}>
+          {useTls ? (
+            <View testID="direct-ssl-toggle-checked">
+              <Check size={14} color={theme.colors.palette.white} />
+            </View>
+          ) : null}
+        </View>
+        <Text style={styles.label}>Use SSL</Text>
+      </Pressable>
+
       <View style={styles.field}>
-        <Text style={styles.label}>Host</Text>
-        <AdaptiveTextInput
-          ref={hostInputRef}
-          testID="direct-host-input"
-          nativeID="direct-host-input"
-          accessibilityLabel="direct-host-input"
-          onChangeText={handleChangeEndpoint}
-          placeholder="hostname:port"
-          placeholderTextColor={theme.colors.foregroundMuted}
-          style={styles.input}
-          autoCapitalize="none"
-          autoCorrect={false}
-          keyboardType="url"
-          editable={!isSaving}
-          returnKeyType="done"
-          onSubmitEditing={handleSubmitEditing}
-        />
+        <Text style={styles.label}>Password</Text>
+        <View style={styles.passwordRow}>
+          <AdaptiveTextInput
+            testID="direct-password-input"
+            nativeID="direct-password-input"
+            accessibilityLabel="Password"
+            value={password}
+            onChangeText={setPassword}
+            placeholder="Optional"
+            placeholderTextColor={theme.colors.foregroundMuted}
+            style={passwordInputStyle}
+            autoCapitalize="none"
+            autoCorrect={false}
+            secureTextEntry={!isPasswordVisible}
+            editable={!isSaving}
+            returnKeyType="done"
+            onSubmitEditing={handleSubmitEditing}
+          />
+          <Pressable
+            style={styles.iconButton}
+            onPress={handleTogglePasswordVisibility}
+            disabled={isSaving}
+            accessibilityRole="button"
+            accessibilityLabel={isPasswordVisible ? "Hide password" : "Show password"}
+            testID="direct-password-visibility-toggle"
+          >
+            <PasswordIcon size={18} color={theme.colors.foregroundMuted} />
+          </Pressable>
+        </View>
+      </View>
+
+      <View style={styles.field}>
+        <Pressable
+          style={styles.advancedToggle}
+          onPress={handleToggleAdvanced}
+          disabled={isSaving}
+          accessibilityRole="button"
+          accessibilityLabel={isAdvancedOpen ? "Hide advanced" : "Show advanced"}
+          testID="direct-host-advanced-toggle"
+        >
+          <AdvancedIcon size={16} color={theme.colors.foregroundMuted} />
+          <Text style={styles.advancedText}>Advanced</Text>
+        </Pressable>
+        {isAdvancedOpen ? (
+          <AdaptiveTextInput
+            testID="direct-host-uri-input"
+            nativeID="direct-host-uri-input"
+            accessibilityLabel="Connection URI"
+            value={advancedUri}
+            onChangeText={setAdvancedUri}
+            placeholder="tcp://localhost:6767?ssl=true"
+            placeholderTextColor={theme.colors.foregroundMuted}
+            style={styles.input}
+            autoCapitalize="none"
+            autoCorrect={false}
+            keyboardType="url"
+            editable={!isSaving}
+            returnKeyType="done"
+            onSubmitEditing={handleToggleAdvanced}
+          />
+        ) : null}
         {errorMessage ? <Text style={styles.error}>{errorMessage}</Text> : null}
       </View>
 

packages/app/src/components/agent-stream-view.test.tsx

@@ -0,0 +1,419 @@
+/**
+ * @vitest-environment jsdom
+ */
+import React from "react";
+import { act } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import type { StreamItem } from "@/types/stream";
+import { AgentStreamView } from "./agent-stream-view";
+
+const assistantMessageCalls = vi.hoisted(
+  () => [] as Array<{ message: string; spacing: string | undefined }>,
+);
+const turnCopyButtonCalls = vi.hoisted(() => [] as Array<{ getContent: () => string }>);
+
+const mockSessionState = vi.hoisted(() => ({
+  sessions: {
+    server: {
+      client: null,
+      agentStreamHead: new Map<string, StreamItem[]>(),
+      workspaces: new Map(),
+      agentTimelineCursor: new Map(),
+      agentTimelineHasOlder: new Map(),
+      agentTimelineOlderFetchInFlight: new Map(),
+    },
+  },
+  setAgentTimelineOlderFetchInFlight: () => {},
+}));
+
+vi.mock("react-native-unistyles", () => ({
+  StyleSheet: {
+    create: (
+      factory: (theme: {
+        borderRadius: Record<string, number>;
+        borderWidth: Record<number, number>;
+        colors: Record<string, string>;
+        fontSize: Record<string, number>;
+        fontWeight: Record<string, string>;
+        shadow: Record<string, object>;
+        spacing: Record<number, number>;
+      }) => unknown,
+    ) =>
+      factory({
+        borderRadius: {
+          full: 9999,
+          md: 6,
+        },
+        borderWidth: {
+          1: 1,
+        },
+        colors: {
+          foreground: "#fff",
+          foregroundMuted: "#aaa",
+          surface0: "#000",
+          surface1: "#111",
+          surface2: "#222",
+          border: "#333",
+          borderAccent: "#444",
+        },
+        fontSize: {
+          sm: 14,
+          base: 16,
+          xs: 12,
+        },
+        fontWeight: {
+          normal: "normal",
+        },
+        shadow: {
+          sm: {},
+        },
+        spacing: {
+          1: 4,
+          2: 8,
+          3: 12,
+          4: 16,
+          12: 48,
+        },
+      }),
+  },
+  useUnistyles: () => ({ rt: { breakpoint: "md" } }),
+  withUnistyles: (Component: unknown) => Component,
+}));
+
+vi.mock("react-native-reanimated", async () => {
+  const ReactModule = await import("react");
+  return {
+    default: {
+      View: ({ children, ...props }: { children?: React.ReactNode }) =>
+        ReactModule.createElement("div", props, children),
+    },
+    Easing: { linear: vi.fn() },
+    FadeIn: { duration: vi.fn(() => undefined) },
+    FadeOut: { duration: vi.fn(() => undefined) },
+    cancelAnimation: vi.fn(),
+    useAnimatedStyle: (factory: () => unknown) => factory(),
+    useSharedValue: (value: unknown) => ({ value }),
+    withRepeat: (value: unknown) => value,
+    withTiming: (value: unknown) => value,
+  };
+});
+
+vi.mock("lucide-react-native", async () => {
+  const ReactModule = await import("react");
+  const Icon = () => ReactModule.createElement("span");
+  return {
+    Check: Icon,
+    ChevronDown: Icon,
+    X: Icon,
+  };
+});
+
+vi.mock("./message", async () => {
+  const ReactModule = await import("react");
+  return {
+    ActivityLog: () => null,
+    AssistantMessage: (props: { message: string; spacing?: string }) => {
+      assistantMessageCalls.push({ message: props.message, spacing: props.spacing });
+      return ReactModule.createElement("div", {
+        "data-message": props.message,
+        "data-spacing": props.spacing ?? "",
+      });
+    },
+    CompactionMarker: () => null,
+    MessageOuterSpacingProvider: ({ children }: { children: React.ReactNode }) =>
+      ReactModule.createElement(ReactModule.Fragment, null, children),
+    SpeakMessage: () => null,
+    TodoListCard: () => null,
+    ToolCall: () => null,
+    TurnCopyButton: (props: { getContent: () => string }) => {
+      turnCopyButtonCalls.push(props);
+      return ReactModule.createElement("button", {
+        "data-testid": "turn-copy-button",
+        type: "button",
+      });
+    },
+    UserMessage: () => null,
+  };
+});
+
+vi.mock("./tool-call-sheet", async () => {
+  const ReactModule = await import("react");
+  return {
+    ToolCallSheetProvider: ({ children }: { children: React.ReactNode }) =>
+      ReactModule.createElement(ReactModule.Fragment, null, children),
+    useToolCallSheet: () => ({ open: vi.fn() }),
+  };
+});
+
+vi.mock("./tool-call-details", () => ({ ToolCallDetailsContent: () => null }));
+vi.mock("./use-web-scrollbar", () => ({ useWebElementScrollbar: () => null }));
+vi.mock("./question-form-card", () => ({ QuestionFormCard: () => null }));
+vi.mock("./plan-card", () => ({ PlanCard: () => null }));
+vi.mock("@/hooks/use-file-explorer-actions", () => ({
+  useFileExplorerActions: () => ({ requestDirectoryListing: vi.fn() }),
+}));
+vi.mock("@/stores/panel-store", () => ({
+  usePanelStore: (selector: (state: Record<string, unknown>) => unknown) =>
+    selector({
+      openFileExplorerForCheckout: vi.fn(),
+      setExplorerTabForCheckout: vi.fn(),
+    }),
+}));
+vi.mock("@/stores/session-store", () => ({
+  useSessionStore: Object.assign(
+    (selector: (state: typeof mockSessionState) => unknown) => selector(mockSessionState),
+    {
+      getState: () => mockSessionState,
+    },
+  ),
+}));
+vi.mock("expo-router", () => ({ useRouter: () => ({ navigate: vi.fn() }) }));
+
+function assistantBlock(params: {
+  id: string;
+  text: string;
+  blockIndex: number;
+}): Extract<StreamItem, { kind: "assistant_message" }> {
+  return {
+    kind: "assistant_message",
+    id: params.id,
+    blockGroupId: "group-1",
+    blockIndex: params.blockIndex,
+    text: params.text,
+    timestamp: new Date("2026-05-01T00:00:00.000Z"),
+  };
+}
+
+function runningToolCall(id: string): Extract<StreamItem, { kind: "tool_call" }> {
+  return {
+    kind: "tool_call",
+    id,
+    timestamp: new Date("2026-05-01T00:00:00.000Z"),
+    payload: {
+      source: "orchestrator",
+      data: {
+        toolCallId: id,
+        toolName: "bash",
+        arguments: "npm test",
+        result: null,
+        status: "executing",
+      },
+    },
+  };
+}
+
+describe("AgentStreamView", () => {
+  let root: Root | null = null;
+  let container: HTMLDivElement | null = null;
+  let originalScrollTo: HTMLElement["scrollTo"] | undefined;
+
+  beforeEach(() => {
+    Object.defineProperty(globalThis, "IS_REACT_ACT_ENVIRONMENT", {
+      value: true,
+      configurable: true,
+    });
+    originalScrollTo = HTMLElement.prototype.scrollTo;
+    HTMLElement.prototype.scrollTo = vi.fn();
+    assistantMessageCalls.length = 0;
+    turnCopyButtonCalls.length = 0;
+    mockSessionState.sessions.server.agentStreamHead = new Map();
+    container = document.createElement("div");
+    document.body.appendChild(container);
+    root = createRoot(container);
+  });
+
+  afterEach(() => {
+    if (root) {
+      act(() => {
+        root?.unmount();
+      });
+    }
+    root = null;
+    container?.remove();
+    container = null;
+    if (originalScrollTo) {
+      HTMLElement.prototype.scrollTo = originalScrollTo;
+    } else {
+      Reflect.deleteProperty(HTMLElement.prototype, "scrollTo");
+    }
+    vi.restoreAllMocks();
+  });
+
+  it("compacts assistant block spacing across the history/live-head boundary", () => {
+    const tailBlock = assistantBlock({
+      id: "group-1:block:0",
+      text: "First paragraph",
+      blockIndex: 0,
+    });
+    const headBlock = assistantBlock({
+      id: "group-1:head",
+      text: "Second paragraph",
+      blockIndex: 1,
+    });
+    mockSessionState.sessions.server.agentStreamHead.set("agent-1", [headBlock]);
+    const agent = {
+      id: "agent-1",
+      serverId: "server",
+      status: "idle",
+      cwd: "/tmp/project",
+    } as never;
+    const streamItems = [tailBlock];
+    const pendingPermissions = new Map();
+
+    act(() => {
+      root?.render(
+        React.createElement(AgentStreamView, {
+          agentId: "agent-1",
+          serverId: "server",
+          agent,
+          streamItems,
+          pendingPermissions,
+        }),
+      );
+    });
+
+    const tailCalls = assistantMessageCalls.filter((call) => call.message === "First paragraph");
+    const headCalls = assistantMessageCalls.filter((call) => call.message === "Second paragraph");
+
+    expect(tailCalls.length).toBeGreaterThan(0);
+    expect(headCalls.length).toBeGreaterThan(0);
+    expect(tailCalls.map((call) => call.spacing)).toEqual(
+      Array.from({ length: tailCalls.length }, () => "compactBottom"),
+    );
+    expect(headCalls.map((call) => call.spacing)).toEqual(
+      Array.from({ length: headCalls.length }, () => "compactTop"),
+    );
+  });
+
+  it("renders running dots in the assistant turn footer when live text is streaming", () => {
+    const headBlock = assistantBlock({
+      id: "group-1:head",
+      text: "Streaming paragraph",
+      blockIndex: 0,
+    });
+    mockSessionState.sessions.server.agentStreamHead.set("agent-1", [headBlock]);
+    const agent = {
+      id: "agent-1",
+      serverId: "server",
+      status: "running",
+      cwd: "/tmp/project",
+    } as never;
+
+    act(() => {
+      root?.render(
+        React.createElement(AgentStreamView, {
+          agentId: "agent-1",
+          serverId: "server",
+          agent,
+          streamItems: [],
+          pendingPermissions: new Map(),
+        }),
+      );
+    });
+
+    expect(container?.querySelector('[data-testid="turn-working-indicator"]')).not.toBeNull();
+    expect(
+      container?.querySelector('[data-testid="stream-working-indicator-auxiliary"]'),
+    ).toBeNull();
+    expect(container?.querySelector('[data-testid="turn-copy-button"]')).toBeNull();
+  });
+
+  it("only renders running dots on the live assistant row", () => {
+    const tailBlock = assistantBlock({
+      id: "group-1:block:0",
+      text: "History paragraph",
+      blockIndex: 0,
+    });
+    const headBlock = assistantBlock({
+      id: "group-2:head",
+      text: "Streaming paragraph",
+      blockIndex: 0,
+    });
+    mockSessionState.sessions.server.agentStreamHead.set("agent-1", [headBlock]);
+    const agent = {
+      id: "agent-1",
+      serverId: "server",
+      status: "running",
+      cwd: "/tmp/project",
+    } as never;
+
+    act(() => {
+      root?.render(
+        React.createElement(AgentStreamView, {
+          agentId: "agent-1",
+          serverId: "server",
+          agent,
+          streamItems: [tailBlock],
+          pendingPermissions: new Map(),
+        }),
+      );
+    });
+
+    expect(container?.querySelectorAll('[data-testid="turn-working-indicator"]')).toHaveLength(1);
+    expect(
+      container?.querySelector('[data-testid="stream-working-indicator-auxiliary"]'),
+    ).toBeNull();
+  });
+
+  it("keeps the auxiliary running dots when there is no live assistant row", () => {
+    mockSessionState.sessions.server.agentStreamHead.set("agent-1", [runningToolCall("tool-1")]);
+    const agent = {
+      id: "agent-1",
+      serverId: "server",
+      status: "running",
+      cwd: "/tmp/project",
+    } as never;
+
+    act(() => {
+      root?.render(
+        React.createElement(AgentStreamView, {
+          agentId: "agent-1",
+          serverId: "server",
+          agent,
+          streamItems: [],
+          pendingPermissions: new Map(),
+        }),
+      );
+    });
+
+    expect(container?.querySelector('[data-testid="turn-working-indicator"]')).toBeNull();
+    expect(
+      container?.querySelector('[data-testid="stream-working-indicator-auxiliary"]'),
+    ).not.toBeNull();
+  });
+
+  it("replaces the running footer with the copy button when the assistant turn idles", () => {
+    const headBlock = assistantBlock({
+      id: "group-1:head",
+      text: "Complete paragraph",
+      blockIndex: 0,
+    });
+    mockSessionState.sessions.server.agentStreamHead.set("agent-1", [headBlock]);
+    const agent = {
+      id: "agent-1",
+      serverId: "server",
+      status: "idle",
+      cwd: "/tmp/project",
+    } as never;
+
+    act(() => {
+      root?.render(
+        React.createElement(AgentStreamView, {
+          agentId: "agent-1",
+          serverId: "server",
+          agent,
+          streamItems: [],
+          pendingPermissions: new Map(),
+        }),
+      );
+    });
+
+    expect(container?.querySelector('[data-testid="turn-working-indicator"]')).toBeNull();
+    expect(container?.querySelector('[data-testid="turn-copy-button"]')).not.toBeNull();
+    expect(turnCopyButtonCalls.length).toBeGreaterThan(0);
+    expect(turnCopyButtonCalls.map((call) => call.getContent())).toEqual(
+      Array.from({ length: turnCopyButtonCalls.length }, () => "Complete paragraph"),
+    );
+  });
+});

packages/app/src/components/agent-stream-view.tsx

@@ -1,4 +1,4 @@
-import {
+import React, {
   forwardRef,
   memo,
   useCallback,
@@ -56,6 +56,8 @@ import type {
 import type { AgentScreenAgent } from "@/hooks/use-agent-screen-state-machine";
 import { useSessionStore } from "@/stores/session-store";
 import { useFileExplorerActions } from "@/hooks/use-file-explorer-actions";
+import { useLoadOlderAgentHistory } from "@/hooks/use-load-older-agent-history";
+import type { ToastApi } from "@/components/toast-host";
 import type { DaemonClient } from "@server/client/daemon-client";
 import { ToolCallDetailsContent } from "./tool-call-details";
 import { QuestionFormCard } from "./question-form-card";
@@ -126,6 +128,12 @@ const getAssistantBlockSpacing = (params: {
   }
   return "default";
 };
+
+interface StreamItemBoundarySeams {
+  aboveItem?: StreamItem | null;
+  belowItem?: StreamItem | null;
+}
+
 export interface AgentStreamViewHandle {
   scrollToBottom(reason?: BottomAnchorLocalRequest["reason"]): void;
   prepareForViewportChange(): void;
@@ -139,6 +147,7 @@ export interface AgentStreamViewProps {
   pendingPermissions: Map<string, PendingPermission>;
   routeBottomAnchorRequest?: BottomAnchorRouteRequest | null;
   isAuthoritativeHistoryReady?: boolean;
+  toast?: ToastApi | null;
   onOpenWorkspaceFile?: (input: { filePath: string }) => void;
 }
 
@@ -152,6 +161,7 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
       pendingPermissions,
       routeBottomAnchorRequest = null,
       isAuthoritativeHistoryReady = true,
+      toast,
       onOpenWorkspaceFile,
     },
     ref,
@@ -192,6 +202,11 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
       workspaceId: workspaceId ?? undefined,
       workspaceRoot,
     });
+    const { isLoadingOlder, hasOlder, loadOlder } = useLoadOlderAgentHistory({
+      serverId: resolvedServerId,
+      agentId,
+      toast,
+    });
     const openWorkspaceFile = useStableEvent(function openWorkspaceFile(input: {
       filePath: string;
     }) {
@@ -286,6 +301,25 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
         isMobileBreakpoint: isMobile,
       });
     }, [isMobile, streamHead, streamItems]);
+    const inlineWorkingIndicatorItemId = useMemo(() => {
+      if (agent.status !== "running") {
+        return null;
+      }
+      const footerItem = baseRenderModel.segments.liveHead.find((item, index, items) => {
+        if (item.kind !== "assistant_message") {
+          return false;
+        }
+        return (
+          getStreamNeighborItem({
+            strategy: streamRenderStrategy,
+            items,
+            index,
+            relation: "below",
+          }) === undefined
+        );
+      });
+      return footerItem?.id ?? null;
+    }, [agent.status, baseRenderModel.segments.liveHead, streamRenderStrategy]);
     useImperativeHandle(
       ref,
       () => ({
@@ -382,6 +416,7 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
           <UserMessage
             message={item.text}
             images={item.images}
+            attachments={item.attachments}
             timestamp={item.timestamp.getTime()}
             isFirstInGroup={isFirstInGroup}
             isLastInGroup={isLastInGroup}
@@ -396,7 +431,7 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
         item: Extract<StreamItem, { kind: "assistant_message" }>,
         index: number,
         items: StreamItem[],
-        seamAboveItem: StreamItem | null,
+        seams: StreamItemBoundarySeams,
       ) => {
         const aboveItem =
           getStreamNeighborItem({
@@ -405,14 +440,17 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
             index,
             relation: "above",
           }) ??
-          seamAboveItem ??
+          seams.aboveItem ??
+          undefined;
+        const belowItem =
+          getStreamNeighborItem({
+            strategy: streamRenderStrategy,
+            items,
+            index,
+            relation: "below",
+          }) ??
+          seams.belowItem ??
           undefined;
-        const belowItem = getStreamNeighborItem({
-          strategy: streamRenderStrategy,
-          items,
-          index,
-          relation: "below",
-        });
         const spacing = getAssistantBlockSpacing({
           item,
           aboveItem,
@@ -519,14 +557,14 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
         item: StreamItem,
         index: number,
         items: StreamItem[],
-        seamAboveItem: StreamItem | null = null,
+        seams: StreamItemBoundarySeams = {},
       ) => {
         switch (item.kind) {
           case "user_message":
-            return renderUserMessageItem(item, index, items, seamAboveItem);
+            return renderUserMessageItem(item, index, items, seams.aboveItem ?? null);
 
           case "assistant_message":
-            return renderAssistantMessageItem(item, index, items, seamAboveItem);
+            return renderAssistantMessageItem(item, index, items, seams);
 
           case "thought":
             return renderThoughtItem(item, index, items);
@@ -562,9 +600,9 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
         item: StreamItem,
         index: number,
         items: StreamItem[],
-        seamAboveItem: StreamItem | null = null,
+        seams: StreamItemBoundarySeams = {},
       ) => {
-        const content = renderStreamItemContent(item, index, items, seamAboveItem);
+        const content = renderStreamItemContent(item, index, items, seams);
         if (!content) {
           return null;
         }
@@ -580,21 +618,31 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
           item.kind === "assistant_message" &&
           (nextItem?.kind === "user_message" ||
             (nextItem === undefined && agent.status !== "running"));
+        const isRunningAssistantTurnFooter =
+          item.kind === "assistant_message" && item.id === inlineWorkingIndicatorItemId;
+        let footer: ReactNode = null;
+        if (isRunningAssistantTurnFooter) {
+          footer = <InlineWorkingIndicatorSlot />;
+        } else if (isEndOfAssistantTurn) {
+          footer = (
+            <TurnCopyButtonSlot strategy={streamRenderStrategy} items={items} startIndex={index} />
+          );
+        }
 
         return (
           <StreamItemWrapper gapBelow={gapBelow}>
             {content}
-            {isEndOfAssistantTurn ? (
-              <TurnCopyButtonSlot
-                strategy={streamRenderStrategy}
-                items={items}
-                startIndex={index}
-              />
-            ) : null}
+            {footer}
           </StreamItemWrapper>
         );
       },
-      [getGapBetween, renderStreamItemContent, agent.status, streamRenderStrategy],
+      [
+        getGapBetween,
+        renderStreamItemContent,
+        agent.status,
+        streamRenderStrategy,
+        inlineWorkingIndicatorItemId,
+      ],
     );
 
     const pendingPermissionItems = useMemo(
@@ -602,7 +650,8 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
       [pendingPermissions, agentId],
     );
 
-    const showWorkingIndicator = agent.status === "running";
+    const showAuxiliaryWorkingIndicator =
+      agent.status === "running" && inlineWorkingIndicatorItemId === null;
     const pendingPermissionsNode = useMemo(
       () =>
         pendingPermissionItems.length > 0 ? (
@@ -616,12 +665,12 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
     );
     const workingIndicatorNode = useMemo(
       () =>
-        showWorkingIndicator ? (
-          <View style={stylesheet.bottomBarWrapper}>
+        showAuxiliaryWorkingIndicator ? (
+          <View style={stylesheet.bottomBarWrapper} testID="stream-working-indicator-auxiliary">
             <WorkingIndicator />
           </View>
         ) : null,
-      [showWorkingIndicator],
+      [showAuxiliaryWorkingIndicator],
     );
     const renderModel = useMemo<AgentStreamRenderModel>(() => {
       return {
@@ -663,6 +712,7 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
     const _liveHeadItems = renderModel.segments.liveHead;
     const { boundary, auxiliary } = renderModel;
     const lastHistoryItem = historyItems.at(-1) ?? null;
+    const firstLiveHeadItem = renderModel.segments.liveHead[0] ?? null;
 
     const historyIndexById = useMemo(() => {
       const indexById = new Map<string, number>();
@@ -678,9 +728,12 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
         if (historyIndex === undefined) {
           return null;
         }
-        return renderStreamItem(item, historyIndex, historyItems);
+        const seamBelowItem = item.id === lastHistoryItem?.id ? firstLiveHeadItem : null;
+        return renderStreamItem(item, historyIndex, historyItems, {
+          belowItem: seamBelowItem,
+        });
       },
-      [historyIndexById, historyItems, renderStreamItem],
+      [firstLiveHeadItem, historyIndexById, historyItems, lastHistoryItem?.id, renderStreamItem],
     );
 
     const renderHistoryVirtualizedRow = useCallback<
@@ -692,7 +745,9 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
     );
     const renderLiveHeadRow = useCallback<StreamSegmentRenderers["renderLiveHeadRow"]>(
       (item, index, items) =>
-        renderStreamItem(item, index, items, index === 0 ? lastHistoryItem : null),
+        renderStreamItem(item, index, items, {
+          aboveItem: index === 0 ? lastHistoryItem : null,
+        }),
       [lastHistoryItem, renderStreamItem],
     );
     const liveAuxiliaryHeaderStyle = useMemo(() => {
@@ -750,6 +805,9 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
               routeBottomAnchorRequest,
               isAuthoritativeHistoryReady,
               onNearBottomChange: setIsNearBottom,
+              onNearHistoryStart: loadOlder,
+              isLoadingOlderHistory: isLoadingOlder,
+              hasOlderHistory: hasOlder,
               scrollEnabled: streamScrollEnabled,
               listStyle: stylesheet.list,
               baseListContentContainerStyle: stylesheet.listContentContainer,
@@ -784,7 +842,7 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
 export const AgentStreamView = memo(AgentStreamViewComponent);
 AgentStreamView.displayName = "AgentStreamView";
 
-function WorkingIndicator() {
+function WorkingIndicator({ variant = "auxiliary" }: { variant?: "auxiliary" | "inline" }) {
   const progress = useSharedValue(0);
 
   useEffect(() => {
@@ -836,8 +894,13 @@ function WorkingIndicator() {
     [dotThreeStyle],
   );
 
+  const containerStyle =
+    variant === "inline"
+      ? stylesheet.inlineWorkingIndicatorFrame
+      : stylesheet.workingIndicatorBubble;
+
   return (
-    <View style={stylesheet.workingIndicatorBubble}>
+    <View style={containerStyle}>
       <View style={stylesheet.workingDotsRow}>
         <Animated.View style={dotOneCombinedStyle} />
         <Animated.View style={dotTwoCombinedStyle} />
@@ -847,6 +910,14 @@ function WorkingIndicator() {
   );
 }
 
+function InlineWorkingIndicatorSlot() {
+  return (
+    <View style={stylesheet.inlineTurnFooter} testID="turn-working-indicator">
+      <WorkingIndicator variant="inline" />
+    </View>
+  );
+}
+
 // Permission Request Card Component
 type TurnContentStrategy = Parameters<
   typeof collectAssistantTurnContentForStreamRenderStrategy
@@ -1128,6 +1199,7 @@ function PermissionRequestCard({
         description={description}
         text={planMarkdown}
         footer={footer}
+        testID="permission-plan-card"
         disableOuterSpacing
       />
     );
@@ -1140,7 +1212,12 @@ function PermissionRequestCard({
       {description ? <Text style={permissionStyles.description}>{description}</Text> : null}
 
       {planMarkdown ? (
-        <PlanCard title="Proposed plan" text={planMarkdown} disableOuterSpacing />
+        <PlanCard
+          title="Proposed plan"
+          text={planMarkdown}
+          testID="permission-plan-card"
+          disableOuterSpacing
+        />
       ) : null}
 
       {!isPlanRequest ? (
@@ -1205,6 +1282,17 @@ const stylesheet = StyleSheet.create((theme) => ({
     paddingBottom: theme.spacing[2],
     gap: theme.spacing[2],
   },
+  inlineTurnFooter: {
+    alignSelf: "flex-start",
+    marginTop: theme.spacing[2],
+    padding: theme.spacing[2],
+    paddingTop: 0,
+  },
+  inlineWorkingIndicatorFrame: {
+    height: 18,
+    alignItems: "center",
+    justifyContent: "center",
+  },
   workingIndicatorBubble: {
     flexDirection: "row",
     alignItems: "center",

packages/app/src/components/browser-pane.tsx

@@ -0,0 +1,48 @@
+import { Text, View } from "react-native";
+import { StyleSheet, useUnistyles } from "react-native-unistyles";
+import { useMemo } from "react";
+
+interface BrowserPaneProps {
+  browserId: string;
+  serverId: string;
+  workspaceId: string;
+  cwd: string | null;
+  isInteractive?: boolean;
+  onFocusPane?: () => void;
+}
+
+export function BrowserPane({ browserId }: BrowserPaneProps) {
+  const { theme } = useUnistyles();
+  const titleStyle = useMemo(
+    () => [styles.title, { color: theme.colors.foreground }],
+    [theme.colors.foreground],
+  );
+  const subtitleStyle = useMemo(
+    () => [styles.subtitle, { color: theme.colors.foregroundMuted }],
+    [theme.colors.foregroundMuted],
+  );
+
+  return (
+    <View style={styles.container}>
+      <Text style={titleStyle}>Browser is desktop-only</Text>
+      <Text style={subtitleStyle}>Browser session {browserId}</Text>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create(() => ({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 8,
+    padding: 16,
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: "600",
+  },
+  subtitle: {
+    fontSize: 12,
+  },
+}));

packages/app/src/components/browser-pane.web.tsx

@@ -0,0 +1,51 @@
+import { useMemo } from "react";
+import { Text, View } from "react-native";
+import { StyleSheet, useUnistyles } from "react-native-unistyles";
+
+interface BrowserPaneProps {
+  browserId: string;
+  serverId: string;
+  workspaceId: string;
+  cwd: string | null;
+  isInteractive?: boolean;
+  onFocusPane?: () => void;
+}
+
+export function BrowserPane({ browserId }: BrowserPaneProps) {
+  const { theme } = useUnistyles();
+  const titleStyle = useMemo(
+    () => [styles.title, { color: theme.colors.foreground }],
+    [theme.colors.foreground],
+  );
+  const subtitleStyle = useMemo(
+    () => [styles.subtitle, { color: theme.colors.foregroundMuted }],
+    [theme.colors.foregroundMuted],
+  );
+
+  return (
+    <View style={styles.container}>
+      <Text style={titleStyle}>Browser is desktop-only</Text>
+      <Text style={subtitleStyle}>
+        Open this workspace in Electron to use the built-in browser.
+      </Text>
+      <Text style={subtitleStyle}>Browser session {browserId}</Text>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create(() => ({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 8,
+    padding: 16,
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: "600",
+  },
+  subtitle: {
+    fontSize: 12,
+  },
+}));

packages/app/src/components/composer-attachments.ts

@@ -1,4 +1,5 @@
 import type { AttachmentMetadata, ComposerAttachment } from "@/attachments/types";
+import { composerWorkspaceAttachment } from "@/attachments/composer-workspace-attachments";
 import type { AgentAttachment } from "@server/shared/messages";
 import { buildGitHubAttachmentFromSearchItem } from "@/utils/review-attachments";
 
@@ -17,6 +18,14 @@ export function splitComposerAttachmentsForSubmit(attachments: ComposerAttachmen
       continue;
     }
 
+    if (composerWorkspaceAttachment.is(attachment)) {
+      const workspaceAttachment = composerWorkspaceAttachment.toSubmitAttachment(attachment);
+      if (workspaceAttachment) {
+        reviewAttachments.push(workspaceAttachment);
+      }
+      continue;
+    }
+
     const reviewAttachment = buildGitHubAttachmentFromSearchItem(attachment.item);
     if (reviewAttachment) {
       reviewAttachments.push(reviewAttachment);

packages/app/src/components/composer.test.tsx

@@ -4,10 +4,16 @@ import { createRoot, type Root } from "react-dom/client";
 import { JSDOM } from "jsdom";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-import type { AttachmentMetadata, ComposerAttachment } from "@/attachments/types";
-import type { GitHubSearchItem } from "@server/shared/messages";
+import type {
+  AttachmentMetadata,
+  ComposerAttachment,
+  UserComposerAttachment,
+} from "@/attachments/types";
+import { composerWorkspaceAttachment } from "@/attachments/composer-workspace-attachments";
+import type { AgentAttachment, GitHubSearchItem } from "@server/shared/messages";
 import { Composer } from "./composer";
 import { splitComposerAttachmentsForSubmit } from "./composer-attachments";
+import { addReviewDraftComment, getReviewDraftComments, resetReviewDraftStore } from "@/review";
 
 const keyboardActionHandlerMock = vi.hoisted(() => vi.fn());
 
@@ -27,6 +33,7 @@ const {
   setAgentStreamHeadMock,
   setQueuedMessagesMock,
   agentDirectoryStatusMock,
+  appSendBehavior,
 } = vi.hoisted(() => {
   const hoistedTheme = {
     spacing: { 1: 4, 2: 8, 3: 12, 4: 16, 6: 24, 8: 32 },
@@ -35,6 +42,8 @@ const {
     borderRadius: { full: 999, md: 6, lg: 8, "2xl": 16 },
     fontSize: { xs: 11, sm: 13, base: 15, lg: 18 },
     fontWeight: { normal: "400", medium: "500" },
+    lineHeight: { diff: 18 },
+    opacity: { 50: 0.5 },
     shadow: { md: {} },
     colors: {
       surface0: "#000",
@@ -99,7 +108,12 @@ const {
     cancelAgent: vi.fn(async () => {}),
   };
 
-  const hoistedSetQueuedMessagesMock = vi.fn();
+  const hoistedSetQueuedMessagesMock = vi.fn(
+    (serverId: string, updater: (prev: Map<string, unknown[]>) => Map<string, unknown[]>) => {
+      const session = hoistedMockSessionState.sessions[serverId];
+      session.queuedMessages = updater(session.queuedMessages);
+    },
+  );
   const hoistedMockSessionState: {
     sessions: Record<
       string,
@@ -161,6 +175,7 @@ const {
   hoistedMockSessionState.setAgentStreamTail = hoistedSetAgentStreamTailMock;
   hoistedMockSessionState.setAgentStreamHead = hoistedSetAgentStreamHeadMock;
   const hoistedAgentDirectoryStatusMock = vi.fn(() => "ready");
+  const hoistedAppSendBehavior = { current: "interrupt" as "interrupt" | "queue" };
 
   return {
     theme: hoistedTheme,
@@ -178,6 +193,7 @@ const {
     setAgentStreamHeadMock: hoistedSetAgentStreamHeadMock,
     setQueuedMessagesMock: hoistedSetQueuedMessagesMock,
     agentDirectoryStatusMock: hoistedAgentDirectoryStatusMock,
+    appSendBehavior: hoistedAppSendBehavior,
   };
 });
 
@@ -210,7 +226,9 @@ vi.mock("lucide-react-native", () => {
     Pencil: createIcon("Pencil"),
     AudioLines: createIcon("AudioLines"),
     CircleDot: createIcon("CircleDot"),
+    MousePointer2: createIcon("MousePointer2"),
     GitPullRequest: createIcon("GitPullRequest"),
+    MessageSquareCode: createIcon("MessageSquareCode"),
     X: createIcon("X"),
     Mic: createIcon("Mic"),
     MicOff: createIcon("MicOff"),
@@ -297,7 +315,7 @@ vi.mock("@/utils/open-external-url", () => ({
 }));
 
 vi.mock("@/hooks/use-settings", () => ({
-  useAppSettings: () => ({ settings: { sendBehavior: "interrupt" } }),
+  useAppSettings: () => ({ settings: { sendBehavior: appSendBehavior.current } }),
 }));
 
 vi.mock("@/hooks/use-agent-autocomplete", () => ({
@@ -555,9 +573,118 @@ let root: Root | null = null;
 let container: HTMLElement | null = null;
 let queryClient: QueryClient | null = null;
 let latestAttachments: ComposerAttachment[] = [];
+let workspaceBindingRenderCount = 0;
+
+type ReviewComposerAttachment = Extract<ComposerAttachment, { kind: "review" }>;
+type ReviewAttachment = Extract<AgentAttachment, { type: "review" }>;
+type BrowserElementComposerAttachment = Extract<ComposerAttachment, { kind: "browser_element" }>;
+
+function reviewAttachment(body: string): ReviewAttachment {
+  return {
+    type: "review",
+    mimeType: "application/paseo-review",
+    cwd: "/repo",
+    mode: "uncommitted",
+    baseRef: null,
+    comments: [
+      {
+        filePath: "src/example.ts",
+        side: "new",
+        lineNumber: 41,
+        body,
+        context: {
+          hunkHeader: "@@ -40,2 +40,2 @@",
+          targetLine: {
+            oldLineNumber: null,
+            newLineNumber: 41,
+            type: "add",
+            content: "const value = newValue;",
+          },
+          lines: [
+            {
+              oldLineNumber: null,
+              newLineNumber: 41,
+              type: "add",
+              content: "const value = newValue;",
+            },
+          ],
+        },
+      },
+    ],
+  };
+}
+
+function reviewComposerAttachment(body: string): ReviewComposerAttachment {
+  return {
+    kind: "review",
+    reviewDraftKey: `review:${body}`,
+    commentCount: 1,
+    attachment: reviewAttachment(body),
+  };
+}
+
+function browserElementComposerAttachment(): BrowserElementComposerAttachment {
+  return {
+    kind: "browser_element",
+    attachment: {
+      url: "https://example.com/page",
+      selector: "button.primary",
+      tag: "button",
+      text: "Save",
+      outerHTML: '<button class="primary">Save</button>',
+      computedStyles: { display: "flex" },
+      boundingRect: { x: 1, y: 2, width: 80, height: 32 },
+      reactSource: {
+        fileName: "src/save-button.tsx",
+        lineNumber: 12,
+        columnNumber: 3,
+        componentName: "SaveButton",
+      },
+      parentChain: ["form.settings"],
+      children: [],
+      formatted: '<browser-element url="https://example.com/page">button.primary</browser-element>',
+    },
+  };
+}
+
+function cloneReviewComposerAttachment(
+  attachment: ReviewComposerAttachment,
+): ReviewComposerAttachment {
+  return {
+    ...attachment,
+    attachment: {
+      ...attachment.attachment,
+      comments: attachment.attachment.comments.map((comment) => ({
+        ...comment,
+        context: {
+          ...comment.context,
+          targetLine: { ...comment.context.targetLine },
+          lines: comment.context.lines.map((line) => ({ ...line })),
+        },
+      })),
+    },
+  };
+}
+
+function seedReviewDraft(key: string) {
+  addReviewDraftComment({
+    key,
+    comment: {
+      id: `${key}:comment`,
+      filePath: "src/example.ts",
+      side: "new",
+      lineNumber: 41,
+      body: "Please simplify this.",
+      createdAt: "2026-04-21T00:00:00.000Z",
+      updatedAt: "2026-04-21T00:00:00.000Z",
+    },
+  });
+}
 
 beforeEach(() => {
-  const dom = new JSDOM("<!doctype html><html><body></body></html>");
+  const dom = new JSDOM("<!doctype html><html><body></body></html>", {
+    url: "http://localhost",
+  });
   vi.stubGlobal("React", React);
   vi.stubGlobal("IS_REACT_ACT_ENVIRONMENT", true);
   vi.stubGlobal("window", dom.window);
@@ -570,6 +697,7 @@ beforeEach(() => {
     attachEvent: vi.fn(),
     detachEvent: vi.fn(),
   });
+  vi.stubGlobal("localStorage", dom.window.localStorage);
 
   container = document.createElement("div");
   document.body.appendChild(container);
@@ -590,6 +718,8 @@ beforeEach(() => {
   keyboardActionHandlerMock.mockClear();
   agentDirectoryStatusMock.mockReset();
   agentDirectoryStatusMock.mockReturnValue("ready");
+  appSendBehavior.current = "interrupt";
+  workspaceBindingRenderCount = 0;
   mockSessionState.sessions.server.serverInfo = {
     serverId: "server",
     hostname: "test",
@@ -607,6 +737,10 @@ beforeEach(() => {
   mockSessionState.sessions.server.agentStreamHead = new Map();
   mockSessionState.sessions.server.agentStreamTail = new Map();
   mockSessionState.sessions.server.queuedMessages = new Map();
+  mockSessionState.sessions.server.agents = new Map([
+    ["agent", { status: "idle", lastUsage: null }],
+  ]);
+  resetReviewDraftStore();
 });
 
 afterEach(() => {
@@ -634,20 +768,30 @@ function imageAttachment(id: string): AttachmentMetadata {
 function ComposerHarness({
   initialText = "",
   initialAttachments = [],
+  workspaceAttachment = null,
   isSubmitLoading = false,
   submitBehavior,
 }: {
   initialText?: string;
-  initialAttachments?: ComposerAttachment[];
+  initialAttachments?: UserComposerAttachment[];
+  workspaceAttachment?: ReviewComposerAttachment | null;
   isSubmitLoading?: boolean;
   submitBehavior?: "clear" | "preserve-and-lock";
 }) {
   const [text, setText] = useState(initialText);
   const [attachments, setAttachments] = useState(initialAttachments);
+  const workspaceAttachments = React.useMemo(
+    () => (workspaceAttachment ? [workspaceAttachment] : []),
+    [workspaceAttachment],
+  );
   latestAttachments = attachments;
 
   const handleChangeAttachments = React.useCallback(
-    (updater: ComposerAttachment[] | ((current: ComposerAttachment[]) => ComposerAttachment[])) => {
+    (
+      updater:
+        | UserComposerAttachment[]
+        | ((current: UserComposerAttachment[]) => UserComposerAttachment[]),
+    ) => {
       setAttachments((current) => {
         const next = typeof updater === "function" ? updater(current) : updater;
         latestAttachments = next;
@@ -666,6 +810,7 @@ function ComposerHarness({
         value={text}
         onChangeText={setText}
         attachments={attachments}
+        workspaceAttachments={workspaceAttachments}
         onChangeAttachments={handleChangeAttachments}
         isSubmitLoading={isSubmitLoading}
         submitBehavior={submitBehavior}
@@ -679,7 +824,8 @@ function ComposerHarness({
 function renderComposer(
   input: {
     initialText?: string;
-    initialAttachments?: ComposerAttachment[];
+    initialAttachments?: UserComposerAttachment[];
+    workspaceAttachment?: ReviewComposerAttachment | null;
     isSubmitLoading?: boolean;
     submitBehavior?: "clear" | "preserve-and-lock";
   } = {},
@@ -689,6 +835,20 @@ function renderComposer(
   });
 }
 
+function WorkspaceAttachmentBindingHarness({
+  workspaceAttachment,
+}: {
+  workspaceAttachment: ReviewComposerAttachment;
+}) {
+  workspaceBindingRenderCount += 1;
+  const { selectedAttachments } = composerWorkspaceAttachment.useBinding({
+    normalAttachments: [],
+    workspaceAttachments: [workspaceAttachment],
+  });
+
+  return <div data-testid="workspace-binding-count">{selectedAttachments.length}</div>;
+}
+
 function click(element: Element) {
   act(() => {
     element.dispatchEvent(new window.MouseEvent("click", { bubbles: true }));
@@ -903,6 +1063,261 @@ describe("Composer attachments", () => {
     );
   });
 
+  it("serializes workspace review attachments through the structured attachment path", async () => {
+    const review = reviewComposerAttachment("Please simplify this.");
+    expect(splitComposerAttachmentsForSubmit([review])).toEqual({
+      images: [],
+      attachments: [review.attachment],
+    });
+  });
+
+  it("serializes browser element workspace attachments as generic text attachments", async () => {
+    const browserElement = browserElementComposerAttachment();
+    expect(splitComposerAttachmentsForSubmit([browserElement])).toEqual({
+      images: [],
+      attachments: [
+        {
+          type: "text",
+          mimeType: "text/plain",
+          title: "Browser element · button",
+          text: browserElement.attachment.formatted,
+        },
+      ],
+    });
+  });
+
+  it("does not enqueue redundant binding renders for equivalent workspace attachments", async () => {
+    const review = reviewComposerAttachment("Stable workspace review.");
+
+    act(() => {
+      root?.render(<WorkspaceAttachmentBindingHarness workspaceAttachment={review} />);
+    });
+    await flushAsyncWork();
+
+    expect(workspaceBindingRenderCount).toBe(1);
+    expect(queryByTestId("workspace-binding-count")?.textContent).toBe("1");
+
+    act(() => {
+      root?.render(
+        <WorkspaceAttachmentBindingHarness
+          workspaceAttachment={cloneReviewComposerAttachment(review)}
+        />,
+      );
+    });
+    await flushAsyncWork();
+
+    expect(workspaceBindingRenderCount).toBe(2);
+    expect(queryByTestId("workspace-binding-count")?.textContent).toBe("1");
+  });
+
+  it("renders and submits a workspace review attachment pill", async () => {
+    const review = reviewComposerAttachment("Please simplify this.");
+    renderComposer({
+      initialText: "review this",
+      workspaceAttachment: review,
+    });
+
+    expect(queryByTestId("composer-review-attachment-pill")?.textContent).toContain("Review");
+    expect(queryByTestId("composer-review-attachment-pill")?.textContent).toContain("1 comment");
+
+    click(document.querySelector('[aria-label="Send message"]')!);
+    await flushAsyncWork();
+
+    expect(mockClient.sendAgentMessage).toHaveBeenCalledWith(
+      "agent",
+      "review this",
+      expect.objectContaining({
+        attachments: [review.attachment],
+      }),
+    );
+  });
+
+  it("clears the included workspace review draft after a successful submit", async () => {
+    const review = reviewComposerAttachment("Clear submitted review draft.");
+    seedReviewDraft(review.reviewDraftKey);
+    renderComposer({
+      initialText: "review this",
+      workspaceAttachment: review,
+    });
+
+    click(document.querySelector('[aria-label="Send message"]')!);
+    await flushAsyncWork();
+
+    expect(getReviewDraftComments(review.reviewDraftKey)).toBeUndefined();
+  });
+
+  it("restores only normal attachments when a submit with a workspace review fails", async () => {
+    const image = imageAttachment("img-failure");
+    const review = reviewComposerAttachment("This should be sent but not persisted.");
+    seedReviewDraft(review.reviewDraftKey);
+    mockClient.sendAgentMessage.mockRejectedValueOnce(new Error("network down"));
+    renderComposer({
+      initialText: "review this",
+      initialAttachments: [{ kind: "image", metadata: image }],
+      workspaceAttachment: review,
+    });
+
+    click(document.querySelector('[aria-label="Send message"]')!);
+    await flushAsyncWork();
+
+    expect(mockClient.sendAgentMessage).toHaveBeenCalledWith(
+      "agent",
+      "review this",
+      expect.objectContaining({
+        attachments: [review.attachment],
+      }),
+    );
+    expect(latestAttachments).toEqual([{ kind: "image", metadata: image }]);
+    expect(getReviewDraftComments(review.reviewDraftKey)).toHaveLength(1);
+  });
+
+  it("clears workspace review suppression after a send lifecycle", async () => {
+    const review = reviewComposerAttachment("Keep this available for the next message.");
+    renderComposer({
+      initialText: "send without review",
+      workspaceAttachment: review,
+    });
+
+    click(document.querySelector('[aria-label="Remove review attachment"]')!);
+    expect(queryByTestId("composer-review-attachment-pill")).toBeNull();
+
+    click(document.querySelector('[aria-label="Send message"]')!);
+    await flushAsyncWork();
+
+    expect(mockClient.sendAgentMessage).toHaveBeenCalledWith(
+      "agent",
+      "send without review",
+      expect.objectContaining({
+        attachments: [],
+      }),
+    );
+    expect(queryByTestId("composer-review-attachment-pill")).not.toBeNull();
+  });
+
+  it("keeps workspace review suppressed after a failed send", async () => {
+    const review = reviewComposerAttachment("Do not send this on retry.");
+    mockClient.sendAgentMessage.mockRejectedValueOnce(new Error("network down"));
+    renderComposer({
+      initialText: "retry without review",
+      workspaceAttachment: review,
+    });
+
+    click(document.querySelector('[aria-label="Remove review attachment"]')!);
+    expect(queryByTestId("composer-review-attachment-pill")).toBeNull();
+
+    click(document.querySelector('[aria-label="Send message"]')!);
+    await flushAsyncWork();
+
+    expect(mockClient.sendAgentMessage).toHaveBeenNthCalledWith(
+      1,
+      "agent",
+      "retry without review",
+      expect.objectContaining({
+        attachments: [],
+      }),
+    );
+    expect(queryByTestId("composer-review-attachment-pill")).toBeNull();
+
+    click(document.querySelector('[aria-label="Send message"]')!);
+    await flushAsyncWork();
+
+    expect(mockClient.sendAgentMessage).toHaveBeenNthCalledWith(
+      2,
+      "agent",
+      "retry without review",
+      expect.objectContaining({
+        attachments: [],
+      }),
+    );
+  });
+
+  it("captures workspace review attachments at queue time", async () => {
+    appSendBehavior.current = "queue";
+    mockSessionState.sessions.server.agents.set("agent", { status: "running", lastUsage: null });
+    const initialReview = reviewComposerAttachment("Initial queued review.");
+    const editedReview = reviewComposerAttachment("Edited after queue.");
+    renderComposer({
+      initialText: "queue this",
+      workspaceAttachment: initialReview,
+    });
+
+    click(document.querySelector('[aria-label="Queue message"]')!);
+    await flushAsyncWork();
+    renderComposer({
+      initialText: "",
+      workspaceAttachment: editedReview,
+    });
+
+    const queued = mockSessionState.sessions.server.queuedMessages.get("agent") as Array<{
+      attachments: ComposerAttachment[];
+    }>;
+    expect(queued[0]?.attachments).toEqual([initialReview]);
+  });
+
+  it("clears the included workspace review draft after queueing", async () => {
+    appSendBehavior.current = "queue";
+    mockSessionState.sessions.server.agents.set("agent", { status: "running", lastUsage: null });
+    const review = reviewComposerAttachment("Clear queued review draft.");
+    seedReviewDraft(review.reviewDraftKey);
+    renderComposer({
+      initialText: "queue this",
+      workspaceAttachment: review,
+    });
+
+    click(document.querySelector('[aria-label="Queue message"]')!);
+    await flushAsyncWork();
+
+    expect(getReviewDraftComments(review.reviewDraftKey)).toBeUndefined();
+  });
+
+  it("clears workspace review suppression after queueing a message", async () => {
+    appSendBehavior.current = "queue";
+    mockSessionState.sessions.server.agents.set("agent", { status: "running", lastUsage: null });
+    const review = reviewComposerAttachment("Queue without this review first.");
+    renderComposer({
+      initialText: "queue without review",
+      workspaceAttachment: review,
+    });
+
+    click(document.querySelector('[aria-label="Remove review attachment"]')!);
+    expect(queryByTestId("composer-review-attachment-pill")).toBeNull();
+
+    click(document.querySelector('[aria-label="Queue message"]')!);
+    await flushAsyncWork();
+
+    const queued = mockSessionState.sessions.server.queuedMessages.get("agent") as Array<{
+      attachments: ComposerAttachment[];
+    }>;
+    expect(queued[0]?.attachments).toEqual([]);
+    expect(queryByTestId("composer-review-attachment-pill")).not.toBeNull();
+  });
+
+  it("does not restore queued workspace review attachments into live draft attachments when editing", async () => {
+    appSendBehavior.current = "queue";
+    mockSessionState.sessions.server.agents.set("agent", { status: "running", lastUsage: null });
+    const image = imageAttachment("img-queued-edit");
+    const review = reviewComposerAttachment("Queued snapshot.");
+    renderComposer({
+      initialText: "queue this",
+      initialAttachments: [{ kind: "image", metadata: image }],
+      workspaceAttachment: review,
+    });
+
+    click(document.querySelector('[aria-label="Queue message"]')!);
+    await flushAsyncWork();
+    expect(
+      (
+        mockSessionState.sessions.server.queuedMessages.get("agent") as Array<{
+          attachments: ComposerAttachment[];
+        }>
+      )[0]?.attachments,
+    ).toEqual([{ kind: "image", metadata: image }, review]);
+
+    click(document.querySelector('[aria-label="Edit queued message"]')!);
+
+    expect(latestAttachments).toEqual([{ kind: "image", metadata: image }]);
+  });
+
   it("submits empty wire arrays when there are no composer attachments", async () => {
     renderComposer({ initialText: "plain message" });
 

packages/app/src/components/composer.tsx

@@ -70,7 +70,13 @@ import { submitAgentInput } from "@/components/agent-input-submit";
 import { useAppSettings } from "@/hooks/use-settings";
 import { isWeb, isNative } from "@/constants/platform";
 import type { GitHubSearchItem } from "@server/shared/messages";
-import type { AttachmentMetadata, ComposerAttachment } from "@/attachments/types";
+import type {
+  AttachmentMetadata,
+  ComposerAttachment,
+  UserComposerAttachment,
+  WorkspaceComposerAttachment,
+} from "@/attachments/types";
+import { composerWorkspaceAttachment } from "@/attachments/composer-workspace-attachments";
 import { useAttachmentPreviewUrl } from "@/attachments/use-attachment-preview-url";
 import { Combobox, ComboboxItem, type ComboboxOption } from "@/components/ui/combobox";
 import { splitComposerAttachmentsForSubmit } from "@/components/composer-attachments";
@@ -86,8 +92,8 @@ interface QueuedMessage {
 }
 
 type AttachmentListUpdater =
-  | ComposerAttachment[]
-  | ((prev: ComposerAttachment[]) => ComposerAttachment[]);
+  | UserComposerAttachment[]
+  | ((prev: UserComposerAttachment[]) => UserComposerAttachment[]);
 
 function noop() {}
 
@@ -145,7 +151,7 @@ async function pickAndPersistImages(
   );
 }
 
-function removeAttachmentAtIndex(prev: ComposerAttachment[], index: number): ComposerAttachment[] {
+function removeAttachmentAtIndex<T extends ComposerAttachment>(prev: T[], index: number): T[] {
   const removed = prev[index];
   if (removed?.kind === "image") {
     void deleteAttachments([removed.metadata]);
@@ -242,26 +248,28 @@ function findGithubItemByOption(
 }
 
 function isAttachmentSelectedForGithubItem(
-  attachments: readonly ComposerAttachment[],
+  current: readonly ComposerAttachment[],
   item: GitHubSearchItem,
 ): boolean {
-  return attachments.some(
-    (attachment) =>
-      attachment.kind !== "image" &&
-      attachment.item.kind === item.kind &&
-      attachment.item.number === item.number,
-  );
+  return composerWorkspaceAttachment
+    .userAttachmentsOnly(current)
+    .some(
+      (attachment) =>
+        attachment.kind !== "image" &&
+        attachment.item.kind === item.kind &&
+        attachment.item.number === item.number,
+    );
 }
 
-function buildGithubAttachment(item: GitHubSearchItem): ComposerAttachment {
+function buildGithubAttachment(item: GitHubSearchItem): UserComposerAttachment {
   return item.kind === "pr" ? { kind: "github_pr", item } : { kind: "github_issue", item };
 }
 
 function toggleGithubAttachment(
-  current: ComposerAttachment[],
+  current: UserComposerAttachment[],
   item: GitHubSearchItem,
-): ComposerAttachment[] {
-  const matches = (attachment: ComposerAttachment) =>
+): UserComposerAttachment[] {
+  const matches = (attachment: UserComposerAttachment) =>
     attachment.kind !== "image" &&
     attachment.item.kind === item.kind &&
     attachment.item.number === item.number;
@@ -361,6 +369,15 @@ function renderComposerAttachmentPill(args: RenderComposerAttachmentPillArgs): R
       />
     );
   }
+  if (composerWorkspaceAttachment.is(attachment)) {
+    return composerWorkspaceAttachment.renderPill({
+      attachment,
+      index,
+      disabled,
+      onOpen,
+      onRemove,
+    });
+  }
   return (
     <GithubAttachmentPill
       key={`${attachment.item.kind}:${attachment.item.number}`}
@@ -446,6 +463,7 @@ async function dispatchAgentMessageSend(args: DispatchAgentMessageSendArgs): Pro
     text,
     timestamp: new Date(),
     ...(wirePayload.images.length > 0 ? { images: wirePayload.images } : {}),
+    ...(wirePayload.attachments.length > 0 ? { attachments: wirePayload.attachments } : {}),
   };
   appendUserMessageToStream({ ...args, userMessage });
   const imagesData = await encodeImages(wirePayload.images);
@@ -459,11 +477,16 @@ async function dispatchAgentMessageSend(args: DispatchAgentMessageSendArgs): Pro
 function openComposerAttachment(
   attachment: ComposerAttachment,
   setLightboxMetadata: (metadata: AttachmentMetadata) => void,
+  openWorkspaceAttachment: (input: { attachment: ComposerAttachment }) => boolean,
 ): void {
   if (attachment.kind === "image") {
     setLightboxMetadata(attachment.metadata);
     return;
   }
+  if (composerWorkspaceAttachment.is(attachment)) {
+    openWorkspaceAttachment({ attachment });
+    return;
+  }
   void openExternalUrl(attachment.item.url);
 }
 
@@ -596,10 +619,18 @@ function QueuedMessageRow({ item, onEdit, onSendNow }: QueuedMessageRowProps) {
         {item.text}
       </Text>
       <View style={styles.queueActions}>
-        <Pressable onPress={handleEdit} style={styles.queueActionButton}>
+        <Pressable
+          onPress={handleEdit}
+          style={styles.queueActionButton}
+          accessibilityLabel="Edit queued message"
+        >
           <ThemedPencil size={ICON_SIZE.sm} uniProps={iconForegroundMapping} />
         </Pressable>
-        <Pressable onPress={handleSendNow} style={QUEUE_SEND_BUTTON_STYLE}>
+        <Pressable
+          onPress={handleSendNow}
+          style={QUEUE_SEND_BUTTON_STYLE}
+          accessibilityLabel="Send queued message now"
+        >
           <ArrowUp size={ICON_SIZE.sm} color="white" />
         </Pressable>
       </View>
@@ -652,7 +683,7 @@ function ImageAttachmentPill({
 }
 
 interface GithubAttachmentPillProps {
-  attachment: Exclude<ComposerAttachment, { kind: "image" }>;
+  attachment: Extract<ComposerAttachment, { kind: "github_pr" | "github_issue" }>;
   index: number;
   disabled: boolean;
   onOpen: (attachment: ComposerAttachment) => void;
@@ -759,7 +790,9 @@ interface ComposerProps {
   blurOnSubmit?: boolean;
   value: string;
   onChangeText: (text: string) => void;
-  attachments: ComposerAttachment[];
+  attachments: UserComposerAttachment[];
+  workspaceAttachments?: readonly WorkspaceComposerAttachment[];
+  onOpenWorkspaceAttachment?: (attachment: WorkspaceComposerAttachment) => void;
   onChangeAttachments: (updater: AttachmentListUpdater) => void;
   cwd: string;
   clearDraft: (lifecycle: "sent" | "abandoned") => void;
@@ -820,9 +853,7 @@ function ComposerCancelButton({
   ) : (
     <Square size={buttonIconSize} color="white" fill="white" />
   );
-  const shortcutNode = agentInterruptKeys ? (
-    <Shortcut chord={agentInterruptKeys} style={styles.tooltipShortcut} />
-  ) : null;
+  const shortcutNode = agentInterruptKeys ? <Shortcut chord={agentInterruptKeys} /> : null;
   return (
     <Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile={false}>
       <TooltipTrigger
@@ -908,9 +939,7 @@ function ComposerVoiceModeButton({
   realtimeVoiceButtonStyle,
   voiceToggleKeys,
 }: ComposerVoiceModeButtonProps) {
-  const shortcutNode = voiceToggleKeys ? (
-    <Shortcut chord={voiceToggleKeys} style={styles.tooltipShortcut} />
-  ) : null;
+  const shortcutNode = voiceToggleKeys ? <Shortcut chord={voiceToggleKeys} /> : null;
   const renderTriggerContent = useCallback(
     ({ hovered }: PressableStateCallbackType & { hovered?: boolean }) => {
       if (isVoiceSwitching) {
@@ -957,6 +986,8 @@ export function Composer({
   value,
   onChangeText,
   attachments,
+  workspaceAttachments = [],
+  onOpenWorkspaceAttachment,
   onChangeAttachments,
   cwd,
   clearDraft,
@@ -1005,7 +1036,19 @@ export function Composer({
   const messagePlaceholder = resolveMessagePlaceholder(isDesktopWebBreakpoint);
   const userInput = value;
   const setUserInput = onChangeText;
-  const selectedAttachments = attachments;
+  const {
+    selectedAttachments,
+    buildOutgoingAttachments,
+    removeAttachment,
+    openAttachment,
+    clearSentAttachments,
+    completeSubmit,
+    resetSuppression,
+  } = composerWorkspaceAttachment.useBinding({
+    normalAttachments: attachments,
+    workspaceAttachments,
+    onOpenWorkspaceAttachment,
+  });
   const setSelectedAttachments = onChangeAttachments;
   const [cursorIndex, setCursorIndex] = useState(0);
   const [isProcessing, setIsProcessing] = useState(false);
@@ -1162,8 +1205,18 @@ export function Composer({
 
       setUserInput("");
       setSelectedAttachments([]);
+      resetSuppression();
+      clearSentAttachments(queuedAttachments);
     },
-    [agentId, serverId, setQueuedMessages, setSelectedAttachments, setUserInput],
+    [
+      agentId,
+      clearSentAttachments,
+      resetSuppression,
+      serverId,
+      setQueuedMessages,
+      setSelectedAttachments,
+      setUserInput,
+    ],
   );
 
   const sendMessageWithContent = useCallback(
@@ -1172,7 +1225,7 @@ export function Composer({
       outgoingAttachments: ComposerAttachment[],
       forceSend?: boolean,
     ) => {
-      await submitAgentInput({
+      const result = await submitAgentInput({
         message: outgoingMessage,
         attachments: outgoingAttachments,
         hasExternalContent,
@@ -1192,7 +1245,7 @@ export function Composer({
         clearDraft,
         setUserInput,
         setAttachments: (nextAttachments) => {
-          setSelectedAttachments(nextAttachments);
+          setSelectedAttachments(composerWorkspaceAttachment.userAttachmentsOnly(nextAttachments));
         },
         setSendError,
         setIsProcessing,
@@ -1200,10 +1253,15 @@ export function Composer({
           console.error("[AgentInput] Failed to send message:", error);
         },
       });
+      completeSubmit({
+        result,
+        outgoingAttachments,
+      });
     },
     [
       allowEmptySubmit,
       clearDraft,
+      completeSubmit,
       hasExternalContent,
       isAgentRunning,
       queueMessage,
@@ -1219,9 +1277,13 @@ export function Composer({
       if (blurOnSubmit) {
         messageInputRef.current?.blur();
       }
-      void sendMessageWithContent(payload.text, payload.attachments, payload.forceSend);
+      void sendMessageWithContent(
+        payload.text,
+        buildOutgoingAttachments(attachments),
+        payload.forceSend,
+      );
     },
-    [blurOnSubmit, sendMessageWithContent],
+    [attachments, blurOnSubmit, buildOutgoingAttachments, sendMessageWithContent],
   );
 
   const handlePickImage = useCallback(async () => {
@@ -1232,14 +1294,24 @@ export function Composer({
 
   const handleRemoveAttachment = useCallback(
     (index: number) => {
+      const didRemoveWorkspaceAttachment = removeAttachment({
+        selectedAttachments,
+        index,
+      });
+      if (didRemoveWorkspaceAttachment) {
+        return;
+      }
       setSelectedAttachments((prev) => removeAttachmentAtIndex(prev, index));
     },
-    [setSelectedAttachments],
+    [removeAttachment, selectedAttachments, setSelectedAttachments],
   );
 
-  const handleOpenAttachment = useCallback((attachment: ComposerAttachment) => {
-    openComposerAttachment(attachment, setLightboxMetadata);
-  }, []);
+  const handleOpenAttachment = useCallback(
+    (attachment: ComposerAttachment) => {
+      openComposerAttachment(attachment, setLightboxMetadata, openAttachment);
+    },
+    [openAttachment],
+  );
 
   useEffect(() => {
     if (!isAgentRunning || !isConnected) {
@@ -1327,7 +1399,7 @@ export function Composer({
 
       updateQueue((current) => current.filter((q) => q.id !== id));
       setUserInput(item.text);
-      setSelectedAttachments(item.attachments);
+      setSelectedAttachments(composerWorkspaceAttachment.userAttachmentsOnly(item.attachments));
     },
     [queuedMessages, setSelectedAttachments, setUserInput, updateQueue],
   );
@@ -1353,9 +1425,9 @@ export function Composer({
 
   const handleQueue = useCallback(
     (payload: MessagePayload) => {
-      queueMessage(payload.text, payload.attachments);
+      queueMessage(payload.text, buildOutgoingAttachments(attachments));
     },
-    [queueMessage],
+    [attachments, buildOutgoingAttachments, queueMessage],
   );
 
   const hasSendableContent = userInput.trim().length > 0 || selectedAttachments.length > 0;
@@ -1408,7 +1480,6 @@ export function Composer({
     ],
   );
 
-  const isVoiceSwitchingValue = voice?.isVoiceSwitching ?? false;
   const rightContent = useMemo(
     () => (
       <ComposerRightControlsSlot
@@ -1420,7 +1491,7 @@ export function Composer({
         buttonIconSize={buttonIconSize}
         handleToggleRealtimeVoice={handleToggleRealtimeVoice}
         isConnected={isConnected}
-        isVoiceSwitching={isVoiceSwitchingValue}
+        isVoiceSwitching={isVoiceSwitching}
         realtimeVoiceButtonStyle={realtimeVoiceButtonStyle}
         voiceToggleKeys={voiceToggleKeys}
         cancelButton={cancelButton}
@@ -1436,7 +1507,7 @@ export function Composer({
       isConnected,
       isProcessing,
       isVoiceModeForAgent,
-      isVoiceSwitchingValue,
+      isVoiceSwitching,
       realtimeVoiceButtonStyle,
       voiceToggleKeys,
     ],
@@ -1799,10 +1870,6 @@ const styles = StyleSheet.create((theme: Theme) => ({
     fontSize: theme.fontSize.sm,
     color: theme.colors.popoverForeground,
   },
-  tooltipShortcut: {
-    backgroundColor: theme.colors.surface3,
-    borderColor: theme.colors.borderAccent,
-  },
   buttonDisabled: {
     opacity: 0.5,
   },

packages/app/src/components/context-window-meter.tsx

@@ -138,7 +138,6 @@ const styles = StyleSheet.create((theme) => ({
   tooltipTitle: {
     color: theme.colors.foreground,
     fontSize: theme.fontSize.sm,
-    fontWeight: theme.fontWeight.semibold,
   },
   tooltipText: {
     color: theme.colors.foreground,

packages/app/src/components/explorer-sidebar.tsx

@@ -483,6 +483,7 @@ function SidebarContent({
             workspaceId={workspaceId}
             cwd={workspaceRoot}
             hideHeaderRow={!isMobile}
+            enabled={isOpen}
           />
         )}
         {resolvedTab === "files" && (

packages/app/src/components/file-pane.tsx

@@ -1,5 +1,6 @@
 import React, { useMemo, useRef } from "react";
 import { useQuery } from "@tanstack/react-query";
+import type { FileReadResult } from "@server/client/daemon-client";
 import Markdown, { MarkdownIt } from "react-native-markdown-display";
 import {
   ActivityIndicator,
@@ -27,8 +28,9 @@ import { isWeb } from "@/constants/platform";
 import { createMarkdownStyles } from "@/styles/markdown-styles";
 import type { AttachmentMetadata } from "@/attachments/types";
 import { useAttachmentPreviewUrl } from "@/attachments/use-attachment-preview-url";
-import { persistAttachmentFromBase64 } from "@/attachments/service";
+import { persistAttachmentFromBytes } from "@/attachments/service";
 import { createPreviewAttachmentId, getFileNameFromPath } from "@/attachments/utils";
+import { explorerFileFromReadResult } from "@/file-explorer/read-result";
 
 interface CodeLineProps {
   tokens: HighlightToken[];
@@ -65,30 +67,34 @@ function formatFileSize({ size }: { size: number }): string {
   return `${(size / (1024 * 1024)).toFixed(1)} MB`;
 }
 
-async function createFilePanePreview(file: ExplorerFile | null): Promise<{
+async function createFilePanePreview(file: FileReadResult | null): Promise<{
   file: ExplorerFile | null;
   imageAttachment: AttachmentMetadata | null;
 }> {
-  if (!file || file.kind !== "image" || !file.content) {
-    return { file, imageAttachment: null };
+  if (!file) {
+    return { file: null, imageAttachment: null };
   }
 
-  const { content: _content, ...imageFile } = file;
-  const imageAttachment = await persistAttachmentFromBase64({
+  const explorerFile = explorerFileFromReadResult(file);
+  if (file.kind !== "image") {
+    return { file: explorerFile, imageAttachment: null };
+  }
+
+  const imageAttachment = await persistAttachmentFromBytes({
     id: createPreviewAttachmentId({
-      mimeType: file.mimeType ?? "image/png",
+      mimeType: file.mime,
       path: file.path,
       size: file.size,
       modifiedAt: file.modifiedAt,
-      contentLength: file.content.length,
+      contentLength: file.bytes.byteLength,
     }),
-    base64: file.content,
-    mimeType: file.mimeType,
+    bytes: file.bytes,
+    mimeType: file.mime,
     fileName: getFileNameFromPath(file.path),
   });
 
   return {
-    file: imageFile,
+    file: explorerFile,
     imageAttachment,
   };
 }
@@ -358,17 +364,21 @@ export function FilePane({
       if (!client || !normalizedWorkspaceRoot || !normalizedFilePath) {
         return { file: null as ExplorerFile | null, error: "Host is not connected" };
       }
-      const payload = await client.exploreFileSystem(
-        normalizedWorkspaceRoot,
-        normalizedFilePath,
-        "file",
-      );
-      const preview = await createFilePanePreview(payload.file ?? null);
-      return {
-        file: preview.file,
-        imageAttachment: preview.imageAttachment,
-        error: payload.error ?? null,
-      };
+      try {
+        const file = await client.readFile(normalizedWorkspaceRoot, normalizedFilePath);
+        const preview = await createFilePanePreview(file);
+        return {
+          file: preview.file,
+          imageAttachment: preview.imageAttachment,
+          error: null,
+        };
+      } catch (error) {
+        return {
+          file: null,
+          imageAttachment: null,
+          error: error instanceof Error ? error.message : "Failed to load file",
+        };
+      }
     },
     staleTime: 5_000,
     refetchOnMount: true,

packages/app/src/components/git-actions-policy.test.ts

@@ -36,6 +36,11 @@ function createInput(overrides: Partial<BuildGitActionsInput> = {}): BuildGitAct
         status: "idle",
         handler: () => undefined,
       },
+      "pull-and-push": {
+        disabled: false,
+        status: "idle",
+        handler: () => undefined,
+      },
       pr: {
         disabled: false,
         status: "idle",
@@ -65,7 +70,7 @@ describe("git-actions-policy", () => {
   it("shows only remote sync actions on the base branch", () => {
     const actions = buildGitActions(createInput({ hasRemote: true }));
 
-    expect(actions.secondary.map((action) => action.id)).toEqual(["pull", "push"]);
+    expect(actions.secondary.map((action) => action.id)).toEqual(["pull", "push", "pull-and-push"]);
   });
 
   it("prioritizes pull when the branch is behind origin", () => {
@@ -149,6 +154,7 @@ describe("git-actions-policy", () => {
     expect(actions.secondary.map((action) => action.id)).toEqual([
       "pull",
       "push",
+      "pull-and-push",
       "merge-from-base",
       "merge-branch",
       "pr",
@@ -158,6 +164,48 @@ describe("git-actions-policy", () => {
     ).toBe(true);
   });
 
+  it("enables pull-and-push when the branch has both incoming and outgoing commits", () => {
+    const actions = buildGitActions(
+      createInput({
+        hasRemote: true,
+        aheadOfOrigin: 2,
+        behindOfOrigin: 3,
+      }),
+    );
+    const action = actions.secondary.find((entry) => entry.id === "pull-and-push");
+
+    expect(action).toMatchObject({
+      label: "Pull and push",
+      disabled: false,
+      unavailableMessage: undefined,
+    });
+  });
+
+  it("explains why pull-and-push is unavailable when the branch is in sync", () => {
+    const actions = buildGitActions(createInput({ hasRemote: true }));
+    const action = actions.secondary.find((entry) => entry.id === "pull-and-push");
+
+    expect(action).toMatchObject({
+      disabled: false,
+      unavailableMessage: "Pull and push isn't available because this branch is already in sync",
+    });
+  });
+
+  it("explains why pull-and-push is unavailable when there are uncommitted changes", () => {
+    const actions = buildGitActions(
+      createInput({
+        hasRemote: true,
+        hasUncommittedChanges: true,
+        aheadOfOrigin: 1,
+      }),
+    );
+    const action = actions.secondary.find((entry) => entry.id === "pull-and-push");
+
+    expect(action?.unavailableMessage).toBe(
+      "Pull and push isn't available while you have local changes so commit or stash them first",
+    );
+  });
+
   it("only shows archive worktree for paseo worktrees", () => {
     const hidden = buildGitActions(createInput());
     const shown = buildGitActions(createInput({ isPaseoOwnedWorktree: true }));

packages/app/src/components/git-actions-policy.ts

@@ -6,6 +6,7 @@ export type GitActionId =
   | "commit"
   | "pull"
   | "push"
+  | "pull-and-push"
   | "pr"
   | "merge-branch"
   | "merge-from-base"
@@ -56,7 +57,7 @@ export interface BuildGitActionsInput {
   runtime: Record<GitActionId, GitActionRuntimeState>;
 }
 
-const REMOTE_ACTION_IDS: GitActionId[] = ["pull", "push"];
+const REMOTE_ACTION_IDS: GitActionId[] = ["pull", "push", "pull-and-push"];
 const FEATURE_ACTION_IDS: GitActionId[] = ["merge-from-base", "merge-branch", "pr"];
 
 export function buildGitActions(input: BuildGitActionsInput): GitActions {
@@ -101,6 +102,20 @@ export function buildGitActions(input: BuildGitActionsInput): GitActions {
     handler: input.runtime.push.handler,
   });
 
+  allActions.set("pull-and-push", {
+    id: "pull-and-push",
+    label: "Pull and push",
+    pendingLabel: "Pulling and pushing...",
+    successLabel: "Pulled and pushed",
+    disabled: input.runtime["pull-and-push"].disabled,
+    status: input.runtime["pull-and-push"].status,
+    unavailableMessage: input.runtime["pull-and-push"].disabled
+      ? undefined
+      : getPullAndPushUnavailableMessage(input),
+    icon: input.runtime["pull-and-push"].icon,
+    handler: input.runtime["pull-and-push"].handler,
+  });
+
   allActions.set("pr", buildPrAction(input));
 
   allActions.set("merge-branch", {
@@ -265,6 +280,19 @@ function getPushUnavailableMessage(input: BuildGitActionsInput): string | undefi
   return undefined;
 }
 
+function getPullAndPushUnavailableMessage(input: BuildGitActionsInput): string | undefined {
+  if (!input.hasRemote) {
+    return "Pull and push isn't available here because this branch is not connected to a remote yet";
+  }
+  if (input.hasUncommittedChanges) {
+    return "Pull and push isn't available while you have local changes so commit or stash them first";
+  }
+  if (input.behindOfOrigin === 0 && input.aheadOfOrigin === 0) {
+    return "Pull and push isn't available because this branch is already in sync";
+  }
+  return undefined;
+}
+
 function getCreatePrUnavailableMessage(input: BuildGitActionsInput): string | undefined {
   if (!input.githubFeaturesEnabled) {
     return "Create PR isn't available right now because GitHub isn't connected";

packages/app/src/components/headers/header-toggle-button.tsx

@@ -88,8 +88,5 @@ const styles = StyleSheet.create((theme) => ({
     fontSize: theme.fontSize.sm,
     color: theme.colors.popoverForeground,
   },
-  shortcut: {
-    backgroundColor: theme.colors.surface3,
-    borderColor: theme.colors.borderAccent,
-  },
+  shortcut: {},
 }));

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

@@ -278,7 +278,7 @@ function VoiceTooltipBody({
   return (
     <View style={styles.tooltipRow}>
       <Text style={styles.tooltipText}>{voiceTooltipText}</Text>
-      {shortcut ? <Shortcut chord={shortcut} style={styles.tooltipShortcut} /> : null}
+      {shortcut ? <Shortcut chord={shortcut} /> : null}
     </View>
   );
 }
@@ -293,7 +293,7 @@ function SendTooltipBody({
   return (
     <View style={styles.tooltipRow}>
       <Text style={styles.tooltipText}>{label}</Text>
-      {sendKeys ? <Shortcut chord={sendKeys} style={styles.tooltipShortcut} /> : null}
+      {sendKeys ? <Shortcut chord={sendKeys} /> : null}
     </View>
   );
 }
@@ -1328,7 +1328,6 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
       onError: handleDictationError,
       canStart: canStartDictation,
       canConfirm: canConfirmDictation,
-      autoStopWhenHidden: { isVisible: isPaneFocused },
       enableDuration: true,
     });
 
@@ -1925,10 +1924,6 @@ const styles = StyleSheet.create((theme: Theme) => ({
     fontSize: theme.fontSize.sm,
     color: theme.colors.popoverForeground,
   },
-  tooltipShortcut: {
-    backgroundColor: theme.colors.surface3,
-    borderColor: theme.colors.borderAccent,
-  },
   buttonDisabled: {
     opacity: 0.5,
   },

packages/app/src/components/message.tsx

@@ -64,6 +64,7 @@ import { createMarkdownStyles } from "@/styles/markdown-styles";
 import { Fonts } from "@/constants/theme";
 import * as Clipboard from "expo-clipboard";
 import type { TodoEntry, UserMessageImageAttachment } from "@/types/stream";
+import type { AgentAttachment } from "@server/shared/messages";
 import type { ToolCallDetail } from "@server/server/agent/agent-sdk-types";
 import { buildToolCallDisplayModel } from "@/utils/tool-call-display";
 import { resolveToolCallIcon } from "@/utils/tool-call-icon";
@@ -81,8 +82,10 @@ import { getMarkdownListMarker } from "@/utils/markdown-list";
 import { openExternalUrl } from "@/utils/open-external-url";
 import { splitMarkdownBlocks } from "@/utils/split-markdown-blocks";
 import {
+  getAssistantImageLoadStateFromMetadata,
   getAssistantImageMetadata,
   setAssistantImageMetadata,
+  type AssistantImageLoadState,
 } from "@/utils/assistant-image-metadata";
 import { setAssistantMarkdownBlockHeight } from "@/utils/assistant-message-height-estimate";
 import { resolveAssistantImageSource } from "@/utils/assistant-image-source";
@@ -95,7 +98,7 @@ import { PlanCard } from "./plan-card";
 import { useToolCallSheet } from "./tool-call-sheet";
 import { ToolCallDetailsContent } from "./tool-call-details";
 import { useAttachmentPreviewUrl } from "@/attachments/use-attachment-preview-url";
-import { persistAttachmentFromBase64, persistAttachmentFromDataUrl } from "@/attachments/service";
+import { persistAttachmentFromBytes, persistAttachmentFromDataUrl } from "@/attachments/service";
 import type { DaemonClient } from "@server/client/daemon-client";
 import { isWeb, isNative } from "@/constants/platform";
 export type { InlinePathTarget } from "@/utils/inline-path";
@@ -105,6 +108,7 @@ type MarkdownStyles = Record<string, TextStyle & ViewStyle & { [key: string]: un
 interface UserMessageProps {
   message: string;
   images?: UserMessageImageAttachment[];
+  attachments?: AgentAttachment[];
   timestamp: number;
   isFirstInGroup?: boolean;
   isLastInGroup?: boolean;
@@ -318,7 +322,7 @@ const userMessageStylesheet = StyleSheet.create((theme) => ({
     flexDirection: "row",
     justifyContent: "flex-end",
     paddingHorizontal: theme.spacing[2],
-    userSelect: isWeb ? "text" : "auto",
+    ...(isWeb ? { userSelect: "text" as const } : {}),
   },
   content: {
     alignItems: "flex-end",
@@ -354,6 +358,11 @@ const userMessageStylesheet = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
     flexWrap: "wrap",
   },
+  attachmentPreviewContainer: {
+    flexDirection: "row",
+    gap: theme.spacing[2],
+    flexWrap: "wrap",
+  },
   imagePreviewSpacing: {
     marginBottom: theme.spacing[2],
   },
@@ -372,6 +381,19 @@ const userMessageStylesheet = StyleSheet.create((theme) => ({
     height: 48,
     backgroundColor: theme.colors.surface1,
   },
+  structuredAttachmentPill: {
+    maxWidth: 220,
+    borderRadius: theme.borderRadius.md,
+    borderWidth: 1,
+    borderColor: theme.colors.borderAccent,
+    backgroundColor: theme.colors.surface1,
+    paddingHorizontal: theme.spacing[3],
+    paddingVertical: theme.spacing[2],
+  },
+  structuredAttachmentText: {
+    color: theme.colors.foreground,
+    fontSize: theme.fontSize.sm,
+  },
   copyButton: {
     alignSelf: "flex-end",
     padding: theme.spacing[1],
@@ -394,9 +416,25 @@ function UserMessageAttachmentThumbnail({ image }: { image: UserMessageImageAtta
   return <Image source={imageSource} style={userMessageStylesheet.imageThumbnail} />;
 }
 
+function getUserMessageAttachmentLabel(attachment: AgentAttachment): string {
+  switch (attachment.type) {
+    case "review": {
+      const count = attachment.comments.length;
+      return count === 1 ? "Review · 1 comment" : `Review · ${count} comments`;
+    }
+    case "github_pr":
+      return `PR #${attachment.number}`;
+    case "github_issue":
+      return `Issue #${attachment.number}`;
+    case "text":
+      return attachment.title ?? "Text attachment";
+  }
+}
+
 export const UserMessage = memo(function UserMessage({
   message,
   images = [],
+  attachments = [],
   timestamp: _timestamp,
   isFirstInGroup = true,
   isLastInGroup = true,
@@ -408,6 +446,7 @@ export const UserMessage = memo(function UserMessage({
   const resolvedDisableOuterSpacing = useDisableOuterSpacing(disableOuterSpacing);
   const hasText = message.trim().length > 0;
   const hasImages = images.length > 0;
+  const hasAttachments = attachments.length > 0;
   const showCopyButton = hasText && (isCompact || messageHovered || copyButtonHovered);
 
   const handleHoverIn = useCallback(() => setMessageHovered(true), []);
@@ -428,6 +467,13 @@ export const UserMessage = memo(function UserMessage({
   const imagePreviewContainerStyle = useMemo(
     () => [
       userMessageStylesheet.imagePreviewContainer,
+      hasText || hasAttachments ? userMessageStylesheet.imagePreviewSpacing : undefined,
+    ],
+    [hasAttachments, hasText],
+  );
+  const attachmentPreviewContainerStyle = useMemo(
+    () => [
+      userMessageStylesheet.attachmentPreviewContainer,
       hasText ? userMessageStylesheet.imagePreviewSpacing : undefined,
     ],
     [hasText],
@@ -459,6 +505,20 @@ export const UserMessage = memo(function UserMessage({
               ))}
             </View>
           ) : null}
+          {hasAttachments ? (
+            <View style={attachmentPreviewContainerStyle}>
+              {attachments.map((attachment, index) => (
+                <View
+                  key={`${attachment.type}:${"number" in attachment ? attachment.number : index}`}
+                  style={userMessageStylesheet.structuredAttachmentPill}
+                >
+                  <Text style={userMessageStylesheet.structuredAttachmentText} numberOfLines={1}>
+                    {getUserMessageAttachmentLabel(attachment)}
+                  </Text>
+                </View>
+              ))}
+            </View>
+          ) : null}
           {hasText ? (
             <Text selectable style={userMessageStylesheet.text}>
               {message}
@@ -493,7 +553,7 @@ export const assistantMessageStylesheet = StyleSheet.create((theme) => ({
   container: {
     paddingHorizontal: theme.spacing[2],
     paddingVertical: theme.spacing[3],
-    userSelect: isWeb ? "text" : "auto",
+    ...(isWeb ? { userSelect: "text" as const } : {}),
   },
   containerCompactTop: {
     paddingTop: 0,
@@ -567,17 +627,17 @@ const AssistantMarkdownResolvedImage = memo(function AssistantMarkdownResolvedIm
     () => getAssistantImageMetadata({ source, workspaceRoot, serverId }),
     [serverId, source, workspaceRoot],
   );
-  const [aspectRatio, setAspectRatio] = useState<number | null>(
-    cachedMetadata?.aspectRatio ?? null,
+  const [loadState, setLoadState] = useState<AssistantImageLoadState>(() =>
+    getAssistantImageLoadStateFromMetadata(cachedMetadata),
   );
 
   useEffect(() => {
     if (cachedMetadata) {
-      setAspectRatio(cachedMetadata.aspectRatio);
+      setLoadState(getAssistantImageLoadStateFromMetadata(cachedMetadata));
       return;
     }
 
-    setAspectRatio(null);
+    setLoadState({ status: "loading" });
     let cancelled = false;
 
     Image.getSize(
@@ -591,14 +651,17 @@ const AssistantMarkdownResolvedImage = memo(function AssistantMarkdownResolvedIm
             { source, workspaceRoot, serverId },
             { width, height },
           );
-          setAspectRatio(metadata?.aspectRatio ?? width / height);
+          setLoadState({
+            status: "ready",
+            aspectRatio: metadata?.aspectRatio ?? width / height,
+          });
         }
       },
       () => {
         if (cancelled) {
           return;
         }
-        setAspectRatio(null);
+        setLoadState({ status: "error" });
       },
     );
 
@@ -607,19 +670,41 @@ const AssistantMarkdownResolvedImage = memo(function AssistantMarkdownResolvedIm
     };
   }, [cachedMetadata, serverId, source, uri, workspaceRoot]);
 
+  const handleImageError = useCallback(() => {
+    setLoadState({ status: "error" });
+  }, []);
   const surfaceStyle = useMemo<StyleProp<ViewStyle>>(
     () => [
       assistantMessageStylesheet.imageSurface,
-      aspectRatio ? { aspectRatio } : { minHeight: ASSISTANT_IMAGE_MIN_HEIGHT },
+      loadState.status === "ready"
+        ? { aspectRatio: loadState.aspectRatio }
+        : { height: ASSISTANT_IMAGE_MIN_HEIGHT },
     ],
-    [aspectRatio],
+    [loadState],
   );
   const frameStyle = useMemo<StyleProp<ViewStyle>>(
     () => [assistantMessageStylesheet.imageFrame, containerStyle],
     [containerStyle],
   );
+  const stateSurfaceStyle = useMemo<StyleProp<ViewStyle>>(
+    () => [surfaceStyle, assistantMessageStylesheet.imageState],
+    [surfaceStyle],
+  );
   const imageSource = useMemo(() => ({ uri }), [uri]);
 
+  if (loadState.status !== "ready") {
+    return (
+      <View style={frameStyle}>
+        <View style={stateSurfaceStyle}>
+          {loadState.status === "loading" ? <ActivityIndicator size="small" /> : null}
+          {loadState.status === "error" ? (
+            <Text style={assistantMessageStylesheet.imageErrorText}>Image unavailable</Text>
+          ) : null}
+        </View>
+      </View>
+    );
+  }
+
   return (
     <View style={frameStyle}>
       <View style={surfaceStyle}>
@@ -628,6 +713,7 @@ const AssistantMarkdownResolvedImage = memo(function AssistantMarkdownResolvedIm
           style={assistantMessageStylesheet.image}
           resizeMode="contain"
           accessibilityLabel={alt}
+          onError={handleImageError}
         />
       </View>
     </View>
@@ -676,25 +762,21 @@ function AssistantMarkdownImage({
         return null;
       }
 
-      const payload = await client.exploreFileSystem(resolution.cwd, resolution.path, "file");
-      if (payload.error) {
-        throw new Error(payload.error);
-      }
-      const file = payload.file;
-      if (!file || file.kind !== "image" || !file.content) {
+      const file = await client.readFile(resolution.cwd, resolution.path);
+      if (file.kind !== "image") {
         throw new Error("Image preview unavailable.");
       }
 
-      return await persistAttachmentFromBase64({
+      return await persistAttachmentFromBytes({
         id: createPreviewAttachmentId({
-          mimeType: file.mimeType ?? "image/png",
+          mimeType: file.mime,
           path: file.path || resolution.path,
           size: file.size,
           modifiedAt: file.modifiedAt,
-          contentLength: file.content.length,
+          contentLength: file.bytes.byteLength,
         }),
-        base64: file.content,
-        mimeType: file.mimeType,
+        bytes: file.bytes,
+        mimeType: file.mime,
         fileName: getFileNameFromPath(file.path || resolution.path),
       });
     },
@@ -728,6 +810,7 @@ function AssistantMarkdownImage({
     () => [
       assistantMessageStylesheet.imageFrame,
       containerStyle,
+      { height: ASSISTANT_IMAGE_MIN_HEIGHT },
       assistantMessageStylesheet.imageState,
     ],
     [containerStyle],
@@ -1063,6 +1146,7 @@ const expandableBadgeStylesheet = StyleSheet.create((theme) => ({
     flexShrink: 1,
     minWidth: 0,
     overflow: "hidden",
+    ...(isWeb ? { cursor: "auto" as const, userSelect: "text" as const } : {}),
   },
   pressableExpanded: {
     borderColor: theme.colors.border,
@@ -2887,6 +2971,7 @@ export const ToolCall = memo(function ToolCall({
       <PlanCard
         title="Plan"
         text={effectiveDetail.text}
+        testID="timeline-plan-card"
         disableOuterSpacing={disableOuterSpacing}
       />
     );

packages/app/src/components/plan-card.tsx

@@ -199,12 +199,14 @@ export function PlanCard({
   text,
   footer,
   disableOuterSpacing = false,
+  testID,
 }: {
   title?: string;
   description?: string;
   text: string;
   footer?: ReactNode;
   disableOuterSpacing?: boolean;
+  testID?: string;
 }) {
   const { theme } = useUnistyles();
   const markdownStyles = createMarkdownStyles(theme);
@@ -231,7 +233,7 @@ export function PlanCard({
   );
 
   return (
-    <View style={containerStyle}>
+    <View testID={testID} style={containerStyle}>
       <Text style={titleStyle}>{title}</Text>
       {description ? <Text style={descriptionStyle}>{description}</Text> : null}
       <Markdown style={markdownStyles} rules={markdownRules}>

packages/app/src/components/sidebar-workspace-list.test.tsx

@@ -37,9 +37,9 @@ import {
 
 vi.mock("@react-native-async-storage/async-storage", () => ({
   default: {
-    getItem: vi.fn(),
-    setItem: vi.fn(),
-    removeItem: vi.fn(),
+    getItem: vi.fn().mockResolvedValue(null),
+    setItem: vi.fn().mockResolvedValue(undefined),
+    removeItem: vi.fn().mockResolvedValue(undefined),
   },
 }));
 
@@ -83,6 +83,7 @@ function workspace(input: {
     workspaceKind: input.name === "main" ? "local_checkout" : "worktree",
     name: input.name,
     status: input.status ?? "done",
+    archivingAt: null,
     diffStat: null,
     scripts: input.scripts ?? [],
   };

packages/app/src/components/sidebar-workspace-list.tsx

@@ -104,9 +104,14 @@ import {
 import { useSessionStore, type WorkspaceDescriptor } from "@/stores/session-store";
 import { useWorkspaceFields } from "@/stores/session-store-hooks";
 import { redirectIfArchivingActiveWorkspace } from "@/utils/sidebar-workspace-archive-redirect";
+import {
+  clearWorkspaceArchivePending,
+  markWorkspaceArchivePending,
+} from "@/contexts/session-workspace-upserts";
 import { openExternalUrl } from "@/utils/open-external-url";
 import {
   requireWorkspaceExecutionDirectory,
+  resolveWorkspaceMapKeyByIdentity,
   resolveWorkspaceExecutionDirectory,
 } from "@/utils/workspace-execution";
 import { WorkspaceHoverCard } from "@/components/workspace-hover-card";
@@ -123,6 +128,36 @@ function toProjectIconDataUri(icon: { mimeType: string; data: string } | null):
 const workspaceKeyExtractor = (workspace: SidebarWorkspaceEntry) => workspace.workspaceKey;
 
 const projectKeyExtractor = (project: SidebarProjectEntry) => project.projectKey;
+
+function hideWorkspaceOptimistically(workspace: SidebarWorkspaceEntry): WorkspaceDescriptor | null {
+  const workspaces = useSessionStore.getState().sessions[workspace.serverId]?.workspaces;
+  const workspaceKey = resolveWorkspaceMapKeyByIdentity({
+    workspaces,
+    workspaceId: workspace.workspaceId,
+  });
+  const snapshot = workspaceKey ? (workspaces?.get(workspaceKey) ?? null) : null;
+  markWorkspaceArchivePending({
+    serverId: workspace.serverId,
+    workspaceId: workspace.workspaceId,
+    workspaceDirectory: workspace.workspaceDirectory,
+  });
+  useSessionStore.getState().removeWorkspace(workspace.serverId, workspace.workspaceId);
+  return snapshot;
+}
+
+function restoreOptimisticallyHiddenWorkspace(input: {
+  serverId: string;
+  workspaceId: string;
+  snapshot: WorkspaceDescriptor | null;
+}): void {
+  clearWorkspaceArchivePending({
+    serverId: input.serverId,
+    workspaceId: input.workspaceId,
+  });
+  if (input.snapshot) {
+    useSessionStore.getState().mergeWorkspaces(input.serverId, [input.snapshot]);
+  }
+}
 const WORKSPACE_STATUS_DOT_WIDTH = 14;
 const DEFAULT_STATUS_DOT_SIZE = 7;
 const EMPHASIZED_STATUS_DOT_SIZE = 9;
@@ -1462,7 +1497,7 @@ function WorkspaceRowWithMenu({
       : "idle",
   );
   const isWorktree = workspace.workspaceKind === "worktree";
-  const isArchiving = isWorktree ? archiveStatus === "pending" : isArchivingWorkspace;
+  const isArchiving = isWorktree ? workspace.archivingAt !== null : isArchivingWorkspace;
   const redirectAfterArchive = useCallback(() => {
     redirectIfArchivingActiveWorkspace({
       serverId: workspace.serverId,
@@ -1514,16 +1549,7 @@ function WorkspaceRowWithMenu({
         toast.error(message);
       });
     })();
-  }, [
-    archiveWorktree,
-    isArchiving,
-    redirectAfterArchive,
-    toast,
-    workspace.name,
-    workspace.workspaceDirectory,
-    workspace.serverId,
-    workspace.workspaceId,
-  ]);
+  }, [archiveWorktree, isArchiving, redirectAfterArchive, toast, workspace]);
 
   const handleArchiveWorkspace = useCallback(() => {
     if (isArchivingWorkspace) {
@@ -1549,6 +1575,7 @@ function WorkspaceRowWithMenu({
       }
 
       setIsArchivingWorkspace(true);
+      const snapshot = hideWorkspaceOptimistically(workspace);
       redirectAfterArchive();
 
       void (async () => {
@@ -1558,20 +1585,18 @@ function WorkspaceRowWithMenu({
             throw new Error(payload.error);
           }
         } catch (error) {
+          restoreOptimisticallyHiddenWorkspace({
+            serverId: workspace.serverId,
+            workspaceId: workspace.workspaceId,
+            snapshot,
+          });
           toast.error(error instanceof Error ? error.message : "Failed to hide workspace");
         } finally {
           setIsArchivingWorkspace(false);
         }
       })();
     })();
-  }, [
-    isArchivingWorkspace,
-    redirectAfterArchive,
-    toast,
-    workspace.name,
-    workspace.serverId,
-    workspace.workspaceId,
-  ]);
+  }, [isArchivingWorkspace, redirectAfterArchive, toast, workspace]);
 
   const handleCopyPath = useCallback(() => {
     let copyTargetDirectory: string;
@@ -1693,6 +1718,7 @@ function NonGitProjectRowWithMenuContent({
       }
 
       setIsArchivingWorkspace(true);
+      const snapshot = hideWorkspaceOptimistically(workspace);
       redirectAfterArchive();
 
       void (async () => {
@@ -1702,20 +1728,18 @@ function NonGitProjectRowWithMenuContent({
             throw new Error(payload.error);
           }
         } catch (error) {
+          restoreOptimisticallyHiddenWorkspace({
+            serverId: workspace.serverId,
+            workspaceId: workspace.workspaceId,
+            snapshot,
+          });
           toast.error(error instanceof Error ? error.message : "Failed to hide workspace");
         } finally {
           setIsArchivingWorkspace(false);
         }
       })();
     })();
-  }, [
-    isArchivingWorkspace,
-    redirectAfterArchive,
-    toast,
-    workspace.name,
-    workspace.serverId,
-    workspace.workspaceId,
-  ]);
+  }, [isArchivingWorkspace, redirectAfterArchive, toast, workspace]);
 
   return (
     <>
@@ -2120,13 +2144,28 @@ function ProjectBlock({
       }
 
       setIsRemovingProject(true);
+      const snapshots = new Map(
+        project.workspaces.map((workspace) => [
+          workspace.workspaceId,
+          hideWorkspaceOptimistically(workspace),
+        ]),
+      );
 
       const isRejected = (r: PromiseSettledResult<unknown>) => r.status === "rejected";
       void Promise.allSettled(
         project.workspaces.map(async (ws) => {
-          const payload = await client.archiveWorkspace(ws.workspaceId);
-          if (payload.error) {
-            throw new Error(payload.error);
+          try {
+            const payload = await client.archiveWorkspace(ws.workspaceId);
+            if (payload.error) {
+              throw new Error(payload.error);
+            }
+          } catch (error) {
+            restoreOptimisticallyHiddenWorkspace({
+              serverId,
+              workspaceId: ws.workspaceId,
+              snapshot: snapshots.get(ws.workspaceId) ?? null,
+            });
+            throw error;
           }
         }),
       ).then((results) => {
@@ -2724,10 +2763,7 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foreground,
     fontSize: theme.fontSize.sm,
   },
-  projectActionTooltipShortcut: {
-    backgroundColor: theme.colors.surface3,
-    borderColor: theme.colors.borderAccent,
-  },
+  projectActionTooltipShortcut: {},
   workspaceRow: {
     minHeight: 36,
     marginBottom: theme.spacing[1],

packages/app/src/components/split-container.tsx

@@ -91,6 +91,8 @@ interface SplitContainerProps {
   onCloseOtherTabs: (tabId: string, paneTabs: WorkspaceTabDescriptor[]) => Promise<void> | void;
   onCreateDraftTab: (input: { paneId?: string }) => void;
   onCreateTerminalTab: (input: { paneId?: string }) => void;
+  onCreateBrowserTab: (input: { paneId?: string }) => void;
+  showCreateBrowserTab?: boolean;
   buildPaneContentModel: (input: {
     paneId: string;
     tab: WorkspaceTabDescriptor;
@@ -126,7 +128,7 @@ interface SplitPaneDropData {
 interface SplitNodeViewProps extends Omit<SplitContainerProps, "layout" | "onMoveTabToPane"> {
   node: SplitNode;
   uiTabs: WorkspaceTab[];
-  focusedPaneId: string;
+  focusedPaneId: string | null;
   activeDragTabId: string | null;
   showDropZones: boolean;
   dropPreview: SplitDropZoneHover | null;
@@ -158,6 +160,7 @@ interface MountedTabSlotProps {
   isWorkspaceFocused: boolean;
   isPaneFocused: boolean;
   paneId: string;
+  onFocusPane: (paneId: string) => void;
   buildPaneContentModel: (input: {
     paneId: string;
     tab: WorkspaceTabDescriptor;
@@ -170,6 +173,7 @@ const MountedTabSlot = memo(function MountedTabSlot({
   isWorkspaceFocused,
   isPaneFocused,
   paneId,
+  onFocusPane,
   buildPaneContentModel,
 }: MountedTabSlotProps) {
   const content = useMemo(
@@ -185,6 +189,9 @@ const MountedTabSlot = memo(function MountedTabSlot({
     () => ({ display: (isVisible ? "flex" : "none") as "flex" | "none", flex: 1 }),
     [isVisible],
   );
+  const handleFocusPane = useCallback(() => {
+    onFocusPane(paneId);
+  }, [onFocusPane, paneId]);
 
   return (
     <View style={wrapperStyle}>
@@ -192,6 +199,7 @@ const MountedTabSlot = memo(function MountedTabSlot({
         content={content}
         isWorkspaceFocused={isWorkspaceFocused}
         isPaneFocused={isPaneFocused}
+        onFocusPane={handleFocusPane}
       />
     </View>
   );
@@ -339,6 +347,8 @@ export function SplitContainer({
   onCloseOtherTabs,
   onCreateDraftTab,
   onCreateTerminalTab,
+  onCreateBrowserTab,
+  showCreateBrowserTab,
   buildPaneContentModel,
   onFocusPane,
   onSplitPane,
@@ -370,7 +380,7 @@ export function SplitContainer({
     if (!focusModeEnabled) {
       return layout.root;
     }
-    const focusedPane = panesById.get(layout.focusedPaneId);
+    const focusedPane = layout.focusedPaneId ? panesById.get(layout.focusedPaneId) : null;
     if (!focusedPane) {
       return layout.root;
     }
@@ -557,6 +567,8 @@ export function SplitContainer({
         onCloseOtherTabs={onCloseOtherTabs}
         onCreateDraftTab={onCreateDraftTab}
         onCreateTerminalTab={onCreateTerminalTab}
+        onCreateBrowserTab={onCreateBrowserTab}
+        showCreateBrowserTab={showCreateBrowserTab}
         buildPaneContentModel={buildPaneContentModel}
         onFocusPane={onFocusPane}
         onSplitPane={onSplitPane}
@@ -694,6 +706,8 @@ function SplitNodeView({
   onCloseOtherTabs,
   onCreateDraftTab,
   onCreateTerminalTab,
+  onCreateBrowserTab,
+  showCreateBrowserTab,
   buildPaneContentModel,
   onFocusPane,
   onSplitPane,
@@ -744,6 +758,8 @@ function SplitNodeView({
         onCloseOtherTabs={onCloseOtherTabs}
         onCreateDraftTab={onCreateDraftTab}
         onCreateTerminalTab={onCreateTerminalTab}
+        onCreateBrowserTab={onCreateBrowserTab}
+        showCreateBrowserTab={showCreateBrowserTab}
         buildPaneContentModel={buildPaneContentModel}
         onFocusPane={onFocusPane}
         onSplitPane={onSplitPane}
@@ -787,6 +803,8 @@ function SplitNodeView({
               onCloseOtherTabs={onCloseOtherTabs}
               onCreateDraftTab={onCreateDraftTab}
               onCreateTerminalTab={onCreateTerminalTab}
+              onCreateBrowserTab={onCreateBrowserTab}
+              showCreateBrowserTab={showCreateBrowserTab}
               buildPaneContentModel={buildPaneContentModel}
               onFocusPane={onFocusPane}
               onSplitPane={onSplitPane}
@@ -836,6 +854,8 @@ function SplitPaneView({
   onCloseOtherTabs,
   onCreateDraftTab,
   onCreateTerminalTab,
+  onCreateBrowserTab,
+  showCreateBrowserTab,
   buildPaneContentModel,
   onFocusPane,
   onSplitPane: _onSplitPane,
@@ -977,6 +997,8 @@ function SplitPaneView({
           onCloseOtherTabs={handleCloseOtherTabs}
           onCreateDraftTab={onCreateDraftTab}
           onCreateTerminalTab={onCreateTerminalTab}
+          onCreateBrowserTab={onCreateBrowserTab}
+          showCreateBrowserTab={showCreateBrowserTab}
           onReorderTabs={handleReorderTabs}
           onSplitRight={handleSplitRight}
           onSplitDown={handleSplitDown}
@@ -1004,6 +1026,7 @@ function SplitPaneView({
                   isWorkspaceFocused={isWorkspaceFocused}
                   isPaneFocused={isFocused && tabId === activeTabDescriptor?.tabId}
                   paneId={pane.id}
+                  onFocusPane={stableOnFocusPane}
                   buildPaneContentModel={buildPaneContentModel}
                 />
               );

packages/app/src/components/stream-strategy-native.tsx

@@ -9,7 +9,9 @@ import {
 } from "react";
 import {
   FlatList,
+  ActivityIndicator,
   Keyboard,
+  View,
   type LayoutChangeEvent,
   type ListRenderItemInfo,
   type NativeScrollEvent,
@@ -29,6 +31,7 @@ const DEFAULT_MAINTAIN_VISIBLE_CONTENT_POSITION = Object.freeze({
   minIndexForVisible: 0,
   autoscrollToTopThreshold: 0,
 });
+const HISTORY_START_THRESHOLD_PX = 96;
 
 function keyExtractor(item: { id: string }): string {
   return item.id;
@@ -45,6 +48,9 @@ function NativeStreamViewport(props: StreamRenderInput & { strategy: StreamStrat
     routeBottomAnchorRequest,
     isAuthoritativeHistoryReady,
     onNearBottomChange,
+    onNearHistoryStart,
+    isLoadingOlderHistory,
+    hasOlderHistory,
     scrollEnabled,
     listStyle,
     baseListContentContainerStyle,
@@ -65,6 +71,7 @@ function NativeStreamViewport(props: StreamRenderInput & { strategy: StreamStrat
   const programmaticScrollEventBudgetRef = useRef(0);
   const [isNativeViewportSettling, setIsNativeViewportSettling] = useState(false);
   const nativeViewportSettlingFrameIdRef = useRef<number | null>(null);
+  const historyStartReadyRef = useRef(false);
 
   const historyRows = useMemo(() => {
     if (segments.historyVirtualized.length === 0) {
@@ -155,6 +162,13 @@ function NativeStreamViewport(props: StreamRenderInput & { strategy: StreamStrat
     scrollOffsetYRef.current = 0;
     clearNativeViewportSettling();
     setIsNativeViewportSettling(false);
+    historyStartReadyRef.current = false;
+    const frame = requestAnimationFrame(() => {
+      historyStartReadyRef.current = true;
+    });
+    return () => {
+      cancelAnimationFrame(frame);
+    };
   }, [agentId, clearNativeViewportSettling]);
 
   useEffect(() => {
@@ -227,6 +241,18 @@ function NativeStreamViewport(props: StreamRenderInput & { strategy: StreamStrat
     });
     onNearBottomChange(nearBottom);
 
+    const distanceFromOldestEdge =
+      streamViewportMetricsRef.current.contentHeight -
+      streamViewportMetricsRef.current.viewportHeight -
+      contentOffset.y;
+    if (
+      historyStartReadyRef.current &&
+      hasOlderHistory &&
+      distanceFromOldestEdge <= HISTORY_START_THRESHOLD_PX
+    ) {
+      onNearHistoryStart();
+    }
+
     if (programmaticScrollEventBudgetRef.current > 0 && contentOffset.y <= 8) {
       programmaticScrollEventBudgetRef.current -= 1;
     } else {
@@ -307,6 +333,17 @@ function NativeStreamViewport(props: StreamRenderInput & { strategy: StreamStrat
     );
   }, [boundary, listEmptyComponent, renderLiveAuxiliary, renderLiveHeadRow, segments.liveHead]);
 
+  const historyFooterContent = useMemo(() => {
+    if (!isLoadingOlderHistory) {
+      return null;
+    }
+    return (
+      <View testID="load-older-history-spinner">
+        <ActivityIndicator size="small" />
+      </View>
+    );
+  }, [isLoadingOlderHistory]);
+
   return (
     <FlatList
       ref={flatListRef}
@@ -316,6 +353,7 @@ function NativeStreamViewport(props: StreamRenderInput & { strategy: StreamStrat
       testID="agent-chat-scroll"
       nativeID="agent-chat-scroll-native-virtualized"
       ListHeaderComponent={liveHeaderContent ?? undefined}
+      ListFooterComponent={historyFooterContent ?? undefined}
       contentContainerStyle={baseListContentContainerStyle}
       style={listStyle}
       onLayout={handleListLayout}

packages/app/src/components/stream-strategy-web.test.tsx

@@ -9,6 +9,24 @@ import type { StreamItem } from "@/types/stream";
 import type { StreamSegmentRenderers, StreamViewportHandle } from "./stream-strategy";
 import { createWebStreamStrategy } from "./stream-strategy-web";
 
+vi.hoisted(() => {
+  Object.defineProperty(window, "matchMedia", {
+    configurable: true,
+    value: () => ({
+      addEventListener: () => {},
+      addListener: () => {},
+      dispatchEvent: () => false,
+      matches: false,
+      media: "",
+      onchange: null,
+      removeEventListener: () => {},
+      removeListener: () => {},
+    }),
+  });
+});
+
+vi.mock("./use-web-scrollbar", () => ({ useWebElementScrollbar: () => null }));
+
 function userMessage(index: number): StreamItem {
   return {
     kind: "user_message",
@@ -115,6 +133,9 @@ describe("createWebStreamStrategy", () => {
             routeBottomAnchorRequest: null,
             isAuthoritativeHistoryReady: true,
             onNearBottomChange: vi.fn(),
+            onNearHistoryStart: vi.fn(),
+            isLoadingOlderHistory: false,
+            hasOlderHistory: false,
             scrollEnabled: true,
             listStyle: null,
             baseListContentContainerStyle: null,
@@ -127,4 +148,63 @@ describe("createWebStreamStrategy", () => {
     expect(rowRenderCount.mock.calls.length).toBeGreaterThan(0);
     expect(rowRenderCount.mock.calls.length).toBeLessThanOrEqual(historyVirtualized.length);
   });
+
+  it("fires near-history-start when the user scrolls near the top", async () => {
+    const strategy = createWebStreamStrategy({ isMobileBreakpoint: true });
+    const viewportRef = React.createRef<StreamViewportHandle>();
+    const onNearHistoryStart = vi.fn();
+    container = document.createElement("div");
+    document.body.appendChild(container);
+    root = createRoot(container);
+
+    act(() => {
+      root?.render(
+        <>
+          {strategy.render({
+            agentId: "agent",
+            segments: {
+              historyVirtualized: [],
+              historyMounted: [userMessage(1), userMessage(2)],
+              liveHead: [],
+            },
+            boundary: {
+              hasVirtualizedHistory: false,
+              hasMountedHistory: true,
+              hasLiveHead: false,
+              historyToHeadGap: 0,
+            },
+            renderers: createRenderers(vi.fn()),
+            listEmptyComponent: null,
+            viewportRef,
+            routeBottomAnchorRequest: null,
+            isAuthoritativeHistoryReady: true,
+            onNearBottomChange: vi.fn(),
+            onNearHistoryStart,
+            isLoadingOlderHistory: false,
+            hasOlderHistory: true,
+            scrollEnabled: true,
+            listStyle: null,
+            baseListContentContainerStyle: null,
+            forwardListContentContainerStyle: null,
+          })}
+        </>,
+      );
+    });
+
+    await act(async () => {
+      await new Promise((resolve) => requestAnimationFrame(resolve));
+    });
+
+    const scrollContainer = container.querySelector('[data-testid="agent-chat-scroll"]');
+    expect(scrollContainer).toBeInstanceOf(HTMLElement);
+    Object.defineProperty(scrollContainer, "clientHeight", { configurable: true, value: 400 });
+    Object.defineProperty(scrollContainer, "scrollHeight", { configurable: true, value: 1200 });
+    Object.defineProperty(scrollContainer, "scrollTop", { configurable: true, value: 64 });
+
+    act(() => {
+      scrollContainer?.dispatchEvent(new Event("scroll"));
+    });
+
+    expect(onNearHistoryStart).toHaveBeenCalledTimes(1);
+  });
 });

packages/app/src/components/stream-strategy-web.tsx

@@ -8,6 +8,7 @@ import React, {
   useRef,
   useState,
 } from "react";
+import { ActivityIndicator } from "react-native";
 import { measureElement as measureVirtualElement, useVirtualizer } from "@tanstack/react-virtual";
 import { estimateStreamItemHeight } from "./agent-stream-web-virtualization";
 import type { StreamRenderInput, StreamStrategy, StreamViewportHandle } from "./stream-strategy";
@@ -23,8 +24,18 @@ const WEB_BOTTOM_SETTLE_TIMEOUT_MS = 200;
 const USER_SCROLL_DELTA_EPSILON = 1;
 const AUTO_SCROLL_BOTTOM_THRESHOLD_PX = 64;
 const AUTO_SCROLL_RESUME_THRESHOLD_PX = 1;
+const HISTORY_START_THRESHOLD_PX = 96;
 import { useWebElementScrollbar } from "./use-web-scrollbar";
 
+const historyStartSlotStyle: CSSProperties = {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  minHeight: 32,
+  paddingTop: 4,
+  paddingBottom: 8,
+};
+
 function isScrollContainerNearBottom(
   scrollContainer: Pick<HTMLElement, "scrollTop" | "clientHeight" | "scrollHeight">,
   thresholdPx = AUTO_SCROLL_BOTTOM_THRESHOLD_PX,
@@ -91,6 +102,9 @@ function WebStreamViewport(props: StreamRenderInput & { isMobileBreakpoint: bool
     routeBottomAnchorRequest,
     isAuthoritativeHistoryReady,
     onNearBottomChange,
+    onNearHistoryStart,
+    isLoadingOlderHistory,
+    hasOlderHistory,
     scrollEnabled,
     isMobileBreakpoint,
   } = props;
@@ -115,6 +129,7 @@ function WebStreamViewport(props: StreamRenderInput & { isMobileBreakpoint: bool
   const pendingAutoScrollFrameRef = useRef<number | null>(null);
   const pendingAutoScrollTimeoutRef = useRef<number | null>(null);
   const pendingVirtualRowMeasureFramesRef = useRef(new Map<Element, number>());
+  const historyStartReadyRef = useRef(false);
   const showDesktopWebScrollbar = !isMobileBreakpoint;
   const scrollbarOverlay = useWebElementScrollbar(scrollContainerRef, {
     enabled: showDesktopWebScrollbar,
@@ -280,7 +295,24 @@ function WebStreamViewport(props: StreamRenderInput & { isMobileBreakpoint: bool
 
     lastKnownScrollTopRef.current = currentScrollTop;
     updateScrollMetrics();
-  }, [cancelPendingStickToBottom, updateScrollMetrics]);
+    if (
+      historyStartReadyRef.current &&
+      hasOlderHistory &&
+      currentScrollTop <= HISTORY_START_THRESHOLD_PX
+    ) {
+      onNearHistoryStart();
+    }
+  }, [cancelPendingStickToBottom, hasOlderHistory, onNearHistoryStart, updateScrollMetrics]);
+
+  useEffect(() => {
+    const frame = window.requestAnimationFrame(() => {
+      historyStartReadyRef.current = true;
+    });
+    return () => {
+      window.cancelAnimationFrame(frame);
+      historyStartReadyRef.current = false;
+    };
+  }, [props.agentId]);
 
   useLayoutEffect(() => {
     if (!isActivationReady) {
@@ -501,6 +533,16 @@ function WebStreamViewport(props: StreamRenderInput & { isMobileBreakpoint: bool
   const liveAuxiliary = useMemo(() => {
     return renderLiveAuxiliary();
   }, [renderLiveAuxiliary]);
+  const historyStartSlot = useMemo(() => {
+    if (!isLoadingOlderHistory) {
+      return null;
+    }
+    return (
+      <div style={historyStartSlotStyle} data-testid="load-older-history-spinner">
+        <ActivityIndicator size="small" />
+      </div>
+    );
+  }, [isLoadingOlderHistory]);
   const shouldRenderEmpty =
     !boundary.hasMountedHistory &&
     !boundary.hasVirtualizedHistory &&
@@ -516,6 +558,7 @@ function WebStreamViewport(props: StreamRenderInput & { isMobileBreakpoint: bool
         style={scrollContainerStyle}
       >
         <div ref={handleContentRef} style={contentContainerStyle}>
+          {historyStartSlot}
           {shouldUseVirtualizer ? (
             <div style={virtualRowsContainerStyle}>
               {virtualRows.map((virtualRow) => {

packages/app/src/components/stream-strategy.ts

@@ -60,6 +60,9 @@ export interface StreamRenderInput {
   routeBottomAnchorRequest: BottomAnchorRouteRequest | null;
   isAuthoritativeHistoryReady: boolean;
   onNearBottomChange: (value: boolean) => void;
+  onNearHistoryStart: () => void;
+  isLoadingOlderHistory: boolean;
+  hasOlderHistory: boolean;
   scrollEnabled: boolean;
   listStyle: StyleProp<ViewStyle>;
   baseListContentContainerStyle: StyleProp<ViewStyle>;

packages/app/src/components/terminal-emulator.tsx

@@ -18,6 +18,7 @@ import type { ITheme } from "@xterm/xterm";
 import type { TerminalState } from "@server/shared/messages";
 import type { PendingTerminalModifiers } from "../utils/terminal-keys";
 import { TerminalEmulatorRuntime } from "../terminal/runtime/terminal-emulator-runtime";
+import type { TerminalRendererReadyChange } from "../utils/terminal-renderer-readiness";
 import { openExternalUrl } from "../utils/open-external-url";
 import { focusWithRetries } from "../utils/web-focus";
 import {
@@ -127,6 +128,7 @@ interface TerminalEmulatorProps {
     meta: boolean;
   }) => Promise<void> | void;
   onPendingModifiersConsumed?: () => Promise<void> | void;
+  onRendererReadyChange?: (change: TerminalRendererReadyChange) => void;
   pendingModifiers?: PendingTerminalModifiers;
   focusRequestToken?: number;
   resizeRequestToken?: number;
@@ -181,6 +183,7 @@ export default function TerminalEmulator({
   onResize,
   onTerminalKey,
   onPendingModifiersConsumed,
+  onRendererReadyChange,
   pendingModifiers = { ctrl: false, shift: false, alt: false },
   focusRequestToken = 0,
   resizeRequestToken = 0,
@@ -198,6 +201,8 @@ export default function TerminalEmulator({
   const themeKey = useMemo(() => buildXtermThemeKey(xtermTheme), [xtermTheme]);
   const xtermThemeRef = useRef(xtermTheme);
   xtermThemeRef.current = xtermTheme;
+  const onRendererReadyChangeRef = useRef(onRendererReadyChange);
+  onRendererReadyChangeRef.current = onRendererReadyChange;
   const mountCallbacksRef = useRef({
     onInput,
     onResize,
@@ -389,9 +394,11 @@ export default function TerminalEmulator({
       initialSnapshot: initialSnapshotRef.current,
       theme: mountedThemeRef.current,
     });
+    onRendererReadyChangeRef.current?.({ streamKey, isReady: true });
 
     return () => {
       runtime.unmount();
+      onRendererReadyChangeRef.current?.({ streamKey, isReady: false });
       if (runtimeRef.current === runtime) {
         runtimeRef.current = null;
       }

packages/app/src/components/terminal-pane.tsx

@@ -28,6 +28,12 @@ import { usePanelStore } from "@/stores/panel-store";
 import { toXtermTheme } from "@/utils/to-xterm-theme";
 import TerminalEmulator, { type TerminalEmulatorHandle } from "./terminal-emulator";
 import { useIsCompactFormFactor } from "@/constants/layout";
+import {
+  applyTerminalRendererReadyChange,
+  shouldReplayTerminalSnapshotForRenderer,
+  shouldShowTerminalLoadingOverlay,
+  type TerminalRendererReadyChange,
+} from "@/utils/terminal-renderer-readiness";
 
 interface TerminalPaneProps {
   serverId: string;
@@ -164,6 +170,7 @@ export function TerminalPane({
   const isConnected = useHostRuntimeIsConnected(serverId);
 
   const scopeKey = useMemo(() => terminalScopeKey({ serverId, cwd }), [serverId, cwd]);
+  const terminalStreamKey = useMemo(() => `${scopeKey}:${terminalId}`, [scopeKey, terminalId]);
   // Keep the latest measured size for whichever client currently owns the pane,
   // but only dedupe resizes that this specific client has already pushed.
   const measuredTerminalSizeRef = useRef<{ rows: number; cols: number } | null>(null);
@@ -175,6 +182,7 @@ export function TerminalPane({
   );
   const [isAttaching, setIsAttaching] = useState(false);
   const [streamError, setStreamError] = useState<string | null>(null);
+  const [rendererReadyStreamKey, setRendererReadyStreamKey] = useState<string | null>(null);
   const [modifiers, setModifiers] = useState<ModifierState>(EMPTY_MODIFIERS);
   const [focusRequestToken, setFocusRequestToken] = useState(0);
   const [resizeRequestToken, setResizeRequestToken] = useState(0);
@@ -195,6 +203,20 @@ export function TerminalPane({
   const requestTerminalReflow = useCallback(() => {
     setResizeRequestToken((current) => current + 1);
   }, []);
+  const handleRendererReadyChange = useCallback(
+    (change: TerminalRendererReadyChange) => {
+      setRendererReadyStreamKey((current) => applyTerminalRendererReadyChange(current, change));
+      if (!shouldReplayTerminalSnapshotForRenderer({ change, terminalStreamKey })) {
+        return;
+      }
+
+      const snapshot = workspaceTerminalSession.snapshots.get({ terminalId });
+      if (snapshot) {
+        emulatorRef.current?.renderSnapshot(snapshot);
+      }
+    },
+    [terminalId, terminalStreamKey, workspaceTerminalSession.snapshots],
+  );
 
   useEffect(() => {
     if (isMobile || !isWorkspaceFocused || !isPaneFocused || !terminalId) {
@@ -617,6 +639,13 @@ export function TerminalPane({
     if (!swipeGesturesEnabled) return;
     onOpenFileExplorer();
   }, [swipeGesturesEnabled, onOpenFileExplorer]);
+  const showLoadingOverlay = shouldShowTerminalLoadingOverlay({
+    isWorkspaceFocused,
+    hasStreamError: Boolean(streamError),
+    isAttaching,
+    rendererReadyStreamKey,
+    terminalStreamKey,
+  });
 
   if (!client || !isConnected) {
     return (
@@ -634,11 +663,12 @@ export function TerminalPane({
             <TerminalEmulator
               ref={emulatorRef}
               dom={TERMINAL_EMULATOR_DOM_PROPS}
-              streamKey={`${scopeKey}:${terminalId}`}
+              streamKey={terminalStreamKey}
               testId="terminal-surface"
               xtermTheme={xtermTheme}
               swipeGesturesEnabled={swipeGesturesEnabled}
               initialSnapshot={initialSnapshot}
+              onRendererReadyChange={handleRendererReadyChange}
               onSwipeRight={handleSwipeRight}
               onSwipeLeft={handleSwipeLeft}
               onInput={handleTerminalData}
@@ -654,7 +684,7 @@ export function TerminalPane({
           <View style={styles.terminalGestureContainer} />
         )}
 
-        {isAttaching && isWorkspaceFocused ? (
+        {showLoadingOverlay ? (
           <View style={styles.attachOverlay} pointerEvents="none" testID="terminal-attach-loading">
             <ActivityIndicator size="small" color={theme.colors.foregroundMuted} />
           </View>

packages/app/src/components/toast-host.tsx

@@ -18,7 +18,7 @@ export type ToastVariant = "default" | "success" | "error";
 export interface ToastShowOptions {
   icon?: ReactNode;
   variant?: ToastVariant;
-  durationMs?: number;
+  durationMs?: number | null;
   nativeAndroid?: boolean;
   testID?: string;
 }
@@ -29,7 +29,7 @@ export interface ToastState {
   nativeMessage: string | null;
   icon?: ReactNode;
   variant: ToastVariant;
-  durationMs: number;
+  durationMs: number | null;
   testID?: string;
 }
 
@@ -59,11 +59,12 @@ export function useToastHost(): {
     }
 
     const variant = options?.variant ?? "default";
-    const durationMs = options?.durationMs ?? DEFAULT_DURATION_MS;
+    const durationMs = options?.durationMs === undefined ? DEFAULT_DURATION_MS : options.durationMs;
     const nativeAndroid = options?.nativeAndroid ?? false;
 
     if (Platform.OS === "android" && nativeAndroid && nativeMessage) {
-      const duration = durationMs <= 2500 ? ToastAndroid.SHORT : ToastAndroid.LONG;
+      const duration =
+        durationMs !== null && durationMs <= 2500 ? ToastAndroid.SHORT : ToastAndroid.LONG;
       ToastAndroid.showWithGravity(nativeMessage, duration, ToastAndroid.TOP);
       return;
     }
@@ -148,8 +149,13 @@ export function ToastViewport({
   }, [clearTimer, onDismiss, opacity, translateY]);
 
   const scheduleDismiss = useCallback(
-    (durationMs: number) => {
+    (durationMs: number | null) => {
       clearTimer();
+      if (durationMs === null) {
+        remainingDurationRef.current = 0;
+        dismissDeadlineRef.current = null;
+        return;
+      }
       const nextDurationMs = Math.max(0, durationMs);
       remainingDurationRef.current = nextDurationMs;
       dismissDeadlineRef.current = Date.now() + nextDurationMs;
@@ -169,7 +175,7 @@ export function ToastViewport({
   }, [clearTimer]);
 
   const resumeDismiss = useCallback(() => {
-    if (!toast) {
+    if (!toast || toast.durationMs === null) {
       return;
     }
     scheduleDismiss(remainingDurationRef.current || toast.durationMs);
@@ -204,7 +210,6 @@ export function ToastViewport({
       }),
     ]).start();
 
-    remainingDurationRef.current = toast.durationMs;
     scheduleDismiss(toast.durationMs);
 
     return () => {

packages/app/src/components/tool-call-details.tsx

@@ -244,15 +244,125 @@ function resolveSubAgentFallbackHeader(
 
 interface SubAgentDetailProps {
   log: string;
+  childSessionId: string | null | undefined;
   subAgentType: string | null | undefined;
   description: string | null | undefined;
   ds: DetailStyles;
 }
 
-function SubAgentDetailSection({ log, subAgentType, description, ds }: SubAgentDetailProps) {
-  const activityLog = log.replace(/^\n+/, "");
-  const hasLog = activityLog.length > 0;
+interface SubAgentActivityRow {
+  index: number;
+  toolName: string;
+  summary?: string;
+}
+
+interface ParsedSubAgentLog {
+  actions: SubAgentActivityRow[];
+  remainingLog: string;
+}
+
+function parseBracketedSubAgentLine(line: string, index: number): SubAgentActivityRow | null {
+  const match = line.match(/^\[([^\]]+)\](?:\s+(.*))?$/);
+  if (!match) {
+    return null;
+  }
+  const toolName = match[1]?.trim();
+  if (!toolName) {
+    return null;
+  }
+  const summary = match[2]?.trim();
+  return {
+    index,
+    toolName,
+    ...(summary ? { summary } : {}),
+  };
+}
+
+function parseSubAgentLog(log: string): ParsedSubAgentLog {
+  const actions: SubAgentActivityRow[] = [];
+  const remainingLines: string[] = [];
+  for (const line of log.replace(/^\n+/, "").split("\n")) {
+    const normalizedLine = line.trim();
+    if (!normalizedLine) {
+      continue;
+    }
+    const parsedAction = parseBracketedSubAgentLine(normalizedLine, actions.length + 1);
+    if (parsedAction) {
+      actions.push(parsedAction);
+    } else {
+      remainingLines.push(line);
+    }
+  }
+  return {
+    actions,
+    remainingLog: remainingLines.join("\n").replace(/^\n+/, ""),
+  };
+}
+
+function SubAgentActionRow({ action }: { action: SubAgentActivityRow }) {
+  return (
+    <View style={styles.subAgentActionRow}>
+      <Text selectable style={styles.subAgentActionTool}>
+        {formatSubAgentToolName(action.toolName)}
+      </Text>
+      {action.summary ? (
+        <Text selectable style={styles.subAgentActionSummary}>
+          {action.summary}
+        </Text>
+      ) : null}
+    </View>
+  );
+}
+
+function formatSubAgentToolName(toolName: string): string {
+  const trimmed = toolName.trim();
+  if (!trimmed) {
+    return toolName;
+  }
+  return trimmed
+    .replace(/[._-]+/g, " ")
+    .split(" ")
+    .filter((segment) => segment.length > 0)
+    .map((segment) => `${segment[0]?.toUpperCase() ?? ""}${segment.slice(1)}`)
+    .join(" ");
+}
+
+function SubAgentLogText({
+  activityLog,
+  fallbackHeader,
+  hasActions,
+}: {
+  activityLog: string;
+  fallbackHeader: string;
+  hasActions: boolean;
+}) {
+  if (activityLog.length > 0) {
+    return (
+      <Text selectable style={styles.scrollText}>
+        {activityLog}
+      </Text>
+    );
+  }
+  if (!hasActions) {
+    return (
+      <Text selectable style={styles.scrollText}>
+        {fallbackHeader}
+      </Text>
+    );
+  }
+  return null;
+}
+
+function SubAgentDetailSection({
+  log,
+  childSessionId,
+  subAgentType,
+  description,
+  ds,
+}: SubAgentDetailProps) {
+  const { actions, remainingLog } = useMemo(() => parseSubAgentLog(log), [log]);
   const fallbackHeader = resolveSubAgentFallbackHeader(subAgentType, description);
+  const hasActions = actions.length > 0;
   return (
     <View style={ds.sectionFillStyle}>
       <View style={ds.codeBlockFillStyle}>
@@ -270,9 +380,23 @@ function SubAgentDetailSection({ log, subAgentType, description, ds }: SubAgentD
             contentContainerStyle={styles.codeHorizontalContent}
           >
             <View style={styles.codeLine}>
-              <Text selectable style={styles.scrollText}>
-                {hasLog ? activityLog : fallbackHeader}
-              </Text>
+              {childSessionId ? (
+                <Text selectable style={styles.subAgentSessionText}>
+                  session {childSessionId}
+                </Text>
+              ) : null}
+              {hasActions ? (
+                <View style={styles.subAgentActions}>
+                  {actions.map((action) => (
+                    <SubAgentActionRow key={action.index} action={action} />
+                  ))}
+                </View>
+              ) : null}
+              <SubAgentLogText
+                activityLog={remainingLog}
+                fallbackHeader={fallbackHeader}
+                hasActions={hasActions}
+              />
             </View>
           </ScrollView>
         </ScrollView>
@@ -530,6 +654,7 @@ function buildDetailSections(
       <SubAgentDetailSection
         key="sub-agent"
         log={detail.log}
+        childSessionId={detail.childSessionId}
         subAgentType={detail.subAgentType}
         description={detail.description}
         ds={ds}
@@ -731,6 +856,34 @@ const styles = StyleSheet.create((theme) => {
     shellPrompt: {
       color: theme.colors.foregroundMuted,
     },
+    subAgentSessionText: {
+      fontFamily: Fonts.mono,
+      fontSize: theme.fontSize.xs,
+      color: theme.colors.foregroundMuted,
+      lineHeight: 18,
+      marginBottom: theme.spacing[2],
+    },
+    subAgentActions: {
+      gap: theme.spacing[1],
+      marginBottom: theme.spacing[2],
+    },
+    subAgentActionRow: {
+      flexDirection: "row",
+      alignItems: "center",
+      gap: theme.spacing[2],
+    },
+    subAgentActionTool: {
+      fontFamily: Fonts.mono,
+      fontSize: theme.fontSize.xs,
+      color: theme.colors.foregroundMuted,
+      lineHeight: 18,
+    },
+    subAgentActionSummary: {
+      fontFamily: Fonts.mono,
+      fontSize: theme.fontSize.xs,
+      color: theme.colors.foreground,
+      lineHeight: 18,
+    },
     jsonScroll: {
       borderWidth: theme.borderWidth[1],
       borderColor: theme.colors.border,

packages/app/src/components/tool-call-sheet.tsx

@@ -1,4 +1,5 @@
-import React, { createContext, useContext, useCallback, useMemo, useRef, ReactNode } from "react";
+import React, { createContext, useContext, useCallback, useMemo } from "react";
+import type { ReactNode } from "react";
 import { View, Text, Pressable } from "react-native";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import Animated from "react-native-reanimated";
@@ -11,7 +12,7 @@ import { X } from "lucide-react-native";
 import type { ToolCallDetail } from "@server/server/agent/agent-sdk-types";
 import {
   IsolatedBottomSheetModal,
-  type IsolatedBottomSheetModalRef,
+  useIsolatedBottomSheetVisibility,
 } from "@/components/ui/isolated-bottom-sheet-modal";
 import { resolveToolCallIcon } from "@/utils/tool-call-icon";
 import { ToolCallDetailsContent } from "./tool-call-details";
@@ -63,32 +64,33 @@ interface ToolCallSheetProviderProps {
 
 export function ToolCallSheetProvider({ children }: ToolCallSheetProviderProps) {
   const { theme } = useUnistyles();
-  const bottomSheetRef = useRef<IsolatedBottomSheetModalRef>(null);
-  const hasPresentedRef = useRef(false);
   const [sheetData, setSheetData] = React.useState<ToolCallSheetData | null>(null);
+  const [isSheetOpen, setIsSheetOpen] = React.useState(false);
 
   const snapPoints = useMemo(() => ["60%", "95%"], []);
 
   const openToolCall = useCallback((data: ToolCallSheetData) => {
     setSheetData(data);
-    if (hasPresentedRef.current) {
-      requestAnimationFrame(() => bottomSheetRef.current?.snapToIndex(0));
-      return;
-    }
-
-    hasPresentedRef.current = true;
-    bottomSheetRef.current?.present();
+    setIsSheetOpen(true);
   }, []);
 
   const closeToolCall = useCallback(() => {
-    bottomSheetRef.current?.close();
+    setIsSheetOpen(false);
   }, []);
 
-  const handleSheetChange = useCallback((index: number) => {
-    if (index === -1) {
-      setSheetData(null);
-    }
-  }, []);
+  const {
+    sheetRef: bottomSheetRef,
+    handleSheetChange,
+    handleSheetDismiss,
+  } = useIsolatedBottomSheetVisibility({
+    visible: isSheetOpen,
+    onClose: closeToolCall,
+  });
+
+  const handleToolCallSheetDismiss = useCallback(() => {
+    handleSheetDismiss();
+    setSheetData(null);
+  }, [handleSheetDismiss]);
 
   const renderBackdrop = useCallback(
     (props: React.ComponentProps<typeof BottomSheetBackdrop>) => (
@@ -116,6 +118,7 @@ export function ToolCallSheetProvider({ children }: ToolCallSheetProviderProps)
         index={0}
         enableDynamicSizing={false}
         onChange={handleSheetChange}
+        onDismiss={handleToolCallSheetDismiss}
         backdropComponent={renderBackdrop}
         enablePanDownToClose
         backgroundComponent={CustomSheetBackground}

packages/app/src/components/ui/button.tsx

@@ -1,10 +1,12 @@
 import {
+  default as React,
   useCallback,
   useMemo,
   useState,
   type ComponentType,
   type PropsWithChildren,
   type ReactElement,
+  type ReactNode,
 } from "react";
 import { ActivityIndicator, Pressable, Text, View } from "react-native";
 import type {
@@ -17,7 +19,7 @@ import type {
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 
 type ButtonVariant = "default" | "secondary" | "outline" | "ghost" | "destructive";
-type ButtonSize = "sm" | "md" | "lg";
+type ButtonSize = "xs" | "sm" | "md" | "lg";
 
 type LeftIcon =
   | ReactElement
@@ -25,7 +27,7 @@ type LeftIcon =
   | ((color: string) => ReactElement)
   | null;
 
-const ICON_SIZE: Record<ButtonSize, number> = { sm: 14, md: 16, lg: 20 };
+const ICON_SIZE: Record<ButtonSize, number> = { xs: 12, sm: 14, md: 16, lg: 20 };
 
 const styles = StyleSheet.create((theme) => ({
   base: {
@@ -41,6 +43,12 @@ const styles = StyleSheet.create((theme) => ({
     paddingVertical: theme.spacing[3],
     paddingHorizontal: theme.spacing[4],
   },
+  xs: {
+    minHeight: 28,
+    paddingVertical: theme.spacing[1],
+    paddingHorizontal: theme.spacing[3],
+    borderRadius: theme.borderRadius.md,
+  },
   sm: {
     paddingVertical: theme.spacing[2],
     paddingHorizontal: theme.spacing[3],
@@ -82,6 +90,9 @@ const styles = StyleSheet.create((theme) => ({
     fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
+  textXs: {
+    fontSize: theme.fontSize.xs,
+  },
   textDefault: {
     color: theme.colors.palette.white,
   },
@@ -101,6 +112,7 @@ export function Button({
   variant = "secondary",
   size = "md",
   leftIcon,
+  trailing,
   style,
   textStyle,
   disabled,
@@ -112,6 +124,7 @@ export function Button({
     variant?: ButtonVariant;
     size?: ButtonSize;
     leftIcon?: LeftIcon;
+    trailing?: ReactNode;
     style?: StyleProp<ViewStyle>;
     textStyle?: StyleProp<TextStyle>;
     loading?: boolean;
@@ -135,7 +148,9 @@ export function Button({
   }
 
   let sizeStyle: ViewStyle;
-  if (size === "sm") {
+  if (size === "xs") {
+    sizeStyle = styles.xs;
+  } else if (size === "sm") {
     sizeStyle = styles.sm;
   } else if (size === "lg") {
     sizeStyle = styles.lg;
@@ -162,13 +177,14 @@ export function Button({
   const resolvedTextStyle = useMemo(
     () => [
       styles.text,
+      size === "xs" ? styles.textXs : null,
       variant === "default" ? styles.textDefault : null,
       variant === "destructive" ? styles.textDestructive : null,
       variant === "ghost" ? styles.textGhost : null,
       textStyle,
       isGhostHovered ? styles.textGhostHovered : null,
     ],
-    [variant, textStyle, isGhostHovered],
+    [size, variant, textStyle, isGhostHovered],
   );
 
   const accessibilityState = useMemo(
@@ -235,6 +251,7 @@ export function Button({
     >
       {renderIcon()}
       {children != null ? <Text style={resolvedTextStyle}>{children}</Text> : null}
+      {trailing}
     </Pressable>
   );
 }

packages/app/src/components/ui/combobox.tsx

@@ -910,10 +910,13 @@ function resolveInitialActiveIndex(
   return selectedIndex >= 0 ? selectedIndex : fallbackIndex;
 }
 
+type BottomSheetVisibility = ReturnType<typeof useIsolatedBottomSheetVisibility>;
+
 interface MobileBodyProps {
-  bottomSheetRef: ReturnType<typeof useIsolatedBottomSheetVisibility>["sheetRef"];
+  bottomSheetRef: BottomSheetVisibility["sheetRef"];
   snapPoints: string[];
-  handleSheetChange: ReturnType<typeof useIsolatedBottomSheetVisibility>["handleSheetChange"];
+  handleSheetChange: BottomSheetVisibility["handleSheetChange"];
+  handleSheetDismiss: BottomSheetVisibility["handleSheetDismiss"];
   handleIndicatorStyle: { backgroundColor: string };
   titleColor: string;
   title: string;
@@ -971,6 +974,7 @@ function MobileComboboxBody(props: MobileBodyProps): ReactElement {
       index={0}
       enableDynamicSizing={false}
       onChange={props.handleSheetChange}
+      onDismiss={props.handleSheetDismiss}
       backdropComponent={renderBackdrop}
       enablePanDownToClose
       backgroundComponent={ComboboxSheetBackground}
@@ -1298,7 +1302,11 @@ export function Combobox({
     referenceWidth,
   });
 
-  const { sheetRef: bottomSheetRef, handleSheetChange } = useIsolatedBottomSheetVisibility({
+  const {
+    sheetRef: bottomSheetRef,
+    handleSheetChange,
+    handleSheetDismiss,
+  } = useIsolatedBottomSheetVisibility({
     visible: isOpen,
     isEnabled: isMobile,
     onClose: handleClose,
@@ -1454,6 +1462,7 @@ export function Combobox({
         bottomSheetRef={bottomSheetRef}
         snapPoints={snapPoints}
         handleSheetChange={handleSheetChange}
+        handleSheetDismiss={handleSheetDismiss}
         handleIndicatorStyle={handleIndicatorStyle}
         titleColor={titleColor}
         title={title}

packages/app/src/components/ui/context-menu.tsx

@@ -400,7 +400,11 @@ export function ContextMenuContent({
     setOpen(false);
   }, [setOpen]);
 
-  const { sheetRef: bottomSheetRef, handleSheetChange } = useIsolatedBottomSheetVisibility({
+  const {
+    sheetRef: bottomSheetRef,
+    handleSheetChange,
+    handleSheetDismiss,
+  } = useIsolatedBottomSheetVisibility({
     visible: open,
     isEnabled: useMobileSheet,
     onClose: handleClose,
@@ -534,6 +538,7 @@ export function ContextMenuContent({
           snapPoints={sheetSnapPoints}
           enableDynamicSizing={false}
           onChange={handleSheetChange}
+          onDismiss={handleSheetDismiss}
           backdropComponent={renderSheetBackdrop}
           enablePanDownToClose
           backgroundStyle={sheetBackgroundStyle}

packages/app/src/components/ui/dropdown-menu.tsx

@@ -28,6 +28,7 @@ import {
 import Animated, { Keyframe, runOnJS } from "react-native-reanimated";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { Check, CheckCircle } from "lucide-react-native";
+import { isWeb } from "@/constants/platform";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { useWebScrollbarStyle } from "@/hooks/use-web-scrollbar-style";
 
@@ -46,6 +47,11 @@ interface Rect {
   height: number;
 }
 
+interface Size {
+  width: number;
+  height: number;
+}
+
 interface DropdownMenuContextValue {
   open: boolean;
   setOpen: (open: boolean) => void;
@@ -56,6 +62,11 @@ interface DropdownMenuContextValue {
 
 const DropdownMenuContext = createContext<DropdownMenuContextValue | null>(null);
 
+export function useDropdownMenuClose(): () => void {
+  const { setOpen } = useDropdownMenuContext("useDropdownMenuClose");
+  return useCallback(() => setOpen(false), [setOpen]);
+}
+
 function useDropdownMenuContext(componentName: string): DropdownMenuContextValue {
   const ctx = useContext(DropdownMenuContext);
   if (!ctx) {
@@ -161,6 +172,55 @@ function computePosition({
   return { x, y, actualPlacement };
 }
 
+interface SharedDropdownContentProps {
+  collapsable: false;
+  testID?: string;
+  style: StyleProp<ViewStyle>;
+}
+
+function renderDropdownSurface(input: {
+  isWebSurface: boolean;
+  sharedProps: SharedDropdownContentProps;
+  scrollable: boolean;
+  scrollViewportStyle: StyleProp<ViewStyle>;
+  content: ReactElement;
+  onExited: () => void;
+}): ReactElement {
+  const { isWebSurface, sharedProps, scrollable, scrollViewportStyle, content, onExited } = input;
+
+  const body = scrollable ? (
+    <ScrollView
+      bounces={false}
+      showsVerticalScrollIndicator
+      style={scrollViewportStyle}
+      contentContainerStyle={DROPDOWN_SCROLL_CONTENT_STYLE}
+    >
+      {content}
+    </ScrollView>
+  ) : (
+    content
+  );
+
+  if (isWebSurface) {
+    return <View {...sharedProps}>{body}</View>;
+  }
+
+  return (
+    <Animated.View
+      {...sharedProps}
+      entering={contentEntering}
+      exiting={contentExiting.withCallback((finished) => {
+        "worklet";
+        if (finished) {
+          runOnJS(onExited)();
+        }
+      })}
+    >
+      {body}
+    </Animated.View>
+  );
+}
+
 export function DropdownMenu({
   open,
   defaultOpen,
@@ -314,8 +374,10 @@ export function DropdownMenuContent({
   width,
   minWidth = 180,
   maxWidth,
+  maxHeight,
   fullWidth = false,
   horizontalPadding = 16,
+  scrollable = false,
   testID,
 }: PropsWithChildren<{
   side?: Placement;
@@ -324,8 +386,10 @@ export function DropdownMenuContent({
   width?: number;
   minWidth?: number;
   maxWidth?: number;
+  maxHeight?: number;
   fullWidth?: boolean;
   horizontalPadding?: number;
+  scrollable?: boolean;
   testID?: string;
 }>): ReactElement | null {
   const { open, setOpen, triggerRef, flushPendingSelect } =
@@ -334,9 +398,23 @@ export function DropdownMenuContent({
   const webScrollbarStyle = useWebScrollbarStyle();
   const [closing, setClosing] = useState(false);
   const [triggerRect, setTriggerRect] = useState<Rect | null>(null);
-  const [contentSize, setContentSize] = useState<{ width: number; height: number } | null>(null);
+  const [contentSize, setContentSize] = useState<Size | null>(null);
   const [position, setPosition] = useState<{ x: number; y: number } | null>(null);
   const [actualPlacement, setActualPlacement] = useState<Placement>(side);
+  const visibleContentSize = useMemo(() => {
+    if (!contentSize) return null;
+    if (!scrollable) return contentSize;
+
+    const { height: screenHeight } = Dimensions.get("window");
+    const viewportMaxHeight = Math.max(screenHeight - 16, 0);
+    const resolvedMaxHeight =
+      typeof maxHeight === "number" ? Math.min(maxHeight, viewportMaxHeight) : viewportMaxHeight;
+
+    return {
+      width: contentSize.width,
+      height: Math.min(contentSize.height, resolvedMaxHeight),
+    };
+  }, [contentSize, scrollable, maxHeight]);
 
   // Keep Modal mounted during exit animation
   useEffect(() => {
@@ -395,7 +473,7 @@ export function DropdownMenuContent({
 
   // Calculate position when we have both measurements
   useEffect(() => {
-    if (!triggerRect || !contentSize) return;
+    if (!triggerRect || !visibleContentSize) return;
 
     const { width: screenWidth, height: screenHeight } = Dimensions.get("window");
     // measureInWindow returns screen coordinates including status bar
@@ -409,7 +487,7 @@ export function DropdownMenuContent({
 
     const result = computePosition({
       triggerRect,
-      contentSize,
+      contentSize: visibleContentSize,
       displayArea,
       placement: side,
       alignment: align,
@@ -420,12 +498,17 @@ export function DropdownMenuContent({
     const x = fullWidth ? horizontalPadding : result.x;
     setPosition({ x, y: result.y });
     setActualPlacement(result.actualPlacement);
-  }, [triggerRect, contentSize, side, align, offset, fullWidth, horizontalPadding]);
+  }, [triggerRect, visibleContentSize, side, align, offset, fullWidth, horizontalPadding]);
 
-  const handleContentLayout = useCallback(
+  const handleMeasuredContentLayout = useCallback(
     (event: { nativeEvent: { layout: { width: number; height: number } } }) => {
       const { width: w, height: h } = event.nativeEvent.layout;
-      setContentSize({ width: w, height: h });
+      setContentSize((current) => {
+        if (current && current.width === w && current.height === h) {
+          return current;
+        }
+        return { width: w, height: h };
+      });
     },
     [],
   );
@@ -460,9 +543,27 @@ export function DropdownMenuContent({
     actualPlacement,
     align,
   ]);
+  const sharedContentProps = useMemo(
+    () => ({
+      collapsable: false as const,
+      testID,
+      style: contentStyle,
+    }),
+    [testID, contentStyle],
+  );
+  const scrollViewportStyle = useMemo(
+    () => [webScrollbarStyle, visibleContentSize ? { height: visibleContentSize.height } : null],
+    [visibleContentSize, webScrollbarStyle],
+  );
 
   if (!modalVisible) return null;
 
+  const content = (
+    <View collapsable={false} onLayout={handleMeasuredContentLayout}>
+      {children}
+    </View>
+  );
+
   return (
     <Modal
       visible={modalVisible}
@@ -480,30 +581,16 @@ export function DropdownMenuContent({
           onPress={handleClose}
           testID={testID ? `${testID}-backdrop` : undefined}
         />
-        {!closing ? (
-          <Animated.View
-            entering={contentEntering}
-            exiting={contentExiting.withCallback((finished) => {
-              "worklet";
-              if (finished) {
-                runOnJS(setModalVisible)(false);
-              }
-            })}
-            collapsable={false}
-            testID={testID}
-            onLayout={handleContentLayout}
-            style={contentStyle}
-          >
-            <ScrollView
-              bounces={false}
-              showsVerticalScrollIndicator
-              style={webScrollbarStyle}
-              contentContainerStyle={DROPDOWN_SCROLL_CONTENT_STYLE}
-            >
-              {children}
-            </ScrollView>
-          </Animated.View>
-        ) : null}
+        {!closing
+          ? renderDropdownSurface({
+              isWebSurface: isWeb,
+              sharedProps: sharedContentProps,
+              scrollable,
+              scrollViewportStyle,
+              content,
+              onExited: () => setModalVisible(false),
+            })
+          : null}
       </View>
     </Modal>
   );

packages/app/src/components/ui/isolated-bottom-sheet-modal.test.tsx

@@ -14,7 +14,12 @@ const SNAP_POINTS_90: (string | number)[] = ["90%"];
 
 function noop(): void {}
 
-const { modalMethods, modalProps } = vi.hoisted(() => ({
+interface CapturedModalProps {
+  onChange?: (index: number) => void;
+  onDismiss?: () => void;
+}
+
+const { modalMethods, modalProps, shouldExposeModalRef } = vi.hoisted(() => ({
   modalMethods: {
     present: vi.fn(),
     close: vi.fn(),
@@ -22,6 +27,7 @@ const { modalMethods, modalProps } = vi.hoisted(() => ({
     dismiss: vi.fn(),
   },
   modalProps: vi.fn(),
+  shouldExposeModalRef: { current: true },
 }));
 
 vi.mock("@gorhom/bottom-sheet", async () => {
@@ -29,7 +35,7 @@ vi.mock("@gorhom/bottom-sheet", async () => {
   const MockBottomSheetModal = React.forwardRef(
     (props: Record<string, unknown>, ref: React.ForwardedRef<unknown>) => {
       modalProps(props);
-      React.useImperativeHandle(ref, () => modalMethods);
+      React.useImperativeHandle(ref, () => (shouldExposeModalRef.current ? modalMethods : null));
       return React.createElement(
         "div",
         { "data-testid": "bottom-sheet" },
@@ -54,7 +60,7 @@ vi.mock("@gorhom/portal", async () => {
 });
 
 function Harness({ visible, onClose }: { visible: boolean; onClose: () => void }) {
-  const { sheetRef, handleSheetChange } = useIsolatedBottomSheetVisibility({
+  const { sheetRef, handleSheetChange, handleSheetDismiss } = useIsolatedBottomSheetVisibility({
     visible,
     onClose,
   });
@@ -65,26 +71,34 @@ function Harness({ visible, onClose }: { visible: boolean; onClose: () => void }
       index={0}
       snapPoints={SNAP_POINTS_50}
       onChange={handleSheetChange}
+      onDismiss={handleSheetDismiss}
     >
       <div>Sheet content</div>
     </IsolatedBottomSheetModal>
   );
 }
 
+function latestModalProps(): CapturedModalProps {
+  const props = modalProps.mock.lastCall?.[0];
+  expect(props).toBeDefined();
+  return props as CapturedModalProps;
+}
+
 describe("IsolatedBottomSheetModal", () => {
   afterEach(() => {
     cleanup();
     vi.clearAllMocks();
+    shouldExposeModalRef.current = true;
   });
 
-  it("forces sheet isolation and keeps modal content mounted while hidden", () => {
+  it("forces sheet isolation and uses the modal dismissal lifecycle", () => {
     const onClose = vi.fn();
     const { getByTestId, rerender } = render(<Harness visible={false} onClose={onClose} />);
 
     expect(getByTestId("app-portal").getAttribute("data-host")).toBe("root");
     expect(modalProps).toHaveBeenLastCalledWith(
       expect.objectContaining({
-        enableDismissOnClose: false,
+        enableDismissOnClose: true,
         stackBehavior: "replace",
       }),
     );
@@ -94,28 +108,61 @@ describe("IsolatedBottomSheetModal", () => {
     expect(modalMethods.present).toHaveBeenCalledTimes(1);
 
     rerender(<Harness visible={false} onClose={onClose} />);
-    expect(modalMethods.close).toHaveBeenCalledTimes(1);
-    expect(modalMethods.dismiss).not.toHaveBeenCalled();
+    expect(modalMethods.dismiss).toHaveBeenCalledTimes(1);
+    expect(modalMethods.close).not.toHaveBeenCalled();
 
     rerender(<Harness visible onClose={onClose} />);
-    expect(modalMethods.present).toHaveBeenCalledTimes(1);
-    expect(modalMethods.snapToIndex).toHaveBeenCalledWith(0);
+    expect(modalMethods.present).toHaveBeenCalledTimes(2);
+    expect(modalMethods.snapToIndex).not.toHaveBeenCalled();
   });
 
   it("only reports a user close when the sheet was visible", () => {
     const onClose = vi.fn();
     const { rerender } = render(<Harness visible onClose={onClose} />);
 
-    const latestProps = modalProps.mock.lastCall?.[0] as { onChange: (index: number) => void };
-    latestProps.onChange(-1);
+    latestModalProps().onChange?.(-1);
     expect(onClose).toHaveBeenCalledTimes(1);
 
     rerender(<Harness visible={false} onClose={onClose} />);
-    const closedProps = modalProps.mock.lastCall?.[0] as { onChange: (index: number) => void };
-    closedProps.onChange(-1);
+    latestModalProps().onChange?.(-1);
     expect(onClose).toHaveBeenCalledTimes(1);
   });
 
+  it("reports a dismiss while visible as a close request", () => {
+    const onClose = vi.fn();
+    render(<Harness visible onClose={onClose} />);
+
+    latestModalProps().onDismiss?.();
+
+    expect(onClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("deduplicates close notifications from change and dismiss callbacks", () => {
+    const onClose = vi.fn();
+    render(<Harness visible onClose={onClose} />);
+
+    const props = latestModalProps();
+    props.onChange?.(-1);
+    props.onDismiss?.();
+
+    expect(onClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("presents when the sheet ref becomes available after opening", () => {
+    shouldExposeModalRef.current = false;
+    const onClose = vi.fn();
+    const { rerender } = render(<Harness visible onClose={onClose} />);
+
+    expect(modalMethods.present).not.toHaveBeenCalled();
+    expect(modalMethods.snapToIndex).not.toHaveBeenCalled();
+
+    shouldExposeModalRef.current = true;
+    rerender(<Harness visible onClose={onClose} />);
+
+    expect(modalMethods.present).toHaveBeenCalledTimes(1);
+    expect(modalMethods.snapToIndex).not.toHaveBeenCalled();
+  });
+
   it("allows nested sheets inside a parent sheet without creating a sibling provider", () => {
     const { getAllByTestId } = render(
       <IsolatedBottomSheetModal index={0} snapPoints={SNAP_POINTS_90}>

packages/app/src/components/ui/isolated-bottom-sheet-modal.tsx

@@ -41,7 +41,7 @@ export const IsolatedBottomSheetModal = forwardRef<
     <GorhomBottomSheetModal
       {...bottomSheetProps}
       ref={ref}
-      enableDismissOnClose={false}
+      enableDismissOnClose
       stackBehavior={isNestedSheet ? "push" : "replace"}
     >
       {scopedChildren}
@@ -68,39 +68,92 @@ export function useIsolatedBottomSheetVisibility({
   isEnabled?: boolean;
   onClose: () => void;
 }) {
-  const sheetRef = useRef<IsolatedBottomSheetModalRef>(null);
-  const hasPresentedRef = useRef(false);
+  const sheetRef = useRef<IsolatedBottomSheetModalRef | null>(null);
+  const visibleRef = useRef(visible);
+  const isEnabledRef = useRef(isEnabled);
+  const isPresentedRef = useRef(false);
+  const hasNotifiedCloseRef = useRef(false);
+
+  visibleRef.current = visible;
+  isEnabledRef.current = isEnabled;
+
+  const presentSheet = useCallback((sheet: IsolatedBottomSheetModalRef) => {
+    if (isPresentedRef.current) {
+      return;
+    }
+
+    isPresentedRef.current = true;
+    hasNotifiedCloseRef.current = false;
+    sheet.present();
+  }, []);
+
+  const dismissSheet = useCallback((sheet: IsolatedBottomSheetModalRef) => {
+    if (!isPresentedRef.current) {
+      return;
+    }
+
+    isPresentedRef.current = false;
+    sheet.dismiss();
+  }, []);
+
+  const notifyClose = useCallback(() => {
+    if (hasNotifiedCloseRef.current) {
+      return;
+    }
+
+    hasNotifiedCloseRef.current = true;
+    onClose();
+  }, [onClose]);
+
+  const handleSheetDismiss = useCallback(() => {
+    isPresentedRef.current = false;
+    if (visibleRef.current) {
+      notifyClose();
+      return;
+    }
+    hasNotifiedCloseRef.current = false;
+  }, [notifyClose]);
+
+  const handleSheetChange = useCallback(
+    (index: number) => {
+      if (index === -1 && visibleRef.current) {
+        notifyClose();
+      }
+    },
+    [notifyClose],
+  );
+
+  const setSheetRef = useCallback(
+    (instance: IsolatedBottomSheetModalRef | null) => {
+      sheetRef.current = instance;
+      if (instance && visibleRef.current && isEnabledRef.current !== false) {
+        presentSheet(instance);
+      }
+    },
+    [presentSheet],
+  );
 
   useEffect(() => {
     if (isEnabled === false) return;
 
+    const sheet = sheetRef.current;
     if (visible) {
-      if (hasPresentedRef.current) {
-        sheetRef.current?.snapToIndex(0);
+      if (!sheet) {
         return;
       }
 
-      hasPresentedRef.current = true;
-      sheetRef.current?.present();
+      presentSheet(sheet);
       return;
     }
 
-    if (hasPresentedRef.current) {
-      sheetRef.current?.close();
+    if (sheet) {
+      dismissSheet(sheet);
     }
-  }, [isEnabled, visible]);
-
-  const handleSheetChange = useCallback(
-    (index: number) => {
-      if (index === -1 && visible) {
-        onClose();
-      }
-    },
-    [onClose, visible],
-  );
+  }, [dismissSheet, isEnabled, presentSheet, visible]);
 
   return {
-    sheetRef,
+    sheetRef: setSheetRef,
     handleSheetChange,
+    handleSheetDismiss,
   };
 }

packages/app/src/components/ui/shortcut.tsx

@@ -1,9 +1,26 @@
-import { useMemo, type ReactElement } from "react";
+import React, { useMemo, type ReactElement } from "react";
 import { Text, View, type StyleProp, type TextStyle, type ViewStyle } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
 import { formatShortcut, type ShortcutKey } from "@/utils/format-shortcut";
 import { getShortcutOs } from "@/utils/shortcut-platform";
 
+function colorWithOpacity(color: string, opacity: number): string {
+  const hex = color.trim();
+  if (/^#[0-9a-fA-F]{3}$/.test(hex)) {
+    const r = Number.parseInt(hex[1] + hex[1], 16);
+    const g = Number.parseInt(hex[2] + hex[2], 16);
+    const b = Number.parseInt(hex[3] + hex[3], 16);
+    return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+  }
+  if (/^#[0-9a-fA-F]{6}$/.test(hex)) {
+    const r = Number.parseInt(hex.slice(1, 3), 16);
+    const g = Number.parseInt(hex.slice(3, 5), 16);
+    const b = Number.parseInt(hex.slice(5, 7), 16);
+    return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+  }
+  return `rgba(255, 255, 255, ${opacity})`;
+}
+
 export function Shortcut({
   keys,
   chord,
@@ -53,9 +70,8 @@ const styles = StyleSheet.create((theme) => ({
     paddingHorizontal: theme.spacing[1],
     paddingVertical: 2,
     borderRadius: theme.borderRadius.md,
-    backgroundColor: theme.colors.surface2,
-    borderWidth: theme.borderWidth[1],
-    borderColor: theme.colors.borderAccent,
+    backgroundColor: colorWithOpacity(theme.colors.foreground, 0.05),
+    borderWidth: 0,
   },
   sequence: {
     flexDirection: "row",
@@ -66,6 +82,6 @@ const styles = StyleSheet.create((theme) => ({
   text: {
     fontSize: theme.fontSize.xs,
     fontWeight: theme.fontWeight.normal,
-    color: theme.colors.foregroundMuted,
+    color: colorWithOpacity(theme.colors.foreground, 0.6),
   },
 }));

packages/app/src/components/welcome-screen.tsx

@@ -248,8 +248,6 @@ export function WelcomeScreen({ onHostAdded }: WelcomeScreenProps) {
         },
       ];
 
-  const isConnectingToSavedHosts = hosts.length > 0 && !anyOnlineServerId;
-
   const scrollContentContainerStyle = useMemo(
     () => [styles.container, { paddingBottom: theme.spacing[6] + insets.bottom }],
     [theme.spacing, insets.bottom],
@@ -266,20 +264,14 @@ export function WelcomeScreen({ onHostAdded }: WelcomeScreenProps) {
         <View style={styles.content}>
           <PaseoLogo size={96} />
           <View style={styles.copyBlock}>
-            {isConnectingToSavedHosts ? (
-              <Text style={styles.subtitle}>Connecting…</Text>
-            ) : (
-              <>
-                <Text style={styles.title}>Welcome to Paseo</Text>
-                <Text style={styles.subtitle}>Connect your computer to get started</Text>
-                {isNative ? (
-                  <Pressable style={styles.setupLink} onPress={handleOpenPaseoSite}>
-                    <Text style={styles.setupLinkText}>paseo.sh</Text>
-                    <ExternalLink size={14} color={theme.colors.accent} />
-                  </Pressable>
-                ) : null}
-              </>
-            )}
+            <Text style={styles.title}>Welcome to Paseo</Text>
+            <Text style={styles.subtitle}>Connect your computer to get started</Text>
+            {isNative ? (
+              <Pressable style={styles.setupLink} onPress={handleOpenPaseoSite}>
+                <Text style={styles.setupLinkText}>paseo.sh</Text>
+                <ExternalLink size={14} color={theme.colors.accent} />
+              </Pressable>
+            ) : null}
           </View>
 
           <View style={styles.actions}>

packages/app/src/components/workspace-setup-dialog.tsx

@@ -14,11 +14,7 @@ import { normalizeAgentSnapshot } from "@/utils/agent-snapshots";
 import { encodeImages } from "@/utils/encode-images";
 import { toErrorMessage } from "@/utils/error-messages";
 import { splitComposerAttachmentsForSubmit } from "@/components/composer-attachments";
-import type {
-  CreateAgentRequestOptions,
-  CreatePaseoWorktreeInput,
-  DaemonClient,
-} from "@server/client/daemon-client";
+import type { CreateAgentRequestOptions, DaemonClient } from "@server/client/daemon-client";
 import { projectIconPlaceholderLabelFromDisplayName } from "@/utils/project-display-name";
 import { requireWorkspaceExecutionAuthority } from "@/utils/workspace-execution";
 import { navigateToPreparedWorkspaceTab } from "@/utils/workspace-navigation";
@@ -73,24 +69,19 @@ function buildChatDraftComposerArgs({
   };
 }
 
-type WorkspaceCreationAttachments = NonNullable<CreatePaseoWorktreeInput["attachments"]>;
-
 async function callWorkspaceCreation({
   creationMethod,
   connectedClient,
   input,
-  wirePayload,
 }: {
   creationMethod: "create_worktree" | "open_project";
   connectedClient: DaemonClient;
   input: { cwd: string };
-  wirePayload: { attachments: WorkspaceCreationAttachments };
 }) {
   if (creationMethod === "create_worktree") {
     return connectedClient.createPaseoWorktree({
       cwd: input.cwd,
       worktreeSlug: createNameId(),
-      ...(wirePayload.attachments.length > 0 ? { attachments: wirePayload.attachments } : {}),
     });
   }
   return connectedClient.openProject(input.cwd);
@@ -228,12 +219,10 @@ export function WorkspaceSetupDialog() {
       }
 
       const connectedClient = withConnectedClient();
-      const wirePayload = splitComposerAttachmentsForSubmit(input.attachments);
       const payload = await callWorkspaceCreation({
         creationMethod: pendingWorkspaceSetup.creationMethod,
         connectedClient,
         input,
-        wirePayload,
       });
 
       if (payload.error || !payload.workspace) {

packages/app/src/components/workspace-shortcut-targets-subscriber.test.tsx

@@ -31,6 +31,7 @@ function workspaceDescriptor(input: {
     workspaceKind: "worktree",
     name: input.name ?? input.id,
     status: "done",
+    archivingAt: null,
     diffStat: null,
     scripts: [],
   };

packages/app/src/contexts/session-context.service-status.test.ts

@@ -18,6 +18,7 @@ function workspace(input: {
     workspaceKind: "checkout",
     name: "main",
     status: "running",
+    archivingAt: null,
     diffStat: null,
     scripts: input.scripts ?? [],
   };

packages/app/src/contexts/session-context.tsx

@@ -12,7 +12,8 @@ import {
   processTimelineResponse,
   type ProcessTimelineResponseOutput,
   type TimelineReducerSideEffect,
-} from "@/contexts/session-stream-reducers";
+} from "@/timeline/session-stream-reducers";
+import { TIMELINE_FETCH_PAGE_SIZE } from "@/timeline/timeline-fetch-policy";
 import type {
   AgentAttachment,
   AgentStreamEventPayload,
@@ -58,6 +59,10 @@ import type { AttachmentMetadata } from "@/attachments/types";
 import { splitComposerAttachmentsForSubmit } from "@/components/composer-attachments";
 import { reconcilePreviousAgentStatuses } from "@/contexts/session-status-tracking";
 import { patchWorkspaceScripts } from "@/contexts/session-workspace-scripts";
+import {
+  clearWorkspaceArchivePending,
+  shouldSuppressWorkspaceForLocalArchive,
+} from "@/contexts/session-workspace-upserts";
 import { isNative } from "@/constants/platform";
 import { useToast } from "@/contexts/toast-context";
 import { toErrorMessage } from "@/utils/error-messages";
@@ -449,6 +454,7 @@ function SessionProviderInternal({ children, serverId, client }: SessionProvider
   const setAgentStreamState = useSessionStore((state) => state.setAgentStreamState);
   const clearAgentStreamHead = useSessionStore((state) => state.clearAgentStreamHead);
   const setAgentTimelineCursor = useSessionStore((state) => state.setAgentTimelineCursor);
+  const setAgentTimelineHasOlder = useSessionStore((state) => state.setAgentTimelineHasOlder);
   const setInitializingAgents = useSessionStore((state) => state.setInitializingAgents);
   const bumpHistorySyncGeneration = useSessionStore((state) => state.bumpHistorySyncGeneration);
   const markAgentHistorySynchronized = useSessionStore(
@@ -539,6 +545,9 @@ function SessionProviderInternal({ children, serverId, client }: SessionProvider
 
         for (const entry of payload.entries) {
           const workspace = normalizeWorkspaceDescriptor(entry);
+          if (shouldSuppressWorkspaceForLocalArchive({ serverId, workspace })) {
+            continue;
+          }
           workspaces.set(workspace.id, workspace);
         }
 
@@ -746,17 +755,15 @@ function SessionProviderInternal({ children, serverId, client }: SessionProvider
       if (isNative) {
         const session = useSessionStore.getState().sessions[serverId];
         const agentId = session?.focusedAgentId;
-        const cursor = agentId ? session?.agentTimelineCursor.get(agentId) : undefined;
-        if (agentId && cursor) {
+        if (agentId) {
           void client
             .fetchAgentTimeline(agentId, {
-              direction: "after",
-              cursor: { epoch: cursor.epoch, seq: cursor.endSeq },
-              limit: 0,
+              direction: "tail",
+              limit: TIMELINE_FETCH_PAGE_SIZE,
               projection: "canonical",
             })
             .catch((error) => {
-              console.warn("[Session] failed to fetch catch-up timeline on resume", agentId, error);
+              console.warn("[Session] failed to fetch tail timeline on resume", agentId, error);
             });
         }
       }
@@ -1022,7 +1029,7 @@ function SessionProviderInternal({ children, serverId, client }: SessionProvider
         .fetchAgentTimeline(agentId, {
           direction: "after",
           cursor: { epoch: cursor.epoch, seq: cursor.endSeq },
-          limit: 0,
+          limit: TIMELINE_FETCH_PAGE_SIZE,
           projection: "canonical",
         })
         .catch((error) => {
@@ -1053,6 +1060,15 @@ function SessionProviderInternal({ children, serverId, client }: SessionProvider
       const currentTail = session?.agentStreamTail.get(agentId) ?? [];
       const currentHead = session?.agentStreamHead.get(agentId) ?? [];
 
+      setAgentTimelineHasOlder(serverId, (prev) => {
+        if (prev.get(agentId) === payload.hasOlder) {
+          return prev;
+        }
+        const next = new Map(prev);
+        next.set(agentId, payload.hasOlder);
+        return next;
+      });
+
       if (payload.agent) {
         const normalized = normalizeAgentSnapshot(payload.agent, serverId);
         applyAuthoritativeAgentSnapshot({
@@ -1125,6 +1141,7 @@ function SessionProviderInternal({ children, serverId, client }: SessionProvider
       setAgentStreamHead,
       setAgentStreamTail,
       setAgentTimelineCursor,
+      setAgentTimelineHasOlder,
       setInitializingAgents,
     ],
   );
@@ -1227,11 +1244,18 @@ function SessionProviderInternal({ children, serverId, client }: SessionProvider
     const unsubWorkspaceUpdate = client.on("workspace_update", (message) => {
       if (message.type !== "workspace_update") return;
       if (message.payload.kind === "remove") {
+        clearWorkspaceArchivePending({
+          serverId,
+          workspaceId: String(message.payload.id),
+        });
         removeWorkspaceSetup({ serverId, workspaceId: String(message.payload.id) });
         removeWorkspace(serverId, String(message.payload.id));
         return;
       }
       const workspace = normalizeWorkspaceDescriptor(message.payload.workspace);
+      if (shouldSuppressWorkspaceForLocalArchive({ serverId, workspace })) {
+        return;
+      }
       mergeWorkspaces(serverId, [workspace]);
     });
 

packages/app/src/contexts/session-stream-lifecycle.test.ts

@@ -1,30 +0,0 @@
-import { describe, expect, it } from "vitest";
-import type { AgentStreamEventPayload } from "@server/shared/messages";
-import { deriveOptimisticLifecycleStatus } from "./session-stream-lifecycle";
-
-const turnCompletedEvent: AgentStreamEventPayload = {
-  type: "turn_completed",
-  provider: "claude",
-};
-
-const turnFailedEvent: AgentStreamEventPayload = {
-  type: "turn_failed",
-  provider: "claude",
-  error: "failed",
-};
-
-const turnCanceledEvent: AgentStreamEventPayload = {
-  type: "turn_canceled",
-  provider: "codex",
-  reason: "interrupted",
-};
-
-describe("session stream lifecycle helpers", () => {
-  it("derives optimistic terminal lifecycle only when current status is running", () => {
-    expect(deriveOptimisticLifecycleStatus("running", turnCompletedEvent)).toBe("idle");
-    expect(deriveOptimisticLifecycleStatus("running", turnFailedEvent)).toBe("error");
-    expect(deriveOptimisticLifecycleStatus("running", turnCanceledEvent)).toBe(null);
-    expect(deriveOptimisticLifecycleStatus("initializing", turnCompletedEvent)).toBe(null);
-    expect(deriveOptimisticLifecycleStatus("idle", turnFailedEvent)).toBe(null);
-  });
-});

packages/app/src/contexts/session-stream-lifecycle.ts

@@ -1,23 +0,0 @@
-import type { AgentLifecycleStatus } from "@server/shared/agent-lifecycle";
-import type { AgentStreamEventPayload } from "@server/shared/messages";
-
-export function deriveOptimisticLifecycleStatus(
-  currentStatus: AgentLifecycleStatus,
-  event: AgentStreamEventPayload,
-): AgentLifecycleStatus | null {
-  if (currentStatus !== "running") {
-    return null;
-  }
-  switch (event.type) {
-    case "turn_completed":
-      return "idle";
-    case "turn_failed":
-      return "error";
-    case "turn_canceled":
-      // A canceled turn can be either a final user cancel or an interrupt before
-      // a replacement turn starts. The daemon snapshot is authoritative here.
-      return null;
-    default:
-      return null;
-  }
-}

packages/app/src/contexts/session-timeline-bootstrap-policy.test.ts

@@ -1,108 +0,0 @@
-import { describe, expect, it } from "vitest";
-import { classifySessionTimelineSeq } from "./session-timeline-seq-gate";
-import {
-  deriveBootstrapTailTimelinePolicy,
-  shouldResolveTimelineInit,
-} from "./session-timeline-bootstrap-policy";
-
-describe("deriveBootstrapTailTimelinePolicy", () => {
-  it("always replaces on explicit reset without catch-up cursor", () => {
-    const policy = deriveBootstrapTailTimelinePolicy({
-      direction: "after",
-      reset: true,
-      epoch: "epoch-1",
-      endCursor: { seq: 200 },
-      isInitializing: false,
-      hasActiveInitDeferred: false,
-    });
-
-    expect(policy.replace).toBe(true);
-    expect(policy.catchUpCursor).toBeNull();
-  });
-
-  it("forces baseline replace and canonical catch-up for init tail race", () => {
-    const advancedCursor = { epoch: "epoch-1", endSeq: 205 };
-    const tailSeqStart = 101;
-    const tailSeqEnd = 200;
-
-    let acceptedWithoutBootstrap = 0;
-    for (let seq = tailSeqStart; seq <= tailSeqEnd; seq += 1) {
-      const decision = classifySessionTimelineSeq({
-        cursor: advancedCursor,
-        epoch: "epoch-1",
-        seq,
-      });
-      if (decision === "accept" || decision === "init") {
-        acceptedWithoutBootstrap += 1;
-      }
-    }
-    expect(acceptedWithoutBootstrap).toBe(0);
-
-    const policy = deriveBootstrapTailTimelinePolicy({
-      direction: "tail",
-      reset: false,
-      epoch: "epoch-1",
-      endCursor: { seq: 200 },
-      isInitializing: true,
-      hasActiveInitDeferred: true,
-    });
-
-    expect(policy.replace).toBe(true);
-    expect(policy.catchUpCursor).toEqual({
-      epoch: "epoch-1",
-      endSeq: 200,
-    });
-  });
-
-  it("does not replace non-bootstrap, non-reset responses", () => {
-    const policy = deriveBootstrapTailTimelinePolicy({
-      direction: "tail",
-      reset: false,
-      epoch: "epoch-1",
-      endCursor: { seq: 200 },
-      isInitializing: false,
-      hasActiveInitDeferred: false,
-    });
-
-    expect(policy.replace).toBe(false);
-    expect(policy.catchUpCursor).toBeNull();
-  });
-});
-
-describe("shouldResolveTimelineInit", () => {
-  it("resolves tail init when the tail response arrives", () => {
-    expect(
-      shouldResolveTimelineInit({
-        hasActiveInitDeferred: true,
-        isInitializing: true,
-        initRequestDirection: "tail",
-        responseDirection: "tail",
-        reset: false,
-      }),
-    ).toBe(true);
-  });
-
-  it("does not resolve tail init when an after response arrives first", () => {
-    expect(
-      shouldResolveTimelineInit({
-        hasActiveInitDeferred: true,
-        isInitializing: true,
-        initRequestDirection: "tail",
-        responseDirection: "after",
-        reset: false,
-      }),
-    ).toBe(false);
-  });
-
-  it("resolves after init when an after response arrives", () => {
-    expect(
-      shouldResolveTimelineInit({
-        hasActiveInitDeferred: true,
-        isInitializing: true,
-        initRequestDirection: "after",
-        responseDirection: "after",
-        reset: false,
-      }),
-    ).toBe(true);
-  });
-});

packages/app/src/contexts/session-timeline-bootstrap-policy.ts

@@ -1,96 +0,0 @@
-type TimelineDirection = "tail" | "before" | "after";
-type InitRequestDirection = "tail" | "after";
-
-type BootstrapTailCursor = {
-  seq: number;
-} | null;
-
-type InitialTimelineCursor = {
-  epoch: string;
-  seq: number;
-} | null;
-
-export function deriveInitialTimelineRequest({
-  cursor,
-  hasAuthoritativeHistory,
-  initialTimelineLimit,
-}: {
-  cursor: InitialTimelineCursor;
-  hasAuthoritativeHistory: boolean;
-  initialTimelineLimit: number;
-}): {
-  direction: "tail" | "after";
-  cursor?: { epoch: string; seq: number };
-  limit: number;
-  projection: "canonical";
-} {
-  if (!hasAuthoritativeHistory || !cursor) {
-    return {
-      direction: "tail",
-      limit: initialTimelineLimit,
-      projection: "canonical",
-    };
-  }
-
-  return {
-    direction: "after",
-    cursor: { epoch: cursor.epoch, seq: cursor.seq },
-    limit: 0,
-    projection: "canonical",
-  };
-}
-
-export function deriveBootstrapTailTimelinePolicy({
-  direction,
-  reset,
-  epoch,
-  endCursor,
-  isInitializing,
-  hasActiveInitDeferred,
-}: {
-  direction: TimelineDirection;
-  reset: boolean;
-  epoch: string;
-  endCursor: BootstrapTailCursor;
-  isInitializing: boolean;
-  hasActiveInitDeferred: boolean;
-}): {
-  replace: boolean;
-  catchUpCursor: { epoch: string; endSeq: number } | null;
-} {
-  if (reset) {
-    return { replace: true, catchUpCursor: null };
-  }
-
-  const isBootstrapTailInit = direction === "tail" && isInitializing && hasActiveInitDeferred;
-  if (!isBootstrapTailInit) {
-    return { replace: false, catchUpCursor: null };
-  }
-
-  return {
-    replace: true,
-    catchUpCursor: endCursor ? { epoch, endSeq: endCursor.seq } : null,
-  };
-}
-
-export function shouldResolveTimelineInit({
-  hasActiveInitDeferred,
-  isInitializing,
-  initRequestDirection,
-  responseDirection,
-  reset,
-}: {
-  hasActiveInitDeferred: boolean;
-  isInitializing: boolean;
-  initRequestDirection: InitRequestDirection;
-  responseDirection: TimelineDirection;
-  reset: boolean;
-}): boolean {
-  if (!hasActiveInitDeferred || !isInitializing) {
-    return false;
-  }
-  if (reset) {
-    return true;
-  }
-  return responseDirection === initRequestDirection;
-}