fix(desktop): add cleanup-assets job to delete stale release assets before rebuild

# Conflicts:
#	packages/app/src/app/h/[serverId]/workspace/[workspaceId]/_layout.tsx
#	packages/app/src/screens/workspace/workspace-agent-visibility.test.ts
#	packages/app/src/screens/workspace/workspace-agent-visibility.ts
#	packages/app/src/screens/workspace/workspace-screen.tsx

.github/workflows/desktop-release.yml

@@ -3,21 +3,21 @@ name: Desktop Release
 on:
   push:
     tags:
-      - "v*"
-      - "desktop-v*"
-      - "desktop-macos-v*"
-      - "desktop-linux-v*"
-      - "desktop-windows-v*"
+      - 'v*'
+      - 'desktop-v*'
+      - 'desktop-macos-v*'
+      - 'desktop-linux-v*'
+      - 'desktop-windows-v*'
   workflow_dispatch:
     inputs:
       tag:
-        description: "Existing tag to build (e.g. v0.1.0)"
+        description: 'Existing tag to build (e.g. v0.1.0)'
         required: true
         type: string
       platform:
-        description: "Optional desktop platform to build."
+        description: 'Optional desktop platform to build.'
         required: false
-        default: "all"
+        default: 'all'
         type: choice
         options:
           - all
@@ -31,18 +31,54 @@ concurrency:
 
 env:
   SOURCE_TAG: ${{ github.event_name == 'workflow_dispatch' && github.event.inputs.tag || github.ref_name }}
+  DESKTOP_WORKSPACE: '@getpaseo/desktop'
+  DESKTOP_PACKAGE_PATH: 'packages/desktop'
 
 jobs:
+  cleanup-assets:
+    permissions:
+      contents: write
+    runs-on: ubuntu-latest
+    steps:
+      - name: Resolve release tag
+        shell: bash
+        run: |
+          set -euo pipefail
+          source_tag="${SOURCE_TAG}"
+          if [[ "$source_tag" =~ ^(desktop-(windows|linux|macos)-|desktop-)?v([0-9]+\.[0-9]+\.[0-9]+) ]]; then
+            release_tag="v${BASH_REMATCH[3]}"
+          else
+            release_tag="$source_tag"
+          fi
+          echo "RELEASE_TAG=$release_tag" >> "$GITHUB_ENV"
+
+      - name: Delete all existing release assets
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        shell: bash
+        run: |
+          set -euo pipefail
+          assets=$(gh release view "$RELEASE_TAG" --repo "${{ github.repository }}" --json assets --jq '.assets[].name' 2>/dev/null || true)
+          if [[ -z "$assets" ]]; then
+            echo "No existing assets to clean up"
+            exit 0
+          fi
+          for asset in $assets; do
+            echo "Deleting $asset"
+            gh release delete-asset "$RELEASE_TAG" "$asset" --repo "${{ github.repository }}" --yes || true
+          done
+
   publish-macos:
+    needs: cleanup-assets
     if: ${{ (github.event_name == 'workflow_dispatch' && (github.event.inputs.platform == 'all' || github.event.inputs.platform == 'macos')) || (github.event_name == 'push' && (startsWith(github.ref_name, 'v') || startsWith(github.ref_name, 'desktop-v') || startsWith(github.ref_name, 'desktop-macos-v'))) }}
     strategy:
       fail-fast: false
       matrix:
         include:
           - runner: macos-14
-            rust_target: aarch64-apple-darwin
+            electron_arch: arm64
           - runner: macos-15-intel
-            rust_target: x86_64-apple-darwin
+            electron_arch: x64
     permissions:
       contents: write
       packages: read
@@ -75,85 +111,39 @@ jobs:
             echo "IS_SMOKE_TAG=false" >> "$GITHUB_ENV"
           fi
 
-      - name: Set desktop version from tag
-        shell: bash
-        run: |
-          node <<'NODE'
-          const fs = require('node:fs');
-          const path = require('node:path');
-          const version = process.env.DESKTOP_VERSION;
-          if (!version) throw new Error('DESKTOP_VERSION env var is missing');
-          console.log(`Setting desktop version to ${version}`);
-
-          const tauriConfPath = path.join('packages', 'desktop', 'src-tauri', 'tauri.conf.json');
-          const tauriConfText = fs.readFileSync(tauriConfPath, 'utf8');
-          const tauriRe = /("version"\s*:\s*")([^"]+)(")/;
-          if (!tauriRe.test(tauriConfText)) throw new Error('Failed to find version in tauri.conf.json');
-          fs.writeFileSync(tauriConfPath, tauriConfText.replace(tauriRe, `$1${version}$3`));
-
-          const cargoTomlPath = path.join('packages', 'desktop', 'src-tauri', 'Cargo.toml');
-          const lines = fs.readFileSync(cargoTomlPath, 'utf8').split(/\r?\n/);
-          let inPackage = false, updated = false;
-          const result = lines.map((line) => {
-            if (/^\[package\]\s*$/.test(line)) inPackage = true;
-            else if (inPackage && /^\[/.test(line)) inPackage = false;
-            if (inPackage && /^version\s*=\s*".*"\s*$/.test(line)) {
-              updated = true;
-              return `version = "${version}"`;
-            }
-            return line;
-          });
-          if (!updated) throw new Error('Failed to update Cargo.toml version');
-          fs.writeFileSync(cargoTomlPath, result.join('\n') + '\n');
-          NODE
-
       - name: Setup Node
         uses: actions/setup-node@v4
         with:
-          node-version: "22"
-          cache: "npm"
+          node-version: '22'
+          cache: 'npm'
           cache-dependency-path: package-lock.json
-          registry-url: "https://npm.pkg.github.com"
-          scope: "@boudra"
-
-      - name: Install Rust stable
-        uses: dtolnay/rust-toolchain@stable
-        with:
-          targets: ${{ matrix.rust_target }}
-
-      - name: Restore Rust cache
-        uses: Swatinem/rust-cache@v2
-        with:
-          shared-key: desktop-release-macos-${{ matrix.rust_target }}
-          workspaces: |
-            .
-            packages/desktop/src-tauri -> target
+          registry-url: 'https://npm.pkg.github.com'
+          scope: '@boudra'
 
       - name: Install JS dependencies
         run: npm ci
         env:
           NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
-      - name: Build web app for Tauri
+      - name: Set desktop package version from tag
+        shell: bash
+        run: |
+          node <<'NODE'
+          const fs = require('node:fs');
+          const path = require('node:path');
+
+          const version = process.env.DESKTOP_VERSION;
+          if (!version) throw new Error('DESKTOP_VERSION env var is missing');
+
+          const packageJsonPath = path.join(process.env.DESKTOP_PACKAGE_PATH, 'package.json');
+          const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+          packageJson.version = version;
+          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 managed runtime
-        run: npm run prepare:managed-runtime --workspace=@getpaseo/desktop
-
-      - name: Validate managed runtime bundle
-        run: npm run validate:managed-runtime --workspace=@getpaseo/desktop
-
-      - name: Import Apple code-signing certificate
-        uses: apple-actions/import-codesign-certs@v3
-        with:
-          p12-file-base64: ${{ secrets.APPLE_CERTIFICATE }}
-          p12-password: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
-
-      - name: Sign bundled managed runtime
-        env:
-          APPLE_SIGNING_IDENTITY: ${{ secrets.APPLE_SIGNING_IDENTITY }}
-        run: node ./packages/desktop/scripts/sign-managed-runtime-macos.mjs
-
       - name: Detect existing GitHub release state
         if: env.IS_SMOKE_TAG != 'true'
         env:
@@ -162,78 +152,38 @@ jobs:
         run: |
           set -euo pipefail
           if release_draft="$(gh release view "$RELEASE_TAG" --repo "${{ github.repository }}" --json isDraft --jq '.isDraft' 2>/dev/null)"; then
-            :
+            if [[ "$release_draft" == "true" ]]; then
+              release_type="draft"
+            else
+              release_type="release"
+            fi
           else
-            release_draft="false"
+            release_type="release"
           fi
-          echo "RELEASE_DRAFT=$release_draft" >> "$GITHUB_ENV"
+          echo "RELEASE_TYPE=$release_type" >> "$GITHUB_ENV"
 
-      - name: Build and publish macOS Tauri release
-        if: env.IS_SMOKE_TAG != 'true'
-        id: tauri_build
-        uses: tauri-apps/tauri-action@v0
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          APPLE_CERTIFICATE: ${{ secrets.APPLE_CERTIFICATE }}
-          APPLE_CERTIFICATE_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
-          APPLE_SIGNING_IDENTITY: ${{ secrets.APPLE_SIGNING_IDENTITY }}
-          APPLE_ID: ${{ secrets.APPLE_ID }}
-          APPLE_PASSWORD: ${{ secrets.APPLE_PASSWORD }}
-          APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
-          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
-          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
-        with:
-          projectPath: packages/desktop
-          tagName: ${{ env.RELEASE_TAG }}
-          releaseName: Paseo ${{ env.RELEASE_TAG }}
-          releaseBody: See the assets to download and install this version.
-          releaseDraft: ${{ env.RELEASE_DRAFT }}
-          prerelease: false
-          args: --target ${{ matrix.rust_target }}
-
-      - name: Notarize and re-upload DMG
-        if: env.IS_SMOKE_TAG != 'true'
-        env:
-          APPLE_ID: ${{ secrets.APPLE_ID }}
-          APPLE_PASSWORD: ${{ secrets.APPLE_PASSWORD }}
-          APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
-          APPLE_SIGNING_IDENTITY: ${{ secrets.APPLE_SIGNING_IDENTITY }}
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Build desktop release
         shell: bash
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CSC_LINK: ${{ secrets.APPLE_CERTIFICATE }}
+          CSC_KEY_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
+          APPLE_ID: ${{ secrets.APPLE_ID }}
+          APPLE_APP_SPECIFIC_PASSWORD: ${{ secrets.APPLE_PASSWORD }}
+          APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
         run: |
           set -euo pipefail
-          artifacts='${{ steps.tauri_build.outputs.artifactPaths }}'
-          dmg_path=$(echo "$artifacts" | jq -r '.[] | select(endswith(".dmg"))')
-          if [ -z "$dmg_path" ]; then
-            echo "::error::No DMG found in tauri build artifacts"
-            exit 1
+          publish_mode="never"
+          publish_args=()
+          if [[ "$IS_SMOKE_TAG" != "true" ]]; then
+            publish_mode="always"
+            publish_args+=("-c.publish.releaseType=$RELEASE_TYPE")
           fi
-          echo "DMG: $dmg_path"
 
-          echo "Signing DMG..."
-          codesign --force --sign "$APPLE_SIGNING_IDENTITY" --timestamp "$dmg_path"
-
-          echo "Submitting DMG for notarization..."
-          xcrun notarytool submit "$dmg_path" \
-            --apple-id "$APPLE_ID" \
-            --password "$APPLE_PASSWORD" \
-            --team-id "$APPLE_TEAM_ID" \
-            --wait
-
-          echo "Stapling notarization ticket..."
-          xcrun stapler staple "$dmg_path"
-
-          echo "Verifying..."
-          spctl --assess --type install --verbose "$dmg_path"
-
-          echo "Replacing release asset with notarized DMG..."
-          gh release upload "$RELEASE_TAG" "$dmg_path" --repo "${{ github.repository }}" --clobber
-
-      - name: Build macOS app (smoke only)
-        if: env.IS_SMOKE_TAG == 'true'
-        run: npm run tauri --workspace=@getpaseo/desktop build -- --target ${{ matrix.rust_target }} --no-bundle
+          npm run build --workspace="$DESKTOP_WORKSPACE" -- --publish "$publish_mode" --mac --${{ matrix.electron_arch }} "${publish_args[@]}"
 
   publish-linux:
+    needs: cleanup-assets
     if: ${{ (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'))) }}
     permissions:
       contents: write
@@ -267,89 +217,38 @@ jobs:
             echo "IS_SMOKE_TAG=false" >> "$GITHUB_ENV"
           fi
 
-      - name: Set desktop version from tag
-        shell: bash
-        run: |
-          node <<'NODE'
-          const fs = require('node:fs');
-          const path = require('node:path');
-          const version = process.env.DESKTOP_VERSION;
-          if (!version) throw new Error('DESKTOP_VERSION env var is missing');
-          console.log(`Setting desktop version to ${version}`);
-
-          const tauriConfPath = path.join('packages', 'desktop', 'src-tauri', 'tauri.conf.json');
-          const tauriConfText = fs.readFileSync(tauriConfPath, 'utf8');
-          const tauriRe = /("version"\s*:\s*")([^"]+)(")/;
-          if (!tauriRe.test(tauriConfText)) throw new Error('Failed to find version in tauri.conf.json');
-          fs.writeFileSync(tauriConfPath, tauriConfText.replace(tauriRe, `$1${version}$3`));
-
-          const cargoTomlPath = path.join('packages', 'desktop', 'src-tauri', 'Cargo.toml');
-          const lines = fs.readFileSync(cargoTomlPath, 'utf8').split(/\r?\n/);
-          let inPackage = false, updated = false;
-          const result = lines.map((line) => {
-            if (/^\[package\]\s*$/.test(line)) inPackage = true;
-            else if (inPackage && /^\[/.test(line)) inPackage = false;
-            if (inPackage && /^version\s*=\s*".*"\s*$/.test(line)) {
-              updated = true;
-              return `version = "${version}"`;
-            }
-            return line;
-          });
-          if (!updated) throw new Error('Failed to update Cargo.toml version');
-          fs.writeFileSync(cargoTomlPath, result.join('\n') + '\n');
-          NODE
-
-      - name: Install Linux packaging dependencies
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y libwebkit2gtk-4.1-dev libgtk-3-dev libappindicator3-dev librsvg2-dev patchelf libfuse2
-
       - name: Setup Node
         uses: actions/setup-node@v4
         with:
-          node-version: "22"
-          cache: "npm"
+          node-version: '22'
+          cache: 'npm'
           cache-dependency-path: package-lock.json
-          registry-url: "https://npm.pkg.github.com"
-          scope: "@boudra"
-
-      - name: Install Rust stable
-        uses: dtolnay/rust-toolchain@stable
-
-      - name: Restore Rust cache
-        uses: Swatinem/rust-cache@v2
-        with:
-          shared-key: desktop-release-linux
-          workspaces: |
-            .
-            packages/desktop/src-tauri -> target
+          registry-url: 'https://npm.pkg.github.com'
+          scope: '@boudra'
 
       - name: Install JS dependencies
         run: npm ci
         env:
           NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
-      - name: Build web app for Tauri
-        run: npm run build:web --workspace=@getpaseo/app
-
-      - name: Build managed runtime
-        run: npm run prepare:managed-runtime --workspace=@getpaseo/desktop
-
-      - name: Validate managed runtime bundle
-        run: npm run validate:managed-runtime --workspace=@getpaseo/desktop
-
-      - name: Strip CUDA dependencies from onnxruntime
+      - name: Set desktop package version from tag
         shell: bash
         run: |
-          find packages/desktop/src-tauri/resources/managed-runtime -path '*/onnxruntime-node/bin/*' \( -name '*cuda*' -o -name '*tensorrt*' \) -delete || true
-          # Remove CUDA shared library references from onnxruntime .so files so linuxdeploy
-          # doesn't try to bundle them (they're optional runtime deps, not needed for CPU inference)
-          for f in $(find packages/desktop/src-tauri/resources/managed-runtime -path '*/onnxruntime-node/bin/*' \( -name '*.so' -o -name '*.so.*' \)); do
-            for lib in $(patchelf --print-needed "$f" 2>/dev/null | grep -iE 'cublas|cudnn|cudart|cufft|curand|cusolver|cusparse|nccl|nvrtc|tensorrt|nvinfer'); do
-              echo "Removing needed $lib from $f"
-              patchelf --remove-needed "$lib" "$f"
-            done
-          done
+          node <<'NODE'
+          const fs = require('node:fs');
+          const path = require('node:path');
+
+          const version = process.env.DESKTOP_VERSION;
+          if (!version) throw new Error('DESKTOP_VERSION env var is missing');
+
+          const packageJsonPath = path.join(process.env.DESKTOP_PACKAGE_PATH, 'package.json');
+          const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+          packageJson.version = version;
+          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: Detect existing GitHub release state
         if: env.IS_SMOKE_TAG != 'true'
@@ -359,99 +258,33 @@ jobs:
         run: |
           set -euo pipefail
           if release_draft="$(gh release view "$RELEASE_TAG" --repo "${{ github.repository }}" --json isDraft --jq '.isDraft' 2>/dev/null)"; then
-            :
+            if [[ "$release_draft" == "true" ]]; then
+              release_type="draft"
+            else
+              release_type="release"
+            fi
           else
-            release_draft="false"
+            release_type="release"
           fi
-          echo "RELEASE_DRAFT=$release_draft" >> "$GITHUB_ENV"
+          echo "RELEASE_TYPE=$release_type" >> "$GITHUB_ENV"
 
-      - name: Build Linux Tauri release
-        if: env.IS_SMOKE_TAG != 'true'
-        id: linux_tauri
-        continue-on-error: true
-        env:
-          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
-          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
-          NO_STRIP: "1"
-          APPIMAGE_EXTRACT_AND_RUN: "1"
+      - name: Build desktop release
         shell: bash
-        run: |
-          set -euo pipefail
-          npm run tauri --workspace=@getpaseo/desktop build -- --bundles appimage
-
-      - name: Attempt manual Linux AppImage fallback
-        if: env.IS_SMOKE_TAG != 'true' && steps.linux_tauri.outcome == 'failure'
-        env:
-          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
-          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
-        shell: bash
-        run: |
-          set -euxo pipefail
-          appimage_dir="packages/desktop/src-tauri/target/release/bundle/appimage"
-          appdir_path="$appimage_dir/Paseo.AppDir"
-          canonical_appimage="$appimage_dir/Paseo_${DESKTOP_VERSION}_amd64.AppImage"
-          existing_appimage="$(find "$appimage_dir" -maxdepth 1 -type f -name '*.AppImage' | head -n 1)"
-          if [ -n "$existing_appimage" ]; then
-            if [ "$existing_appimage" != "$canonical_appimage" ]; then
-              mv "$existing_appimage" "$canonical_appimage"
-            fi
-            if [ ! -f "$canonical_appimage.sig" ]; then
-              npx tauri signer sign "$canonical_appimage"
-            fi
-            exit 0
-          fi
-          if [ ! -d "$appdir_path" ]; then
-            echo "::error::AppDir was not generated at $appdir_path"
-            exit 1
-          fi
-          cp --remove-destination "$appdir_path/usr/share/applications/Paseo.desktop" "$appdir_path/Paseo.desktop"
-          cp --remove-destination "$appdir_path/Paseo.png" "$appdir_path/.DirIcon"
-          env | sort | grep -E '^(APPIMAGE|DESKTOP_VERSION|NO_STRIP|RELEASE_TAG|SOURCE_TAG|TAURI_)' || true
-          tools_dir="$(mktemp -d)"
-          curl -fsSL https://github.com/AppImage/appimagetool/releases/download/continuous/appimagetool-x86_64.AppImage -o "$tools_dir/appimagetool-x86_64.AppImage"
-          chmod +x "$tools_dir/appimagetool-x86_64.AppImage"
-          ARCH=x86_64 APPIMAGE_EXTRACT_AND_RUN=1 "$tools_dir/appimagetool-x86_64.AppImage" "$appdir_path" "$canonical_appimage"
-          npx tauri signer sign "$canonical_appimage"
-
-      - name: Fail Linux release when AppImage bundling fails
-        if: env.IS_SMOKE_TAG != 'true' && steps.linux_tauri.outcome == 'failure'
-        shell: bash
-        run: |
-          set -euo pipefail
-          shopt -s nullglob
-          assets=(
-            packages/desktop/src-tauri/target/release/bundle/appimage/*.AppImage
-            packages/desktop/src-tauri/target/release/bundle/appimage/*.AppImage.sig
-          )
-          if [ "${#assets[@]}" -eq 0 ]; then
-            echo "::error::Linux AppImage assets are still missing after the manual fallback."
-            exit 1
-          fi
-
-      - name: Upload Linux release assets
-        if: env.IS_SMOKE_TAG != 'true'
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        shell: bash
         run: |
           set -euo pipefail
-          shopt -s nullglob
-          assets=(
-            packages/desktop/src-tauri/target/release/bundle/appimage/*.AppImage
-            packages/desktop/src-tauri/target/release/bundle/appimage/*.AppImage.sig
-          )
-          if [ "${#assets[@]}" -eq 0 ]; then
-            echo "::error::No Linux AppImage assets were produced."
-            exit 1
+          publish_mode="never"
+          publish_args=()
+          if [[ "$IS_SMOKE_TAG" != "true" ]]; then
+            publish_mode="always"
+            publish_args+=("-c.publish.releaseType=$RELEASE_TYPE")
           fi
-          printf 'Uploading Linux assets:\n%s\n' "${assets[@]}"
-          gh release upload "$RELEASE_TAG" "${assets[@]}" --repo "${{ github.repository }}" --clobber
 
-      - name: Build Linux app (smoke only)
-        if: env.IS_SMOKE_TAG == 'true'
-        run: npm run tauri --workspace=@getpaseo/desktop build -- --no-bundle
+          npm run build --workspace="$DESKTOP_WORKSPACE" -- --publish "$publish_mode" --linux --x64 "${publish_args[@]}"
 
   publish-windows:
+    needs: cleanup-assets
     if: ${{ (github.event_name == 'workflow_dispatch' && (github.event.inputs.platform == 'all' || github.event.inputs.platform == 'windows')) || (github.event_name == 'push' && (startsWith(github.ref_name, 'v') || startsWith(github.ref_name, 'desktop-v') || startsWith(github.ref_name, 'desktop-windows-v'))) }}
     permissions:
       contents: write
@@ -485,76 +318,43 @@ jobs:
             echo "IS_SMOKE_TAG=false" >> "$GITHUB_ENV"
           fi
 
-      - name: Set desktop version from tag
-        shell: bash
-        run: |
-          node <<'NODE'
-          const fs = require('node:fs');
-          const path = require('node:path');
-          const version = process.env.DESKTOP_VERSION;
-          if (!version) throw new Error('DESKTOP_VERSION env var is missing');
-          console.log(`Setting desktop version to ${version}`);
-
-          const tauriConfPath = path.join('packages', 'desktop', 'src-tauri', 'tauri.conf.json');
-          const tauriConfText = fs.readFileSync(tauriConfPath, 'utf8');
-          const tauriRe = /("version"\s*:\s*")([^"]+)(")/;
-          if (!tauriRe.test(tauriConfText)) throw new Error('Failed to find version in tauri.conf.json');
-          fs.writeFileSync(tauriConfPath, tauriConfText.replace(tauriRe, `$1${version}$3`));
-
-          const cargoTomlPath = path.join('packages', 'desktop', 'src-tauri', 'Cargo.toml');
-          const lines = fs.readFileSync(cargoTomlPath, 'utf8').split(/\r?\n/);
-          let inPackage = false, updated = false;
-          const result = lines.map((line) => {
-            if (/^\[package\]\s*$/.test(line)) inPackage = true;
-            else if (inPackage && /^\[/.test(line)) inPackage = false;
-            if (inPackage && /^version\s*=\s*".*"\s*$/.test(line)) {
-              updated = true;
-              return `version = "${version}"`;
-            }
-            return line;
-          });
-          if (!updated) throw new Error('Failed to update Cargo.toml version');
-          fs.writeFileSync(cargoTomlPath, result.join('\n') + '\n');
-          NODE
-
       - name: Setup Node
         uses: actions/setup-node@v4
         with:
-          node-version: "22"
-          cache: "npm"
+          node-version: '22'
+          cache: 'npm'
           cache-dependency-path: package-lock.json
-          registry-url: "https://npm.pkg.github.com"
-          scope: "@boudra"
-
-      - name: Install Rust stable
-        uses: dtolnay/rust-toolchain@stable
-
-      - name: Restore Rust cache
-        uses: Swatinem/rust-cache@v2
-        with:
-          shared-key: desktop-release-windows
-          workspaces: |
-            .
-            packages/desktop/src-tauri -> target
+          registry-url: 'https://npm.pkg.github.com'
+          scope: '@boudra'
 
       - name: Install JS dependencies
         run: npm ci
         env:
           NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
-      - name: Build web app for Tauri
+      - name: Set desktop package version from tag
+        shell: bash
+        run: |
+          node <<'NODE'
+          const fs = require('node:fs');
+          const path = require('node:path');
+
+          const version = process.env.DESKTOP_VERSION;
+          if (!version) throw new Error('DESKTOP_VERSION env var is missing');
+
+          const packageJsonPath = path.join(process.env.DESKTOP_PACKAGE_PATH, 'package.json');
+          const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+          packageJson.version = version;
+          fs.writeFileSync(packageJsonPath, `${JSON.stringify(packageJson, null, 2)}\n`);
+          NODE
+
+      - 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"
           npm run build:web --workspace=@getpaseo/app
 
-      - name: Build managed runtime
-        run: npm run prepare:managed-runtime --workspace=@getpaseo/desktop
-
-      - name: Validate managed runtime bundle
-        run: npm run validate:managed-runtime --workspace=@getpaseo/desktop
-
       - name: Detect existing GitHub release state
         if: env.IS_SMOKE_TAG != 'true'
         env:
@@ -563,31 +363,27 @@ jobs:
         run: |
           set -euo pipefail
           if release_draft="$(gh release view "$RELEASE_TAG" --repo "${{ github.repository }}" --json isDraft --jq '.isDraft' 2>/dev/null)"; then
-            :
+            if [[ "$release_draft" == "true" ]]; then
+              release_type="draft"
+            else
+              release_type="release"
+            fi
           else
-            release_draft="false"
+            release_type="release"
           fi
-          echo "RELEASE_DRAFT=$release_draft" >> "$GITHUB_ENV"
+          echo "RELEASE_TYPE=$release_type" >> "$GITHUB_ENV"
 
-      - name: Build and publish Windows Tauri release
-        if: env.IS_SMOKE_TAG != 'true'
-        uses: tauri-apps/tauri-action@v0
+      - name: Build desktop release
+        shell: bash
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
-          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
-        with:
-          projectPath: packages/desktop
-          tagName: ${{ env.RELEASE_TAG }}
-          releaseName: Paseo ${{ env.RELEASE_TAG }}
-          releaseBody: See the assets to download and install this version.
-          releaseDraft: ${{ env.RELEASE_DRAFT }}
-          prerelease: false
-          args: --bundles nsis
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          set -euo pipefail
+          publish_mode="never"
+          publish_args=()
+          if [[ "$IS_SMOKE_TAG" != "true" ]]; then
+            publish_mode="always"
+            publish_args+=("-c.publish.releaseType=$RELEASE_TYPE")
+          fi
 
-      - name: Build Windows app (smoke only)
-        if: env.IS_SMOKE_TAG == 'true'
-        run: npm run tauri --workspace=@getpaseo/desktop build -- --no-bundle
-        env:
-          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
-          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
+          npm run build --workspace="$DESKTOP_WORKSPACE" -- --publish "$publish_mode" --win --x64 "${publish_args[@]}"

.gitignore

@@ -46,6 +46,9 @@ test-results/
 # Vercel
 .vercel/
 
+# Expo
+.expo/
+
 # Misc
 *.pem
 .vercel

CHANGELOG.md

@@ -166,7 +166,7 @@
 - Redesigned the website get-started experience into a clearer two-step flow.
 - Simplified website GitHub navigation and changelog headings.
 - Improved app draft/new-agent UX with clearer working directory placeholder and empty-state messaging.
-- Enabled drag interactions in previously unhandled areas on the desktop (Tauri) draft screen.
+- Enabled drag interactions in previously unhandled areas on the desktop draft screen.
 - Hid empty filter groups in the left sidebar.
 
 ### Fixed
@@ -188,7 +188,7 @@
 - Improved new worktree-agent defaults by prefilling CWD to the main repository.
 - Improved desktop command autocomplete behavior to match combobox interactions.
 - Improved git sync UX by simplifying sync labels and only showing Sync when a branch diverges from origin.
-- Improved desktop settings and permissions UX in Tauri.
+- Improved desktop settings and permissions UX on desktop.
 - Improved scrollbar visibility, drag interactions, tracking, and animation timing on web/desktop.
 
 ### Fixed
@@ -227,7 +227,7 @@
 - Fixed stuck "send while running" recovery across app and server session handling.
 - Fixed Claude session identity preservation when reloading existing agents.
 - Fixed combobox option behavior and related interactions.
-- Fixed Tauri file-drop listener cleanup to avoid uncaught unlisten errors.
+- Fixed desktop file-drop listener cleanup to avoid uncaught unlisten errors.
 - Fixed web tool-detail wheel event routing at scroll edges.
 
 ## 0.1.7 - 2026-02-16

CLAUDE.md

@@ -12,7 +12,7 @@ This is an npm workspace monorepo:
 - `packages/app` — Mobile + web client (Expo)
 - `packages/cli` — Docker-style CLI (`paseo run/ls/logs/wait`)
 - `packages/relay` — E2E encrypted relay for remote access
-- `packages/desktop` — Tauri desktop wrapper
+- `packages/desktop` — Electron desktop wrapper
 - `packages/website` — Marketing site (paseo.sh)
 
 ## Documentation

README.md

@@ -44,7 +44,7 @@ Quick monorepo package map:
 - `packages/server`: Paseo daemon (agent process orchestration, WebSocket API, MCP server)
 - `packages/app`: Expo client (iOS, Android, web)
 - `packages/cli`: `paseo` CLI for daemon and agent workflows
-- `packages/desktop`: Tauri desktop app
+- `packages/desktop`: Electron desktop app
 - `packages/relay`: Relay package for remote connectivity
 - `packages/website`: Marketing site and documentation (`paseo.sh`)
 

docs/ARCHITECTURE.md

@@ -9,7 +9,7 @@ Your code never leaves your machine. Paseo is local-first.
 ```
 ┌─────────────┐    ┌─────────────┐    ┌─────────────┐
 │  Mobile App  │    │     CLI     │    │ Desktop App │
-│   (Expo)     │    │ (Commander) │    │  (Tauri)    │
+│   (Expo)     │    │ (Commander) │    │ (Electron)  │
 └──────┬───────┘    └──────┬──────┘    └──────┬──────┘
        │                   │                  │
        │    WebSocket      │    WebSocket     │    Managed subprocess
@@ -90,9 +90,9 @@ Enables remote access when the daemon is behind a firewall.
 
 See [SECURITY.md](../SECURITY.md) for the full threat model.
 
-### `packages/desktop` — Desktop app (Tauri)
+### `packages/desktop` — Desktop app (Electron)
 
-Tauri wrapper for macOS, Linux, and Windows.
+Electron wrapper for macOS, Linux, and Windows.
 
 - Can spawn the daemon as a managed subprocess
 - Native file access for workspace integration
@@ -180,5 +180,5 @@ $PASEO_HOME/
 ## Deployment models
 
 1. **Local daemon** (default): `paseo daemon start` on `127.0.0.1:6767`
-2. **Managed desktop**: Tauri app spawns daemon as subprocess
+2. **Managed desktop**: Electron app spawns daemon as subprocess
 3. **Remote + relay**: Daemon behind firewall, relay bridges with E2E encryption

docs/PANEL-REFACTOR-PLAN.md

@@ -1,341 +0,0 @@
-# Panel Interface Refactor Plan
-
-**Goal:** Replace the hardcoded panel switch statements with a registry-based panel interface. This is a pure refactor — all product surfaces stay identical. The motivation is to prepare for split panes (VSCode-style), where each split independently renders panels.
-
-## The Problem
-
-The workspace screen (`packages/app/src/screens/workspace/workspace-screen.tsx`, ~2084 lines) has a `renderContent()` function (line 1437) that switches on `target.kind` to render each panel type with bespoke props. The same pattern repeats in:
-
-- `workspace-tab-model.ts` — switches on `target.kind` to build tab descriptors (labels, subtitles, status)
-- `workspace-tab-presentation.tsx` — switches on kind for icons and status indicators
-
-Every new panel type requires editing 3+ files. This must become a registry where panels self-register.
-
-## Target Architecture
-
-### 1. PanelRegistration Interface
-
-```typescript
-// panels/panel-registry.ts
-
-interface PanelDescriptor {
-  label: string;
-  subtitle: string;
-  titleState: "ready" | "loading";
-  icon: React.ComponentType<{ size: number; color: string }>;
-  statusBucket: SidebarStateBucket | null;
-}
-
-interface PanelRegistration<K extends WorkspaceTabTarget["kind"] = WorkspaceTabTarget["kind"]> {
-  kind: K;
-  component: React.ComponentType;
-  useDescriptor(
-    target: Extract<WorkspaceTabTarget, { kind: K }>,
-    context: { serverId: string; workspaceId: string },
-  ): PanelDescriptor;
-  confirmClose?(
-    target: Extract<WorkspaceTabTarget, { kind: K }>,
-    context: { serverId: string; workspaceId: string },
-  ): Promise<boolean>;
-}
-```
-
-### 2. Panel Registry
-
-```typescript
-const panelRegistry = new Map<string, PanelRegistration>();
-
-function registerPanel(registration: PanelRegistration): void {
-  panelRegistry.set(registration.kind, registration);
-}
-
-function getPanelRegistration(kind: string): PanelRegistration | undefined {
-  return panelRegistry.get(kind);
-}
-```
-
-### 3. PaneContext
-
-Every panel gets workspace-level context via `usePaneContext()`. No prop drilling of serverId/workspaceId through panel-specific props.
-
-```typescript
-interface PaneContextValue {
-  serverId: string;
-  workspaceId: string;
-  tabId: string;
-  target: WorkspaceTabTarget;
-  openTab(target: WorkspaceTabTarget): void;
-  closeCurrentTab(): void;
-  retargetCurrentTab(target: WorkspaceTabTarget): void;
-  openFileInWorkspace(filePath: string): void;
-}
-```
-
-### 4. WorkspaceTabTarget stays unchanged
-
-```typescript
-type WorkspaceTabTarget =
-  | { kind: "draft"; draftId: string }
-  | { kind: "agent"; agentId: string }
-  | { kind: "terminal"; terminalId: string }
-  | { kind: "file"; path: string };
-```
-
-No store migration needed. `serverId` and `workspaceId` come from the pane context, not the target.
-
-## Panel Implementations
-
-Each panel type gets its own file that exports a `PanelRegistration`. Panels use `usePaneContext()` for workspace-level context and read their own data from stores directly.
-
-### Agent Panel Example
-
-```typescript
-// panels/agent-panel.ts
-
-function useAgentPanelDescriptor(
-  target: { kind: "agent"; agentId: string },
-  context: { serverId: string },
-): PanelDescriptor {
-  const agent = useSessionStore(
-    (s) => s.agentsByServer.get(context.serverId)?.get(target.agentId) ?? null,
-  );
-  const provider = agent?.provider ?? "codex";
-  const label = resolveAgentLabel(agent?.title);
-  return {
-    label: label ?? "",
-    subtitle: `${formatProviderLabel(provider)} agent`,
-    titleState: label ? "ready" : "loading",
-    icon: agentIconForProvider(provider),
-    statusBucket: agent ? deriveAgentStatusBucket(agent) : null,
-  };
-}
-
-function AgentPanel() {
-  const { serverId, target, openFileInWorkspace } = usePaneContext();
-  invariant(target.kind === "agent", "AgentPanel requires agent target");
-  return (
-    <AgentReadyScreen
-      serverId={serverId}
-      agentId={target.agentId}
-      showExplorerSidebar={false}
-      wrapWithExplorerSidebarProvider={false}
-      onOpenWorkspaceFile={openFileInWorkspace}
-    />
-  );
-}
-
-export const agentPanelRegistration: PanelRegistration<"agent"> = {
-  kind: "agent",
-  component: AgentPanel,
-  useDescriptor: useAgentPanelDescriptor,
-  async confirmClose(target, context) {
-    const agent = useSessionStore.getState().agentsByServer.get(context.serverId)?.get(target.agentId);
-    if (agent?.status === "running") {
-      return confirmDialog({ title: "Agent is still running. Close anyway?" });
-    }
-    return true;
-  },
-};
-```
-
-### Terminal Panel Example
-
-```typescript
-function useTerminalPanelDescriptor(
-  target: { kind: "terminal"; terminalId: string },
-  _context: { serverId: string; workspaceId: string },
-): PanelDescriptor {
-  // read terminal data from appropriate store
-  return {
-    label: "Terminal",
-    subtitle: "Terminal",
-    titleState: "ready",
-    icon: TerminalIcon,
-    statusBucket: null,
-  };
-}
-
-function TerminalPanel() {
-  const { serverId, workspaceId, target, openTab } = usePaneContext();
-  invariant(target.kind === "terminal", "TerminalPanel requires terminal target");
-  return (
-    <TerminalPane
-      serverId={serverId}
-      cwd={workspaceId}
-      selectedTerminalId={target.terminalId}
-      onSelectedTerminalIdChange={(terminalId) => {
-        if (terminalId) {
-          openTab({ kind: "terminal", terminalId });
-        }
-      }}
-      hideHeader
-      manageTerminalDirectorySubscription={false}
-    />
-  );
-}
-```
-
-### Draft Panel Example
-
-```typescript
-function useDraftPanelDescriptor(
-  _target: { kind: "draft"; draftId: string },
-  _context: { serverId: string; workspaceId: string },
-): PanelDescriptor {
-  return {
-    label: "New Agent",
-    subtitle: "New Agent",
-    titleState: "ready",
-    icon: PencilIcon,
-    statusBucket: null,
-  };
-}
-
-function DraftPanel() {
-  const { serverId, workspaceId, tabId, target, openFileInWorkspace, retargetCurrentTab } = usePaneContext();
-  invariant(target.kind === "draft", "DraftPanel requires draft target");
-  return (
-    <WorkspaceDraftAgentTab
-      serverId={serverId}
-      workspaceId={workspaceId}
-      tabId={tabId}
-      draftId={target.draftId}
-      onOpenWorkspaceFile={openFileInWorkspace}
-      onCreated={(agentSnapshot) => {
-        retargetCurrentTab({ kind: "agent", agentId: agentSnapshot.id });
-      }}
-    />
-  );
-}
-```
-
-### File Panel Example
-
-```typescript
-function useFilePanelDescriptor(
-  target: { kind: "file"; path: string },
-  _context: { serverId: string; workspaceId: string },
-): PanelDescriptor {
-  const fileName = target.path.split("/").filter(Boolean).pop() ?? target.path;
-  return {
-    label: fileName,
-    subtitle: target.path,
-    titleState: "ready",
-    icon: FileTextIcon,
-    statusBucket: null,
-  };
-}
-
-function FilePanel() {
-  const { serverId, workspaceId, target } = usePaneContext();
-  invariant(target.kind === "file", "FilePanel requires file target");
-  return (
-    <FilePane
-      serverId={serverId}
-      workspaceRoot={workspaceId}
-      filePath={target.path}
-    />
-  );
-}
-```
-
-## How the Tab Bar Uses It
-
-Each tab chip calls the panel's `useDescriptor` hook:
-
-```typescript
-function TabChip({ tabId, target, serverId, workspaceId }: {
-  tabId: string;
-  target: WorkspaceTabTarget;
-  serverId: string;
-  workspaceId: string;
-}) {
-  const registration = getPanelRegistration(target.kind);
-  invariant(registration, `No panel registration for kind: ${target.kind}`);
-  const descriptor = registration.useDescriptor(target, { serverId, workspaceId });
-  return (
-    <TabChipChrome
-      tabId={tabId}
-      label={descriptor.label}
-      subtitle={descriptor.subtitle}
-      titleState={descriptor.titleState}
-      icon={<descriptor.icon size={16} color={theme.colors.foregroundMuted} />}
-      statusBucket={descriptor.statusBucket}
-    />
-  );
-}
-```
-
-## How the Workspace Screen Renders Content
-
-Replaces the entire `renderContent()` switch:
-
-```typescript
-function PaneContent({ tabId, target, serverId, workspaceId }: {
-  tabId: string;
-  target: WorkspaceTabTarget;
-  serverId: string;
-  workspaceId: string;
-}) {
-  const registration = getPanelRegistration(target.kind);
-  if (!registration) return null;
-  const Component = registration.component;
-  return (
-    <PaneProvider value={{ serverId, workspaceId, tabId, target, ...actions }}>
-      <Component />
-    </PaneProvider>
-  );
-}
-```
-
-## Implementation Steps
-
-### Step 1: Create panel registry infrastructure
-
-Create the following new files:
-
-- `packages/app/src/panels/panel-registry.ts` — `PanelRegistration`, `PanelDescriptor` types, registry map, `registerPanel()`, `getPanelRegistration()`
-- `packages/app/src/panels/pane-context.ts` — `PaneContextValue` type, React context, `PaneProvider`, `usePaneContext()` hook
-
-### Step 2: Create panel registration files
-
-Move panel-specific logic out of workspace-screen, workspace-tab-model, and workspace-tab-presentation into self-contained panel modules:
-
-- `packages/app/src/panels/agent-panel.ts` — agent component wrapper + `useDescriptor` + `confirmClose`
-- `packages/app/src/panels/draft-panel.ts` — draft component wrapper + `useDescriptor`
-- `packages/app/src/panels/terminal-panel.ts` — terminal component wrapper + `useDescriptor`
-- `packages/app/src/panels/file-panel.ts` — file component wrapper + `useDescriptor`
-- `packages/app/src/panels/register-panels.ts` — imports all panels, calls `registerPanel()` for each
-
-### Step 3: Refactor workspace-tab-model.ts
-
-Replace the per-kind descriptor derivation in `deriveWorkspaceTabModel()` with calls to `getPanelRegistration(target.kind).useDescriptor(...)`.
-
-Note: `deriveWorkspaceTabModel` is a pure function, not a hook. The `useDescriptor` hooks are called from React components (the tab bar). The model derivation may need to be restructured — the tab bar calls `useDescriptor` per tab, and the model just handles ordering and active-tab resolution.
-
-### Step 4: Refactor workspace-screen.tsx renderContent()
-
-Replace the `renderContent()` switch with `<PaneContent>` that uses the registry. Wire up the `PaneProvider` with the action callbacks that currently live as inline functions in the workspace screen.
-
-### Step 5: Refactor workspace-tab-presentation.tsx
-
-Move icon components and status derivation into each panel's registration. The shared `WorkspaceTabIcon` component becomes a thin wrapper that calls `registration.useDescriptor()` and renders the icon from the descriptor.
-
-### Step 6: Verify
-
-- `npm run typecheck` must pass
-- All existing tab behavior must work identically: open, close, reorder, retarget, keyboard shortcuts, context menus
-- Mobile tab switcher must work unchanged
-- No visual regressions in tab bar, icons, status indicators
-
-## Constraints
-
-- **Pure refactor** — zero user-visible behavior changes
-- **No new features** — no splits, no new panel types, no new keyboard shortcuts
-- **WorkspaceTabTarget stays unchanged** — no store migration
-- **workspace-tabs-store.ts stays unchanged** — the store is not part of this refactor
-- **Do not create index.ts barrel files** — project convention
-- **Use `invariant` from `tiny-invariant`** for asserting panel target kinds
-- **Use `function` declarations** — project convention (no arrow function components)
-- **Use `interface` over `type` where possible** — project convention
-- **Run `npm run typecheck` after every change** — project rule

docs/RELEASE.md

@@ -31,6 +31,7 @@ npm run release:finalize       # Publish npm, promote draft to published
 - `draft-release:patch` creates the GitHub Release as a draft so desktop assets, APK uploads, and synced notes attach to it
 - `release:finalize` publishes npm and promotes the same draft release
 - Use the same semver tag for both; don't cut a second tag
+- Desktop assets now come from the Electron package at `packages/desktop`
 
 ## Fixing a failed release build
 
@@ -53,6 +54,7 @@ If the fix requires a code change (e.g. a broken build script), commit the fix t
 
 - `version:all:*` bumps root + syncs workspace versions and `@getpaseo/*` dependency versions
 - `release:prepare` refreshes workspace `node_modules` links to prevent stale types
+- `npm run dev:desktop` and `npm run build:desktop` target the Electron desktop package in `packages/desktop`
 - If `release:publish` partially fails, re-run it — npm skips already-published versions
 - Website Mac download CTA URL derives from `packages/website/package.json` version at build time
 

docs/SPLIT-PANES-PLAN.md

@@ -1,275 +0,0 @@
-# Split Panes Plan
-
-**Goal:** VSCode-style split panes for the workspace screen. Users can drag tabs to edges to create horizontal/vertical splits, resize splits, and navigate between panes with keyboard shortcuts. Desktop/web only — mobile uses the same store but never creates splits (single pane).
-
-## Data Model
-
-### Core Types
-
-```typescript
-interface SplitPane {
-  id: string;
-  tabIds: string[];
-  focusedTabId: string | null;
-}
-
-interface SplitGroup {
-  id: string;
-  direction: "horizontal" | "vertical";
-  children: SplitNode[];
-  sizes: number[];  // proportional, sum to 1, same length as children
-}
-
-type SplitNode =
-  | { kind: "pane"; pane: SplitPane }
-  | { kind: "group"; group: SplitGroup };
-
-interface WorkspaceLayout {
-  root: SplitNode;
-  focusedPaneId: string;
-}
-```
-
-### Design Decisions
-
-- **Single store replaces the flat tab store.** The layout store owns tabs, tab order (per pane), and focused tab (per pane). No separate flat tab store.
-- **Mobile is just a single-pane tree.** Same store, same code paths. Mobile never calls split operations, so the tree never grows beyond one pane.
-- **Focused pane concept.** Common operations (`openTab`, `closeTab`, `focusTab`) route to the focused pane automatically. No `paneId` parameter needed for everyday use.
-- **`PaneContext` doesn't need `paneId`.** Split-specific operations (drag-drop, resize) are wired directly in split UI components that know their pane ID from tree rendering.
-- **Max depth: 4 levels.**
-- **Proportional sizes** that sum to 1. Minimum proportion per child: 0.1 (10%).
-
-### Default State
-
-Every workspace starts with:
-
-```typescript
-{
-  root: { kind: "pane", pane: { id: "main", tabIds: [], focusedTabId: null } },
-  focusedPaneId: "main",
-}
-```
-
-### Migration
-
-Version 6 migration from the current flat tab store. Wraps existing `tabIds`, `tabOrder`, and `focusedTabId` into a single-pane tree.
-
-## Store Actions
-
-### Everyday Operations (pane-agnostic)
-
-These don't take a `paneId`. Mobile code only uses these.
-
-```typescript
-openTab(workspaceKey: string, target: WorkspaceTabTarget): string | null;
-closeTab(workspaceKey: string, tabId: string): void;
-focusTab(workspaceKey: string, tabId: string): void;
-retargetTab(workspaceKey: string, tabId: string, target: WorkspaceTabTarget): string | null;
-reorderTabs(workspaceKey: string, tabIds: string[]): void;  // within focused pane
-getWorkspaceTabs(workspaceKey: string): WorkspaceTab[];      // all tabs across all panes
-```
-
-- `openTab` creates the tab and adds it to the focused pane.
-- `closeTab` finds the tab in any pane, removes it. If that was the last tab in the pane, collapses the pane.
-- `focusTab` finds the tab in any pane, focuses it and focuses that pane.
-
-### Split Operations (desktop only)
-
-```typescript
-splitPane(workspaceKey: string, input: {
-  tabId: string;
-  targetPaneId: string;
-  position: "left" | "right" | "top" | "bottom";
-}): string | null;  // new pane ID, or null if depth cap hit
-
-moveTabToPane(workspaceKey: string, tabId: string, toPaneId: string): void;
-focusPane(workspaceKey: string, paneId: string): void;
-resizeSplit(workspaceKey: string, groupId: string, sizes: number[]): void;
-reorderTabsInPane(workspaceKey: string, paneId: string, tabIds: string[]): void;
-```
-
-## Tree Transformations
-
-### splitPane
-
-**Position mapping:**
-- `left` / `right` → `horizontal` direction
-- `top` / `bottom` → `vertical` direction
-- `left` / `top` → new pane inserted before target
-- `right` / `bottom` → new pane inserted after target
-
-**Optimization:** If the target pane's parent group has the same direction, insert as a sibling into that group instead of nesting. This keeps the tree flat.
-
-```
-Before: horizontal([A, B])
-Split B right with tab X
-
-Optimized: horizontal([A, B, C])       ← insert into existing group
-Naive:     horizontal([A, horizontal([B, C])])  ← wastes depth
-```
-
-**Steps:**
-1. Check depth — reject if would exceed 4 levels
-2. Remove `tabId` from source pane (could be same or different pane)
-3. Create new pane: `{ id: generateId(), tabIds: [tabId], focusedTabId: tabId }`
-4. If parent group has same direction → insert new pane adjacent to target in parent's children, split target's size proportion 50/50 between target and new pane
-5. Else → replace target node with new group `{ direction, children: [target, newPane], sizes: [0.5, 0.5] }` (order based on position)
-6. If source pane is now empty → collapse it
-7. Set `focusedPaneId` to new pane
-
-### collapsePane
-
-Triggered when a pane's last tab is removed or moved out.
-
-```
-Before: horizontal([A, B, C]) sizes [0.3, 0.4, 0.3]
-B loses last tab
-
-After:  horizontal([A, C]) sizes [0.5, 0.5]  (renormalized)
-```
-
-**Steps:**
-1. Remove pane from parent group's children
-2. Remove corresponding entry from parent's sizes
-3. Renormalize sizes to sum to 1
-4. If parent group now has 1 child → unwrap: replace group with its single remaining child
-5. Unwrap can cascade up the tree
-6. Move focus to nearest sibling
-
-### moveTabToPane
-
-Tab dragged from one pane to another existing pane.
-
-1. Remove `tabId` from source pane's `tabIds`
-2. Insert into target pane's `tabIds` at drop position (or end)
-3. Set target pane's `focusedTabId` to the moved tab
-4. If source pane is now empty → collapsePane
-5. Set `focusedPaneId` to target pane
-
-### resizeSplit
-
-User drags a divider between panes.
-
-1. Find group by ID
-2. Update the two adjacent sizes based on drag delta
-3. Clamp each child to minimum proportion (0.1)
-4. Renormalize so sizes sum to 1
-
-## Keyboard Shortcuts
-
-| Action | Shortcut |
-|---|---|
-| Split right | `Cmd+\` |
-| Split down | `Cmd+Shift+\` |
-| Focus pane left | `Cmd+Shift+←` |
-| Focus pane right | `Cmd+Shift+→` |
-| Focus pane up | `Cmd+Shift+↑` |
-| Focus pane down | `Cmd+Shift+↓` |
-| Move tab to pane left | `Cmd+Shift+Alt+←` |
-| Move tab to pane right | `Cmd+Shift+Alt+→` |
-| Move tab to pane up | `Cmd+Shift+Alt+↑` |
-| Move tab to pane down | `Cmd+Shift+Alt+↓` |
-| Close pane | `Cmd+Shift+W` |
-
-Existing tab shortcuts unchanged — `Cmd+T`, `Cmd+W`, `Alt+Shift+[/]`, `Alt+1-9` — they operate on the focused pane's tabs.
-
-## Drag and Drop UX
-
-### Drop Zones
-
-When dragging a tab over a pane, the pane is divided into 5 drop zones:
-- **Center** (inner 40%) — move tab to this pane (add to existing tab list)
-- **Left edge** (leftmost 15%) — split left
-- **Right edge** (rightmost 15%) — split right
-- **Top edge** (topmost 15%) — split up
-- **Bottom edge** (bottommost 15%) — split down
-
-### Overlay Preview
-
-On hover over a drop zone, show a semi-transparent overlay rectangle covering the half of the pane where the new split would appear. The overlay uses the theme's accent color at low opacity.
-
-### Cross-Pane Tab Drag
-
-Tabs can be dragged:
-- Within a pane's tab bar → reorder (existing behavior via SortableInlineList)
-- From one pane's tab bar to another pane's tab bar → move tab to that pane
-- From a tab bar to a pane's drop zone → split
-
-When dragging the last tab out of a pane, the pane collapses after the drop completes.
-
-## Implementation Steps
-
-### Step 1: Layout Store
-
-Create `packages/app/src/stores/workspace-layout-store.ts`:
-- `WorkspaceLayout`, `SplitNode`, `SplitPane`, `SplitGroup` types
-- Zustand store with AsyncStorage persistence
-- Everyday actions: `openTab`, `closeTab`, `focusTab`, `retargetTab`, `reorderTabs`
-- Tree helpers: `findPaneById`, `findPaneContainingTab`, `getTreeDepth`, `collectAllTabs`
-- Version 6 migration from flat tab store
-
-### Step 2: Migrate Workspace Screen to Layout Store
-
-Replace all `useWorkspaceTabsStore` usage in workspace-screen with the new layout store. Mobile and desktop both use the layout store — mobile just never splits. All existing behavior preserved.
-
-### Step 3: Split Tree Transformations
-
-Add to the layout store:
-- `splitPane` with the parent-direction optimization and depth check
-- `collapsePane` with unwrap cascading
-- `moveTabToPane`
-- `resizeSplit`
-
-Pure tree transformation functions, tested independently.
-
-### Step 4: Split Container Component
-
-Create `packages/app/src/components/split-container.tsx`:
-- Recursive component that renders `SplitNode`
-- Groups render as flex containers with direction from `SplitGroup.direction`
-- Panes render tab bar + active panel content (using the panel registry)
-- Resize handles between children of a group
-
-### Step 5: Drop Zones and Overlay
-
-Create `packages/app/src/components/split-drop-zone.tsx`:
-- Overlay that appears during tab drag
-- Divides pane into 5 zones (center + 4 edges)
-- Shows preview rectangle on hover
-- Calls `splitPane` or `moveTabToPane` on drop
-
-### Step 6: Cross-Pane Drag
-
-Extend the existing dnd-kit setup:
-- Tab bar items remain draggable (existing)
-- Pane drop zones become droppable targets
-- Tab bar of other panes become droppable targets (move to pane)
-- DndContext wraps the entire split container (not individual panes)
-
-### Step 7: Keyboard Shortcuts
-
-Register new actions in `keyboard/actions.ts`:
-- `workspace.pane.split.right`, `workspace.pane.split.down`
-- `workspace.pane.focus.left/right/up/down`
-- `workspace.pane.move-tab.left/right/up/down`
-- `workspace.pane.close`
-
-Add bindings in `keyboard-shortcuts.ts` and handlers in the workspace screen.
-
-### Step 8: Pane Focus Navigation
-
-Implement spatial navigation for `focus.left/right/up/down`:
-- Walk the tree to find the focused pane's position in the layout
-- Find the nearest pane in the requested direction
-- Focus it
-
-Same logic for `move-tab` shortcuts — find adjacent pane, call `moveTabToPane`.
-
-## Constraints
-
-- Mobile stays single-pane — same store, no special casing
-- Max 4 levels of nesting
-- Minimum pane size: 10% of parent
-- `PaneContext` interface unchanged — no `paneId` added
-- Panel registry unchanged — panels don't know about splits
-- Existing tab shortcuts work on focused pane, unchanged

package.json

@@ -1,6 +1,6 @@
 {
   "name": "paseo",
-  "version": "0.1.30",
+  "version": "0.1.32",
   "private": true,
   "workspaces": [
     "packages/expo-two-way-audio",
@@ -56,7 +56,6 @@
     "release:major": "npm run version:all:major && npm run release:check && npm run release:publish && npm run release:push"
   },
   "devDependencies": {
-    "concurrently": "^9.2.1",
     "prettier": "^3.5.3",
     "get-port-cli": "^3.0.0",
     "knip": "^5.82.1",

packages/app/e2e/helpers/agent-bottom-anchor.ts

@@ -2,10 +2,7 @@ import { expect, type Page } from "@playwright/test";
 import path from "node:path";
 import { pathToFileURL } from "node:url";
 import { randomUUID } from "node:crypto";
-import {
-  buildHostWorkspaceAgentRoute,
-  buildHostWorkspaceRoute,
-} from "../../src/utils/host-routes";
+import { buildHostWorkspaceRoute } from "../../src/utils/host-routes";
 
 const NEAR_BOTTOM_THRESHOLD_PX = 72;
 
@@ -162,7 +159,7 @@ export async function seedBottomAnchorAgent(input: {
     id: created.id,
     title,
     expectedTailText,
-    url: buildHostWorkspaceAgentRoute(getServerId(), input.cwd, created.id),
+    url: `${buildHostWorkspaceRoute(getServerId(), input.cwd)}?open=${encodeURIComponent(`agent:${created.id}`)}`,
     workspaceUrl: buildHostWorkspaceRoute(getServerId(), input.cwd),
   };
 }

packages/app/index.ts

@@ -2,17 +2,10 @@
 import { polyfillCrypto } from "./src/polyfills/crypto";
 polyfillCrypto();
 
-// Polyfill screen.orientation for WebKitGTK (Tauri Linux) which lacks the API
+// Polyfill screen.orientation for WebKitGTK desktop runtimes that lack the API.
 import { polyfillScreenOrientation } from "./src/polyfills/screen-orientation";
 polyfillScreenOrientation();
 
-// Bridge console.log/warn/error to Tauri's log plugin so JS output appears in app.log
-if ((globalThis as { __TAURI__?: unknown }).__TAURI__) {
-  import("@tauri-apps/plugin-log").then(({ attachConsole }) => {
-    attachConsole();
-  });
-}
-
 // Configure Unistyles before Expo Router pulls in any components using StyleSheet.
 import "./src/styles/unistyles";
 import "expo-router/entry";

packages/app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@getpaseo/app",
   "main": "index.ts",
-  "version": "0.1.30",
+  "version": "0.1.32",
   "private": true,
   "scripts": {
     "start": "expo start",
@@ -16,7 +16,6 @@
     "ios": "expo run:ios",
     "ios:release": "expo run:ios --configuration Release",
     "web": "expo start --web",
-    "web:tauri": "PASEO_WEB_PLATFORM=tauri expo start --web",
     "lint": "expo lint",
     "typecheck": "tsc --noEmit",
     "test": "vitest run",
@@ -24,27 +23,33 @@
     "test:e2e:ui": "playwright test --ui",
     "build": "npm run build:web",
     "build:web": "expo export --platform web",
-    "build:web:tauri": "PASEO_WEB_PLATFORM=tauri expo export --platform web",
     "deploy:web": "npm run build:web && wrangler pages deploy dist --project-name paseo-app --branch main"
   },
   "dependencies": {
-    "@getpaseo/expo-two-way-audio": "0.1.30",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
     "@expo/vector-icons": "^15.0.2",
     "@floating-ui/react-native": "^0.10.7",
-    "@getpaseo/server": "0.1.30",
+    "@getpaseo/expo-two-way-audio": "0.1.32",
+    "@getpaseo/server": "0.1.32",
     "@gorhom/bottom-sheet": "^5.2.6",
     "@gorhom/portal": "^1.0.14",
     "@lezer/common": "^1.5.0",
+    "@lezer/cpp": "^1.1.5",
     "@lezer/css": "^1.3.0",
+    "@lezer/go": "^1.0.1",
     "@lezer/highlight": "^1.2.3",
     "@lezer/html": "^1.3.13",
+    "@lezer/java": "^1.1.3",
     "@lezer/javascript": "^1.5.4",
     "@lezer/json": "^1.0.3",
     "@lezer/markdown": "^1.6.2",
+    "@lezer/php": "^1.0.5",
     "@lezer/python": "^1.1.18",
+    "@lezer/rust": "^1.0.2",
+    "@lezer/xml": "^1.0.6",
+    "@lezer/yaml": "^1.0.4",
     "@react-native-async-storage/async-storage": "2.2.0",
     "@react-native-masked-view/masked-view": "^0.3.2",
     "@react-native/normalize-colors": "^0.81.5",
@@ -53,8 +58,6 @@
     "@react-navigation/native": "^7.1.8",
     "@tanstack/react-query": "^5.90.11",
     "@tanstack/react-virtual": "^3.13.21",
-    "@tauri-apps/api": "^2.9.1",
-    "@tauri-apps/plugin-log": "^2.8.0",
     "@xterm/addon-fit": "^0.11.0",
     "@xterm/addon-unicode11": "^0.9.0",
     "@xterm/addon-webgl": "^0.19.0",

packages/app/playwright.webkit.tmp.config.ts

@@ -1,12 +1,11 @@
-import { defineConfig, devices } from "@playwright/test";
+import { defineConfig, devices } from '@playwright/test'
 
 const baseURL =
-  process.env.E2E_BASE_URL ??
-  `http://localhost:${process.env.E2E_METRO_PORT ?? "8081"}`;
+  process.env.E2E_BASE_URL ?? `http://localhost:${process.env.E2E_METRO_PORT ?? '8081'}`
 
 export default defineConfig({
-  testDir: "./e2e",
-  globalSetup: "./e2e/global-setup.ts",
+  testDir: './e2e',
+  globalSetup: './e2e/global-setup.ts',
   timeout: 60_000,
   expect: {
     timeout: 10_000,
@@ -14,17 +13,17 @@ export default defineConfig({
   fullyParallel: false,
   workers: 1,
   retries: 0,
-  reporter: [["list"]],
+  reporter: [['list']],
   use: {
     baseURL,
-    trace: "retain-on-failure",
-    screenshot: "only-on-failure",
-    video: "retain-on-failure",
+    trace: 'retain-on-failure',
+    screenshot: 'only-on-failure',
+    video: 'retain-on-failure',
   },
   projects: [
     {
-      name: "Desktop Safari",
-      use: { ...devices["Desktop Safari"] },
+      name: 'Desktop Safari',
+      use: { ...devices['Desktop Safari'] },
     },
   ],
-});
+})

packages/app/public/index.html

@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html lang="%LANG_ISO_CODE%">
+  <head>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
+    />
+    <title>%WEB_TITLE%</title>
+    <!-- The `react-native-web` recommended style reset: https://necolas.github.io/react-native-web/docs/setup/#root-element -->
+    <style id="expo-reset">
+      /* These styles make the body full-height */
+      html,
+      body {
+        height: 100%;
+      }
+      /* These styles disable body scrolling if you are using <ScrollView> */
+      body {
+        overflow: hidden;
+      }
+      /* These styles make the root element full-height */
+      #root {
+        display: flex;
+        height: 100%;
+        flex: 1;
+      }
+    </style>
+    <style>
+      button,
+      a,
+      input,
+      textarea,
+      select,
+      [role='button'],
+      [role='link'],
+      [role='textbox'],
+      [role='combobox'],
+      [role='tab'],
+      [role='switch'],
+      [role='checkbox'],
+      [role='slider'],
+      [role='menuitem'],
+      [tabindex],
+      [contenteditable='true'] {
+        -webkit-app-region: no-drag !important;
+      }
+    </style>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

packages/app/src/app/_layout.tsx

@@ -23,7 +23,7 @@ import {
   getHostRuntimeStore,
   useHosts,
   useHostMutations,
-  useHostRuntimeSession,
+  useHostRuntimeClient,
 } from "@/runtime/host-runtime";
 import { SessionProvider } from "@/contexts/session-context";
 import type { HostProfile } from "@/types/host-connection";
@@ -53,11 +53,10 @@ import {
   HorizontalScrollProvider,
   useHorizontalScrollOptional,
 } from "@/contexts/horizontal-scroll-context";
-import { getIsTauri } from "@/constants/layout";
+import { getIsDesktop } from "@/constants/layout";
 import { CommandCenter } from "@/components/command-center";
 import { ProjectPickerModal } from "@/components/project-picker-modal";
 import { KeyboardShortcutsDialog } from "@/components/keyboard-shortcuts-dialog";
-import { listenToDesktopNotificationClicks } from "@/desktop/notifications/desktop-notifications";
 import { useKeyboardShortcuts } from "@/hooks/use-keyboard-shortcuts";
 import { queryClient } from "@/query/query-client";
 import {
@@ -65,19 +64,18 @@ import {
   type WebNotificationClickDetail,
   ensureOsNotificationPermission,
 } from "@/utils/os-notifications";
+import { getDesktopHost } from "@/desktop/host";
 import { buildNotificationRoute } from "@/utils/notification-routing";
 import {
   buildHostRootRoute,
+  mapPathnameToServer,
   parseServerIdFromPathname,
   parseHostAgentRouteFromPathname,
   parseWorkspaceOpenIntent,
 } from "@/utils/host-routes";
-import { getTauri } from "@/utils/tauri";
-import { attachConsole } from "@/utils/tauri-attach-console";
 import { syncNavigationActiveWorkspace } from "@/stores/navigation-active-workspace-store";
 
 polyfillCrypto();
-attachConsole();
 const HostRuntimeBootstrapContext = createContext(false);
 
 function PushNotificationRouter() {
@@ -86,33 +84,37 @@ function PushNotificationRouter() {
 
   useEffect(() => {
     if (Platform.OS === "web") {
-      if (getTauri()) {
+      let removeDesktopNotificationListener: (() => void) | null = null;
+      let cancelled = false;
+
+      if (getIsDesktop()) {
         void ensureOsNotificationPermission();
 
-        let disposed = false;
-        let unlisten: (() => void) | null = null;
+        const unlistenResult = getDesktopHost()?.events?.on?.(
+          "notification-click",
+          (payload: unknown) => {
+            const data =
+              typeof payload === "object" &&
+              payload !== null &&
+              "data" in payload &&
+              typeof (payload as { data?: unknown }).data === "object" &&
+              (payload as { data?: unknown }).data !== null
+                ? ((payload as { data: Record<string, unknown> }).data)
+                : undefined;
+            router.push(buildNotificationRoute(data) as any);
+          }
+        );
 
-        void listenToDesktopNotificationClicks((payload) => {
-          router.push(buildNotificationRoute(payload.data) as any);
-        })
-          .then((cleanup) => {
-            if (disposed) {
-              cleanup();
-              return;
-            }
-            unlisten = cleanup;
-          })
-          .catch((error) => {
-            console.error(
-              "[OSNotifications][Desktop] Failed to register notification click listener",
-              error
-            );
-          });
-
-        return () => {
-          disposed = true;
-          unlisten?.();
-        };
+        void Promise.resolve(unlistenResult).then((unlisten) => {
+          if (typeof unlisten !== "function") {
+            return;
+          }
+          if (cancelled) {
+            unlisten();
+            return;
+          }
+          removeDesktopNotificationListener = unlisten;
+        });
       }
 
       const target = globalThis as unknown as EventTarget;
@@ -126,7 +128,10 @@ function PushNotificationRouter() {
         WEB_NOTIFICATION_CLICK_EVENT,
         openFromWebClick as EventListener
       );
+
       return () => {
+        cancelled = true;
+        removeDesktopNotificationListener?.();
         target.removeEventListener(
           WEB_NOTIFICATION_CLICK_EVENT,
           openFromWebClick as EventListener
@@ -176,7 +181,7 @@ function PushNotificationRouter() {
 }
 
 function ManagedDaemonSession({ daemon }: { daemon: HostProfile }) {
-  const { client } = useHostRuntimeSession(daemon.serverId);
+  const client = useHostRuntimeClient(daemon.serverId);
 
   if (!client) {
     return null;
@@ -252,6 +257,9 @@ function QueryProvider({ children }: { children: ReactNode }) {
   return <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>;
 }
 
+const rowStyle = { flex: 1, flexDirection: "row" } as const;
+const flexStyle = { flex: 1 } as const;
+
 interface AppContainerProps {
   children: ReactNode;
   selectedAgentId?: string;
@@ -265,23 +273,12 @@ function AppContainer({
 }: AppContainerProps) {
   const { theme } = useUnistyles();
   const daemons = useHosts();
-  const mobileView = usePanelStore((state) => state.mobileView);
-  const desktopAgentListOpen = usePanelStore((state) => state.desktop.agentListOpen);
-  const openAgentList = usePanelStore((state) => state.openAgentList);
   const toggleAgentList = usePanelStore((state) => state.toggleAgentList);
   const toggleFileExplorer = usePanelStore((state) => state.toggleFileExplorer);
-  const horizontalScroll = useHorizontalScrollOptional();
 
   const isMobile =
     UnistylesRuntime.breakpoint === "xs" || UnistylesRuntime.breakpoint === "sm";
   const chromeEnabled = chromeEnabledOverride ?? daemons.length > 0;
-  const isOpen = chromeEnabled
-    ? isMobile
-      ? mobileView === "agent-list"
-      : desktopAgentListOpen
-    : false;
-  const openGestureEnabled =
-    chromeEnabled && isMobile && mobileView === "agent";
 
   useKeyboardShortcuts({
     enabled: chromeEnabled,
@@ -290,6 +287,50 @@ function AppContainer({
     selectedAgentId,
     toggleFileExplorer,
   });
+
+  const containerStyle = useMemo(
+    () => ({ flex: 1 as const, backgroundColor: theme.colors.surface0 }),
+    [theme.colors.surface0]
+  );
+
+  const content = (
+    <View style={containerStyle}>
+      <View style={rowStyle}>
+        {!isMobile && chromeEnabled && <LeftSidebar selectedAgentId={selectedAgentId} />}
+        <View style={flexStyle}>
+          {children}
+        </View>
+      </View>
+      {isMobile && chromeEnabled && <LeftSidebar selectedAgentId={selectedAgentId} />}
+      <DownloadToast />
+      <UpdateBanner />
+      <CommandCenter />
+      <ProjectPickerModal />
+      <KeyboardShortcutsDialog />
+    </View>
+  );
+
+  if (!isMobile) {
+    return content;
+  }
+
+  return (
+    <MobileGestureWrapper chromeEnabled={chromeEnabled}>
+      {content}
+    </MobileGestureWrapper>
+  );
+}
+
+function MobileGestureWrapper({
+  children,
+  chromeEnabled,
+}: {
+  children: ReactNode;
+  chromeEnabled: boolean;
+}) {
+  const mobileView = usePanelStore((state) => state.mobileView);
+  const openAgentList = usePanelStore((state) => state.openAgentList);
+  const horizontalScroll = useHorizontalScrollOptional();
   const {
     translateX,
     backdropOpacity,
@@ -298,18 +339,14 @@ function AppContainer({
     animateToClose,
     isGesturing,
   } = useSidebarAnimation();
-
-  // Track initial touch position for manual activation
   const touchStartX = useSharedValue(0);
+  const openGestureEnabled = chromeEnabled && mobileView === "agent";
 
-  // Open gesture: swipe right from anywhere to open sidebar (interactive drag)
-  // If any horizontal scroll is scrolled right, let the scroll view handle the gesture first
   const openGesture = useMemo(
     () =>
       Gesture.Pan()
         .enabled(openGestureEnabled)
         .manualActivation(true)
-        // Fail if 10px vertical movement happens first (allow vertical scroll)
         .failOffsetY([-10, 10])
         .onTouchesDown((event) => {
           const touch = event.changedTouches[0];
@@ -323,13 +360,11 @@ function AppContainer({
 
           const deltaX = touch.absoluteX - touchStartX.value;
 
-          // If horizontal scroll is scrolled right, fail so ScrollView handles it
           if (horizontalScroll?.isAnyScrolledRight.value) {
             stateManager.fail();
             return;
           }
 
-          // Activate after 15px rightward movement
           if (deltaX > 15) {
             stateManager.activate();
           }
@@ -338,7 +373,6 @@ function AppContainer({
           isGesturing.value = true;
         })
         .onUpdate((event) => {
-          // Start from closed position (-windowWidth) and move towards 0
           const newTranslateX = Math.min(0, -windowWidth + event.translationX);
           translateX.value = newTranslateX;
           backdropOpacity.value = interpolate(
@@ -350,7 +384,6 @@ function AppContainer({
         })
         .onEnd((event) => {
           isGesturing.value = false;
-          // Open if dragged more than 1/3 of sidebar or fast swipe
           const shouldOpen = event.translationX > windowWidth / 3 || event.velocityX > 500;
           if (shouldOpen) {
             animateToOpen();
@@ -370,37 +403,15 @@ function AppContainer({
       animateToOpen,
       animateToClose,
       openAgentList,
-      mobileView,
       isGesturing,
       horizontalScroll?.isAnyScrolledRight,
       touchStartX,
     ]
   );
 
-  const content = (
-    <View style={{ flex: 1, backgroundColor: theme.colors.surface0 }}>
-      <View style={{ flex: 1, flexDirection: "row" }}>
-        {!isMobile && chromeEnabled && <LeftSidebar selectedAgentId={selectedAgentId} />}
-        <View style={{ flex: 1 }}>
-          {children}
-        </View>
-      </View>
-      {isMobile && chromeEnabled && <LeftSidebar selectedAgentId={selectedAgentId} />}
-      <DownloadToast />
-      <UpdateBanner />
-      <CommandCenter />
-      <ProjectPickerModal />
-      <KeyboardShortcutsDialog />
-    </View>
-  );
-
-  if (!isMobile) {
-    return content;
-  }
-
   return (
     <GestureDetector gesture={openGesture} touchAction="pan-y">
-      {content}
+      {children}
     </GestureDetector>
   );
 }
@@ -430,6 +441,7 @@ function ProvidersWrapper({ children }: { children: ReactNode }) {
     <VoiceProvider>
       <OfferLinkListener upsertDaemonFromOfferUrl={upsertConnectionFromOfferUrl} />
       <HostSessionManager />
+      <FaviconStatusSync />
       {children}
     </VoiceProvider>
   );
@@ -476,12 +488,23 @@ function OfferLinkListener({
 }
 
 function AppWithSidebar({ children }: { children: ReactNode }) {
+  const router = useRouter();
   const pathname = usePathname();
   const params = useGlobalSearchParams<{ open?: string | string[] }>();
-  useFaviconStatus();
+  const hosts = useHosts();
   const activeServerId = useMemo(() => parseServerIdFromPathname(pathname), [pathname]);
   const shouldShowAppChrome = activeServerId !== null;
 
+  useEffect(() => {
+    if (!activeServerId || hosts.length === 0) {
+      return;
+    }
+    if (hosts.some((host) => host.serverId === activeServerId)) {
+      return;
+    }
+    router.replace(mapPathnameToServer(pathname, hosts[0]!.serverId) as any);
+  }, [activeServerId, hosts, pathname, router]);
+
   // Parse selectedAgentKey directly from pathname
   // useLocalSearchParams doesn't update when navigating between same-pattern routes
   const selectedAgentKey = useMemo(() => {
@@ -508,6 +531,11 @@ function AppWithSidebar({ children }: { children: ReactNode }) {
   );
 }
 
+function FaviconStatusSync() {
+  useFaviconStatus();
+  return null;
+}
+
 function NavigationActiveWorkspaceObserver() {
   const navigationRef = useNavigationContainerRef();
 
@@ -588,8 +616,8 @@ export default function RootLayout() {
       <PortalProvider>
         <SafeAreaProvider>
           <KeyboardProvider>
-            <BottomSheetModalProvider>
-              <QueryProvider>
+            <QueryProvider>
+              <BottomSheetModalProvider>
                 <HostRuntimeBootstrapProvider>
                   <PushNotificationRouter />
                   <ProvidersWrapper>
@@ -610,17 +638,14 @@ export default function RootLayout() {
                               <Stack.Screen name="settings" />
                               <Stack.Screen
                                 name="h/[serverId]/workspace/[workspaceId]"
-                                getId={({ params }) =>
-                                  `${params?.serverId}:${params?.workspaceId}`
-                                }
+                                options={{ freezeOnBlur: true }}
                               />
                               <Stack.Screen
                                 name="h/[serverId]/agent/[agentId]"
-                                options={{ gestureEnabled: false }}
+                                options={{ gestureEnabled: false, freezeOnBlur: true }}
                               />
                               <Stack.Screen name="h/[serverId]/index" />
                               <Stack.Screen name="h/[serverId]/agents" />
-                              <Stack.Screen name="h/[serverId]/new-agent" />
                               <Stack.Screen name="h/[serverId]/open-project" />
                               <Stack.Screen name="h/[serverId]/settings" />
                               <Stack.Screen name="pair-scan" />
@@ -631,8 +656,8 @@ export default function RootLayout() {
                     </SidebarAnimationProvider>
                   </ProvidersWrapper>
                 </HostRuntimeBootstrapProvider>
-              </QueryProvider>
-            </BottomSheetModalProvider>
+              </BottomSheetModalProvider>
+            </QueryProvider>
           </KeyboardProvider>
         </SafeAreaProvider>
       </PortalProvider>

packages/app/src/app/h/[serverId]/agent/[agentId].tsx

@@ -1,11 +1,11 @@
 import { useEffect, useRef } from "react";
 import { useLocalSearchParams, useRouter } from "expo-router";
 import { useSessionStore } from "@/stores/session-store";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import {
   buildHostRootRoute,
-  buildHostWorkspaceAgentRoute,
 } from "@/utils/host-routes";
+import { prepareWorkspaceTab } from "@/utils/workspace-navigation";
 
 export default function HostAgentReadyRoute() {
   const router = useRouter();
@@ -16,7 +16,8 @@ export default function HostAgentReadyRoute() {
   const redirectedRef = useRef(false);
   const serverId = typeof params.serverId === "string" ? params.serverId : "";
   const agentId = typeof params.agentId === "string" ? params.agentId : "";
-  const { client, isConnected } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
+  const isConnected = useHostRuntimeIsConnected(serverId);
   const agentCwd = useSessionStore((state) => {
     if (!serverId || !agentId) {
       return null;
@@ -38,7 +39,11 @@ export default function HostAgentReadyRoute() {
     if (normalizedCwd) {
       redirectedRef.current = true;
       router.replace(
-        buildHostWorkspaceAgentRoute(serverId, normalizedCwd, agentId) as any
+        prepareWorkspaceTab({
+          serverId,
+          workspaceId: normalizedCwd,
+          target: { kind: "agent", agentId },
+        }) as any
       );
     }
   }, [agentCwd, agentId, router, serverId]);
@@ -77,7 +82,13 @@ export default function HostAgentReadyRoute() {
         const cwd = result?.agent?.cwd?.trim();
         redirectedRef.current = true;
         if (cwd) {
-          router.replace(buildHostWorkspaceAgentRoute(serverId, cwd, agentId) as any);
+          router.replace(
+            prepareWorkspaceTab({
+              serverId,
+              workspaceId: cwd,
+              target: { kind: "agent", agentId },
+            }) as any
+          );
           return;
         }
         router.replace(buildHostRootRoute(serverId) as any);

packages/app/src/app/h/[serverId]/index.tsx

@@ -5,9 +5,9 @@ import { useFormPreferences } from "@/hooks/use-form-preferences";
 import {
   buildHostOpenProjectRoute,
   buildHostRootRoute,
-  buildHostWorkspaceAgentRoute,
   buildHostWorkspaceRoute,
 } from "@/utils/host-routes";
+import { prepareWorkspaceTab } from "@/utils/workspace-navigation";
 
 const HOST_ROOT_REDIRECT_DELAY_MS = 300;
 
@@ -59,11 +59,11 @@ export default function HostIndexRoute() {
       const primaryAgent = visibleAgents[0];
       if (primaryAgent?.cwd?.trim()) {
         router.replace(
-          buildHostWorkspaceAgentRoute(
+          prepareWorkspaceTab({
             serverId,
-            primaryAgent.cwd.trim(),
-            primaryAgent.id
-          ) as any
+            workspaceId: primaryAgent.cwd.trim(),
+            target: { kind: "agent", agentId: primaryAgent.id },
+          }) as any
         );
         return;
       }

packages/app/src/app/h/[serverId]/new-agent.tsx

@@ -1,9 +0,0 @@
-import { useLocalSearchParams } from "expo-router";
-import { DraftAgentScreen } from "@/screens/agent/draft-agent-screen";
-
-export default function HostNewAgentRoute() {
-  const params = useLocalSearchParams<{ serverId?: string }>();
-  const serverId = typeof params.serverId === "string" ? params.serverId : "";
-
-  return <DraftAgentScreen forcedServerId={serverId} />;
-}

packages/app/src/app/h/[serverId]/workspace/[workspaceId]/_layout.tsx

@@ -1,31 +1,87 @@
-import { useLocalSearchParams } from 'expo-router'
+import { useEffect, useRef } from 'react'
+import { useGlobalSearchParams, useLocalSearchParams, useRouter } from 'expo-router'
+import type { WorkspaceTabTarget } from '@/stores/workspace-tabs-store'
 import { WorkspaceScreen } from '@/screens/workspace/workspace-screen'
 import {
+  buildHostWorkspaceRoute,
   decodeWorkspaceIdFromPathSegment,
   parseWorkspaceOpenIntent,
+  type WorkspaceOpenIntent,
 } from '@/utils/host-routes'
+import { prepareWorkspaceTab } from '@/utils/workspace-navigation'
+
+function getParamValue(value: string | string[] | undefined): string {
+  if (typeof value === 'string') {
+    return value.trim()
+  }
+  if (Array.isArray(value)) {
+    const firstValue = value[0]
+    return typeof firstValue === 'string' ? firstValue.trim() : ''
+  }
+  return ''
+}
+
+function getOpenIntentTarget(openIntent: WorkspaceOpenIntent): WorkspaceTabTarget {
+  if (openIntent.kind === 'agent') {
+    return { kind: 'agent', agentId: openIntent.agentId }
+  }
+  if (openIntent.kind === 'terminal') {
+    return { kind: 'terminal', terminalId: openIntent.terminalId }
+  }
+  if (openIntent.kind === 'file') {
+    return { kind: 'file', path: openIntent.path }
+  }
+  return { kind: 'draft', draftId: openIntent.draftId }
+}
 
 export default function HostWorkspaceLayout() {
+  const router = useRouter()
+  const consumedIntentRef = useRef<string | null>(null)
   const params = useLocalSearchParams<{
     serverId?: string | string[]
     workspaceId?: string | string[]
+  }>()
+  const globalParams = useGlobalSearchParams<{
     open?: string | string[]
   }>()
-  const serverValue = Array.isArray(params.serverId) ? params.serverId[0] : params.serverId
-  const workspaceValue = Array.isArray(params.workspaceId)
-    ? params.workspaceId[0]
-    : params.workspaceId
-  const serverId = serverValue?.trim() ?? ''
+  const serverId = getParamValue(params.serverId)
+  const workspaceValue = getParamValue(params.workspaceId)
   const workspaceId = workspaceValue ? (decodeWorkspaceIdFromPathSegment(workspaceValue) ?? '') : ''
-  const openValue = Array.isArray(params.open) ? params.open[0] : params.open
-  const openIntent = parseWorkspaceOpenIntent(openValue)
+  const openValue = getParamValue(globalParams.open)
+
+  useEffect(() => {
+    if (!openValue) {
+      return
+    }
+
+    const consumptionKey = `${serverId}:${workspaceId}:${openValue}`
+    if (consumedIntentRef.current === consumptionKey) {
+      return
+    }
+    consumedIntentRef.current = consumptionKey
+
+    const openIntent = parseWorkspaceOpenIntent(openValue)
+    const route = openIntent
+      ? prepareWorkspaceTab({
+          serverId,
+          workspaceId,
+          target: getOpenIntentTarget(openIntent),
+          pin: openIntent.kind === 'agent',
+        })
+      : buildHostWorkspaceRoute(serverId, workspaceId)
+
+    router.replace(route as any)
+  }, [openValue, router, serverId, workspaceId])
+
+  if (openValue) {
+    return null
+  }
 
   return (
     <WorkspaceScreen
       key={`${serverId}:${workspaceId}`}
       serverId={serverId}
       workspaceId={workspaceId}
-      openIntent={openIntent}
     />
   )
 }

packages/app/src/app/index.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useSyncExternalStore, useState } from 'react'
 import { usePathname, useRouter } from 'expo-router'
 import { useHosts } from '@/runtime/host-runtime'
-import { shouldUseManagedDesktopDaemon } from '@/desktop/managed-runtime/managed-runtime'
+import { shouldUseDesktopDaemon } from '@/desktop/daemon/desktop-daemon'
 import { buildHostRootRoute } from '@/utils/host-routes'
 import { StartupSplashScreen } from '@/screens/startup-splash-screen'
 import { WelcomeScreen } from '@/components/welcome-screen'
@@ -57,7 +57,7 @@ export default function Index() {
   const pathname = usePathname()
   const daemons = useHosts()
   const [hasTimedOut, setHasTimedOut] = useState(false)
-  const isDesktopStartupRace = shouldUseManagedDesktopDaemon()
+  const isDesktopStartupRace = shouldUseDesktopDaemon()
   const onlineServerId = useAnyHostOnline(daemons.map((daemon) => daemon.serverId))
   useEffect(() => {
     const timer = setTimeout(() => {

packages/app/src/attachments/store.ts

@@ -1,12 +1,12 @@
 import { Platform } from "react-native";
-import { isTauriEnvironment } from "@/utils/tauri";
+import { isDesktop } from "@/desktop/host";
 import type { AttachmentStore } from "@/attachments/types";
 
 let attachmentStorePromise: Promise<AttachmentStore> | null = null;
 
 async function createAttachmentStore(): Promise<AttachmentStore> {
   if (Platform.OS === "web") {
-    if (isTauriEnvironment()) {
+    if (isDesktop()) {
       const { createDesktopAttachmentStore } = await import(
         "../desktop/attachments/desktop-attachment-store"
       );

packages/app/src/components/agent-input-area.tsx

@@ -28,7 +28,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip
 import { Shortcut } from '@/components/ui/shortcut'
 import { Autocomplete } from '@/components/ui/autocomplete'
 import { useAgentAutocomplete } from '@/hooks/use-agent-autocomplete'
-import { useHostRuntimeSession } from '@/runtime/host-runtime'
+import { useHostRuntimeAgentDirectoryStatus, useHostRuntimeClient, useHostRuntimeIsConnected } from '@/runtime/host-runtime'
 import {
   deleteAttachments,
   persistAttachmentFromBlob,
@@ -97,17 +97,20 @@ export function AgentInputArea({
 }: AgentInputAreaProps) {
   markScrollInvestigationRender(`AgentInputArea:${serverId}:${agentId}`)
   const { theme } = useUnistyles()
+  const buttonIconSize = Platform.OS === 'web' ? theme.iconSize.md : theme.iconSize.lg
   const insets = useSafeAreaInsets()
   const isScreenFocused = useIsFocused()
 
-  const { client, isConnected, snapshot } = useHostRuntimeSession(serverId)
+  const client = useHostRuntimeClient(serverId)
+  const isConnected = useHostRuntimeIsConnected(serverId)
+  const agentDirectoryStatus = useHostRuntimeAgentDirectoryStatus(serverId)
   const toast = useToast()
   const voice = useVoiceOptional()
   const isDictationReady =
     isConnected &&
-    (snapshot?.agentDirectoryStatus === 'ready' ||
-      snapshot?.agentDirectoryStatus === 'revalidating' ||
-      snapshot?.agentDirectoryStatus === 'error_after_ready')
+    (agentDirectoryStatus === 'ready' ||
+      agentDirectoryStatus === 'revalidating' ||
+      agentDirectoryStatus === 'error_after_ready')
 
   const agent = useSessionStore((state) => state.sessions[serverId]?.agents?.get(agentId))
 
@@ -699,7 +702,7 @@ export function AgentInputArea({
           {isCancellingAgent ? (
             <ActivityIndicator size="small" color="white" />
           ) : (
-            <Square size={theme.iconSize.md} color="white" fill="white" />
+            <Square size={buttonIconSize} color="white" fill="white" />
           )}
         </TooltipTrigger>
         <TooltipContent side="top" align="center" offset={8}>
@@ -729,7 +732,7 @@ export function AgentInputArea({
             {voice?.isVoiceSwitching ? (
               <ActivityIndicator size="small" color="white" />
             ) : (
-              <AudioLines size={theme.iconSize.md} color={theme.colors.foreground} />
+              <AudioLines size={buttonIconSize} color={theme.colors.foreground} />
             )}
           </TooltipTrigger>
           <TooltipContent side="top" align="center" offset={8}>

packages/app/src/components/agent-list.tsx

@@ -9,14 +9,14 @@ import {
 } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { useCallback, useMemo, useState, type ReactElement } from 'react'
-import { router, usePathname, type Href } from 'expo-router'
+import { router } from 'expo-router'
 import { StyleSheet, UnistylesRuntime, useUnistyles } from 'react-native-unistyles'
 import { formatTimeAgo } from '@/utils/time'
 import { shortenPath } from '@/utils/shorten-path'
 import { type AggregatedAgent } from '@/hooks/use-aggregated-agents'
 import { useSessionStore } from '@/stores/session-store'
 import { AgentStatusDot } from '@/components/agent-status-dot'
-import { buildHostWorkspaceAgentRoute } from '@/utils/host-routes'
+import { prepareWorkspaceTab } from '@/utils/workspace-navigation'
 
 interface AgentListProps {
   agents: AggregatedAgent[]
@@ -250,7 +250,6 @@ export function AgentList({
   showAttentionIndicator = true,
 }: AgentListProps) {
   const { theme } = useUnistyles()
-  const pathname = usePathname()
   const insets = useSafeAreaInsets()
   const [actionAgent, setActionAgent] = useState<AggregatedAgent | null>(null)
   const isMobile = UnistylesRuntime.breakpoint === 'xs' || UnistylesRuntime.breakpoint === 'sm'
@@ -270,15 +269,17 @@ export function AgentList({
 
       const serverId = agent.serverId
       const agentId = agent.id
-      const shouldReplace = pathname.startsWith('/h/')
-      const navigate = shouldReplace ? router.replace : router.push
 
       onAgentSelect?.()
 
-      const route: Href = buildHostWorkspaceAgentRoute(serverId, agent.cwd, agentId) as Href
-      navigate(route)
+      const route = prepareWorkspaceTab({
+        serverId,
+        workspaceId: agent.cwd,
+        target: { kind: 'agent', agentId },
+      })
+      router.navigate(route as any)
     },
-    [isActionSheetVisible, pathname, onAgentSelect]
+    [isActionSheetVisible, onAgentSelect]
   )
 
   const handleAgentLongPress = useCallback((agent: AggregatedAgent) => {

packages/app/src/components/agent-status-bar.test.ts

@@ -1,5 +1,17 @@
 import { describe, expect, it } from 'vitest'
-import { normalizeModelId, resolveAgentModelSelection } from './agent-status-bar.utils'
+import {
+  getStatusSelectorHint,
+  normalizeModelId,
+  resolveAgentModelSelection,
+} from './agent-status-bar.utils'
+
+describe('getStatusSelectorHint', () => {
+  it('explains what each editable status control does', () => {
+    expect(getStatusSelectorHint('thinking')).toBe('Thinking mode')
+    expect(getStatusSelectorHint('model')).toBe('Change model')
+    expect(getStatusSelectorHint('mode')).toBe('Change permission mode')
+  })
+})
 
 describe('normalizeModelId', () => {
   it('treats empty and default values as unset', () => {

packages/app/src/components/agent-status-bar.tsx

@@ -2,13 +2,12 @@ import { useCallback, useMemo, useRef, useState } from 'react'
 import { View, Text, Platform, Pressable } from 'react-native'
 import { StyleSheet, useUnistyles } from 'react-native-unistyles'
 import {
-  Bot,
   Brain,
   ChevronDown,
   ShieldAlert,
   ShieldCheck,
   ShieldOff,
-  SlidersHorizontal,
+
 } from 'lucide-react-native'
 import { getProviderIcon } from '@/components/provider-icons'
 import { CombinedModelSelector } from '@/components/combined-model-selector'
@@ -22,6 +21,7 @@ import {
 } from '@/components/ui/dropdown-menu'
 import { Combobox, ComboboxItem, type ComboboxOption } from '@/components/ui/combobox'
 import { AdaptiveModalSheet } from '@/components/adaptive-modal-sheet'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
 import type {
   AgentMode,
   AgentModelDefinition,
@@ -33,13 +33,18 @@ import {
   type AgentModeColorTier,
   type AgentModeIcon,
 } from '@server/server/agent/provider-manifest'
-import { normalizeModelId, resolveAgentModelSelection } from '@/components/agent-status-bar.utils'
+import {
+  getStatusSelectorHint,
+  resolveAgentModelSelection,
+} from '@/components/agent-status-bar.utils'
 
 type StatusOption = {
   id: string
   label: string
 }
 
+type StatusSelector = 'provider' | 'mode' | 'model' | 'thinking'
+
 type ControlledAgentStatusBarProps = {
   provider: string
   providerOptions?: StatusOption[]
@@ -139,7 +144,7 @@ function ControlledStatusBar({
   const { theme } = useUnistyles()
   const isWeb = Platform.OS === 'web'
   const [prefsOpen, setPrefsOpen] = useState(false)
-  const [openSelector, setOpenSelector] = useState<'provider' | 'mode' | 'model' | 'thinking' | null>(null)
+  const [openSelector, setOpenSelector] = useState<StatusSelector | null>(null)
 
   const providerAnchorRef = useRef<View>(null)
   const modeAnchorRef = useRef<View>(null)
@@ -215,12 +220,19 @@ function ControlledStatusBar({
   )
 
   const handleOpenChange = useCallback(
-    (selector: 'provider' | 'mode' | 'model' | 'thinking') => (nextOpen: boolean) => {
+    (selector: StatusSelector) => (nextOpen: boolean) => {
       setOpenSelector(nextOpen ? selector : null)
     },
     []
   )
 
+  const handleSelectorPress = useCallback(
+    (selector: StatusSelector) => {
+      handleOpenChange(selector)(openSelector !== selector)
+    },
+    [handleOpenChange, openSelector]
+  )
+
   return (
     <View style={styles.container}>
       {isWeb ? (
@@ -231,7 +243,7 @@ function ControlledStatusBar({
                 ref={providerAnchorRef}
                 collapsable={false}
                 disabled={disabled || !canSelectProvider}
-                onPress={() => setOpenSelector(openSelector === 'provider' ? null : 'provider')}
+                onPress={() => handleSelectorPress('provider')}
                 style={({ pressed, hovered }) => [
                   styles.modeBadge,
                   hovered && styles.modeBadgeHovered,
@@ -260,27 +272,39 @@ function ControlledStatusBar({
 
           {modeOptions && modeOptions.length > 0 ? (
             <>
-              <Pressable
-                ref={modeAnchorRef}
-                collapsable={false}
-                disabled={disabled || !canSelectMode}
-                onPress={() => setOpenSelector(openSelector === 'mode' ? null : 'mode')}
-                style={({ pressed, hovered }) => [
-                  styles.modeIconBadge,
-                  hovered && styles.modeBadgeHovered,
-                  (pressed || openSelector === 'mode') && styles.modeBadgePressed,
-                  (disabled || !canSelectMode) && styles.disabledBadge,
-                ]}
-                accessibilityRole="button"
-                accessibilityLabel={`Select agent mode (${displayMode})`}
-                testID="agent-mode-selector"
+              <Tooltip
+                key={`mode-${openSelector === 'mode' ? 'open' : 'closed'}`}
+                delayDuration={0}
+                enabledOnDesktop
+                enabledOnMobile={false}
               >
-                {ModeIconComponent ? (
-                  <ModeIconComponent size={theme.iconSize.md} color={modeIconColor} />
-                ) : (
-                  <ShieldCheck size={theme.iconSize.md} color={theme.colors.foregroundMuted} />
-                )}
-              </Pressable>
+                <TooltipTrigger asChild triggerRefProp="ref">
+                  <Pressable
+                    ref={modeAnchorRef}
+                    collapsable={false}
+                    disabled={disabled || !canSelectMode}
+                    onPress={() => handleSelectorPress('mode')}
+                    style={({ pressed, hovered }) => [
+                      styles.modeIconBadge,
+                      hovered && styles.modeBadgeHovered,
+                      (pressed || openSelector === 'mode') && styles.modeBadgePressed,
+                      (disabled || !canSelectMode) && styles.disabledBadge,
+                    ]}
+                    accessibilityRole="button"
+                    accessibilityLabel={`Select agent mode (${displayMode})`}
+                    testID="agent-mode-selector"
+                  >
+                    {ModeIconComponent ? (
+                      <ModeIconComponent size={theme.iconSize.md} color={modeIconColor} />
+                    ) : (
+                      <ShieldCheck size={theme.iconSize.md} color={theme.colors.foregroundMuted} />
+                    )}
+                  </Pressable>
+                </TooltipTrigger>
+                <TooltipContent side="top" align="center" offset={8}>
+                  <Text style={styles.tooltipText}>{getStatusSelectorHint('mode')}</Text>
+                </TooltipContent>
+              </Tooltip>
               <Combobox
                 options={comboboxModeOptions}
                 value={selectedModeId ?? ''}
@@ -297,25 +321,37 @@ function ControlledStatusBar({
 
           {canSelectModel ? (
             <>
-              <Pressable
-                ref={modelAnchorRef}
-                collapsable={false}
-                disabled={modelDisabled}
-                onPress={() => setOpenSelector(openSelector === 'model' ? null : 'model')}
-                style={({ pressed, hovered }) => [
-                  styles.modeBadge,
-                  hovered && styles.modeBadgeHovered,
-                  (pressed || openSelector === 'model') && styles.modeBadgePressed,
-                  modelDisabled && styles.disabledBadge,
-                ]}
-                accessibilityRole="button"
-                accessibilityLabel="Select agent model"
-                testID="agent-model-selector"
+              <Tooltip
+                key={`model-${openSelector === 'model' ? 'open' : 'closed'}`}
+                delayDuration={0}
+                enabledOnDesktop
+                enabledOnMobile={false}
               >
-                <ProviderIcon size={theme.iconSize.md} color={theme.colors.foregroundMuted} />
-                <Text style={styles.modeBadgeText}>{displayModel}</Text>
-                <ChevronDown size={theme.iconSize.sm} color={theme.colors.foregroundMuted} />
-              </Pressable>
+                <TooltipTrigger asChild triggerRefProp="ref">
+                  <Pressable
+                    ref={modelAnchorRef}
+                    collapsable={false}
+                    disabled={modelDisabled}
+                    onPress={() => handleSelectorPress('model')}
+                    style={({ pressed, hovered }) => [
+                      styles.modeBadge,
+                      hovered && styles.modeBadgeHovered,
+                      (pressed || openSelector === 'model') && styles.modeBadgePressed,
+                      modelDisabled && styles.disabledBadge,
+                    ]}
+                    accessibilityRole="button"
+                    accessibilityLabel="Select agent model"
+                    testID="agent-model-selector"
+                  >
+                    <ProviderIcon size={theme.iconSize.md} color={theme.colors.foregroundMuted} />
+                    <Text style={styles.modeBadgeText}>{displayModel}</Text>
+                    <ChevronDown size={theme.iconSize.sm} color={theme.colors.foregroundMuted} />
+                  </Pressable>
+                </TooltipTrigger>
+                <TooltipContent side="top" align="center" offset={8}>
+                  <Text style={styles.tooltipText}>{getStatusSelectorHint('model')}</Text>
+                </TooltipContent>
+              </Tooltip>
               <Combobox
                 options={comboboxModelOptions}
                 value={selectedModelId ?? ''}
@@ -331,25 +367,37 @@ function ControlledStatusBar({
 
           {thinkingOptions && thinkingOptions.length > 0 ? (
             <>
-              <Pressable
-                ref={thinkingAnchorRef}
-                collapsable={false}
-                disabled={disabled || !canSelectThinking}
-                onPress={() => setOpenSelector(openSelector === 'thinking' ? null : 'thinking')}
-                style={({ pressed, hovered }) => [
-                  styles.modeBadge,
-                  hovered && styles.modeBadgeHovered,
-                  (pressed || openSelector === 'thinking') && styles.modeBadgePressed,
-                  (disabled || !canSelectThinking) && styles.disabledBadge,
-                ]}
-                accessibilityRole="button"
-                accessibilityLabel={`Select thinking option (${displayThinking})`}
-                testID="agent-thinking-selector"
+              <Tooltip
+                key={`thinking-${openSelector === 'thinking' ? 'open' : 'closed'}`}
+                delayDuration={0}
+                enabledOnDesktop
+                enabledOnMobile={false}
               >
-                <Brain size={theme.iconSize.md} color={theme.colors.foregroundMuted} />
-                <Text style={styles.modeBadgeText}>{displayThinking}</Text>
-                <ChevronDown size={theme.iconSize.sm} color={theme.colors.foregroundMuted} />
-              </Pressable>
+                <TooltipTrigger asChild triggerRefProp="ref">
+                  <Pressable
+                    ref={thinkingAnchorRef}
+                    collapsable={false}
+                    disabled={disabled || !canSelectThinking}
+                    onPress={() => handleSelectorPress('thinking')}
+                    style={({ pressed, hovered }) => [
+                      styles.modeBadge,
+                      hovered && styles.modeBadgeHovered,
+                      (pressed || openSelector === 'thinking') && styles.modeBadgePressed,
+                      (disabled || !canSelectThinking) && styles.disabledBadge,
+                    ]}
+                    accessibilityRole="button"
+                    accessibilityLabel={`Select thinking option (${displayThinking})`}
+                    testID="agent-thinking-selector"
+                  >
+                    <Brain size={theme.iconSize.md} color={theme.colors.foregroundMuted} />
+                    <Text style={styles.modeBadgeText}>{displayThinking}</Text>
+                    <ChevronDown size={theme.iconSize.sm} color={theme.colors.foregroundMuted} />
+                  </Pressable>
+                </TooltipTrigger>
+                <TooltipContent side="top" align="center" offset={8}>
+                  <Text style={styles.tooltipText}>{getStatusSelectorHint('thinking')}</Text>
+                </TooltipContent>
+              </Tooltip>
               <Combobox
                 options={comboboxThinkingOptions}
                 value={selectedThinkingOptionId ?? ''}
@@ -375,7 +423,8 @@ function ControlledStatusBar({
             accessibilityLabel="Agent preferences"
             testID="agent-preferences-button"
           >
-            <SlidersHorizontal size={theme.iconSize.md} color={theme.colors.foreground} />
+            <ProviderIcon size={theme.iconSize.lg} color={theme.colors.foregroundMuted} />
+            <Text style={styles.prefsButtonText} numberOfLines={1}>{displayModel}</Text>
           </Pressable>
 
           <AdaptiveModalSheet
@@ -386,7 +435,10 @@ function ControlledStatusBar({
           >
             {providerOptions && providerOptions.length > 0 ? (
               <View style={styles.sheetSection}>
-                <DropdownMenu>
+                <DropdownMenu
+                  open={openSelector === 'provider'}
+                  onOpenChange={handleOpenChange('provider')}
+                >
                   <DropdownMenuTrigger
                     disabled={disabled || !canSelectProvider}
                     style={({ pressed }) => [
@@ -418,7 +470,10 @@ function ControlledStatusBar({
 
             {modeOptions && modeOptions.length > 0 ? (
               <View style={styles.sheetSection}>
-                <DropdownMenu>
+                <DropdownMenu
+                  open={openSelector === 'mode'}
+                  onOpenChange={handleOpenChange('mode')}
+                >
                   <DropdownMenuTrigger
                     disabled={disabled || !canSelectMode}
                     style={({ pressed }) => [
@@ -458,7 +513,10 @@ function ControlledStatusBar({
 
             {canSelectModel ? (
               <View style={styles.sheetSection}>
-                <DropdownMenu>
+                <DropdownMenu
+                  open={openSelector === 'model'}
+                  onOpenChange={handleOpenChange('model')}
+                >
                   <DropdownMenuTrigger
                     disabled={modelDisabled}
                     style={({ pressed }) => [
@@ -490,7 +548,10 @@ function ControlledStatusBar({
 
             {thinkingOptions && thinkingOptions.length > 0 ? (
               <View style={styles.sheetSection}>
-                <DropdownMenu>
+                <DropdownMenu
+                  open={openSelector === 'thinking'}
+                  onOpenChange={handleOpenChange('thinking')}
+                >
                   <DropdownMenuTrigger
                     disabled={disabled || !canSelectThinking}
                     style={({ pressed }) => [
@@ -763,16 +824,28 @@ const styles = StyleSheet.create((theme) => ({
     fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
+  tooltipText: {
+    color: theme.colors.foreground,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.4,
+  },
   prefsButton: {
-    width: 28,
     height: 28,
-    borderRadius: theme.borderRadius.full,
+    flexDirection: 'row',
     alignItems: 'center',
-    justifyContent: 'center',
+    gap: theme.spacing[1],
+    paddingHorizontal: theme.spacing[2],
+    borderRadius: theme.borderRadius['2xl'],
   },
   prefsButtonPressed: {
     backgroundColor: theme.colors.surface0,
   },
+  prefsButtonText: {
+    color: theme.colors.foregroundMuted,
+    fontSize: theme.fontSize.sm,
+    fontWeight: theme.fontWeight.normal,
+    flexShrink: 1,
+  },
   sheetSection: {
     gap: theme.spacing[2],
   },

packages/app/src/components/agent-status-bar.utils.ts

@@ -1,5 +1,18 @@
 import type { AgentModelDefinition } from '@server/server/agent/agent-sdk-types'
 
+export type ExplainedStatusSelector = 'mode' | 'model' | 'thinking'
+
+export function getStatusSelectorHint(selector: ExplainedStatusSelector): string {
+  switch (selector) {
+    case 'thinking':
+      return 'Thinking mode'
+    case 'model':
+      return 'Change model'
+    case 'mode':
+      return 'Change permission mode'
+  }
+}
+
 export function normalizeModelId(modelId: string | null | undefined): string | null {
   const normalized = typeof modelId === 'string' ? modelId.trim() : ''
   if (!normalized || normalized.toLowerCase() === 'default') {

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

@@ -67,8 +67,8 @@ import {
 import { createMarkdownStyles } from "@/styles/markdown-styles";
 import { MAX_CONTENT_WIDTH } from "@/constants/layout";
 import { getMarkdownListMarker } from "@/utils/markdown-list";
-import { buildHostWorkspaceFileRoute } from "@/utils/host-routes";
 import { normalizeInlinePathTarget } from "@/utils/inline-path";
+import { prepareWorkspaceTab } from "@/utils/workspace-navigation";
 import {
   getWorkingIndicatorDotStrength,
   WORKING_INDICATOR_CYCLE_MS,
@@ -171,12 +171,12 @@ export const AgentStreamView = forwardRef<AgentStreamViewHandle, AgentStreamView
           return;
         }
 
-        const route = buildHostWorkspaceFileRoute(
-          resolvedServerId,
+        const route = prepareWorkspaceTab({
+          serverId: resolvedServerId,
           workspaceId,
-          normalized.file
-        );
-        router.replace(route as any);
+          target: { kind: "file", path: normalized.file },
+        });
+        router.navigate(route as any);
         return;
       }
 
@@ -261,6 +261,44 @@ export const AgentStreamView = forwardRef<AgentStreamViewHandle, AgentStreamView
     [looseGap, tightGap]
   );
 
+  // ---------------------------------------------------------------------------
+  // DEBUG: track when render callback deps change
+  // ---------------------------------------------------------------------------
+  const debugStreamPrevRef = useRef<Record<string, unknown>>({});
+  useEffect(() => {
+    const prev = debugStreamPrevRef.current;
+    const curr: Record<string, unknown> = {
+      // handleInlinePathPress deps (line 196-205)
+      "hip.agent.cwd": agent.cwd,
+      "hip.openFileExplorer": openFileExplorer,
+      "hip.requestDirectoryListing": requestDirectoryListing,
+      "hip.resolvedServerId": resolvedServerId,
+      "hip.router": router,
+      "hip.setExplorerTabForCheckout": setExplorerTabForCheckout,
+      "hip.onOpenWorkspaceFile": onOpenWorkspaceFile,
+      "hip.workspaceId": workspaceId,
+      // top-level deps
+      handleInlinePathPress,
+      "agent.status": agent.status,
+      streamRenderStrategy,
+      getGapBetween,
+      streamItems,
+      "streamItems.length": streamItems.length,
+      streamHead,
+      baseRenderModel,
+    };
+    const changed: string[] = [];
+    for (const key of Object.keys(curr)) {
+      if (!Object.is(prev[key], curr[key])) {
+        changed.push(key);
+      }
+    }
+    if (changed.length > 0 && Object.keys(prev).length > 0) {
+      console.log("[AgentStreamView] deps changed:", changed.join(", "));
+    }
+    debugStreamPrevRef.current = curr;
+  });
+
   const renderStreamItemContent = useCallback(
     (
       item: StreamItem,

packages/app/src/components/archived-agent-callout.tsx

@@ -0,0 +1,99 @@
+import { useState } from 'react'
+import { View, Text } from 'react-native'
+import { StyleSheet } from 'react-native-unistyles'
+import Animated from 'react-native-reanimated'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
+import { FOOTER_HEIGHT, MAX_CONTENT_WIDTH } from '@/constants/layout'
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from '@/runtime/host-runtime'
+import { useKeyboardShiftStyle } from '@/hooks/use-keyboard-shift-style'
+import { Button } from '@/components/ui/button'
+import type { Theme } from '@/styles/theme'
+
+interface ArchivedAgentCalloutProps {
+  serverId: string
+  agentId: string
+}
+
+export function ArchivedAgentCallout({ serverId, agentId }: ArchivedAgentCalloutProps) {
+  const insets = useSafeAreaInsets()
+  const client = useHostRuntimeClient(serverId)
+  const isConnected = useHostRuntimeIsConnected(serverId)
+  const [isUnarchiving, setIsUnarchiving] = useState(false)
+
+  const { style: keyboardAnimatedStyle } = useKeyboardShiftStyle({ mode: 'translate' })
+
+  async function handleUnarchive() {
+    if (!client || !isConnected || isUnarchiving) return
+    setIsUnarchiving(true)
+    try {
+      await client.refreshAgent(agentId)
+    } catch (error) {
+      console.error('[ArchivedAgentCallout] Failed to unarchive agent:', error)
+      setIsUnarchiving(false)
+    }
+  }
+
+  return (
+    <Animated.View
+      style={[styles.container, { paddingBottom: insets.bottom }, keyboardAnimatedStyle]}
+    >
+      <View style={styles.inputAreaContainer}>
+        <View style={styles.inputAreaContent}>
+          <View style={styles.callout}>
+            <Text style={styles.calloutText}>This agent is archived</Text>
+            <Button
+              size="sm"
+              variant="secondary"
+              onPress={handleUnarchive}
+              disabled={!isConnected || isUnarchiving}
+            >
+              Unarchive
+            </Button>
+          </View>
+        </View>
+      </View>
+    </Animated.View>
+  )
+}
+
+const styles = StyleSheet.create(((theme: Theme) => ({
+  container: {
+    flexDirection: 'column',
+    position: 'relative',
+  },
+  inputAreaContainer: {
+    position: 'relative',
+    minHeight: FOOTER_HEIGHT,
+    marginHorizontal: 'auto',
+    alignItems: 'center',
+    width: '100%',
+    overflow: 'visible',
+    padding: theme.spacing[4],
+  },
+  inputAreaContent: {
+    width: '100%',
+    maxWidth: MAX_CONTENT_WIDTH,
+  },
+  callout: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    gap: theme.spacing[3],
+    backgroundColor: theme.colors.surface1,
+    borderWidth: theme.borderWidth[1],
+    borderColor: theme.colors.borderAccent,
+    borderRadius: theme.borderRadius['2xl'],
+    paddingVertical: {
+      xs: theme.spacing[3],
+      md: theme.spacing[4],
+    },
+    paddingHorizontal: {
+      xs: theme.spacing[4],
+      md: theme.spacing[6],
+    },
+  },
+  calloutText: {
+    color: theme.colors.foregroundMuted,
+    fontSize: theme.fontSize.base,
+  },
+})) as any) as Record<string, any>

packages/app/src/components/git-diff-pane.tsx

@@ -25,6 +25,7 @@ import {
   ListChevronsUpDown,
   RefreshCcw,
   Upload,
+  WrapText,
 } from "lucide-react-native";
 import { useCheckoutGitActionsStore } from "@/stores/checkout-git-actions-store";
 import {
@@ -47,6 +48,7 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
+import { Tooltip, TooltipTrigger, TooltipContent } from "@/components/ui/tooltip";
 import { GitHubIcon } from "@/components/icons/github-icon";
 import {
   buildGitActions,
@@ -153,7 +155,7 @@ interface DiffFileSectionProps {
   testID?: string;
 }
 
-function DiffLineView({ line }: { line: DiffLine }) {
+function DiffLineView({ line, lineNumber, gutterWidth }: { line: DiffLine; lineNumber: number | null; gutterWidth: number }) {
   return (
     <View
       style={[
@@ -164,6 +166,15 @@ function DiffLineView({ line }: { line: DiffLine }) {
         line.type === "context" && styles.contextLineContainer,
       ]}
     >
+      <View style={[styles.lineNumberGutter, { width: gutterWidth }]}>
+        <Text style={[
+          styles.lineNumberText,
+          line.type === "add" && styles.addLineNumberText,
+          line.type === "remove" && styles.removeLineNumberText,
+        ]}>
+          {lineNumber != null ? String(lineNumber) : ""}
+        </Text>
+      </View>
       {line.tokens && line.type !== "header" ? (
         <HighlightedText
           tokens={line.tokens}
@@ -280,10 +291,12 @@ const DiffFileHeader = memo(function DiffFileHeader({
 
 function DiffFileBody({
   file,
+  wrapLines,
   onBodyHeightChange,
   testID,
 }: {
   file: ParsedDiffFile;
+  wrapLines: boolean;
   onBodyHeightChange?: (path: string, height: number) => void;
   testID?: string;
 }) {
@@ -332,39 +345,86 @@ function DiffFileBody({
       }}
       testID={testID}
     >
-      {file.status === "too_large" || file.status === "binary" ? (
-        <View style={styles.statusMessageContainer}>
-          <Text style={styles.statusMessageText}>
-            {file.status === "binary" ? "Binary file" : "Diff too large to display"}
-          </Text>
-        </View>
-      ) : (
-        <ScrollView
-          ref={scrollViewRef}
-          horizontal
-          nestedScrollEnabled
-          showsHorizontalScrollIndicator
-          bounces={false}
-          style={styles.diffContent}
-          contentContainerStyle={styles.diffContentInner}
-          onScroll={handleScroll}
-          scrollEventThrottle={16}
-          onLayout={(e) => setScrollViewWidth(e.nativeEvent.layout.width)}
-          // When at left edge, wait for close gesture to fail before scrolling.
-          // The close gesture fails quickly on leftward swipes (failOffsetX=-10),
-          // so scrolling left works normally. On rightward swipes, close gesture
-          // activates and closes the sidebar.
-          waitFor={isAtLeftEdge && closeGestureRef?.current ? closeGestureRef : undefined}
-        >
-          <View style={[styles.linesContainer, scrollViewWidth > 0 && { minWidth: scrollViewWidth }]}>
-            {file.hunks.map((hunk, hunkIndex) =>
-              hunk.lines.map((line, lineIndex) => (
-                <DiffLineView key={`${hunkIndex}-${lineIndex}`} line={line} />
-              ))
-            )}
-          </View>
-        </ScrollView>
-      )}
+      {(() => {
+        if (file.status === "too_large" || file.status === "binary") {
+          return (
+            <View style={styles.statusMessageContainer}>
+              <Text style={styles.statusMessageText}>
+                {file.status === "binary" ? "Binary file" : "Diff too large to display"}
+              </Text>
+            </View>
+          );
+        }
+
+        const linesContent = (() => {
+          let maxLineNo = 0;
+          for (const hunk of file.hunks) {
+            maxLineNo = Math.max(maxLineNo, hunk.oldStart + hunk.oldCount, hunk.newStart + hunk.newCount);
+          }
+          const digitCount = Math.max(1, String(maxLineNo).length);
+          const gutterWidth = digitCount * 8 + 12;
+          return file.hunks.map((hunk, hunkIndex) => {
+            let oldLineNo = hunk.oldStart;
+            let newLineNo = hunk.newStart;
+            return hunk.lines.map((line, lineIndex) => {
+              let lineNumber: number | null = null;
+              if (line.type === "remove") {
+                lineNumber = oldLineNo;
+                oldLineNo++;
+              } else if (line.type === "add") {
+                lineNumber = newLineNo;
+                newLineNo++;
+              } else if (line.type === "context") {
+                lineNumber = newLineNo;
+                oldLineNo++;
+                newLineNo++;
+              }
+              return (
+                <DiffLineView
+                  key={`${hunkIndex}-${lineIndex}`}
+                  line={line}
+                  lineNumber={lineNumber}
+                  gutterWidth={gutterWidth}
+                />
+              );
+            });
+          });
+        })();
+
+        if (wrapLines) {
+          return (
+            <View style={styles.diffContent}>
+              <View style={styles.linesContainer}>
+                {linesContent}
+              </View>
+            </View>
+          );
+        }
+
+        return (
+          <ScrollView
+            ref={scrollViewRef}
+            horizontal
+            nestedScrollEnabled
+            showsHorizontalScrollIndicator
+            bounces={false}
+            style={styles.diffContent}
+            contentContainerStyle={styles.diffContentInner}
+            onScroll={handleScroll}
+            scrollEventThrottle={16}
+            onLayout={(e) => setScrollViewWidth(e.nativeEvent.layout.width)}
+            // When at left edge, wait for close gesture to fail before scrolling.
+            // The close gesture fails quickly on leftward swipes (failOffsetX=-10),
+            // so scrolling left works normally. On rightward swipes, close gesture
+            // activates and closes the sidebar.
+            waitFor={isAtLeftEdge && closeGestureRef?.current ? closeGestureRef : undefined}
+          >
+            <View style={[styles.linesContainer, scrollViewWidth > 0 && { minWidth: scrollViewWidth }]}>
+              {linesContent}
+            </View>
+          </ScrollView>
+        );
+      })()}
     </View>
   );
 }
@@ -390,6 +450,22 @@ export function GitDiffPane({ serverId, workspaceId, cwd, hideHeaderRow }: GitDi
   const [actionError, setActionError] = useState<string | null>(null);
   const [postShipArchiveSuggested, setPostShipArchiveSuggested] = useState(false);
   const [shipDefault, setShipDefault] = useState<"merge" | "pr">("merge");
+  const [wrapLines, setWrapLines] = useState(false);
+
+  useEffect(() => {
+    AsyncStorage.getItem("diff-wrap-lines").then((value) => {
+      if (value === "true") setWrapLines(true);
+    });
+  }, []);
+
+  const handleToggleWrapLines = useCallback(() => {
+    setWrapLines((prev) => {
+      const next = !prev;
+      AsyncStorage.setItem("diff-wrap-lines", String(next));
+      return next;
+    });
+  }, []);
+
   const { status, isLoading: isStatusLoading, isFetching: isStatusFetching, isError: isStatusError, error: statusError, refresh: refreshStatus } =
     useCheckoutStatusQuery({ serverId, cwd });
   const gitStatus = status && status.isGit ? status : null;
@@ -736,12 +812,13 @@ export function GitDiffPane({ serverId, workspaceId, cwd, hideHeaderRow }: GitDi
       return (
         <DiffFileBody
           file={item.file}
+          wrapLines={wrapLines}
           onBodyHeightChange={handleBodyHeightChange}
           testID={`diff-file-${item.fileIndex}-body`}
         />
       );
     },
-    [handleBodyHeightChange, handleHeaderHeightChange, handleToggleExpanded]
+    [handleBodyHeightChange, handleHeaderHeightChange, handleToggleExpanded, wrapLines]
   );
 
   const flatKeyExtractor = useCallback(
@@ -1018,19 +1095,48 @@ export function GitDiffPane({ serverId, workspaceId, cwd, hideHeaderRow }: GitDi
               </DropdownMenuContent>
             </DropdownMenu>
             {files.length > 0 ? (
-              <Pressable
-                style={({ hovered, pressed }) => [
-                  styles.expandAllButton,
-                  (hovered || pressed) && styles.diffStatusRowHovered,
-                ]}
-                onPress={handleToggleExpandAll}
-              >
-                {allExpanded ? (
-                  <ListChevronsDownUp size={14} color={theme.colors.foregroundMuted} />
-                ) : (
-                  <ListChevronsUpDown size={14} color={theme.colors.foregroundMuted} />
-                )}
-              </Pressable>
+              <View style={styles.diffStatusButtons}>
+                <Tooltip delayDuration={300}>
+                  <TooltipTrigger asChild>
+                    <Pressable
+                      style={({ hovered, pressed }) => [
+                        styles.expandAllButton,
+                        (hovered || pressed) && styles.diffStatusRowHovered,
+                      ]}
+                      onPress={handleToggleWrapLines}
+                    >
+                      <WrapText size={isMobile ? 18 : 14} color={theme.colors.foregroundMuted} />
+                    </Pressable>
+                  </TooltipTrigger>
+                  <TooltipContent side="bottom">
+                    <Text style={styles.tooltipText}>
+                      {wrapLines ? "Scroll long lines" : "Wrap long lines"}
+                    </Text>
+                  </TooltipContent>
+                </Tooltip>
+                <Tooltip delayDuration={300}>
+                  <TooltipTrigger asChild>
+                    <Pressable
+                      style={({ hovered, pressed }) => [
+                        styles.expandAllButton,
+                        (hovered || pressed) && styles.diffStatusRowHovered,
+                      ]}
+                      onPress={handleToggleExpandAll}
+                    >
+                      {allExpanded ? (
+                        <ListChevronsDownUp size={isMobile ? 18 : 14} color={theme.colors.foregroundMuted} />
+                      ) : (
+                        <ListChevronsUpDown size={isMobile ? 18 : 14} color={theme.colors.foregroundMuted} />
+                      )}
+                    </Pressable>
+                  </TooltipTrigger>
+                  <TooltipContent side="bottom">
+                    <Text style={styles.tooltipText}>
+                      {allExpanded ? "Collapse all files" : "Expand all files"}
+                    </Text>
+                  </TooltipContent>
+                </Tooltip>
+              </View>
             ) : null}
           </View>
         </View>
@@ -1125,13 +1231,30 @@ const styles = StyleSheet.create((theme) => ({
   diffStatusIconHidden: {
     opacity: 0,
   },
+  diffStatusButtons: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: {
+      xs: theme.spacing[1],
+      sm: theme.spacing[1],
+      md: 0,
+    },
+  },
   expandAllButton: {
     flexDirection: "row",
     alignItems: "center",
     gap: theme.spacing[1],
     marginVertical: theme.spacing[2],
-    paddingHorizontal: theme.spacing[1],
-    paddingVertical: theme.spacing[1],
+    paddingHorizontal: {
+      xs: theme.spacing[2],
+      sm: theme.spacing[2],
+      md: theme.spacing[1],
+    },
+    paddingVertical: {
+      xs: theme.spacing[2],
+      sm: theme.spacing[2],
+      md: theme.spacing[1],
+    },
     borderRadius: theme.borderRadius.base,
   },
   actionErrorText: {
@@ -1289,10 +1412,34 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface1,
   },
   diffLineContainer: {
-    paddingHorizontal: theme.spacing[3],
+    flexDirection: "row",
+    alignItems: "stretch",
+  },
+  lineNumberGutter: {
+    borderRightWidth: theme.borderWidth[1],
+    borderRightColor: theme.colors.border,
+    marginRight: theme.spacing[2],
+    alignSelf: "stretch",
+    justifyContent: "center",
+  },
+  lineNumberText: {
+    textAlign: "right",
+    paddingRight: theme.spacing[2],
     paddingVertical: theme.spacing[1],
+    fontSize: theme.fontSize.xs,
+    fontFamily: Fonts.mono,
+    color: theme.colors.foregroundMuted,
+  },
+  addLineNumberText: {
+    color: theme.colors.palette.green[400],
+  },
+  removeLineNumberText: {
+    color: theme.colors.palette.red[500],
   },
   diffLineText: {
+    flex: 1,
+    paddingRight: theme.spacing[3],
+    paddingVertical: theme.spacing[1],
     fontSize: theme.fontSize.xs,
     fontFamily: Fonts.mono,
     color: theme.colors.foreground,
@@ -1333,4 +1480,8 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foregroundMuted,
     fontStyle: "italic",
   },
+  tooltipText: {
+    fontSize: theme.fontSize.xs,
+    color: theme.colors.foreground,
+  },
 }));

packages/app/src/components/headers/screen-header.tsx

@@ -6,9 +6,9 @@ import {
   HEADER_INNER_HEIGHT,
   HEADER_INNER_HEIGHT_MOBILE,
   HEADER_TOP_PADDING_MOBILE,
-  getIsTauriMac,
+  getIsDesktopMac,
 } from "@/constants/layout";
-import { useTauriDragHandlers, useTrafficLightPadding } from "@/utils/tauri-window";
+import { useDesktopDragHandlers, useTrafficLightPadding } from "@/utils/desktop-window";
 import { usePanelStore } from "@/stores/panel-store";
 
 interface ScreenHeaderProps {
@@ -37,18 +37,20 @@ export function ScreenHeader({
   const topPadding = isMobile ? HEADER_TOP_PADDING_MOBILE : 0;
   const baseHorizontalPadding = theme.spacing[2];
   const collapsedSidebarTrafficLightInset =
-    !isMobile && !desktopAgentListOpen && getIsTauriMac()
+    !isMobile && !desktopAgentListOpen && getIsDesktopMac()
       ? trafficLightPadding.left
       : 0;
 
-  // On Tauri macOS, enable window dragging and double-click to maximize
-  const dragHandlers = useTauriDragHandlers();
+  const dragHandlers = useDesktopDragHandlers();
 
   return (
     <View style={styles.header}>
       <View style={[styles.inner, { paddingTop: insets.top + topPadding }]}>
         <View
-          style={[styles.row, { paddingLeft: baseHorizontalPadding + collapsedSidebarTrafficLightInset }]}
+          style={[
+            styles.row,
+            { paddingLeft: baseHorizontalPadding + collapsedSidebarTrafficLightInset },
+          ]}
           {...dragHandlers}
         >
           <View style={[styles.left, leftStyle]}>{left}</View>

packages/app/src/components/keyboard-shortcuts-dialog.tsx

@@ -1,7 +1,7 @@
 import { useMemo } from "react";
 import { Text, View } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
-import { getIsTauri } from "@/constants/layout";
+import { getIsDesktop } from "@/constants/layout";
 import { AdaptiveModalSheet } from "@/components/adaptive-modal-sheet";
 import { Shortcut } from "@/components/ui/shortcut";
 import { useKeyboardShortcutsStore } from "@/stores/keyboard-shortcuts-store";
@@ -13,10 +13,10 @@ export function KeyboardShortcutsDialog() {
   const setOpen = useKeyboardShortcutsStore((s) => s.setShortcutsDialogOpen);
 
   const isMac = getShortcutOs() === "mac";
-  const isTauri = getIsTauri();
+  const isDesktopApp = getIsDesktop();
   const sections = useMemo(
-    () => buildKeyboardShortcutHelpSections({ isMac, isTauri }),
-    [isMac, isTauri]
+    () => buildKeyboardShortcutHelpSections({ isMac, isDesktop: isDesktopApp }),
+    [isDesktopApp, isMac]
   );
 
   return (

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

@@ -1,4 +1,15 @@
-import { useCallback, useMemo, useState, useEffect, useRef, useSyncExternalStore } from 'react'
+import {
+  memo,
+  useCallback,
+  useMemo,
+  useState,
+  useEffect,
+  useRef,
+  useSyncExternalStore,
+  type Dispatch,
+  type RefObject,
+  type SetStateAction,
+} from 'react'
 import { View, Pressable, Text, Platform } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import Animated, {
@@ -11,14 +22,16 @@ import Animated, {
 import { Gesture, GestureDetector } from 'react-native-gesture-handler'
 import { StyleSheet, UnistylesRuntime, useUnistyles } from 'react-native-unistyles'
 import { MessagesSquare, Plus, Settings } from 'lucide-react-native'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
+import { Shortcut } from '@/components/ui/shortcut'
 import { router, usePathname } from 'expo-router'
 import { usePanelStore } from '@/stores/panel-store'
 import { SidebarWorkspaceList } from './sidebar-workspace-list'
 import { SidebarAgentListSkeleton } from './sidebar-agent-list-skeleton'
 import { useSidebarShortcutModel } from '@/hooks/use-sidebar-shortcut-model'
-import { useSidebarWorkspacesList } from '@/hooks/use-sidebar-workspaces-list'
+import { useSidebarWorkspacesList, type SidebarProjectEntry } from '@/hooks/use-sidebar-workspaces-list'
 import { useSidebarAnimation } from '@/contexts/sidebar-animation-context'
-import { useTauriDragHandlers, useTrafficLightPadding } from '@/utils/tauri-window'
+import { useDesktopDragHandlers, useTrafficLightPadding } from '@/utils/desktop-window'
 import { Combobox } from '@/components/ui/combobox'
 import { getHostRuntimeStore, useHosts } from '@/runtime/host-runtime'
 import { formatConnectionStatus } from '@/utils/daemons'
@@ -29,15 +42,61 @@ import {
   mapPathnameToServer,
   parseServerIdFromPathname,
 } from '@/utils/host-routes'
-import { useKeyboardShortcutsStore } from '@/stores/keyboard-shortcuts-store'
+import { useOpenProjectPicker } from '@/hooks/use-open-project-picker'
 
 const DESKTOP_SIDEBAR_WIDTH = 320
+type SidebarShortcutModel = ReturnType<typeof useSidebarShortcutModel>
+type SidebarTheme = ReturnType<typeof useUnistyles>['theme']
 
 interface LeftSidebarProps {
   selectedAgentId?: string
 }
 
-export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarProps) {
+interface HostOption {
+  id: string
+  label: string
+  description: string
+}
+
+interface SidebarSharedProps {
+  theme: SidebarTheme
+  activeServerId: string | null
+  activeHostLabel: string
+  activeHostStatusColor: string
+  hostOptions: HostOption[]
+  hostTriggerRef: RefObject<View | null>
+  isHostPickerOpen: boolean
+  setIsHostPickerOpen: Dispatch<SetStateAction<boolean>>
+  projects: SidebarProjectEntry[]
+  isInitialLoad: boolean
+  isRevalidating: boolean
+  isManualRefresh: boolean
+  collapsedProjectKeys: SidebarShortcutModel['collapsedProjectKeys']
+  shortcutIndexByWorkspaceKey: SidebarShortcutModel['shortcutIndexByWorkspaceKey']
+  toggleProjectCollapsed: SidebarShortcutModel['toggleProjectCollapsed']
+  setProjectCollapsed: SidebarShortcutModel['setProjectCollapsed']
+  handleRefresh: () => void
+  handleHostSelect: (nextServerId: string) => void
+  handleOpenProject: () => void
+  handleSettings: () => void
+}
+
+interface MobileSidebarProps extends SidebarSharedProps {
+  insetsTop: number
+  insetsBottom: number
+  isOpen: boolean
+  closeToAgent: () => void
+  handleViewMoreNavigate: () => void
+}
+
+interface DesktopSidebarProps extends SidebarSharedProps {
+  isOpen: boolean
+  handleViewMore: () => void
+}
+
+export const LeftSidebar = memo(function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarProps) {
+  void _selectedAgentId
+
   const { theme } = useUnistyles()
   const insets = useSafeAreaInsets()
   const isMobile = UnistylesRuntime.breakpoint === 'xs' || UnistylesRuntime.breakpoint === 'sm'
@@ -107,33 +166,18 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
       })),
     [daemons, runtime, runtimeConnectionStatusSignature]
   )
-  const hostTriggerRef = useRef<View>(null)
+  const hostTriggerRef = useRef<View | null>(null)
   const [isHostPickerOpen, setIsHostPickerOpen] = useState(false)
 
-  // Derive isOpen from the unified panel state
   const isOpen = isMobile ? mobileView === 'agent-list' : desktopAgentListOpen
 
   const { projects, isInitialLoad, isRevalidating, refreshAll } = useSidebarWorkspacesList({
     serverId: activeServerId,
     enabled: isOpen,
   })
-  const { collapsedProjectKeys, shortcutIndexByWorkspaceKey, toggleProjectCollapsed } =
+  const { collapsedProjectKeys, shortcutIndexByWorkspaceKey, toggleProjectCollapsed, setProjectCollapsed } =
     useSidebarShortcutModel(projects)
-  const {
-    translateX,
-    backdropOpacity,
-    windowWidth,
-    animateToOpen,
-    animateToClose,
-    isGesturing,
-    closeGestureRef,
-  } = useSidebarAnimation()
-  const dragHandlers = useTauriDragHandlers()
-  const trafficLightPadding = useTrafficLightPadding()
-  const closeTouchStartX = useSharedValue(0)
-  const closeTouchStartY = useSharedValue(0)
 
-  // Track user-initiated refresh to avoid showing spinner on background revalidation
   const [isManualRefresh, setIsManualRefresh] = useState(false)
 
   const handleRefresh = useCallback(() => {
@@ -141,29 +185,23 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
     refreshAll()
   }, [refreshAll])
 
-  // Reset manual refresh flag when revalidation completes
   useEffect(() => {
     if (!isRevalidating && isManualRefresh) {
       setIsManualRefresh(false)
     }
   }, [isRevalidating, isManualRefresh])
 
-  const handleClose = useCallback(() => {
-    closeToAgent()
-  }, [closeToAgent])
-
-  const setProjectPickerOpen = useKeyboardShortcutsStore((s) => s.setProjectPickerOpen)
+  const openProjectPicker = useOpenProjectPicker(activeServerId)
 
   const handleOpenProjectMobile = useCallback(() => {
     closeToAgent()
-    setProjectPickerOpen(true)
-  }, [closeToAgent, setProjectPickerOpen])
+    void openProjectPicker()
+  }, [closeToAgent, openProjectPicker])
 
   const handleOpenProjectDesktop = useCallback(() => {
-    setProjectPickerOpen(true)
-  }, [setProjectPickerOpen])
+    void openProjectPicker()
+  }, [openProjectPicker])
 
-  // Mobile: close sidebar and navigate
   const handleSettingsMobile = useCallback(() => {
     if (!activeServerId) {
       return
@@ -172,7 +210,6 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
     router.push(buildHostSettingsRoute(activeServerId) as any)
   }, [activeServerId, closeToAgent])
 
-  // Desktop: just navigate, don't close
   const handleSettingsDesktop = useCallback(() => {
     if (!activeServerId) {
       return
@@ -180,17 +217,12 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
     router.push(buildHostSettingsRoute(activeServerId) as any)
   }, [activeServerId])
 
-  const handleViewMore = useCallback(() => {
+  const handleViewMoreNavigate = useCallback(() => {
     if (!activeServerId) {
       return
     }
-    if (isMobile) {
-      translateX.value = -windowWidth
-      backdropOpacity.value = 0
-      closeToAgent()
-    }
     router.push(buildHostAgentsRoute(activeServerId) as any)
-  }, [activeServerId, backdropOpacity, closeToAgent, isMobile, translateX, windowWidth])
+  }, [activeServerId])
 
   const handleHostSelect = useCallback(
     (nextServerId: string) => {
@@ -204,77 +236,201 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
     [pathname]
   )
 
-  // Close gesture (swipe left to close when sidebar is open)
-  const closeGesture = Gesture.Pan()
-    .withRef(closeGestureRef)
-    .enabled(isOpen)
-    // Use manual activation so child views keep touch streams unless we detect
-    // an intentional left-swipe close (mirrors explorer-sidebar pattern).
-    .manualActivation(true)
-    .onTouchesDown((event) => {
-      const touch = event.changedTouches[0]
-      if (!touch) {
-        return
-      }
-      closeTouchStartX.value = touch.absoluteX
-      closeTouchStartY.value = touch.absoluteY
-    })
-    .onTouchesMove((event, stateManager) => {
-      const touch = event.changedTouches[0]
-      if (!touch || event.numberOfTouches !== 1) {
-        stateManager.fail()
-        return
-      }
+  const sharedProps = {
+    theme,
+    activeServerId,
+    activeHostLabel,
+    activeHostStatusColor,
+    hostOptions,
+    hostTriggerRef,
+    isHostPickerOpen,
+    setIsHostPickerOpen,
+    projects,
+    isInitialLoad,
+    isRevalidating,
+    isManualRefresh,
+    collapsedProjectKeys,
+    shortcutIndexByWorkspaceKey,
+    toggleProjectCollapsed,
+    setProjectCollapsed,
+    handleRefresh,
+    handleHostSelect,
+  }
 
-      const deltaX = touch.absoluteX - closeTouchStartX.value
-      const deltaY = touch.absoluteY - closeTouchStartY.value
-      const absDeltaX = Math.abs(deltaX)
-      const absDeltaY = Math.abs(deltaY)
+  if (isMobile) {
+    return (
+      <MobileSidebar
+        {...sharedProps}
+        insetsTop={insets.top}
+        insetsBottom={insets.bottom}
+        isOpen={isOpen}
+        closeToAgent={closeToAgent}
+        handleOpenProject={handleOpenProjectMobile}
+        handleSettings={handleSettingsMobile}
+        handleViewMoreNavigate={handleViewMoreNavigate}
+      />
+    )
+  }
 
-      // Fail quickly on clear rightward or vertical intent so child views keep control.
-      if (deltaX >= 10) {
-        stateManager.fail()
-        return
-      }
-      if (absDeltaY > 10 && absDeltaY > absDeltaX) {
-        stateManager.fail()
-        return
-      }
+  return (
+    <DesktopSidebar
+      {...sharedProps}
+      isOpen={isOpen}
+      handleOpenProject={handleOpenProjectDesktop}
+      handleSettings={handleSettingsDesktop}
+      handleViewMore={handleViewMoreNavigate}
+    />
+  )
+})
 
-      // Activate only on intentional leftward movement.
-      if (deltaX <= -15 && absDeltaX > absDeltaY) {
-        stateManager.activate()
-      }
-    })
-    .onStart(() => {
-      isGesturing.value = true
-    })
-    .onUpdate((event) => {
-      if (!isMobile) return
-      // Only allow swiping left (closing)
-      const newTranslateX = Math.min(0, Math.max(-windowWidth, event.translationX))
-      translateX.value = newTranslateX
-      backdropOpacity.value = interpolate(
-        newTranslateX,
-        [-windowWidth, 0],
-        [0, 1],
-        Extrapolation.CLAMP
-      )
-    })
-    .onEnd((event) => {
-      isGesturing.value = false
-      if (!isMobile) return
-      const shouldClose = event.translationX < -windowWidth / 3 || event.velocityX < -500
-      if (shouldClose) {
-        animateToClose()
-        runOnJS(handleClose)()
-      } else {
-        animateToOpen()
-      }
-    })
-    .onFinalize(() => {
-      isGesturing.value = false
-    })
+function MobileSidebar({
+  theme,
+  activeServerId,
+  activeHostLabel,
+  activeHostStatusColor,
+  hostOptions,
+  hostTriggerRef,
+  isHostPickerOpen,
+  setIsHostPickerOpen,
+  projects,
+  isInitialLoad,
+  isRevalidating,
+  isManualRefresh,
+  collapsedProjectKeys,
+  shortcutIndexByWorkspaceKey,
+  toggleProjectCollapsed,
+  setProjectCollapsed,
+  handleRefresh,
+  handleHostSelect,
+  handleOpenProject,
+  handleSettings,
+  insetsTop,
+  insetsBottom,
+  isOpen,
+  closeToAgent,
+  handleViewMoreNavigate,
+}: MobileSidebarProps) {
+  const {
+    translateX,
+    backdropOpacity,
+    windowWidth,
+    animateToOpen,
+    animateToClose,
+    isGesturing,
+    closeGestureRef,
+  } = useSidebarAnimation()
+  const closeTouchStartX = useSharedValue(0)
+  const closeTouchStartY = useSharedValue(0)
+
+  const handleClose = useCallback(() => {
+    closeToAgent()
+  }, [closeToAgent])
+
+  const handleViewMore = useCallback(() => {
+    if (!activeServerId) {
+      return
+    }
+    translateX.value = -windowWidth
+    backdropOpacity.value = 0
+    closeToAgent()
+    handleViewMoreNavigate()
+  }, [
+    activeServerId,
+    backdropOpacity,
+    closeToAgent,
+    handleViewMoreNavigate,
+    translateX,
+    windowWidth,
+  ])
+
+  const closeGesture = useMemo(
+    () =>
+      Gesture.Pan()
+        .withRef(closeGestureRef)
+        .enabled(isOpen)
+        .manualActivation(true)
+        .onTouchesDown((event) => {
+          const touch = event.changedTouches[0]
+          if (!touch) {
+            return
+          }
+          closeTouchStartX.value = touch.absoluteX
+          closeTouchStartY.value = touch.absoluteY
+        })
+        .onTouchesMove((event, stateManager) => {
+          const touch = event.changedTouches[0]
+          if (!touch || event.numberOfTouches !== 1) {
+            stateManager.fail()
+            return
+          }
+
+          const deltaX = touch.absoluteX - closeTouchStartX.value
+          const deltaY = touch.absoluteY - closeTouchStartY.value
+          const absDeltaX = Math.abs(deltaX)
+          const absDeltaY = Math.abs(deltaY)
+
+          if (deltaX >= 10) {
+            stateManager.fail()
+            return
+          }
+          if (absDeltaY > 10 && absDeltaY > absDeltaX) {
+            stateManager.fail()
+            return
+          }
+          if (deltaX <= -15 && absDeltaX > absDeltaY) {
+            stateManager.activate()
+          }
+        })
+        .onStart(() => {
+          isGesturing.value = true
+        })
+        .onUpdate((event) => {
+          const newTranslateX = Math.min(0, Math.max(-windowWidth, event.translationX))
+          translateX.value = newTranslateX
+          backdropOpacity.value = interpolate(
+            newTranslateX,
+            [-windowWidth, 0],
+            [0, 1],
+            Extrapolation.CLAMP
+          )
+        })
+        .onEnd((event) => {
+          isGesturing.value = false
+          const shouldClose = event.translationX < -windowWidth / 3 || event.velocityX < -500
+          if (shouldClose) {
+            animateToClose()
+            runOnJS(handleClose)()
+          } else {
+            animateToOpen()
+          }
+        })
+        .onFinalize(() => {
+          isGesturing.value = false
+        }),
+    [
+      isOpen,
+      closeGestureRef,
+      closeTouchStartX,
+      closeTouchStartY,
+      isGesturing,
+      windowWidth,
+      translateX,
+      backdropOpacity,
+      animateToClose,
+      animateToOpen,
+      handleClose,
+    ]
+  )
+
+  const mobileSidebarInsetStyle = useMemo(
+    () => ({ width: windowWidth, paddingTop: insetsTop, paddingBottom: insetsBottom }),
+    [windowWidth, insetsTop, insetsBottom]
+  )
+
+  const hostStatusDotStyle = useMemo(
+    () => [styles.hostStatusDot, { backgroundColor: activeHostStatusColor }],
+    [activeHostStatusColor]
+  )
 
   const sidebarAnimatedStyle = useAnimatedStyle(() => ({
     transform: [{ translateX: translateX.value }],
@@ -285,149 +441,177 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
     pointerEvents: backdropOpacity.value > 0.01 ? 'auto' : 'none',
   }))
 
-  // Render mobile sidebar
-  // On web, keep the overlay interactive only while the sidebar is open.
-  // This preserves swipe/scroll behavior without blocking taps when closed.
   const overlayPointerEvents = Platform.OS === 'web' ? (isOpen ? 'auto' : 'none') : 'box-none'
-  if (isMobile) {
-    return (
-      <View style={StyleSheet.absoluteFillObject} pointerEvents={overlayPointerEvents}>
-        {/* Backdrop */}
-        <Animated.View style={[styles.backdrop, backdropAnimatedStyle]}>
-          <Pressable style={styles.backdropPressable} onPress={handleClose} />
-        </Animated.View>
 
-        <GestureDetector gesture={closeGesture} touchAction="pan-y">
-          <Animated.View
-            style={[
-              styles.mobileSidebar,
-              { width: windowWidth, paddingTop: insets.top, paddingBottom: insets.bottom },
-              sidebarAnimatedStyle,
-            ]}
-            pointerEvents="auto"
-          >
-            <View style={styles.sidebarContent} pointerEvents="auto">
-              {/* Header */}
-              <View style={styles.sidebarHeader}>
-                <View style={styles.sidebarHeaderRow}>
-                  <Pressable
-                    style={styles.newAgentButton}
-                    testID="sidebar-new-agent"
-                    onPress={handleOpenProjectMobile}
-                  >
-                    {({ hovered }) => (
-                      <>
-                        <Plus
-                          size={theme.iconSize.md}
-                          color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
-                        />
-                        <Text
-                          style={[
-                            styles.newAgentButtonText,
-                            hovered && styles.newAgentButtonTextHovered,
-                          ]}
-                        >
-                          Add project
-                        </Text>
-                      </>
-                    )}
-                  </Pressable>
-                </View>
-              </View>
+  return (
+    <View style={StyleSheet.absoluteFillObject} pointerEvents={overlayPointerEvents}>
+      <Animated.View style={[styles.backdrop, backdropAnimatedStyle]}>
+        <Pressable style={styles.backdropPressable} onPress={handleClose} />
+      </Animated.View>
 
-              {/* Middle: scrollable project/workspace tree */}
-              {isInitialLoad ? (
-                <SidebarAgentListSkeleton />
-              ) : (
-                <SidebarWorkspaceList
-                  serverId={activeServerId}
-                  collapsedProjectKeys={collapsedProjectKeys}
-                  onToggleProjectCollapsed={toggleProjectCollapsed}
-                  shortcutIndexByWorkspaceKey={shortcutIndexByWorkspaceKey}
-                  projects={projects}
-                  isRefreshing={isManualRefresh && isRevalidating}
-                  onRefresh={handleRefresh}
-                  onWorkspacePress={closeToAgent}
-                  parentGestureRef={closeGestureRef}
-                />
-              )}
-
-              {/* Footer */}
-              <View style={styles.sidebarFooter}>
-                <View style={styles.footerHostSlot}>
-                  <Pressable
-                    ref={hostTriggerRef}
-                    style={({ hovered = false }) => [
-                      styles.hostTrigger,
-                      hovered && styles.hostTriggerHovered,
-                    ]}
-                    onPress={() => setIsHostPickerOpen(true)}
-                    disabled={hostOptions.length === 0}
-                  >
-                    <View
-                      style={[styles.hostStatusDot, { backgroundColor: activeHostStatusColor }]}
-                    />
-                    <Text style={styles.hostTriggerText} numberOfLines={1}>
-                      {activeHostLabel}
-                    </Text>
-                  </Pressable>
-                </View>
-                <View style={styles.footerIconRow}>
-                  <Pressable
-                    style={styles.footerIconButton}
-                    testID="sidebar-all-agents"
-                    nativeID="sidebar-all-agents"
-                    collapsable={false}
-                    accessible
-                    accessibilityLabel="Sessions"
-                    accessibilityRole="button"
-                    onPress={handleViewMore}
-                  >
-                    {({ hovered }) => (
+      <GestureDetector gesture={closeGesture} touchAction="pan-y">
+        <Animated.View
+          style={[styles.mobileSidebar, mobileSidebarInsetStyle, sidebarAnimatedStyle]}
+          pointerEvents="auto"
+        >
+          <View style={styles.sidebarContent} pointerEvents="auto">
+            <View style={styles.sidebarHeader}>
+              <View style={styles.sidebarHeaderRow}>
+                <Pressable
+                  style={styles.newAgentButton}
+                  testID="sidebar-sessions"
+                  accessible
+                  accessibilityRole="button"
+                  accessibilityLabel="Sessions"
+                  onPress={handleViewMore}
+                >
+                  {({ hovered }) => (
+                    <>
                       <MessagesSquare
-                        size={theme.iconSize.lg}
+                        size={theme.iconSize.md}
                         color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
                       />
-                    )}
-                  </Pressable>
-                  <Pressable
-                    style={styles.footerIconButton}
-                    testID="sidebar-settings"
-                    nativeID="sidebar-settings"
-                    collapsable={false}
-                    accessible
-                    accessibilityLabel="Settings"
-                    accessibilityRole="button"
-                    onPress={handleSettingsMobile}
-                  >
-                    {({ hovered }) => (
-                      <Settings
-                        size={theme.iconSize.lg}
-                        color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
-                      />
-                    )}
-                  </Pressable>
-                </View>
-                <Combobox
-                  options={hostOptions}
-                  value={activeServerId ?? ''}
-                  onSelect={handleHostSelect}
-                  searchable={false}
-                  title="Switch host"
-                  searchPlaceholder="Search hosts..."
-                  open={isHostPickerOpen}
-                  onOpenChange={setIsHostPickerOpen}
-                  anchorRef={hostTriggerRef}
-                />
+                      <Text
+                        style={[styles.newAgentButtonText, hovered && styles.newAgentButtonTextHovered]}
+                      >
+                        Sessions
+                      </Text>
+                    </>
+                  )}
+                </Pressable>
               </View>
             </View>
-          </Animated.View>
-        </GestureDetector>
-      </View>
-    )
-  }
 
-  // Desktop: no edge swipe, just show/hide based on isOpen
+            {isInitialLoad ? (
+              <SidebarAgentListSkeleton />
+            ) : (
+              <SidebarWorkspaceList
+                serverId={activeServerId}
+                collapsedProjectKeys={collapsedProjectKeys}
+                onToggleProjectCollapsed={toggleProjectCollapsed}
+                onSetProjectCollapsed={setProjectCollapsed}
+                shortcutIndexByWorkspaceKey={shortcutIndexByWorkspaceKey}
+                projects={projects}
+                isRefreshing={isManualRefresh && isRevalidating}
+                onRefresh={handleRefresh}
+                onWorkspacePress={closeToAgent}
+                parentGestureRef={closeGestureRef}
+              />
+            )}
+
+            <View style={styles.sidebarFooter}>
+              <View style={styles.footerHostSlot}>
+                <Pressable
+                  ref={hostTriggerRef}
+                  style={({ hovered = false }) => [
+                    styles.hostTrigger,
+                    hovered && styles.hostTriggerHovered,
+                  ]}
+                  onPress={() => setIsHostPickerOpen(true)}
+                  disabled={hostOptions.length === 0}
+                >
+                  <View style={hostStatusDotStyle} />
+                  <Text style={styles.hostTriggerText} numberOfLines={1}>
+                    {activeHostLabel}
+                  </Text>
+                </Pressable>
+              </View>
+              <View style={styles.footerIconRow}>
+                <Tooltip delayDuration={300}>
+                  <TooltipTrigger asChild>
+                    <Pressable
+                      style={styles.footerIconButton}
+                      testID="sidebar-add-project"
+                      nativeID="sidebar-add-project"
+                      collapsable={false}
+                      accessible
+                      accessibilityLabel="Add project"
+                      accessibilityRole="button"
+                      onPress={handleOpenProject}
+                    >
+                      {({ hovered }) => (
+                        <Plus
+                          size={theme.iconSize.lg}
+                          color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
+                        />
+                      )}
+                    </Pressable>
+                  </TooltipTrigger>
+                  <TooltipContent side="top" align="center" offset={8}>
+                    <View style={styles.tooltipRow}>
+                      <Text style={styles.tooltipText}>Add project</Text>
+                      <Shortcut keys={['⌘', '⇧', 'O']} />
+                    </View>
+                  </TooltipContent>
+                </Tooltip>
+                <Pressable
+                  style={styles.footerIconButton}
+                  testID="sidebar-settings"
+                  nativeID="sidebar-settings"
+                  collapsable={false}
+                  accessible
+                  accessibilityLabel="Settings"
+                  accessibilityRole="button"
+                  onPress={handleSettings}
+                >
+                  {({ hovered }) => (
+                    <Settings
+                      size={theme.iconSize.lg}
+                      color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
+                    />
+                  )}
+                </Pressable>
+              </View>
+              <Combobox
+                options={hostOptions}
+                value={activeServerId ?? ''}
+                onSelect={handleHostSelect}
+                searchable={false}
+                title="Switch host"
+                searchPlaceholder="Search hosts..."
+                open={isHostPickerOpen}
+                onOpenChange={setIsHostPickerOpen}
+                anchorRef={hostTriggerRef}
+              />
+            </View>
+          </View>
+        </Animated.View>
+      </GestureDetector>
+    </View>
+  )
+}
+
+function DesktopSidebar({
+  theme,
+  activeServerId,
+  activeHostLabel,
+  activeHostStatusColor,
+  hostOptions,
+  hostTriggerRef,
+  isHostPickerOpen,
+  setIsHostPickerOpen,
+  projects,
+  isInitialLoad,
+  isRevalidating,
+  isManualRefresh,
+  collapsedProjectKeys,
+  shortcutIndexByWorkspaceKey,
+  toggleProjectCollapsed,
+  setProjectCollapsed,
+  handleRefresh,
+  handleHostSelect,
+  handleOpenProject,
+  handleSettings,
+  isOpen,
+  handleViewMore,
+}: DesktopSidebarProps) {
+  const dragHandlers = useDesktopDragHandlers()
+  const trafficLightPadding = useTrafficLightPadding()
+  const hostStatusDotStyle = useMemo(
+    () => [styles.hostStatusDot, { backgroundColor: activeHostStatusColor }],
+    [activeHostStatusColor]
+  )
+
   if (!isOpen) {
     return null
   }
@@ -441,19 +625,22 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
         <View style={styles.sidebarHeaderRow}>
           <Pressable
             style={styles.newAgentButton}
-            testID="sidebar-new-agent"
-            onPress={handleOpenProjectDesktop}
+            testID="sidebar-sessions"
+            accessible
+            accessibilityRole="button"
+            accessibilityLabel="Sessions"
+            onPress={handleViewMore}
           >
             {({ hovered }) => (
               <>
-                <Plus
+                <MessagesSquare
                   size={theme.iconSize.md}
                   color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
                 />
                 <Text
                   style={[styles.newAgentButtonText, hovered && styles.newAgentButtonTextHovered]}
                 >
-                  Add project
+                  Sessions
                 </Text>
               </>
             )}
@@ -461,7 +648,6 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
         </View>
       </View>
 
-      {/* Middle: scrollable project/workspace tree */}
       {isInitialLoad ? (
         <SidebarAgentListSkeleton />
       ) : (
@@ -469,6 +655,7 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
           serverId={activeServerId}
           collapsedProjectKeys={collapsedProjectKeys}
           onToggleProjectCollapsed={toggleProjectCollapsed}
+          onSetProjectCollapsed={setProjectCollapsed}
           shortcutIndexByWorkspaceKey={shortcutIndexByWorkspaceKey}
           projects={projects}
           isRefreshing={isManualRefresh && isRevalidating}
@@ -476,7 +663,6 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
         />
       )}
 
-      {/* Footer */}
       <View style={styles.sidebarFooter}>
         <View style={styles.footerHostSlot}>
           <Pressable
@@ -488,30 +674,40 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
             onPress={() => setIsHostPickerOpen(true)}
             disabled={hostOptions.length === 0}
           >
-            <View style={[styles.hostStatusDot, { backgroundColor: activeHostStatusColor }]} />
+            <View style={hostStatusDotStyle} />
             <Text style={styles.hostTriggerText} numberOfLines={1}>
               {activeHostLabel}
             </Text>
           </Pressable>
         </View>
         <View style={styles.footerIconRow}>
-          <Pressable
-            style={styles.footerIconButton}
-            testID="sidebar-all-agents"
-            nativeID="sidebar-all-agents"
-            collapsable={false}
-            accessible
-            accessibilityLabel="Sessions"
-            accessibilityRole="button"
-            onPress={handleViewMore}
-          >
-            {({ hovered }) => (
-              <MessagesSquare
-                size={theme.iconSize.lg}
-                color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
-              />
-            )}
-          </Pressable>
+          <Tooltip delayDuration={300}>
+            <TooltipTrigger asChild>
+              <Pressable
+                style={styles.footerIconButton}
+                testID="sidebar-add-project"
+                nativeID="sidebar-add-project"
+                collapsable={false}
+                accessible
+                accessibilityLabel="Add project"
+                accessibilityRole="button"
+                onPress={handleOpenProject}
+              >
+                {({ hovered }) => (
+                  <Plus
+                    size={theme.iconSize.lg}
+                    color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted}
+                  />
+                )}
+              </Pressable>
+            </TooltipTrigger>
+            <TooltipContent side="top" align="center" offset={8}>
+              <View style={styles.tooltipRow}>
+                <Text style={styles.tooltipText}>Add project</Text>
+                <Shortcut keys={['⌘', '⇧', 'O']} />
+              </View>
+            </TooltipContent>
+          </Tooltip>
           <Pressable
             style={styles.footerIconButton}
             testID="sidebar-settings"
@@ -520,7 +716,7 @@ export function LeftSidebar({ selectedAgentId: _selectedAgentId }: LeftSidebarPr
             accessible
             accessibilityLabel="Settings"
             accessibilityRole="button"
-            onPress={handleSettingsDesktop}
+            onPress={handleSettings}
           >
             {({ hovered }) => (
               <Settings
@@ -594,7 +790,8 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: 'center',
     gap: theme.spacing[2],
     paddingVertical: theme.spacing[1],
-    paddingHorizontal: theme.spacing[1],
+    paddingRight: theme.spacing[1],
+    paddingLeft: theme.spacing[3],
     flexShrink: 0,
   },
   newAgentButtonHovered: {},
@@ -615,12 +812,9 @@ const styles = StyleSheet.create((theme) => ({
     paddingVertical: theme.spacing[1],
     paddingHorizontal: theme.spacing[2],
     borderRadius: theme.borderRadius.lg,
-    borderWidth: 1,
-    borderColor: theme.colors.border,
-    backgroundColor: theme.colors.surface1,
   },
   hostTriggerHovered: {
-    borderColor: theme.colors.borderAccent,
+    backgroundColor: theme.colors.surface1,
   },
   hostStatusDot: {
     width: 8,
@@ -690,4 +884,13 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foregroundMuted,
     fontSize: theme.fontSize.sm,
   },
+  tooltipRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: theme.spacing[2],
+  },
+  tooltipText: {
+    fontSize: theme.fontSize.sm,
+    color: theme.colors.popoverForeground,
+  },
 }))

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

@@ -212,6 +212,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
   ref
 ) {
   const { theme } = useUnistyles()
+  const buttonIconSize = IS_WEB ? theme.iconSize.md : theme.iconSize.lg
   const investigationComponentId = `MessageInput:${voiceServerId ?? 'unknown-server'}:${voiceAgentId ?? 'unknown-agent'}`
   markScrollInvestigationRender(investigationComponentId)
   const toast = useToast()
@@ -950,7 +951,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
                     (!isConnected || disabled) && styles.buttonDisabled,
                   ]}
                 >
-                  <Paperclip size={theme.iconSize.md} color={theme.colors.foreground} />
+                  <Paperclip size={buttonIconSize} color={theme.colors.foreground} />
                 </TooltipTrigger>
                 <TooltipContent side="top" align="center" offset={8}>
                   <Text style={styles.tooltipText}>Attach images</Text>
@@ -984,11 +985,11 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
                 ]}
               >
                 {isDictating ? (
-                  <Square size={theme.iconSize.md} color="white" fill="white" />
+                  <Square size={buttonIconSize} color="white" fill="white" />
                 ) : isRealtimeVoiceForCurrentAgent && voice?.isMuted ? (
-                  <MicOff size={theme.iconSize.md} color={theme.colors.foreground} />
+                  <MicOff size={buttonIconSize} color={theme.colors.foreground} />
                 ) : (
-                  <Mic size={theme.iconSize.md} color={theme.colors.foreground} />
+                  <Mic size={buttonIconSize} color={theme.colors.foreground} />
                 )}
               </TooltipTrigger>
               <TooltipContent side="top" align="center" offset={8}>
@@ -1021,7 +1022,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
                     (!isConnected || disabled) && styles.buttonDisabled,
                   ]}
                 >
-                  <Plus size={theme.iconSize.md} color="white" />
+                  <Plus size={buttonIconSize} color="white" />
                 </TooltipTrigger>
                 <TooltipContent side="top" align="center" offset={8}>
                   <View style={styles.tooltipRow}>
@@ -1043,7 +1044,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
                   {isSubmitLoading ? (
                     <ActivityIndicator size="small" color="white" />
                   ) : (
-                    <ArrowUp size={theme.iconSize.md} color="white" />
+                    <ArrowUp size={buttonIconSize} color="white" />
                   )}
                 </TooltipTrigger>
                 <TooltipContent side="top" align="center" offset={8}>
@@ -1184,12 +1185,12 @@ const styles = StyleSheet.create(((theme: any) => ({
   leftButtonGroup: {
     flexDirection: 'row',
     alignItems: 'flex-end',
-    gap: theme.spacing[2],
+    gap: Platform.OS === 'web' ? theme.spacing[2] : theme.spacing[1],
   },
   rightButtonGroup: {
     flexDirection: 'row',
     alignItems: 'center',
-    gap: theme.spacing[2],
+    gap: Platform.OS === 'web' ? theme.spacing[2] : theme.spacing[1],
   },
   attachButton: {
     width: 28,

packages/app/src/components/message.tsx

@@ -759,6 +759,13 @@ export const AssistantMessage = memo(function AssistantMessage({
   workspaceRoot,
   disableOuterSpacing,
 }: AssistantMessageProps) {
+  // DEBUG: log when AssistantMessage actually renders (inside memo boundary)
+  console.log("[AssistantMessage] render", {
+    messageLength: message?.length,
+    timestamp,
+    hasOnInlinePathPress: !!onInlinePathPress,
+  });
+
   const { theme, rt } = useUnistyles();
   const resolvedDisableOuterSpacing =
     useDisableOuterSpacing(disableOuterSpacing);
@@ -1918,6 +1925,9 @@ export const ToolCall = memo(function ToolCall({
   onInlineDetailsHoverChange,
   onInlineDetailsExpandedChange,
 }: ToolCallProps) {
+  // DEBUG: log when ToolCall actually renders (inside memo boundary)
+  console.log("[ToolCall] render", { toolName, status });
+
   const { openToolCall } = useToolCallSheet();
   const [isExpanded, setIsExpanded] = useState(false);
 

packages/app/src/components/project-picker-modal.tsx

@@ -11,22 +11,17 @@ import {
 import { Folder } from "lucide-react-native";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { useQuery } from "@tanstack/react-query";
-import { router, usePathname } from "expo-router";
+import { usePathname } from "expo-router";
 import { useKeyboardShortcutsStore } from "@/stores/keyboard-shortcuts-store";
 import { shortenPath } from "@/utils/shorten-path";
-import {
-  normalizeWorkspaceDescriptor,
-  useSessionStore,
-} from "@/stores/session-store";
-import { useHosts, useHostRuntimeSession } from "@/runtime/host-runtime";
-import { useToast } from "@/contexts/toast-context";
+import { useSessionStore } from "@/stores/session-store";
+import { useHosts, useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
+import { useOpenProject } from "@/hooks/use-open-project";
 import { parseServerIdFromPathname } from "@/utils/host-routes";
-import { buildHostWorkspaceRouteWithOpenIntent } from "@/utils/host-routes";
 import { buildWorkingDirectorySuggestions } from "@/utils/working-directory-suggestions";
 
 export function ProjectPickerModal() {
   const { theme } = useUnistyles();
-  const toast = useToast();
   const pathname = usePathname();
   const daemons = useHosts();
 
@@ -39,19 +34,17 @@ export function ProjectPickerModal() {
     return daemons[0]?.serverId ?? null;
   }, [pathname, daemons]);
 
-  const { client, isConnected } = useHostRuntimeSession(serverId ?? "");
+  const client = useHostRuntimeClient(serverId ?? "");
+  const isConnected = useHostRuntimeIsConnected(serverId ?? "");
   const workspaces = useSessionStore((state) =>
     serverId ? state.sessions[serverId]?.workspaces : undefined
   );
-  const mergeWorkspaces = useSessionStore((state) => state.mergeWorkspaces);
-  const setHasHydratedWorkspaces = useSessionStore(
-    (state) => state.setHasHydratedWorkspaces
-  );
 
   const inputRef = useRef<TextInput>(null);
   const [query, setQuery] = useState("");
   const [activeIndex, setActiveIndex] = useState(0);
   const [isSubmitting, setIsSubmitting] = useState(false);
+  const openProject = useOpenProject(serverId);
 
   const recommendedPaths = useMemo(() => {
     if (!workspaces) return [];
@@ -102,31 +95,15 @@ export function ProjectPickerModal() {
 
       setIsSubmitting(true);
       try {
-        const payload = await client.openProject(trimmed);
-        if (payload.error || !payload.workspace) {
-          throw new Error(payload.error || "Failed to open project");
+        const didOpenProject = await openProject(trimmed);
+        if (didOpenProject) {
+          setOpen(false);
         }
-        mergeWorkspaces(serverId, [
-          normalizeWorkspaceDescriptor(payload.workspace),
-        ]);
-        setHasHydratedWorkspaces(serverId, true);
-        setOpen(false);
-        router.replace(
-          buildHostWorkspaceRouteWithOpenIntent(
-            serverId,
-            payload.workspace.id,
-            { kind: "draft", draftId: "new" }
-          ) as any
-        );
-      } catch (error) {
-        toast.error(
-          error instanceof Error ? error.message : "Failed to open project"
-        );
       } finally {
         setIsSubmitting(false);
       }
     },
-    [client, mergeWorkspaces, serverId, setHasHydratedWorkspaces, setOpen, toast]
+    [client, openProject, serverId, setOpen]
   );
 
   const handleSubmitCustom = useCallback(() => {

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

@@ -25,18 +25,17 @@ import { navigateToWorkspace } from '@/hooks/use-workspace-navigation'
 import { StyleSheet, UnistylesRuntime, useUnistyles } from 'react-native-unistyles'
 import { type GestureType } from 'react-native-gesture-handler'
 import * as Clipboard from 'expo-clipboard'
-import { Archive, ChevronDown, ChevronRight, Copy, MoreVertical, Plus } from 'lucide-react-native'
+import { Archive, Check, ChevronDown, ChevronRight, CircleHelp, Copy, FolderGit2, Monitor, MoreVertical, Plus } from 'lucide-react-native'
 import { NestableScrollContainer } from 'react-native-draggable-flatlist'
 import { DraggableList, type DraggableRenderItemInfo } from './draggable-list'
 import type { DraggableListDragHandleProps } from './draggable-list.types'
 import { getHostRuntimeStore, isHostRuntimeConnected } from '@/runtime/host-runtime'
-import { getIsTauri } from '@/constants/layout'
+import { getIsDesktop } from '@/constants/layout'
 import { projectIconQueryKey } from '@/hooks/use-project-icon-query'
 import {
-  buildHostNewAgentRoute,
-  buildHostWorkspaceRoute,
   parseHostWorkspaceRouteFromPathname,
 } from '@/utils/host-routes'
+import { prepareWorkspaceTab } from '@/utils/workspace-navigation'
 import {
   type SidebarProjectEntry,
   type SidebarWorkspaceEntry,
@@ -72,6 +71,9 @@ import {
 } from '@/components/ui/tooltip'
 import { buildSidebarProjectRowModel } from '@/utils/sidebar-project-row-model'
 import { useNavigationActiveWorkspaceSelection } from '@/stores/navigation-active-workspace-store'
+import { normalizeWorkspaceDescriptor, useSessionStore } from '@/stores/session-store'
+import { createNameId } from 'mnemonic-id'
+import { buildWorkspaceArchiveRedirectRoute } from '@/utils/workspace-archive-navigation'
 
 function toProjectIconDataUri(icon: { mimeType: string; data: string } | null): string | null {
   if (!icon) {
@@ -84,12 +86,14 @@ const workspaceKeyExtractor = (workspace: SidebarWorkspaceEntry) =>
   workspace.workspaceKey
 
 const projectKeyExtractor = (project: SidebarProjectEntry) => project.projectKey
+const EMPTY_WORKSPACES = new Map()
 
 interface SidebarWorkspaceListProps {
   projects: SidebarProjectEntry[]
   serverId: string | null
   collapsedProjectKeys: ReadonlySet<string>
   onToggleProjectCollapsed: (projectKey: string) => void
+  onSetProjectCollapsed: (projectKey: string, collapsed: boolean) => void
   shortcutIndexByWorkspaceKey: Map<string, number>
   isRefreshing?: boolean
   onRefresh?: () => void
@@ -105,9 +109,11 @@ interface ProjectHeaderRowProps {
   iconDataUri: string | null
   workspace: SidebarWorkspaceEntry | null
   selected?: boolean
-  chevron: 'expand' | 'collapse' | 'disclosure'
+  chevron: 'expand' | 'collapse' | null
   onPress: () => void
   onCreateWorktree?: () => void
+  shortcutNumber?: number | null
+  showShortcutBadge?: boolean
   drag: () => void
   isDragging: boolean
   isArchiving?: boolean
@@ -124,6 +130,7 @@ interface WorkspaceRowInnerProps {
   drag: () => void
   isDragging: boolean
   isArchiving: boolean
+  isCreating?: boolean
   dragHandleProps?: DraggableListDragHandleProps
   menuController: ReturnType<typeof useContextMenu> | null
   archiveLabel?: string
@@ -153,18 +160,26 @@ function resolveStatusDotColor(input: {
 
 function WorkspaceStatusIndicator({
   bucket,
+  workspaceKind,
   loading = false,
 }: {
   bucket: SidebarWorkspaceEntry['statusBucket']
+  workspaceKind: SidebarWorkspaceEntry['workspaceKind']
   loading?: boolean
 }) {
   const { theme } = useUnistyles()
   const color = resolveStatusDotColor({ theme, bucket })
   const shouldShowSyncedLoader = shouldRenderSyncedStatusLoader({ bucket })
-  const shouldRenderIdlePlaceholder = !loading && !shouldShowSyncedLoader && bucket === 'done'
+  const isIdle = !loading && !shouldShowSyncedLoader && bucket === 'done'
 
-  if (shouldRenderIdlePlaceholder) {
-    return null
+  if (isIdle) {
+    const KindIcon = workspaceKind === 'local_checkout' ? Monitor : workspaceKind === 'worktree' ? FolderGit2 : null
+    if (!KindIcon) return null
+    return (
+      <View style={styles.workspaceStatusDot}>
+        <KindIcon size={14} color={theme.colors.foregroundMuted} />
+      </View>
+    )
   }
 
   return (
@@ -173,6 +188,10 @@ function WorkspaceStatusIndicator({
         <ActivityIndicator size={8} color={theme.colors.foregroundMuted} />
       ) : shouldShowSyncedLoader ? (
         <SyncedLoader size={11} color={theme.colors.palette.amber[500]} />
+      ) : bucket === 'needs_input' ? (
+        <CircleHelp size={14} color={theme.colors.palette.amber[500]} />
+      ) : bucket === 'attention' ? (
+        <Check size={14} color={theme.colors.palette.green[500]} />
       ) : (
         <View style={[styles.workspaceStatusDotFill, { backgroundColor: color }]} />
       )}
@@ -184,11 +203,15 @@ function ProjectLeadingVisual({
   displayName,
   iconDataUri,
   workspace,
+  chevron = null,
+  showChevron = false,
   isArchiving = false,
 }: {
   displayName: string
   iconDataUri: string | null
   workspace: SidebarWorkspaceEntry | null
+  chevron?: 'expand' | 'collapse' | null
+  showChevron?: boolean
   isArchiving?: boolean
 }) {
   const placeholderLabel = projectIconPlaceholderLabelFromDisplayName(displayName)
@@ -199,8 +222,10 @@ function ProjectLeadingVisual({
 
   return (
     <View style={styles.projectLeadingVisualSlot}>
-      {shouldShowWorkspaceStatus && activeWorkspace ? (
-        <WorkspaceStatusIndicator bucket={activeWorkspace.statusBucket} loading={isArchiving} />
+      {showChevron && chevron !== null ? (
+        <ProjectInlineChevron chevron={chevron} />
+      ) : shouldShowWorkspaceStatus && activeWorkspace ? (
+        <WorkspaceStatusIndicator bucket={activeWorkspace.statusBucket} workspaceKind={activeWorkspace.workspaceKind} loading={isArchiving} />
       ) : iconDataUri ? (
         <Image source={{ uri: iconDataUri }} style={styles.projectIcon} />
       ) : (
@@ -215,8 +240,11 @@ function ProjectLeadingVisual({
 function ProjectInlineChevron({
   chevron,
 }: {
-  chevron: 'expand' | 'collapse' | 'disclosure'
+  chevron: 'expand' | 'collapse' | null
 }) {
+  if (chevron === null) {
+    return null
+  }
   if (chevron === 'collapse') {
     return <ChevronDown size={14} color="#9ca3af" />
   }
@@ -226,33 +254,47 @@ function ProjectInlineChevron({
 function NewWorktreeButton({
   displayName,
   onPress,
+  visible,
   testID,
 }: {
   displayName: string
   onPress: () => void
+  visible: boolean
   testID: string
 }) {
+  const { theme } = useUnistyles()
+
   return (
-    <Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile={false}>
-      <TooltipTrigger
-        style={({ hovered, pressed }) => [
-          styles.projectIconActionButton,
-          (hovered || pressed) && styles.projectIconActionButtonHovered,
-        ]}
-        onPress={(event) => {
-          event.stopPropagation()
-          onPress()
-        }}
-        accessibilityRole="button"
-        accessibilityLabel={`Create a new worktree for ${displayName}`}
-        testID={testID}
-      >
-        <Plus size={14} color="#9ca3af" />
-      </TooltipTrigger>
-      <TooltipContent side="bottom" align="end" offset={8}>
-        <Text style={styles.projectActionTooltipText}>New worktree</Text>
-      </TooltipContent>
-    </Tooltip>
+    <View style={styles.projectTrailingControlSlot} pointerEvents={visible ? 'auto' : 'none'}>
+      <Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile={false}>
+        <TooltipTrigger asChild disabled={!visible}>
+          <Pressable
+            style={({ hovered, pressed }) => [
+              styles.projectIconActionButton,
+              !visible && styles.projectIconActionButtonHidden,
+              (hovered || pressed) && styles.projectIconActionButtonHovered,
+            ]}
+            onPress={(event) => {
+              event.stopPropagation()
+              onPress()
+            }}
+            accessibilityRole="button"
+            accessibilityLabel={`Create a new worktree for ${displayName}`}
+            testID={testID}
+          >
+            {({ hovered, pressed }) => (
+              <Plus
+                size={14}
+                color={hovered || pressed ? theme.colors.foreground : theme.colors.foregroundMuted}
+              />
+            )}
+          </Pressable>
+        </TooltipTrigger>
+        <TooltipContent side="bottom" align="end" offset={8}>
+          <Text style={styles.projectActionTooltipText}>New worktree</Text>
+        </TooltipContent>
+      </Tooltip>
+    </View>
   )
 }
 
@@ -479,12 +521,15 @@ function ProjectHeaderRow({
   chevron,
   onPress,
   onCreateWorktree,
+  shortcutNumber = null,
+  showShortcutBadge = false,
   drag,
   isDragging,
   isArchiving = false,
   menuController,
   dragHandleProps,
 }: ProjectHeaderRowProps) {
+  const [isHovered, setIsHovered] = useState(false)
   const interaction = useLongPressDragInteraction({
     drag,
     menuController,
@@ -510,34 +555,71 @@ function ProjectHeaderRow({
           displayName={displayName}
           iconDataUri={iconDataUri}
           workspace={workspace}
+          chevron={chevron}
+          showChevron={isHovered && chevron !== null}
           isArchiving={isArchiving}
         />
 
-        <Text style={styles.projectTitle} numberOfLines={1}>
-          {displayName}
-        </Text>
-
-        <ProjectInlineChevron chevron={chevron} />
+        <View style={styles.projectTitleGroup}>
+          <Text style={styles.projectTitle} numberOfLines={1}>
+            {displayName}
+          </Text>
+        </View>
       </View>
       {onCreateWorktree ? (
         <NewWorktreeButton
           displayName={displayName}
           onPress={onCreateWorktree}
+          visible={isHovered}
           testID={`sidebar-project-new-worktree-${project.projectKey}`}
         />
       ) : null}
+      {showShortcutBadge && shortcutNumber !== null ? (
+        <View style={styles.shortcutBadge}>
+          <Text style={styles.shortcutBadgeText}>{shortcutNumber}</Text>
+        </View>
+      ) : null}
     </>
   )
 
   if (menuController) {
     return (
-      <ContextMenuTrigger
-        enabledOnMobile={false}
-        style={({ pressed, hovered = false }) => [
+      <View
+        onPointerEnter={() => setIsHovered(true)}
+        onPointerLeave={() => setIsHovered(false)}
+      >
+        <ContextMenuTrigger
+          enabledOnMobile={false}
+          style={({ pressed }) => [
+            styles.projectRow,
+            isDragging && styles.projectRowDragging,
+            selected && styles.sidebarRowSelected,
+            isHovered && styles.projectRowHovered,
+            pressed && styles.projectRowPressed,
+          ]}
+          onPressIn={interaction.handlePressIn}
+          onTouchMove={interaction.handleTouchMove}
+          onPressOut={interaction.handlePressOut}
+          onPress={handlePress}
+          testID={`sidebar-project-row-${project.projectKey}`}
+        >
+          {rowChildren}
+        </ContextMenuTrigger>
+      </View>
+    )
+  }
+
+  return (
+    <View
+      onPointerEnter={() => setIsHovered(true)}
+      onPointerLeave={() => setIsHovered(false)}
+    >
+      <Pressable
+        style={({ pressed }) => [
           styles.projectRow,
           isDragging && styles.projectRowDragging,
           selected && styles.sidebarRowSelected,
-          hovered && styles.projectRowHovered,
+          isHovered && styles.projectRowHovered,
           pressed && styles.projectRowPressed,
         ]}
         onPressIn={interaction.handlePressIn}
@@ -547,27 +629,8 @@ function ProjectHeaderRow({
         testID={`sidebar-project-row-${project.projectKey}`}
       >
         {rowChildren}
-      </ContextMenuTrigger>
-    )
-  }
-
-  return (
-    <Pressable
-      style={({ pressed, hovered = false }) => [
-        styles.projectRow,
-        isDragging && styles.projectRowDragging,
-        selected && styles.sidebarRowSelected,
-        hovered && styles.projectRowHovered,
-        pressed && styles.projectRowPressed,
-      ]}
-      onPressIn={interaction.handlePressIn}
-      onTouchMove={interaction.handleTouchMove}
-      onPressOut={interaction.handlePressOut}
-      onPress={handlePress}
-      testID={`sidebar-project-row-${project.projectKey}`}
-    >
-      {rowChildren}
-    </Pressable>
+      </Pressable>
+    </View>
   )
 }
 
@@ -580,6 +643,7 @@ function WorkspaceRowInner({
   drag,
   isDragging,
   isArchiving,
+  isCreating = false,
   dragHandleProps,
   menuController,
   archiveLabel,
@@ -632,15 +696,24 @@ function WorkspaceRowInner({
           ref={dragHandleProps?.setActivatorNodeRef as any}
           style={styles.workspaceRowLeft}
         >
-          <WorkspaceStatusIndicator bucket={workspace.statusBucket} loading={isArchiving} />
+          <WorkspaceStatusIndicator
+            bucket={workspace.statusBucket}
+            workspaceKind={workspace.workspaceKind}
+            loading={isArchiving || isCreating}
+          />
           <Text
-            style={[styles.workspaceBranchText, isHovered && styles.workspaceBranchTextHovered]}
+            style={[
+              styles.workspaceBranchText,
+              isHovered && styles.workspaceBranchTextHovered,
+              isCreating && styles.workspaceBranchTextCreating,
+            ]}
             numberOfLines={1}
           >
             {workspace.name}
           </Text>
         </View>
         <View style={styles.workspaceRowRight}>
+          {isCreating ? <Text style={styles.workspaceCreatingText}>Creating...</Text> : null}
           {onArchive && (isHovered || isMobile) ? (
             <DropdownMenu>
               <DropdownMenuTrigger
@@ -717,6 +790,7 @@ function WorkspaceRowWithMenu({
   isDragging,
   dragHandleProps,
   canCopyBranchName,
+  isCreating = false,
 }: {
   workspace: SidebarWorkspaceEntry
   selected: boolean
@@ -727,9 +801,14 @@ function WorkspaceRowWithMenu({
   isDragging: boolean
   dragHandleProps?: DraggableListDragHandleProps
   canCopyBranchName: boolean
+  isCreating?: boolean
 }) {
   const toast = useToast()
+  const activeWorkspaceSelection = useNavigationActiveWorkspaceSelection()
   const archiveWorktree = useCheckoutGitActionsStore((state) => state.archiveWorktree)
+  const sessionWorkspaces = useSessionStore(
+    (state) => state.sessions[workspace.serverId]?.workspaces ?? EMPTY_WORKSPACES
+  )
   const [isArchivingWorkspace, setIsArchivingWorkspace] = useState(false)
   const archiveStatus = useCheckoutGitActionsStore((state) =>
     state.getStatus({
@@ -740,6 +819,27 @@ function WorkspaceRowWithMenu({
   )
   const isWorktree = workspace.workspaceKind === 'worktree'
   const isArchiving = isWorktree ? archiveStatus === 'pending' : isArchivingWorkspace
+  const redirectAfterArchive = useCallback(() => {
+    if (
+      activeWorkspaceSelection?.serverId !== workspace.serverId ||
+      activeWorkspaceSelection.workspaceId !== workspace.workspaceId
+    ) {
+      return
+    }
+
+    router.replace(
+      buildWorkspaceArchiveRedirectRoute({
+        serverId: workspace.serverId,
+        archivedWorkspaceId: workspace.workspaceId,
+        workspaces: sessionWorkspaces.values(),
+      }) as any
+    )
+  }, [
+    activeWorkspaceSelection,
+    sessionWorkspaces,
+    workspace.serverId,
+    workspace.workspaceId,
+  ])
 
   const handleArchiveWorktree = useCallback(() => {
     if (isArchiving) {
@@ -763,12 +863,22 @@ function WorkspaceRowWithMenu({
         serverId: workspace.serverId,
         cwd: workspace.workspaceId,
         worktreePath: workspace.workspaceId,
+      }).then(() => {
+        redirectAfterArchive()
       }).catch((error) => {
         const message = error instanceof Error ? error.message : 'Failed to archive worktree'
         toast.error(message)
       })
     })()
-  }, [archiveWorktree, isArchiving, toast, workspace.name, workspace.serverId, workspace.workspaceId])
+  }, [
+    archiveWorktree,
+    isArchiving,
+    redirectAfterArchive,
+    toast,
+    workspace.name,
+    workspace.serverId,
+    workspace.workspaceId,
+  ])
 
   const handleArchiveWorkspace = useCallback(() => {
     if (isArchivingWorkspace) {
@@ -799,13 +909,21 @@ function WorkspaceRowWithMenu({
         if (payload.error) {
           throw new Error(payload.error)
         }
+        redirectAfterArchive()
       } catch (error) {
         toast.error(error instanceof Error ? error.message : 'Failed to hide workspace')
       } finally {
         setIsArchivingWorkspace(false)
       }
     })()
-  }, [isArchivingWorkspace, toast, workspace.name, workspace.serverId, workspace.workspaceId])
+  }, [
+    isArchivingWorkspace,
+    redirectAfterArchive,
+    toast,
+    workspace.name,
+    workspace.serverId,
+    workspace.workspaceId,
+  ])
 
   const handleCopyPath = useCallback(() => {
     void Clipboard.setStringAsync(workspace.workspaceId)
@@ -827,6 +945,7 @@ function WorkspaceRowWithMenu({
       drag={drag}
       isDragging={isDragging}
       isArchiving={isArchiving}
+      isCreating={isCreating}
       dragHandleProps={dragHandleProps}
       menuController={null}
       archiveLabel={isWorktree ? 'Archive worktree' : 'Hide from sidebar'}
@@ -846,6 +965,8 @@ function NonGitProjectRowWithMenuContent({
   workspace,
   selected,
   onPress,
+  shortcutNumber,
+  showShortcutBadge,
   drag,
   isDragging,
   dragHandleProps,
@@ -856,13 +977,40 @@ function NonGitProjectRowWithMenuContent({
   workspace: SidebarWorkspaceEntry
   selected: boolean
   onPress: () => void
+  shortcutNumber: number | null
+  showShortcutBadge: boolean
   drag: () => void
   isDragging: boolean
   dragHandleProps?: DraggableListDragHandleProps
 }) {
   const toast = useToast()
   const contextMenu = useContextMenu()
+  const activeWorkspaceSelection = useNavigationActiveWorkspaceSelection()
+  const sessionWorkspaces = useSessionStore(
+    (state) => state.sessions[workspace.serverId]?.workspaces ?? EMPTY_WORKSPACES
+  )
   const [isArchivingWorkspace, setIsArchivingWorkspace] = useState(false)
+  const redirectAfterArchive = useCallback(() => {
+    if (
+      activeWorkspaceSelection?.serverId !== workspace.serverId ||
+      activeWorkspaceSelection.workspaceId !== workspace.workspaceId
+    ) {
+      return
+    }
+
+    router.replace(
+      buildWorkspaceArchiveRedirectRoute({
+        serverId: workspace.serverId,
+        archivedWorkspaceId: workspace.workspaceId,
+        workspaces: sessionWorkspaces.values(),
+      }) as any
+    )
+  }, [
+    activeWorkspaceSelection,
+    sessionWorkspaces,
+    workspace.serverId,
+    workspace.workspaceId,
+  ])
 
   const handleArchiveWorkspace = useCallback(() => {
     if (isArchivingWorkspace) {
@@ -893,13 +1041,21 @@ function NonGitProjectRowWithMenuContent({
         if (payload.error) {
           throw new Error(payload.error)
         }
+        redirectAfterArchive()
       } catch (error) {
         toast.error(error instanceof Error ? error.message : 'Failed to hide workspace')
       } finally {
         setIsArchivingWorkspace(false)
       }
     })()
-  }, [isArchivingWorkspace, toast, workspace.name, workspace.serverId, workspace.workspaceId])
+  }, [
+    isArchivingWorkspace,
+    redirectAfterArchive,
+    toast,
+    workspace.name,
+    workspace.serverId,
+    workspace.workspaceId,
+  ])
 
   return (
     <>
@@ -909,8 +1065,10 @@ function NonGitProjectRowWithMenuContent({
         iconDataUri={iconDataUri}
         workspace={workspace}
         selected={selected}
-        chevron="disclosure"
+        chevron={null}
         onPress={onPress}
+        shortcutNumber={shortcutNumber}
+        showShortcutBadge={showShortcutBadge}
         drag={drag}
         isDragging={isDragging}
         isArchiving={isArchivingWorkspace}
@@ -944,6 +1102,8 @@ function NonGitProjectRowWithMenu(props: {
   workspace: SidebarWorkspaceEntry
   selected: boolean
   onPress: () => void
+  shortcutNumber: number | null
+  showShortcutBadge: boolean
   drag: () => void
   isDragging: boolean
   dragHandleProps?: DraggableListDragHandleProps
@@ -955,37 +1115,65 @@ function NonGitProjectRowWithMenu(props: {
   )
 }
 
-function WorkspaceRowPlain({
-  workspace,
-  selected,
+function FlattenedProjectRow({
+  project,
+  displayName,
+  iconDataUri,
+  rowModel,
+  onPress,
+  onCreateWorktree,
   shortcutNumber,
   showShortcutBadge,
-  onPress,
   drag,
   isDragging,
   dragHandleProps,
 }: {
-  workspace: SidebarWorkspaceEntry
-  selected: boolean
+  project: SidebarProjectEntry
+  displayName: string
+  iconDataUri: string | null
+  rowModel: Extract<ReturnType<typeof buildSidebarProjectRowModel>, { kind: 'workspace_link' }>
+  onPress: () => void
+  onCreateWorktree?: () => void
   shortcutNumber: number | null
   showShortcutBadge: boolean
-  onPress: () => void
   drag: () => void
   isDragging: boolean
   dragHandleProps?: DraggableListDragHandleProps
 }) {
+  if (project.projectKind === 'non_git') {
+    return (
+      <NonGitProjectRowWithMenu
+        project={project}
+        displayName={displayName}
+        iconDataUri={iconDataUri}
+        workspace={rowModel.workspace}
+        selected={rowModel.selected}
+        onPress={onPress}
+        shortcutNumber={shortcutNumber}
+        showShortcutBadge={showShortcutBadge}
+        drag={drag}
+        isDragging={isDragging}
+        dragHandleProps={dragHandleProps}
+      />
+    )
+  }
+
   return (
-    <WorkspaceRowInner
-      workspace={workspace}
-      selected={selected}
+    <ProjectHeaderRow
+      project={project}
+      displayName={displayName}
+      iconDataUri={iconDataUri}
+      workspace={rowModel.workspace}
+      selected={rowModel.selected}
+      chevron={rowModel.chevron}
+      onPress={onPress}
+      onCreateWorktree={rowModel.trailingAction === 'new_worktree' ? onCreateWorktree : undefined}
       shortcutNumber={shortcutNumber}
       showShortcutBadge={showShortcutBadge}
-      onPress={onPress}
       drag={drag}
       isDragging={isDragging}
-      isArchiving={false}
-      dragHandleProps={dragHandleProps}
       menuController={null}
+      dragHandleProps={dragHandleProps}
     />
   )
 }
@@ -1000,6 +1188,7 @@ function WorkspaceRow({
   isDragging,
   dragHandleProps,
   canCopyBranchName,
+  isCreating = false,
 }: {
   workspace: SidebarWorkspaceEntry
   selected: boolean
@@ -1010,6 +1199,7 @@ function WorkspaceRow({
   isDragging: boolean
   dragHandleProps?: DraggableListDragHandleProps
   canCopyBranchName: boolean
+  isCreating?: boolean
 }) {
   return (
     <WorkspaceRowWithMenu
@@ -1022,6 +1212,7 @@ function WorkspaceRow({
       isDragging={isDragging}
       dragHandleProps={dragHandleProps}
       canCopyBranchName={canCopyBranchName}
+      isCreating={isCreating}
     />
   )
 }
@@ -1044,6 +1235,7 @@ function ProjectBlock({
   isDragging,
   dragHandleProps,
   useNestable,
+  creatingWorkspaceIds,
 }: {
   project: SidebarProjectEntry
   collapsed: boolean
@@ -1062,6 +1254,7 @@ function ProjectBlock({
   isDragging: boolean
   dragHandleProps?: DraggableListDragHandleProps
   useNestable: boolean
+  creatingWorkspaceIds: ReadonlySet<string>
 }) {
   const rowModel = useMemo(
     () =>
@@ -1073,11 +1266,9 @@ function ProjectBlock({
       }),
     [activeWorkspaceSelection, collapsed, project, serverId]
   )
-  const flattenedWorkspace = rowModel.flattenedWorkspace
 
   const renderWorkspaceRow = useCallback(
     (item: SidebarWorkspaceEntry, input?: { drag?: () => void; isDragging?: boolean; dragHandleProps?: DraggableListDragHandleProps }) => {
-      const workspaceRoute = buildHostWorkspaceRoute(serverId ?? '', item.workspaceId)
       const isSelected =
         Boolean(serverId) &&
         activeWorkspaceSelection?.serverId === serverId &&
@@ -1090,6 +1281,7 @@ function ProjectBlock({
           shortcutNumber={shortcutIndexByWorkspaceKey.get(item.workspaceKey) ?? null}
           showShortcutBadge={showShortcutBadges}
           canCopyBranchName={project.projectKind === 'git'}
+          isCreating={creatingWorkspaceIds.has(item.workspaceId)}
           onPress={() => {
             if (!serverId) {
               return
@@ -1105,6 +1297,8 @@ function ProjectBlock({
     },
     [
       activeWorkspaceSelection,
+      project.projectKind,
+      creatingWorkspaceIds,
       onWorkspacePress,
       serverId,
       shortcutIndexByWorkspaceKey,
@@ -1137,20 +1331,26 @@ function ProjectBlock({
 
   return (
     <View style={styles.projectBlock}>
-      {flattenedWorkspace ? (
-        <NonGitProjectRowWithMenu
+      {rowModel.kind === 'workspace_link' ? (
+        <FlattenedProjectRow
           project={project}
           displayName={displayName}
           iconDataUri={iconDataUri}
-          workspace={flattenedWorkspace}
-          selected={rowModel.selected}
+          rowModel={rowModel}
           onPress={() => {
             if (!serverId) {
               return
             }
             onWorkspacePress?.()
-            navigateToWorkspace(serverId, flattenedWorkspace.workspaceId)
+            navigateToWorkspace(serverId, rowModel.workspace.workspaceId)
           }}
+          onCreateWorktree={
+            rowModel.trailingAction === 'new_worktree' && onCreateWorktree
+              ? () => onCreateWorktree(project)
+              : undefined
+          }
+          shortcutNumber={shortcutIndexByWorkspaceKey.get(rowModel.workspace.workspaceKey) ?? null}
+          showShortcutBadge={showShortcutBadges}
           drag={drag}
           isDragging={isDragging}
           dragHandleProps={dragHandleProps}
@@ -1201,6 +1401,7 @@ export function SidebarWorkspaceList({
   serverId,
   collapsedProjectKeys,
   onToggleProjectCollapsed,
+  onSetProjectCollapsed,
   shortcutIndexByWorkspaceKey,
   isRefreshing = false,
   onRefresh,
@@ -1212,10 +1413,17 @@ export function SidebarWorkspaceList({
   const isNative = Platform.OS !== 'web'
   const pathname = usePathname()
   const activeWorkspaceSelection = useNavigationActiveWorkspaceSelection()
-  const isTauri = getIsTauri()
+  const toast = useToast()
+  const mergeWorkspaces = useSessionStore((state) => state.mergeWorkspaces)
+  const [creatingProjectKey, setCreatingProjectKey] = useState<string | null>(null)
+  const [creatingWorkspaceIds, setCreatingWorkspaceIds] = useState<Set<string>>(() => new Set())
+  const creatingWorkspaceTimeoutsRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(
+    new Map()
+  )
+  const isDesktopApp = getIsDesktop()
   const altDown = useKeyboardShortcutsStore((state) => state.altDown)
   const cmdOrCtrlDown = useKeyboardShortcutsStore((state) => state.cmdOrCtrlDown)
-  const showShortcutBadges = altDown || (isTauri && cmdOrCtrlDown)
+  const showShortcutBadges = altDown || (isDesktopApp && cmdOrCtrlDown)
 
   const getProjectOrder = useSidebarOrderStore((state) => state.getProjectOrder)
   const setProjectOrder = useSidebarOrderStore((state) => state.setProjectOrder)
@@ -1291,6 +1499,51 @@ export function SidebarWorkspaceList({
     return byProject
   }, [projectIconQueries, projectIconRequests, projects, serverId])
 
+  useEffect(() => {
+    return () => {
+      for (const timeout of creatingWorkspaceTimeoutsRef.current.values()) {
+        clearTimeout(timeout)
+      }
+      creatingWorkspaceTimeoutsRef.current.clear()
+    }
+  }, [])
+
+  useEffect(() => {
+    if (creatingWorkspaceIds.size === 0) {
+      return
+    }
+
+    const visibleWorkspaceIds = new Set<string>()
+    for (const project of projects) {
+      for (const workspace of project.workspaces) {
+        visibleWorkspaceIds.add(workspace.workspaceId)
+      }
+    }
+
+    const removedWorkspaceIds = Array.from(creatingWorkspaceIds).filter(
+      (workspaceId) => !visibleWorkspaceIds.has(workspaceId)
+    )
+    if (removedWorkspaceIds.length === 0) {
+      return
+    }
+
+    for (const workspaceId of removedWorkspaceIds) {
+      const timeout = creatingWorkspaceTimeoutsRef.current.get(workspaceId)
+      if (timeout) {
+        clearTimeout(timeout)
+        creatingWorkspaceTimeoutsRef.current.delete(workspaceId)
+      }
+    }
+
+    setCreatingWorkspaceIds((current) => {
+      const next = new Set(current)
+      for (const workspaceId of removedWorkspaceIds) {
+        next.delete(workspaceId)
+      }
+      return next
+    })
+  }, [creatingWorkspaceIds, projects])
+
   const handleProjectDragEnd = useCallback(
     (reorderedProjects: SidebarProjectEntry[]) => {
       if (!serverId) {
@@ -1349,19 +1602,69 @@ export function SidebarWorkspaceList({
   )
 
   const handleCreateWorktree = useCallback(
-    (project: SidebarProjectEntry) => {
+    async (project: SidebarProjectEntry) => {
       if (!serverId || project.projectKind !== 'git') {
         return
       }
-      onWorkspacePress?.()
-      router.push(
-        buildHostNewAgentRoute(serverId, {
-          workingDir: project.iconWorkingDir,
-          worktreeMode: 'create',
-        }) as any
-      )
+      if (creatingProjectKey) {
+        return
+      }
+      onSetProjectCollapsed(project.projectKey, false)
+      setCreatingProjectKey(project.projectKey)
+      try {
+        const client = getHostRuntimeStore().getClient(serverId)
+        if (!client || !isHostRuntimeConnected(getHostRuntimeStore().getSnapshot(serverId))) {
+          throw new Error('Host is not connected')
+        }
+        const payload = await client.createPaseoWorktree({
+          cwd: project.iconWorkingDir,
+          worktreeSlug: createNameId(),
+        })
+        if (payload.error || !payload.workspace) {
+          throw new Error(payload.error ?? 'Failed to create worktree')
+        }
+        const workspace = payload.workspace
+        mergeWorkspaces(serverId, [normalizeWorkspaceDescriptor(workspace)])
+        setCreatingWorkspaceIds((current) => {
+          const next = new Set(current)
+          next.add(workspace.id)
+          return next
+        })
+        const existingTimeout = creatingWorkspaceTimeoutsRef.current.get(workspace.id)
+        if (existingTimeout) {
+          clearTimeout(existingTimeout)
+        }
+        creatingWorkspaceTimeoutsRef.current.set(
+          workspace.id,
+          setTimeout(() => {
+            creatingWorkspaceTimeoutsRef.current.delete(workspace.id)
+            setCreatingWorkspaceIds((current) => {
+              if (!current.has(workspace.id)) {
+                return current
+              }
+              const next = new Set(current)
+              next.delete(workspace.id)
+              return next
+            })
+          }, 3000)
+        )
+        onWorkspacePress?.()
+        router.navigate(
+          prepareWorkspaceTab({
+            serverId,
+            workspaceId: workspace.id,
+            target: { kind: 'draft', draftId: 'new' },
+          }) as any
+        )
+      } catch (error) {
+        toast.error(
+          error instanceof Error ? error.message : String(error)
+        )
+      } finally {
+        setCreatingProjectKey((current) => (current === project.projectKey ? null : current))
+      }
     },
-    [serverId, onWorkspacePress]
+    [creatingProjectKey, mergeWorkspaces, onSetProjectCollapsed, onWorkspacePress, serverId, toast]
   )
 
   const renderProject = useCallback(
@@ -1385,6 +1688,7 @@ export function SidebarWorkspaceList({
           isDragging={isActive}
           dragHandleProps={dragHandleProps}
           useNestable={isNative}
+          creatingWorkspaceIds={creatingWorkspaceIds}
         />
       )
     },
@@ -1401,6 +1705,7 @@ export function SidebarWorkspaceList({
       shortcutIndexByWorkspaceKey,
       showShortcutBadges,
       isNative,
+      creatingWorkspaceIds,
     ]
   )
 
@@ -1519,6 +1824,13 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     minWidth: 0,
   },
+  projectTitleGroup: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: theme.spacing[1],
+    flex: 1,
+    minWidth: 0,
+  },
   projectIcon: {
     width: '100%',
     height: '100%',
@@ -1547,8 +1859,8 @@ const styles = StyleSheet.create((theme) => ({
   projectTitle: {
     color: theme.colors.foreground,
     fontSize: theme.fontSize.sm,
-    flex: 1,
     minWidth: 0,
+    flexShrink: 1,
   },
   projectActionButton: {
     flexDirection: 'row',
@@ -1577,6 +1889,16 @@ const styles = StyleSheet.create((theme) => ({
   projectIconActionButtonHovered: {
     backgroundColor: theme.colors.surface1,
   },
+  projectIconActionButtonHidden: {
+    opacity: 0,
+  },
+  projectTrailingControlSlot: {
+    width: 24,
+    height: 24,
+    alignItems: 'center',
+    justifyContent: 'center',
+    flexShrink: 0,
+  },
   projectActionTooltipText: {
     color: theme.colors.foreground,
     fontSize: theme.fontSize.xs,
@@ -1595,7 +1917,7 @@ const styles = StyleSheet.create((theme) => ({
   workspaceRowLeft: {
     flexDirection: 'row',
     alignItems: 'center',
-    gap: theme.spacing[1],
+    gap: theme.spacing[2],
     flex: 1,
     minWidth: 0,
   },
@@ -1630,7 +1952,7 @@ const styles = StyleSheet.create((theme) => ({
     position: 'relative',
   },
   workspaceStatusDot: {
-    width: 11,
+    width: 14,
     height: 16,
     borderRadius: theme.borderRadius.full,
     flexShrink: 0,
@@ -1665,9 +1987,17 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     minWidth: 0,
   },
+  workspaceBranchTextCreating: {
+    opacity: 0.92,
+  },
   workspaceBranchTextHovered: {
     opacity: 1,
   },
+  workspaceCreatingText: {
+    color: theme.colors.foregroundMuted,
+    fontSize: theme.fontSize.xs,
+    flexShrink: 0,
+  },
   diffStatRow: {
     flexDirection: 'row',
     alignItems: 'center',
@@ -1698,11 +2028,16 @@ const styles = StyleSheet.create((theme) => ({
     paddingHorizontal: theme.spacing[1],
     alignItems: 'center',
     justifyContent: 'center',
+    borderRadius: theme.borderRadius.sm,
+    borderWidth: 1,
+    borderColor: theme.colors.surface2,
+    backgroundColor: theme.colors.surface0,
+    flexShrink: 0,
   },
   shortcutBadgeText: {
     color: theme.colors.foregroundMuted,
     fontSize: theme.fontSize.xs,
-    fontWeight: theme.fontWeight.normal,
+    fontWeight: theme.fontWeight.medium,
     lineHeight: 14,
   },
 }))

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

@@ -41,7 +41,7 @@ import {
   type WorkspaceDesktopTabRowItem,
 } from "@/screens/workspace/workspace-desktop-tabs-row";
 import {
-  useWorkspaceTabPresentation,
+  WorkspaceTabPresentationResolver,
   WorkspaceTabIcon,
 } from "@/screens/workspace/workspace-tab-presentation";
 import type { WorkspaceTabDescriptor } from "@/screens/workspace/workspace-tabs-types";
@@ -57,9 +57,7 @@ interface SplitContainerProps {
   hoveredCloseTabKey: string | null;
   setHoveredTabKey: Dispatch<SetStateAction<string | null>>;
   setHoveredCloseTabKey: Dispatch<SetStateAction<string | null>>;
-  isArchivingAgent: (input: { serverId: string; agentId: string }) => boolean;
-  killTerminalPending: boolean;
-  killTerminalId: string | null;
+  closingTabIds: Set<string>;
   onNavigateTab: (tabId: string) => void;
   onCloseTab: (tabId: string) => Promise<void> | void;
   onCopyResumeCommand: (agentId: string) => Promise<void> | void;
@@ -67,11 +65,12 @@ interface SplitContainerProps {
   onCloseTabsToLeft: (tabId: string, paneTabs: WorkspaceTabDescriptor[]) => Promise<void> | void;
   onCloseTabsToRight: (tabId: string, paneTabs: WorkspaceTabDescriptor[]) => Promise<void> | void;
   onCloseOtherTabs: (tabId: string, paneTabs: WorkspaceTabDescriptor[]) => Promise<void> | void;
-  onSelectNewTabOption: (selection: { optionId: "__new_tab_agent__"; paneId?: string }) => void;
+  onSelectNewTabOption: (selection: { optionId: "__new_tab_agent__" | "__new_tab_terminal__"; paneId?: string }) => void;
   onNewTerminalTab: (input: { paneId?: string }) => void;
-  newTabAgentOptionId?: "__new_tab_agent__";
+  newTabAgentOptionId?: "__new_tab_agent__" | "__new_tab_terminal__";
   buildPaneContentModel: (input: {
     paneId: string;
+    isPaneFocused: boolean;
     tab: WorkspaceTabDescriptor;
   }) => WorkspacePaneContentModel;
   onFocusPane: (paneId: string) => void;
@@ -161,9 +160,7 @@ export function SplitContainer({
   hoveredCloseTabKey,
   setHoveredTabKey,
   setHoveredCloseTabKey,
-  isArchivingAgent,
-  killTerminalPending,
-  killTerminalId,
+  closingTabIds,
   onNavigateTab,
   onCloseTab,
   onCopyResumeCommand,
@@ -409,9 +406,7 @@ export function SplitContainer({
         hoveredCloseTabKey={hoveredCloseTabKey}
         setHoveredTabKey={setHoveredTabKey}
         setHoveredCloseTabKey={setHoveredCloseTabKey}
-        isArchivingAgent={isArchivingAgent}
-        killTerminalPending={killTerminalPending}
-        killTerminalId={killTerminalId}
+        closingTabIds={closingTabIds}
         onNavigateTab={onNavigateTab}
         onCloseTab={onCloseTab}
         onCopyResumeCommand={onCopyResumeCommand}
@@ -489,35 +484,41 @@ function DragOverlayTabChipInner({
   normalizedWorkspaceId: string;
 }) {
   const { theme } = useUnistyles();
-  const presentation = useWorkspaceTabPresentation({
-    tab,
-    serverId: normalizedServerId,
-    workspaceId: normalizedWorkspaceId,
-  });
-  const label =
-    presentation.titleState === "loading" ? "Loading..." : presentation.label;
 
   return (
-    <View
-      style={[
-        styles.dragOverlayChip,
-        {
-          backgroundColor: theme.colors.surface1,
-          borderColor: theme.colors.borderAccent,
-        },
-      ]}
+    <WorkspaceTabPresentationResolver
+      tab={tab}
+      serverId={normalizedServerId}
+      workspaceId={normalizedWorkspaceId}
     >
-      <WorkspaceTabIcon presentation={presentation} active size={14} />
-      <Text
-        numberOfLines={1}
-        style={[
-          styles.dragOverlayLabel,
-          { color: theme.colors.foreground },
-        ]}
-      >
-        {label}
-      </Text>
-    </View>
+      {(presentation) => {
+        const label =
+          presentation.titleState === "loading" ? "Loading..." : presentation.label;
+
+        return (
+          <View
+            style={[
+              styles.dragOverlayChip,
+              {
+                backgroundColor: theme.colors.surface1,
+                borderColor: theme.colors.borderAccent,
+              },
+            ]}
+          >
+            <WorkspaceTabIcon presentation={presentation} active size={14} />
+            <Text
+              numberOfLines={1}
+              style={[
+                styles.dragOverlayLabel,
+                { color: theme.colors.foreground },
+              ]}
+            >
+              {label}
+            </Text>
+          </View>
+        );
+      }}
+    </WorkspaceTabPresentationResolver>
   );
 }
 
@@ -531,9 +532,7 @@ function SplitNodeView({
   hoveredCloseTabKey,
   setHoveredTabKey,
   setHoveredCloseTabKey,
-  isArchivingAgent,
-  killTerminalPending,
-  killTerminalId,
+  closingTabIds,
   onNavigateTab,
   onCloseTab,
   onCopyResumeCommand,
@@ -568,9 +567,7 @@ function SplitNodeView({
         hoveredCloseTabKey={hoveredCloseTabKey}
         setHoveredTabKey={setHoveredTabKey}
         setHoveredCloseTabKey={setHoveredCloseTabKey}
-        isArchivingAgent={isArchivingAgent}
-        killTerminalPending={killTerminalPending}
-        killTerminalId={killTerminalId}
+        closingTabIds={closingTabIds}
         onNavigateTab={onNavigateTab}
         onCloseTab={onCloseTab}
         onCopyResumeCommand={onCopyResumeCommand}
@@ -619,9 +616,7 @@ function SplitNodeView({
               hoveredCloseTabKey={hoveredCloseTabKey}
               setHoveredTabKey={setHoveredTabKey}
               setHoveredCloseTabKey={setHoveredCloseTabKey}
-              isArchivingAgent={isArchivingAgent}
-              killTerminalPending={killTerminalPending}
-              killTerminalId={killTerminalId}
+              closingTabIds={closingTabIds}
               onNavigateTab={onNavigateTab}
               onCloseTab={onCloseTab}
               onCopyResumeCommand={onCopyResumeCommand}
@@ -670,9 +665,7 @@ function SplitPaneView({
   hoveredCloseTabKey,
   setHoveredTabKey,
   setHoveredCloseTabKey,
-  isArchivingAgent,
-  killTerminalPending,
-  killTerminalId,
+  closingTabIds,
   onNavigateTab,
   onCloseTab,
   onCopyResumeCommand,
@@ -711,32 +704,16 @@ function SplitPaneView({
   const activeTabDescriptor = paneState.activeTab?.descriptor ?? null;
   const desktopTabRowItems = useMemo<WorkspaceDesktopTabRowItem[]>(
     () =>
-      paneTabs.map((tab) => {
-        const isClosingAgent =
-          tab.target.kind === "agent" &&
-          isArchivingAgent({
-            serverId: normalizedServerId,
-            agentId: tab.target.agentId,
-          });
-        const isClosingTerminal =
-          tab.target.kind === "terminal" &&
-          killTerminalPending &&
-          killTerminalId === tab.target.terminalId;
-
-        return {
-          tab,
-          isActive: tab.key === activeTabDescriptor?.key,
-          isCloseHovered: hoveredCloseTabKey === tab.key,
-          isClosingTab: isClosingAgent || isClosingTerminal,
-        };
-      }),
+      paneTabs.map((tab) => ({
+        tab,
+        isActive: tab.key === activeTabDescriptor?.key,
+        isCloseHovered: hoveredCloseTabKey === tab.key,
+        isClosingTab: closingTabIds.has(tab.tabId),
+      })),
     [
       activeTabDescriptor?.key,
+      closingTabIds,
       hoveredCloseTabKey,
-      isArchivingAgent,
-      killTerminalId,
-      killTerminalPending,
-      normalizedServerId,
       paneTabs,
     ]
   );
@@ -745,6 +722,7 @@ function SplitPaneView({
       activeTabDescriptor
         ? buildPaneContentModel({
             paneId: pane.id,
+            isPaneFocused: isFocused,
             tab: activeTabDescriptor,
           })
         : null,

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

@@ -19,7 +19,7 @@ import Svg, {
 import { StyleSheet, UnistylesRuntime, useUnistyles } from "react-native-unistyles";
 import type { ListTerminalsResponse } from "@server/shared/messages";
 import { encodeTerminalKeyInput } from "@server/shared/terminal-key-input";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import { useKeyboardShiftStyle } from "@/hooks/use-keyboard-shift-style";
 import {
   hasPendingTerminalModifiers,
@@ -150,7 +150,8 @@ export function TerminalPane({
   });
 
   const queryClient = useQueryClient();
-  const { client, isConnected } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
+  const isConnected = useHostRuntimeIsConnected(serverId);
 
   const scopeKey = useMemo(() => terminalScopeKey({ serverId, cwd }), [serverId, cwd]);
   const terminalsQueryKey = useMemo(() => ["terminals", serverId, cwd] as const, [cwd, serverId]);

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

@@ -0,0 +1,328 @@
+import {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+  type ReactNode,
+} from "react";
+import { createPortal } from "react-dom";
+import {
+  Animated,
+  Easing,
+  Platform,
+  Text,
+  ToastAndroid,
+  View,
+} from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+import { StyleSheet, UnistylesRuntime, useUnistyles } from "react-native-unistyles";
+import { AlertTriangle, CheckCircle2 } from "lucide-react-native";
+import { getOverlayRoot, OVERLAY_Z } from "@/lib/overlay-root";
+import {
+  HEADER_INNER_HEIGHT,
+  HEADER_INNER_HEIGHT_MOBILE,
+  HEADER_TOP_PADDING_MOBILE,
+} from "@/constants/layout";
+
+export type ToastVariant = "default" | "success" | "error";
+
+export type ToastShowOptions = {
+  icon?: ReactNode;
+  variant?: ToastVariant;
+  durationMs?: number;
+  nativeAndroid?: boolean;
+  testID?: string;
+};
+
+export type ToastState = {
+  id: number;
+  content: ReactNode;
+  nativeMessage: string | null;
+  icon?: ReactNode;
+  variant: ToastVariant;
+  durationMs: number;
+  testID?: string;
+};
+
+export type ToastApi = {
+  show: (content: ReactNode, options?: ToastShowOptions) => void;
+  copied: (label?: string) => void;
+  error: (message: string) => void;
+};
+
+type ToastViewportPlacement = "app-shell" | "panel";
+
+const DEFAULT_DURATION_MS = 2200;
+
+export function useToastHost(): {
+  api: ToastApi;
+  toast: ToastState | null;
+  dismiss: () => void;
+} {
+  const [toast, setToast] = useState<ToastState | null>(null);
+  const idRef = useRef(0);
+
+  const show = useCallback(
+    (content: ReactNode, options?: ToastShowOptions) => {
+      const nativeMessage =
+        typeof content === "string"
+          ? content.trim()
+          : null;
+      if (!content || nativeMessage === "") {
+        return;
+      }
+
+      const variant = options?.variant ?? "default";
+      const durationMs = options?.durationMs ?? DEFAULT_DURATION_MS;
+      const nativeAndroid = options?.nativeAndroid ?? false;
+
+      if (Platform.OS === "android" && nativeAndroid && nativeMessage) {
+        const duration =
+          durationMs <= 2500
+            ? ToastAndroid.SHORT
+            : ToastAndroid.LONG;
+        ToastAndroid.showWithGravity(
+          nativeMessage,
+          duration,
+          ToastAndroid.TOP
+        );
+        return;
+      }
+
+      idRef.current += 1;
+      setToast({
+        id: idRef.current,
+        content,
+        nativeMessage,
+        icon: options?.icon,
+        variant,
+        durationMs,
+        testID: options?.testID,
+      });
+    },
+    []
+  );
+
+  const api = useMemo<ToastApi>(
+    () => ({
+      show,
+      copied: (label?: string) =>
+        show(label ? `Copied ${label}` : "Copied", {
+          variant: "success",
+          icon: <CheckCircle2 size={18} />,
+        }),
+      error: (message: string) =>
+        show(message, { variant: "error", durationMs: 3200 }),
+    }),
+    [show]
+  );
+
+  const dismiss = useCallback(() => {
+    setToast(null);
+  }, []);
+
+  return { api, toast, dismiss };
+}
+
+export function ToastViewport({
+  toast,
+  onDismiss,
+  placement = "app-shell",
+}: {
+  toast: ToastState | null;
+  onDismiss: () => void;
+  placement?: ToastViewportPlacement;
+}) {
+  const { theme } = useUnistyles();
+  const insets = useSafeAreaInsets();
+  const opacity = useRef(new Animated.Value(0)).current;
+  const translateY = useRef(new Animated.Value(-8)).current;
+  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+
+  const clearTimer = useCallback(() => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+  }, []);
+
+  const animateOut = useCallback(() => {
+    clearTimer();
+    Animated.parallel([
+      Animated.timing(opacity, {
+        toValue: 0,
+        duration: 140,
+        easing: Easing.out(Easing.quad),
+        useNativeDriver: true,
+      }),
+      Animated.timing(translateY, {
+        toValue: -8,
+        duration: 140,
+        easing: Easing.out(Easing.quad),
+        useNativeDriver: true,
+      }),
+    ]).start(({ finished }) => {
+      if (finished) {
+        onDismiss();
+      }
+    });
+  }, [clearTimer, onDismiss, opacity, translateY]);
+
+  useEffect(() => {
+    if (!toast) {
+      clearTimer();
+      opacity.setValue(0);
+      translateY.setValue(-8);
+      return;
+    }
+
+    clearTimer();
+    opacity.setValue(0);
+    translateY.setValue(-8);
+
+    Animated.parallel([
+      Animated.timing(opacity, {
+        toValue: 1,
+        duration: 140,
+        easing: Easing.out(Easing.quad),
+        useNativeDriver: true,
+      }),
+      Animated.timing(translateY, {
+        toValue: 0,
+        duration: 140,
+        easing: Easing.out(Easing.quad),
+        useNativeDriver: true,
+      }),
+    ]).start();
+
+    timeoutRef.current = setTimeout(() => {
+      animateOut();
+    }, toast.durationMs);
+
+    return () => {
+      clearTimer();
+    };
+  }, [animateOut, clearTimer, opacity, toast, translateY]);
+
+  if (!toast) {
+    return null;
+  }
+
+  const isMobile =
+    UnistylesRuntime.breakpoint === "xs" || UnistylesRuntime.breakpoint === "sm";
+  const headerHeight = isMobile ? HEADER_INNER_HEIGHT_MOBILE : HEADER_INNER_HEIGHT;
+  const headerTopPadding = isMobile ? HEADER_TOP_PADDING_MOBILE : 0;
+  const topOffset =
+    placement === "app-shell"
+      ? insets.top + headerTopPadding + headerHeight + theme.spacing[2]
+      : theme.spacing[3];
+
+  const icon =
+    toast.icon ?? (
+      toast.variant === "success" ? (
+        <CheckCircle2 size={18} color={theme.colors.primary} />
+      ) : toast.variant === "error" ? (
+        <AlertTriangle size={18} color={theme.colors.destructive} />
+      ) : null
+    );
+
+  const content = (
+    <View style={styles.container} pointerEvents="box-none">
+      <Animated.View
+        testID={toast.testID ?? "app-toast"}
+        style={[
+          styles.toast,
+          toast.variant === "success" ? styles.toastSuccess : null,
+          toast.variant === "error" ? styles.toastError : null,
+          {
+            marginTop: topOffset,
+            opacity,
+            transform: [{ translateY }],
+          },
+        ]}
+        accessibilityRole="alert"
+      >
+        {icon ? <View style={styles.iconSlot}>{icon}</View> : null}
+        {typeof toast.content === "string" ? (
+          <Text
+            testID="app-toast-message"
+            style={[
+              styles.message,
+              toast.variant === "error" ? styles.messageError : null,
+            ]}
+            numberOfLines={2}
+          >
+            {toast.content}
+          </Text>
+        ) : (
+          <View testID="app-toast-message" style={styles.contentSlot}>
+            {toast.content}
+          </View>
+        )}
+      </Animated.View>
+    </View>
+  );
+
+  if (
+    placement === "app-shell" &&
+    Platform.OS === "web" &&
+    typeof document !== "undefined"
+  ) {
+    return createPortal(content, getOverlayRoot());
+  }
+
+  return content;
+}
+
+const styles = StyleSheet.create((theme) => ({
+  container: {
+    position: "absolute",
+    left: theme.spacing[4],
+    right: theme.spacing[4],
+    top: 0,
+    zIndex: OVERLAY_Z.toast,
+    alignItems: "center",
+  },
+  toast: {
+    alignSelf: "center",
+    maxWidth: "92%",
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[2],
+    backgroundColor: theme.colors.surface0,
+    borderRadius: theme.borderRadius.full,
+    borderWidth: theme.borderWidth[1],
+    borderColor: theme.colors.border,
+    paddingVertical: theme.spacing[2],
+    paddingHorizontal: theme.spacing[3],
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.15,
+    shadowRadius: 8,
+    elevation: 8,
+  },
+  toastSuccess: {
+    borderColor: theme.colors.border,
+  },
+  toastError: {
+    borderColor: theme.colors.destructive,
+  },
+  iconSlot: {
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  contentSlot: {
+    flexShrink: 1,
+    minWidth: 0,
+  },
+  message: {
+    flexShrink: 1,
+    color: theme.colors.foreground,
+    fontSize: theme.fontSize.sm,
+    fontWeight: theme.fontWeight.normal,
+  },
+  messageError: {
+    color: theme.colors.foreground,
+  },
+}));

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

@@ -243,9 +243,79 @@ export function ToolCallDetailsContent({
       );
     }
   } else if (detail?.type === "search") {
+    const searchSections: ReactNode[] = [];
+    if (detail.query) {
+      searchSections.push(
+        <View key="search-query" style={styles.section}>
+          <Text selectable style={styles.scrollText}>{detail.query}</Text>
+        </View>
+      );
+    }
+    if (detail.content) {
+      searchSections.push(
+        <View key="search-content" style={styles.section}>
+          <ScrollView
+            style={[
+              styles.scrollArea,
+              resolvedMaxHeight !== undefined && { maxHeight: resolvedMaxHeight },
+            ]}
+            contentContainerStyle={styles.scrollContent}
+            nestedScrollEnabled
+            showsVerticalScrollIndicator
+          >
+            <ScrollView horizontal nestedScrollEnabled showsHorizontalScrollIndicator>
+              <Text selectable style={styles.scrollText}>{detail.content}</Text>
+            </ScrollView>
+          </ScrollView>
+        </View>
+      );
+    }
+    if (detail.filePaths && detail.filePaths.length > 0) {
+      searchSections.push(
+        <View key="search-files" style={styles.section}>
+          <Text selectable style={styles.scrollText}>{detail.filePaths.join("\n")}</Text>
+        </View>
+      );
+    }
+    if (detail.webResults && detail.webResults.length > 0) {
+      searchSections.push(
+        <View key="search-web-results" style={styles.section}>
+          <Text selectable style={styles.scrollText}>
+            {detail.webResults.map((entry) => `${entry.title}\n${entry.url}`).join("\n\n")}
+          </Text>
+        </View>
+      );
+    }
+    if (detail.annotations && detail.annotations.length > 0) {
+      searchSections.push(
+        <View key="search-annotations" style={styles.section}>
+          <Text selectable style={styles.scrollText}>{detail.annotations.join("\n\n")}</Text>
+        </View>
+      );
+    }
+    sections.push(...searchSections);
+  } else if (detail?.type === "fetch") {
     sections.push(
-      <View key="search" style={styles.section}>
-        <Text selectable style={styles.scrollText}>{detail.query}</Text>
+      <View
+        key="fetch"
+        style={[styles.section, shouldFill && styles.fillHeight]}
+      >
+        <ScrollView
+          style={[
+            styles.scrollArea,
+            resolvedMaxHeight !== undefined && { maxHeight: resolvedMaxHeight },
+            shouldFill && styles.fillHeight,
+          ]}
+          contentContainerStyle={styles.scrollContent}
+          nestedScrollEnabled
+          showsVerticalScrollIndicator
+        >
+          <ScrollView horizontal nestedScrollEnabled showsHorizontalScrollIndicator>
+            <Text selectable style={styles.scrollText}>
+              {detail.result ? `${detail.url}\n\n${detail.result}` : detail.url}
+            </Text>
+          </ScrollView>
+        </ScrollView>
       </View>
     );
   } else if (detail?.type === "plain_text") {

packages/app/src/constants/layout.ts

@@ -1,5 +1,5 @@
 import { Platform } from "react-native";
-import { getTauri } from "@/utils/tauri";
+import { isDesktop, isDesktopMac } from "@/desktop/host";
 
 export const FOOTER_HEIGHT = 75;
 
@@ -14,60 +14,56 @@ export const HEADER_TOP_PADDING_MOBILE = 8;
 // Max width for chat content (stream view, input area, new agent form)
 export const MAX_CONTENT_WIDTH = 820;
 
-// Tauri desktop app constants for macOS traffic light buttons
+// Desktop app constants for macOS traffic light buttons
 // These buttons (close/minimize/maximize) overlay the top-left corner
-export const TAURI_TRAFFIC_LIGHT_WIDTH = 78;
-export const TAURI_TRAFFIC_LIGHT_HEIGHT = 56;
+export const DESKTOP_TRAFFIC_LIGHT_WIDTH = 78;
+export const DESKTOP_TRAFFIC_LIGHT_HEIGHT = 45;
 
-// Check if running in Tauri desktop app (any OS)
-function isTauri(): boolean {
+// Check if running in desktop app (any OS)
+function isDesktopEnvironment(): boolean {
   if (Platform.OS !== "web") return false;
-  return getTauri() !== null;
+  return isDesktop();
 }
 
-// Check if running in Tauri desktop app on macOS
-function isTauriMac(): boolean {
+// Check if running in desktop host on macOS
+function isDesktopEnvironmentMac(): boolean {
   if (Platform.OS !== "web") return false;
-  if (typeof window === "undefined") return false;
-  if (getTauri() === null) return false;
-  // Check for macOS via user agent
-  const ua = navigator.userAgent;
-  return ua.includes("Mac OS") || ua.includes("Macintosh");
+  return isDesktopMac();
 }
 
-// Cached result - only cache true, keep checking if false (in case Tauri globals load later)
-let _isTauriMacCached: boolean | null = null;
-let _isTauriCached: boolean | null = null;
+// Cached result - only cache true, keep checking if false (in case desktop globals load later)
+let _isDesktopMacCached: boolean | null = null;
+let _isDesktopCached: boolean | null = null;
 
-export function getIsTauriMac(): boolean {
-  if (_isTauriMacCached === true) {
+export function getIsDesktopMac(): boolean {
+  if (_isDesktopMacCached === true) {
     return true;
   }
-  const result = isTauriMac();
+  const result = isDesktopEnvironmentMac();
   if (result) {
-    _isTauriMacCached = true;
+    _isDesktopMacCached = true;
   }
   return result;
 }
 
-export function getIsTauri(): boolean {
-  if (_isTauriCached === true) {
+export function getIsDesktop(): boolean {
+  if (_isDesktopCached === true) {
     return true;
   }
-  const result = isTauri();
+  const result = isDesktopEnvironment();
   if (result) {
-    _isTauriCached = true;
+    _isDesktopCached = true;
   }
   return result;
 }
 
-// Get traffic light padding values (only non-zero on Tauri macOS)
+// Get traffic light padding values (only non-zero on desktop macOS)
 export function getTrafficLightPadding(): { left: number; top: number } {
-  if (!getIsTauriMac()) {
+  if (!getIsDesktopMac()) {
     return { left: 0, top: 0 };
   }
   return {
-    left: TAURI_TRAFFIC_LIGHT_WIDTH,
-    top: TAURI_TRAFFIC_LIGHT_HEIGHT,
+    left: DESKTOP_TRAFFIC_LIGHT_WIDTH,
+    top: DESKTOP_TRAFFIC_LIGHT_HEIGHT,
   };
 }

packages/app/src/contexts/sidebar-animation-context.tsx

@@ -1,4 +1,4 @@
-import { createContext, useContext, useEffect, useRef, type ReactNode } from "react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, type ReactNode } from "react";
 import { useWindowDimensions } from "react-native";
 import {
   useSharedValue,
@@ -78,7 +78,7 @@ export function SidebarAnimationProvider({ children }: { children: ReactNode })
     }
   }, [isOpen, translateX, backdropOpacity, windowWidth, isGesturing]);
 
-  const animateToOpen = () => {
+  const animateToOpen = useCallback(() => {
     "worklet";
     translateX.value = withTiming(0, {
       duration: ANIMATION_DURATION,
@@ -88,9 +88,9 @@ export function SidebarAnimationProvider({ children }: { children: ReactNode })
       duration: ANIMATION_DURATION,
       easing: ANIMATION_EASING,
     });
-  };
+  }, [translateX, backdropOpacity]);
 
-  const animateToClose = () => {
+  const animateToClose = useCallback(() => {
     "worklet";
     translateX.value = withTiming(-windowWidth, {
       duration: ANIMATION_DURATION,
@@ -100,20 +100,23 @@ export function SidebarAnimationProvider({ children }: { children: ReactNode })
       duration: ANIMATION_DURATION,
       easing: ANIMATION_EASING,
     });
-  };
+  }, [translateX, backdropOpacity, windowWidth]);
+
+  const value = useMemo<SidebarAnimationContextValue>(
+    () => ({
+      translateX,
+      backdropOpacity,
+      windowWidth,
+      animateToOpen,
+      animateToClose,
+      isGesturing,
+      closeGestureRef,
+    }),
+    [translateX, backdropOpacity, windowWidth, animateToOpen, animateToClose, isGesturing, closeGestureRef]
+  );
 
   return (
-    <SidebarAnimationContext.Provider
-      value={{
-        translateX,
-        backdropOpacity,
-        windowWidth,
-        animateToOpen,
-        animateToClose,
-        isGesturing,
-        closeGestureRef,
-      }}
-    >
+    <SidebarAnimationContext.Provider value={value}>
       {children}
     </SidebarAnimationContext.Provider>
   );

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

@@ -1,62 +1,9 @@
+import { createContext, useContext, type ReactNode } from "react";
 import {
-  createContext,
-  useCallback,
-  useContext,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-  type ReactNode,
-} from "react";
-import { createPortal } from "react-dom";
-import { getOverlayRoot, OVERLAY_Z } from "../lib/overlay-root";
-import {
-  Animated,
-  Easing,
-  Platform,
-  Text,
-  ToastAndroid,
-  View,
-} from "react-native";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { StyleSheet, UnistylesRuntime, useUnistyles } from "react-native-unistyles";
-import { CheckCircle2, AlertTriangle } from "lucide-react-native";
-import {
-  HEADER_INNER_HEIGHT,
-  HEADER_INNER_HEIGHT_MOBILE,
-  HEADER_TOP_PADDING_MOBILE,
-} from "@/constants/layout";
-
-type ToastVariant = "default" | "success" | "error";
-
-export type ToastShowOptions = {
-  icon?: ReactNode;
-  variant?: ToastVariant;
-  durationMs?: number;
-  /**
-   * Set to true to use OS toast on Android.
-   */
-  nativeAndroid?: boolean;
-  testID?: string;
-};
-
-type ToastState = {
-  id: number;
-  content: ReactNode;
-  nativeMessage: string | null;
-  icon?: ReactNode;
-  variant: ToastVariant;
-  durationMs: number;
-  testID?: string;
-};
-
-export type ToastApi = {
-  show: (content: ReactNode, options?: ToastShowOptions) => void;
-  copied: (label?: string) => void;
-  error: (message: string) => void;
-};
-
-const DEFAULT_DURATION_MS = 2200;
+  ToastViewport,
+  useToastHost,
+  type ToastApi,
+} from "@/components/toast-host";
 
 const ToastContext = createContext<ToastApi | null>(null);
 
@@ -69,259 +16,12 @@ export function useToast(): ToastApi {
 }
 
 export function ToastProvider({ children }: { children: ReactNode }) {
-  const [toast, setToast] = useState<ToastState | null>(null);
-  const idRef = useRef(0);
-
-  const show = useCallback(
-    (content: ReactNode, options?: ToastShowOptions) => {
-      const nativeMessage =
-        typeof content === "string"
-          ? content.trim()
-          : null;
-      if (!content || nativeMessage === "") return;
-
-      const variant = options?.variant ?? "default";
-      const durationMs = options?.durationMs ?? DEFAULT_DURATION_MS;
-      const nativeAndroid = options?.nativeAndroid ?? false;
-
-      if (Platform.OS === "android" && nativeAndroid && nativeMessage) {
-        const duration =
-          durationMs <= 2500
-            ? ToastAndroid.SHORT
-            : ToastAndroid.LONG;
-        ToastAndroid.showWithGravity(
-          nativeMessage,
-          duration,
-          ToastAndroid.TOP
-        );
-        return;
-      }
-
-      idRef.current += 1;
-      setToast({
-        id: idRef.current,
-        content,
-        nativeMessage,
-        icon: options?.icon,
-        variant,
-        durationMs,
-        testID: options?.testID,
-      });
-    },
-    []
-  );
-
-  const api = useMemo<ToastApi>(
-    () => ({
-      show,
-      copied: (label?: string) =>
-        show(label ? `Copied ${label}` : "Copied", {
-          variant: "success",
-          icon: <CheckCircle2 size={18} />,
-        }),
-      error: (message: string) => show(message, { variant: "error", durationMs: 3200 }),
-    }),
-    [show]
-  );
+  const { api, toast, dismiss } = useToastHost();
 
   return (
     <ToastContext.Provider value={api}>
       {children}
-      <ToastViewport toast={toast} onDismiss={() => setToast(null)} />
+      <ToastViewport toast={toast} onDismiss={dismiss} />
     </ToastContext.Provider>
   );
 }
-
-function ToastViewport({
-  toast,
-  onDismiss,
-}: {
-  toast: ToastState | null;
-  onDismiss: () => void;
-}) {
-  const { theme } = useUnistyles();
-  const insets = useSafeAreaInsets();
-  const opacity = useRef(new Animated.Value(0)).current;
-  const translateY = useRef(new Animated.Value(-8)).current;
-  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-
-  const clearTimer = useCallback(() => {
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-      timeoutRef.current = null;
-    }
-  }, []);
-
-  const animateOut = useCallback(() => {
-    clearTimer();
-    Animated.parallel([
-      Animated.timing(opacity, {
-        toValue: 0,
-        duration: 140,
-        easing: Easing.out(Easing.quad),
-        useNativeDriver: true,
-      }),
-      Animated.timing(translateY, {
-        toValue: -8,
-        duration: 140,
-        easing: Easing.out(Easing.quad),
-        useNativeDriver: true,
-      }),
-    ]).start(({ finished }) => {
-      if (finished) {
-        onDismiss();
-      }
-    });
-  }, [clearTimer, onDismiss, opacity, translateY]);
-
-  useEffect(() => {
-    if (!toast) {
-      clearTimer();
-      opacity.setValue(0);
-      translateY.setValue(-8);
-      return;
-    }
-
-    clearTimer();
-    opacity.setValue(0);
-    translateY.setValue(-8);
-
-    Animated.parallel([
-      Animated.timing(opacity, {
-        toValue: 1,
-        duration: 140,
-        easing: Easing.out(Easing.quad),
-        useNativeDriver: true,
-      }),
-      Animated.timing(translateY, {
-        toValue: 0,
-        duration: 140,
-        easing: Easing.out(Easing.quad),
-        useNativeDriver: true,
-      }),
-    ]).start();
-
-    timeoutRef.current = setTimeout(() => {
-      animateOut();
-    }, toast.durationMs);
-
-    return () => {
-      clearTimer();
-    };
-  }, [animateOut, clearTimer, opacity, toast, translateY]);
-
-  if (!toast) {
-    return null;
-  }
-
-  const isMobile =
-    UnistylesRuntime.breakpoint === "xs" || UnistylesRuntime.breakpoint === "sm";
-  const headerHeight = isMobile ? HEADER_INNER_HEIGHT_MOBILE : HEADER_INNER_HEIGHT;
-  const headerTopPadding = isMobile ? HEADER_TOP_PADDING_MOBILE : 0;
-
-  const icon =
-    toast.icon ?? (
-      toast.variant === "success" ? (
-      <CheckCircle2 size={18} color={theme.colors.primary} />
-    ) : toast.variant === "error" ? (
-      <AlertTriangle size={18} color={theme.colors.destructive} />
-    ) : null
-    );
-
-  const content = (
-    <View style={styles.container} pointerEvents="box-none">
-      <Animated.View
-        testID={toast.testID ?? "app-toast"}
-        style={[
-          styles.toast,
-          toast.variant === "success" ? styles.toastSuccess : null,
-          toast.variant === "error" ? styles.toastError : null,
-          {
-            marginTop:
-              insets.top + headerTopPadding + headerHeight + theme.spacing[2],
-            opacity,
-            transform: [{ translateY }],
-          },
-        ]}
-        accessibilityRole="alert"
-      >
-        {icon ? <View style={styles.iconSlot}>{icon}</View> : null}
-        {typeof toast.content === "string" ? (
-          <Text
-            testID="app-toast-message"
-            style={[
-              styles.message,
-              toast.variant === "error" ? styles.messageError : null,
-            ]}
-            numberOfLines={2}
-          >
-            {toast.content}
-          </Text>
-        ) : (
-          <View testID="app-toast-message" style={styles.contentSlot}>
-            {toast.content}
-          </View>
-        )}
-      </Animated.View>
-    </View>
-  );
-
-  // On web, portal to overlay root to control stacking order
-  if (Platform.OS === "web" && typeof document !== "undefined") {
-    return createPortal(content, getOverlayRoot());
-  }
-
-  return content;
-}
-
-const styles = StyleSheet.create((theme) => ({
-  container: {
-    position: "absolute",
-    left: theme.spacing[4],
-    right: theme.spacing[4],
-    top: 0,
-    zIndex: OVERLAY_Z.toast,
-    alignItems: "center",
-  },
-  toast: {
-    alignSelf: "center",
-    maxWidth: "92%",
-    flexDirection: "row",
-    alignItems: "center",
-    gap: theme.spacing[3],
-    backgroundColor: theme.colors.surface0,
-    borderRadius: theme.borderRadius.full,
-    borderWidth: theme.borderWidth[1],
-    borderColor: theme.colors.border,
-    paddingVertical: theme.spacing[3],
-    paddingHorizontal: theme.spacing[4],
-    shadowColor: "#000",
-    shadowOffset: { width: 0, height: 4 },
-    shadowOpacity: 0.15,
-    shadowRadius: 8,
-    elevation: 8,
-  },
-  toastSuccess: {
-    borderColor: theme.colors.border,
-  },
-  toastError: {
-    borderColor: theme.colors.destructive,
-  },
-  iconSlot: {
-    alignItems: "center",
-    justifyContent: "center",
-  },
-  contentSlot: {
-    flexShrink: 1,
-    minWidth: 0,
-  },
-  message: {
-    flexShrink: 1,
-    color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
-    fontWeight: theme.fontWeight.normal,
-  },
-  messageError: {
-    color: theme.colors.foreground,
-  },
-}));

packages/app/src/desktop/attachments/desktop-file-commands.ts

@@ -1,4 +1,4 @@
-import { invokeDesktopCommand } from "@/desktop/tauri/invoke-desktop-command";
+import { invokeDesktopCommand } from "@/desktop/electron/invoke";
 
 interface AttachmentFileResult {
   path: string;

packages/app/src/desktop/attachments/desktop-preview-url.test.ts

@@ -4,7 +4,7 @@ const { invokeDesktopCommandMock } = vi.hoisted(() => ({
   invokeDesktopCommandMock: vi.fn(async () => "AAECAw=="),
 }));
 
-vi.mock("@/desktop/tauri/invoke-desktop-command", () => ({
+vi.mock("@/desktop/electron/invoke", () => ({
   invokeDesktopCommand: invokeDesktopCommandMock,
 }));
 

packages/app/src/desktop/attachments/desktop-preview-url.ts

@@ -1,6 +1,6 @@
 import type { AttachmentMetadata } from "@/attachments/types";
 import { fileUriToPath } from "@/attachments/utils";
-import { invokeDesktopCommand } from "@/desktop/tauri/invoke-desktop-command";
+import { invokeDesktopCommand } from "@/desktop/electron/invoke";
 
 function base64ToUint8Array(base64: string): Uint8Array {
   const binary = atob(base64);

packages/app/src/desktop/components/desktop-permission-row.tsx

@@ -10,6 +10,10 @@ export interface DesktopPermissionRowProps {
   isRequesting: boolean;
   showBorder?: boolean;
   onRequest: () => void;
+  extraActionLabel?: string;
+  isExtraActionBusy?: boolean;
+  isExtraActionDisabled?: boolean;
+  onExtraAction?: () => void;
 }
 
 export function DesktopPermissionRow({
@@ -18,6 +22,10 @@ export function DesktopPermissionRow({
   isRequesting,
   showBorder,
   onRequest,
+  extraActionLabel,
+  isExtraActionBusy = false,
+  isExtraActionDisabled = false,
+  onExtraAction,
 }: DesktopPermissionRowProps) {
   const { theme } = useUnistyles();
   const state = status?.state ?? "unknown";
@@ -36,9 +44,21 @@ export function DesktopPermissionRow({
       </View>
       <View style={styles.permissionRowActions}>
         {isGranted ? (
-          <View style={styles.permissionStatusPill}>
-            <Check size={theme.iconSize.sm} color={theme.colors.foregroundMuted} />
-            <Text style={styles.permissionStatusText}>Granted</Text>
+          <View style={styles.permissionGrantedActions}>
+            <View style={styles.permissionStatusPill}>
+              <Check size={theme.iconSize.sm} color={theme.colors.foregroundMuted} />
+              <Text style={styles.permissionStatusText}>Granted</Text>
+            </View>
+            {extraActionLabel && onExtraAction ? (
+              <Button
+                variant="outline"
+                size="sm"
+                onPress={onExtraAction}
+                disabled={isExtraActionDisabled || isExtraActionBusy}
+              >
+                {isExtraActionBusy ? `${extraActionLabel}...` : extraActionLabel}
+              </Button>
+            ) : null}
           </View>
         ) : (
           <Button variant="outline" size="sm" onPress={onRequest} disabled={isRequesting}>
@@ -75,6 +95,11 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: "flex-end",
     gap: theme.spacing[1],
   },
+  permissionGrantedActions: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[2],
+  },
   permissionStatusPill: {
     flexDirection: "row",
     alignItems: "center",

packages/app/src/desktop/components/desktop-permissions-section.tsx

@@ -13,8 +13,10 @@ export function DesktopPermissionsSection() {
     snapshot,
     isRefreshing,
     requestingPermission,
+    isSendingTestNotification,
     refreshPermissions,
     requestPermission,
+    sendTestNotification,
   } = useDesktopPermissions();
 
   if (!isDesktop) {
@@ -22,6 +24,7 @@ export function DesktopPermissionsSection() {
   }
 
   const isBusy = isRefreshing || requestingPermission !== null;
+  const notificationsGranted = snapshot?.notifications.state === "granted";
 
   return (
     <View style={settingsStyles.section}>
@@ -48,6 +51,12 @@ export function DesktopPermissionsSection() {
           onRequest={() => {
             void requestPermission("notifications");
           }}
+          extraActionLabel="Test"
+          isExtraActionBusy={isSendingTestNotification}
+          isExtraActionDisabled={!notificationsGranted || isBusy}
+          onExtraAction={() => {
+            void sendTestNotification();
+          }}
         />
         <DesktopPermissionRow
           title="Microphone"

packages/app/src/desktop/components/desktop-updates-section.tsx

@@ -20,55 +20,61 @@ import { Button } from '@/components/ui/button'
 import { useAppSettings } from '@/hooks/use-settings'
 import { confirmDialog } from '@/utils/confirm-dialog'
 import { openExternalUrl } from '@/utils/open-external-url'
-import { formatVersionWithPrefix, isVersionMismatch } from '@/desktop/updates/desktop-updates'
+import { getLocalDaemonVersion, isVersionMismatch } from '@/desktop/updates/desktop-updates'
 import {
   getCliSymlinkInstructions,
-  getManagedDaemonLogs,
-  getManagedDaemonPairing,
-  getManagedDaemonStatus,
-  restartManagedDaemon,
-  shouldUseManagedDesktopDaemon,
-  startManagedDaemon,
-  stopManagedDaemon,
+  getDesktopDaemonLogs,
+  getDesktopDaemonPairing,
+  getDesktopDaemonStatus,
+  restartDesktopDaemon,
+  shouldUseDesktopDaemon,
+  startDesktopDaemon,
+  stopDesktopDaemon,
   type CliSymlinkInstructions,
-  type ManagedDaemonLogs,
-  type ManagedPairingOffer,
-  type ManagedDaemonStatus,
-} from '@/desktop/managed-runtime/managed-runtime'
+  type DesktopDaemonLogs,
+  type DesktopDaemonStatus,
+  type DesktopPairingOffer,
+} from '@/desktop/daemon/desktop-daemon'
 
 export interface LocalDaemonSectionProps {
   appVersion: string | null
+  showLifecycleControls: boolean
 }
 
-export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
+export function LocalDaemonSection({
+  appVersion,
+  showLifecycleControls,
+}: LocalDaemonSectionProps) {
   const { theme } = useUnistyles()
-  const showSection = shouldUseManagedDesktopDaemon()
+  const showSection = shouldUseDesktopDaemon()
   const { settings, updateSettings } = useAppSettings()
-  const [managedStatus, setManagedStatus] = useState<ManagedDaemonStatus | null>(null)
+  const [daemonStatus, setDaemonStatus] = useState<DesktopDaemonStatus | null>(null)
+  const [daemonVersion, setDaemonVersion] = useState<string | null>(null)
   const [statusError, setStatusError] = useState<string | null>(null)
   const [isRestartingDaemon, setIsRestartingDaemon] = useState(false)
   const [isUpdatingDaemonManagement, setIsUpdatingDaemonManagement] = useState(false)
   const [isLoadingCliSymlinkInstructions, setIsLoadingCliSymlinkInstructions] = useState(false)
   const [statusMessage, setStatusMessage] = useState<string | null>(null)
   const [cliStatusMessage, setCliStatusMessage] = useState<string | null>(null)
-  const [managedLogs, setManagedLogs] = useState<ManagedDaemonLogs | null>(null)
+  const [daemonLogs, setDaemonLogs] = useState<DesktopDaemonLogs | null>(null)
   const [isLogsModalOpen, setIsLogsModalOpen] = useState(false)
   const [isPairingModalOpen, setIsPairingModalOpen] = useState(false)
   const [isCliSymlinkModalOpen, setIsCliSymlinkModalOpen] = useState(false)
   const [isLoadingPairing, setIsLoadingPairing] = useState(false)
-  const [pairingOffer, setPairingOffer] = useState<ManagedPairingOffer | null>(null)
+  const [pairingOffer, setPairingOffer] = useState<DesktopPairingOffer | null>(null)
   const [cliSymlinkInstructions, setCliSymlinkInstructions] =
     useState<CliSymlinkInstructions | null>(null)
   const [pairingStatusMessage, setPairingStatusMessage] = useState<string | null>(null)
 
-  const loadManagedStatus = useCallback(() => {
+  const loadDaemonData = useCallback(() => {
     if (!showSection) {
       return Promise.resolve()
     }
-    return Promise.all([getManagedDaemonStatus(), getManagedDaemonLogs()])
-      .then(([status, logs]) => {
-        setManagedStatus(status)
-        setManagedLogs(logs)
+    return Promise.all([getDesktopDaemonStatus(), getDesktopDaemonLogs(), getLocalDaemonVersion()])
+      .then(([status, logs, version]) => {
+        setDaemonStatus(status)
+        setDaemonLogs(logs)
+        setDaemonVersion(version.version)
         setStatusError(null)
       })
       .catch((error) => {
@@ -82,35 +88,31 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
       if (!showSection) {
         return undefined
       }
-      void loadManagedStatus()
+      void loadDaemonData()
       return undefined
-    }, [loadManagedStatus, showSection])
+    }, [loadDaemonData, showSection])
   )
 
-  const localDaemonVersionText = formatVersionWithPrefix(managedStatus?.runtimeVersion ?? null)
-  const daemonVersionMismatch = isVersionMismatch(appVersion, managedStatus?.runtimeVersion ?? null)
+  const daemonVersionMismatch = isVersionMismatch(appVersion, daemonVersion)
   const daemonStatusStateText =
-    statusError ?? (managedStatus?.status === 'running' ? managedStatus.status : 'not running')
-  const daemonStatusDetailText = `PID ${managedStatus?.pid ? managedStatus.pid : '—'}`
+    statusError ?? (daemonStatus?.status === 'running' ? daemonStatus.status : 'not running')
+  const daemonStatusDetailText = `PID ${daemonStatus?.pid ? daemonStatus.pid : '—'}`
   const isDaemonManagementPaused = !settings.manageBuiltInDaemon
-  const daemonActionLabel = managedStatus?.status === 'running' ? 'Restart daemon' : 'Start daemon'
+  const daemonActionLabel = daemonStatus?.status === 'running' ? 'Restart daemon' : 'Start daemon'
   const daemonActionMessage =
-    managedStatus?.status === 'running'
+    daemonStatus?.status === 'running'
       ? 'Restarts the built-in daemon.'
       : 'Starts the built-in daemon.'
 
   const handleUpdateLocalDaemon = useCallback(() => {
-    if (!showSection) {
-      return
-    }
-    if (isRestartingDaemon) {
+    if (!showSection || isRestartingDaemon) {
       return
     }
 
     void confirmDialog({
       title: daemonActionLabel,
       message:
-        managedStatus?.status === 'running'
+        daemonStatus?.status === 'running'
           ? 'This will restart the built-in daemon. The app will reconnect automatically.'
           : 'This will start the built-in daemon.',
       confirmLabel: daemonActionLabel,
@@ -124,19 +126,18 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
         setIsRestartingDaemon(true)
         setStatusMessage(null)
 
-        const action =
-          managedStatus?.status === 'running' ? restartManagedDaemon : startManagedDaemon
+        const action = daemonStatus?.status === 'running' ? restartDesktopDaemon : startDesktopDaemon
 
         void action()
           .then((status) => {
-            setManagedStatus(status)
+            setDaemonStatus(status)
             setStatusMessage(
-              managedStatus?.status === 'running' ? 'Daemon restarted.' : 'Daemon started.'
+              daemonStatus?.status === 'running' ? 'Daemon restarted.' : 'Daemon started.'
             )
-            return loadManagedStatus()
+            return loadDaemonData()
           })
           .catch((error) => {
-            console.error('[Settings] Failed to change managed daemon state', error)
+            console.error('[Settings] Failed to change desktop daemon state', error)
             const message = error instanceof Error ? error.message : String(error)
             setStatusMessage(`${daemonActionLabel} failed: ${message}`)
           })
@@ -145,10 +146,10 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
           })
       })
       .catch((error) => {
-        console.error('[Settings] Failed to open managed daemon action confirmation', error)
+        console.error('[Settings] Failed to open desktop daemon action confirmation', error)
         Alert.alert('Error', 'Unable to open the daemon confirmation dialog.')
       })
-  }, [daemonActionLabel, isRestartingDaemon, loadManagedStatus, managedStatus?.status, showSection])
+  }, [daemonActionLabel, daemonStatus?.status, isRestartingDaemon, loadDaemonData, showSection])
 
   const handleToggleDaemonManagement = useCallback(() => {
     if (isUpdatingDaemonManagement) {
@@ -189,13 +190,13 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
         setStatusMessage(null)
 
         const stopPromise =
-          managedStatus?.status === 'running'
-            ? stopManagedDaemon()
-            : Promise.resolve(managedStatus ?? null)
+          daemonStatus?.status === 'running'
+            ? stopDesktopDaemon()
+            : Promise.resolve(daemonStatus ?? null)
 
         void stopPromise
           .then(() => updateSettings({ manageBuiltInDaemon: false }))
-          .then(() => loadManagedStatus())
+          .then(() => loadDaemonData())
           .then(() => {
             setStatusMessage('Built-in daemon paused and stopped.')
           })
@@ -212,9 +213,9 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
         Alert.alert('Error', 'Unable to open the daemon confirmation dialog.')
       })
   }, [
+    daemonStatus,
     isUpdatingDaemonManagement,
-    loadManagedStatus,
-    managedStatus,
+    loadDaemonData,
     settings.manageBuiltInDaemon,
     updateSettings,
   ])
@@ -254,7 +255,7 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
   }, [cliSymlinkInstructions?.commands])
 
   const handleCopyLogPath = useCallback(() => {
-    const logPath = managedLogs?.logPath
+    const logPath = daemonLogs?.logPath
     if (!logPath) {
       return
     }
@@ -267,14 +268,14 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
         console.error('[Settings] Failed to copy log path', error)
         Alert.alert('Error', 'Unable to copy log path.')
       })
-  }, [managedLogs?.logPath])
+  }, [daemonLogs?.logPath])
 
   const handleOpenLogs = useCallback(() => {
-    if (!managedLogs) {
+    if (!daemonLogs) {
       return
     }
     setIsLogsModalOpen(true)
-  }, [managedLogs])
+  }, [daemonLogs])
 
   const handleOpenPairingModal = useCallback(() => {
     if (isLoadingPairing) {
@@ -285,7 +286,7 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
     setIsLoadingPairing(true)
     setPairingStatusMessage(null)
 
-    void getManagedDaemonPairing()
+    void getDesktopDaemonPairing()
       .then((pairing) => {
         setPairingOffer(pairing)
         if (!pairing.relayEnabled || !pairing.url) {
@@ -340,64 +341,68 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
         <View style={styles.row}>
           <View style={styles.rowContent}>
             <Text style={styles.rowTitle}>Status</Text>
-            <Text style={styles.hintText}>Only the built-in managed daemon is shown here.</Text>
+            <Text style={styles.hintText}>Only the built-in desktop daemon is shown here.</Text>
           </View>
           <View style={styles.statusValueGroup}>
             <Text style={styles.valueText}>{daemonStatusStateText}</Text>
             <Text style={styles.valueSubtext}>{daemonStatusDetailText}</Text>
           </View>
         </View>
-        <View style={[styles.row, styles.rowBorder]}>
-          <View style={styles.rowContent}>
-            <Text style={styles.rowTitle}>Daemon management</Text>
-            <Text style={styles.hintText}>
-              {isDaemonManagementPaused
-                ? 'Paused. The built-in daemon stays stopped until you start it again.'
-                : 'Enabled. Paseo can manage the built-in daemon from the desktop app.'}
-            </Text>
-          </View>
-          <Button
-            variant="outline"
-            size="sm"
-            leftIcon={
-              isDaemonManagementPaused ? (
-                <Play size={theme.iconSize.sm} color={theme.colors.foreground} />
-              ) : (
-                <Pause size={theme.iconSize.sm} color={theme.colors.foreground} />
-              )
-            }
-            onPress={handleToggleDaemonManagement}
-            disabled={isUpdatingDaemonManagement}
-          >
-            {isUpdatingDaemonManagement
-              ? isDaemonManagementPaused
-                ? 'Resuming...'
-                : 'Pausing...'
-              : isDaemonManagementPaused
-                ? 'Resume'
-                : 'Pause'}
-          </Button>
-        </View>
-        <View style={[styles.row, styles.rowBorder]}>
-          <View style={styles.rowContent}>
-            <Text style={styles.rowTitle}>{daemonActionLabel}</Text>
-            <Text style={styles.hintText}>{daemonActionMessage}</Text>
-            {statusMessage ? <Text style={styles.statusText}>{statusMessage}</Text> : null}
-          </View>
-          <Button
-            variant="outline"
-            size="sm"
-            leftIcon={<RotateCw size={theme.iconSize.sm} color={theme.colors.foreground} />}
-            onPress={handleUpdateLocalDaemon}
-            disabled={isRestartingDaemon}
-          >
-            {isRestartingDaemon
-              ? managedStatus?.status === 'running'
-                ? 'Restarting...'
-                : 'Starting...'
-              : daemonActionLabel}
-          </Button>
-        </View>
+        {showLifecycleControls ? (
+          <>
+            <View style={[styles.row, styles.rowBorder]}>
+              <View style={styles.rowContent}>
+                <Text style={styles.rowTitle}>Daemon management</Text>
+                <Text style={styles.hintText}>
+                  {isDaemonManagementPaused
+                    ? 'Paused. The built-in daemon stays stopped until you start it again.'
+                    : 'Enabled. Paseo can manage the built-in daemon from the desktop app.'}
+                </Text>
+              </View>
+              <Button
+                variant="outline"
+                size="sm"
+                leftIcon={
+                  isDaemonManagementPaused ? (
+                    <Play size={theme.iconSize.sm} color={theme.colors.foreground} />
+                  ) : (
+                    <Pause size={theme.iconSize.sm} color={theme.colors.foreground} />
+                  )
+                }
+                onPress={handleToggleDaemonManagement}
+                disabled={isUpdatingDaemonManagement}
+              >
+                {isUpdatingDaemonManagement
+                  ? isDaemonManagementPaused
+                    ? 'Resuming...'
+                    : 'Pausing...'
+                  : isDaemonManagementPaused
+                    ? 'Resume'
+                    : 'Pause'}
+              </Button>
+            </View>
+            <View style={[styles.row, styles.rowBorder]}>
+              <View style={styles.rowContent}>
+                <Text style={styles.rowTitle}>{daemonActionLabel}</Text>
+                <Text style={styles.hintText}>{daemonActionMessage}</Text>
+                {statusMessage ? <Text style={styles.statusText}>{statusMessage}</Text> : null}
+              </View>
+              <Button
+                variant="outline"
+                size="sm"
+                leftIcon={<RotateCw size={theme.iconSize.sm} color={theme.colors.foreground} />}
+                onPress={handleUpdateLocalDaemon}
+                disabled={isRestartingDaemon}
+              >
+                {isRestartingDaemon
+                  ? daemonStatus?.status === 'running'
+                    ? 'Restarting...'
+                    : 'Starting...'
+                  : daemonActionLabel}
+              </Button>
+            </View>
+          </>
+        ) : null}
         <View style={[styles.row, styles.rowBorder]}>
           <View style={styles.rowContent}>
             <Text style={styles.rowTitle}>Command line (CLI)</Text>
@@ -417,10 +422,10 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
         <View style={[styles.row, styles.rowBorder]}>
           <View style={styles.rowContent}>
             <Text style={styles.rowTitle}>Log file</Text>
-            <Text style={styles.hintText}>{managedLogs?.logPath ?? 'Log path unavailable.'}</Text>
+            <Text style={styles.hintText}>{daemonLogs?.logPath ?? 'Log path unavailable.'}</Text>
           </View>
           <View style={styles.actionGroup}>
-            {managedLogs?.logPath ? (
+            {daemonLogs?.logPath ? (
               <Button
                 variant="outline"
                 size="sm"
@@ -435,7 +440,7 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
               size="sm"
               leftIcon={<FileText size={theme.iconSize.sm} color={theme.colors.foreground} />}
               onPress={handleOpenLogs}
-              disabled={!managedLogs}
+              disabled={!daemonLogs}
             >
               Open logs
             </Button>
@@ -515,9 +520,9 @@ export function LocalDaemonSection({ appVersion }: LocalDaemonSectionProps) {
         snapPoints={['70%', '92%']}
       >
         <View style={styles.modalBody}>
-          <Text style={styles.hintText}>{managedLogs?.logPath ?? 'Log path unavailable.'}</Text>
+          <Text style={styles.hintText}>{daemonLogs?.logPath ?? 'Log path unavailable.'}</Text>
           <Text style={styles.logOutput} selectable>
-            {managedLogs?.contents.length ? managedLogs.contents : '(log file is empty)'}
+            {daemonLogs?.contents.length ? daemonLogs.contents : '(log file is empty)'}
           </Text>
         </View>
       </AdaptiveModalSheet>
@@ -529,7 +534,7 @@ const ADVANCED_DAEMON_SETTINGS_URL = 'https://paseo.sh/docs/configuration'
 
 function PairingOfferDialogContent(input: {
   isLoading: boolean
-  pairingOffer: ManagedPairingOffer | null
+  pairingOffer: DesktopPairingOffer | null
   statusMessage: string | null
   onCopyLink: () => void
 }) {

packages/app/src/desktop/daemon/desktop-daemon-transport.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, it, vi, beforeEach } from "vitest";
 
-const managedRuntimeMock = vi.hoisted(() => {
+const desktopDaemonMock = vi.hoisted(() => {
   let eventHandler: ((payload: {
     sessionId: string;
     kind: "open" | "message" | "close" | "error";
@@ -40,32 +40,32 @@ const managedRuntimeMock = vi.hoisted(() => {
   };
 });
 
-vi.mock("@/desktop/managed-runtime/managed-runtime", () => ({
-  openLocalTransportSession: managedRuntimeMock.openLocalTransportSession,
-  listenToLocalTransportEvents: managedRuntimeMock.listenToLocalTransportEvents,
-  sendLocalTransportMessage: managedRuntimeMock.sendLocalTransportMessage,
-  closeLocalTransportSession: managedRuntimeMock.closeLocalTransportSession,
+vi.mock("./desktop-daemon", () => ({
+  openLocalTransportSession: desktopDaemonMock.openLocalTransportSession,
+  listenToLocalTransportEvents: desktopDaemonMock.listenToLocalTransportEvents,
+  sendLocalTransportMessage: desktopDaemonMock.sendLocalTransportMessage,
+  closeLocalTransportSession: desktopDaemonMock.closeLocalTransportSession,
 }));
 
-describe("managed-tauri-daemon-transport", () => {
+describe("desktop-daemon-transport", () => {
   beforeEach(() => {
-    managedRuntimeMock.openLocalTransportSession.mockReset();
-    managedRuntimeMock.listenToLocalTransportEvents.mockClear();
-    managedRuntimeMock.sendLocalTransportMessage.mockClear();
-    managedRuntimeMock.closeLocalTransportSession.mockClear();
+    desktopDaemonMock.openLocalTransportSession.mockReset();
+    desktopDaemonMock.listenToLocalTransportEvents.mockClear();
+    desktopDaemonMock.sendLocalTransportMessage.mockClear();
+    desktopDaemonMock.closeLocalTransportSession.mockClear();
   });
 
   it("emits open after the session resolves even if the rust open event raced earlier", async () => {
     let resolveSession!: (sessionId: string) => void;
-    managedRuntimeMock.openLocalTransportSession.mockImplementation(
+    desktopDaemonMock.openLocalTransportSession.mockImplementation(
       () =>
         new Promise<string>((resolve) => {
           resolveSession = resolve;
         })
     );
 
-    const mod = await import("./managed-tauri-daemon-transport");
-    const transportFactory = mod.createTauriLocalDaemonTransportFactory();
+    const mod = await import("./desktop-daemon-transport");
+    const transportFactory = mod.createDesktopLocalDaemonTransportFactory();
     expect(transportFactory).not.toBeNull();
 
     const transport = transportFactory!({
@@ -75,7 +75,7 @@ describe("managed-tauri-daemon-transport", () => {
     const onOpen = vi.fn();
     transport.onOpen(onOpen);
 
-    managedRuntimeMock.emitEvent({
+    desktopDaemonMock.emitEvent({
       sessionId: "local-session-1",
       kind: "open",
     });
@@ -93,21 +93,21 @@ describe("managed-tauri-daemon-transport", () => {
     let resolveListen!: (cleanup: () => void) => void;
     const cleanup = vi.fn();
 
-    managedRuntimeMock.openLocalTransportSession.mockImplementation(
+    desktopDaemonMock.openLocalTransportSession.mockImplementation(
       () =>
         new Promise<string>((resolve) => {
           resolveSession = resolve;
         })
     );
-    managedRuntimeMock.listenToLocalTransportEvents.mockImplementation(
+    desktopDaemonMock.listenToLocalTransportEvents.mockImplementation(
       () =>
         new Promise<() => void>((resolve) => {
           resolveListen = resolve;
         })
     );
 
-    const mod = await import("./managed-tauri-daemon-transport");
-    const transportFactory = mod.createTauriLocalDaemonTransportFactory();
+    const mod = await import("./desktop-daemon-transport");
+    const transportFactory = mod.createDesktopLocalDaemonTransportFactory();
     expect(transportFactory).not.toBeNull();
 
     const transport = transportFactory!({
@@ -121,7 +121,7 @@ describe("managed-tauri-daemon-transport", () => {
     await Promise.resolve();
     await Promise.resolve();
 
-    expect(managedRuntimeMock.closeLocalTransportSession).toHaveBeenCalledWith("local-session-2");
+    expect(desktopDaemonMock.closeLocalTransportSession).toHaveBeenCalledWith("local-session-2");
     expect(cleanup).toHaveBeenCalledTimes(1);
   });
 });

packages/app/src/desktop/daemon/desktop-daemon-transport.ts

@@ -5,7 +5,7 @@ import {
   openLocalTransportSession,
   sendLocalTransportMessage,
   type LocalTransportTarget,
-} from "@/desktop/managed-runtime/managed-runtime";
+} from "./desktop-daemon";
 
 const LOCAL_TRANSPORT_SCHEME = "paseo+local:";
 
@@ -49,7 +49,7 @@ function parseLocalDaemonTransportUrl(url: string): LocalTransportTarget {
   };
 }
 
-export function createTauriLocalDaemonTransportFactory(): DaemonTransportFactory | null {
+export function createDesktopLocalDaemonTransportFactory(): DaemonTransportFactory | null {
   return ({ url }) => {
     const target = parseLocalDaemonTransportUrl(url);
     let sessionId: string | null = null;

packages/app/src/desktop/daemon/desktop-daemon.ts

@@ -1,29 +1,24 @@
-import { invokeDesktopCommand } from '@/desktop/tauri/invoke-desktop-command'
-import { getTauri, isTauriEnvironment } from '@/utils/tauri'
+import { getDesktopHost, isDesktop } from '@/desktop/host'
+import { invokeDesktopCommand } from '@/desktop/electron/invoke'
 
-export type ManagedRuntimeStatus = {
-  runtimeId: string
-  runtimeVersion: string
-  runtimeRoot: string
-}
+export type DesktopDaemonState = 'starting' | 'running' | 'stopped' | 'errored'
 
-export type ManagedDaemonStatus = {
-  runtimeId: string
-  runtimeVersion: string
+export type DesktopDaemonStatus = {
   serverId: string
-  status: string
+  status: DesktopDaemonState
   listen: string
   hostname: string | null
   pid: number | null
   home: string
+  error: string | null
 }
 
-export type ManagedDaemonLogs = {
+export type DesktopDaemonLogs = {
   logPath: string
   contents: string
 }
 
-export type ManagedPairingOffer = {
+export type DesktopPairingOffer = {
   relayEnabled: boolean
   url: string | null
   qr: string | null
@@ -35,12 +30,6 @@ export type CliSymlinkInstructions = {
   commands: string
 }
 
-export type ManagedTcpSettings = {
-  enabled: boolean
-  host: string
-  port: number
-}
-
 export type LocalTransportTarget = {
   transportType: 'socket' | 'pipe'
   transportPath: string
@@ -68,36 +57,42 @@ function toNumberOrNull(value: unknown): number | null {
   return typeof value === 'number' && Number.isFinite(value) ? value : null
 }
 
-function parseManagedRuntimeStatus(raw: unknown): ManagedRuntimeStatus {
-  if (!isRecord(raw)) {
-    throw new Error('Unexpected managed runtime status response.')
-  }
-  return {
-    runtimeId: toStringOrNull(raw.runtimeId) ?? '',
-    runtimeVersion: toStringOrNull(raw.runtimeVersion) ?? '',
-    runtimeRoot: toStringOrNull(raw.runtimeRoot) ?? '',
+function parseDesktopDaemonState(value: unknown): DesktopDaemonState {
+  const normalized = toStringOrNull(value)?.toLowerCase()
+  switch (normalized) {
+    case 'starting':
+      return 'starting'
+    case 'running':
+      return 'running'
+    case 'errored':
+    case 'error':
+      return 'errored'
+    case 'stopped':
+    case 'stopping':
+    case 'unknown':
+    default:
+      return 'stopped'
   }
 }
 
-function parseManagedDaemonStatus(raw: unknown): ManagedDaemonStatus {
+function parseDesktopDaemonStatus(raw: unknown): DesktopDaemonStatus {
   if (!isRecord(raw)) {
-    throw new Error('Unexpected managed daemon status response.')
+    throw new Error('Unexpected desktop daemon status response.')
   }
   return {
-    runtimeId: toStringOrNull(raw.runtimeId) ?? '',
-    runtimeVersion: toStringOrNull(raw.runtimeVersion) ?? '',
     serverId: toStringOrNull(raw.serverId) ?? '',
-    status: toStringOrNull(raw.status) ?? 'unknown',
+    status: parseDesktopDaemonState(raw.status),
     listen: toStringOrNull(raw.listen) ?? '',
     hostname: toStringOrNull(raw.hostname),
     pid: toNumberOrNull(raw.pid),
     home: toStringOrNull(raw.home) ?? '',
+    error: toStringOrNull(raw.error),
   }
 }
 
-function parseManagedDaemonLogs(raw: unknown): ManagedDaemonLogs {
+function parseDesktopDaemonLogs(raw: unknown): DesktopDaemonLogs {
   if (!isRecord(raw)) {
-    throw new Error('Unexpected managed daemon logs response.')
+    throw new Error('Unexpected desktop daemon logs response.')
   }
   return {
     logPath: toStringOrNull(raw.logPath) ?? '',
@@ -105,9 +100,9 @@ function parseManagedDaemonLogs(raw: unknown): ManagedDaemonLogs {
   }
 }
 
-function parseManagedPairingOffer(raw: unknown): ManagedPairingOffer {
+function parseDesktopPairingOffer(raw: unknown): DesktopPairingOffer {
   if (!isRecord(raw)) {
-    throw new Error('Unexpected managed daemon pairing response.')
+    throw new Error('Unexpected desktop daemon pairing response.')
   }
   return {
     relayEnabled: raw.relayEnabled === true,
@@ -127,36 +122,32 @@ function parseCliSymlinkInstructionsInternal(raw: unknown): CliSymlinkInstructio
   }
 }
 
-export function shouldUseManagedDesktopDaemon(): boolean {
-  return isTauriEnvironment() && getTauri() !== null
+export function shouldUseDesktopDaemon(): boolean {
+  return isDesktop()
 }
 
-export async function getManagedRuntimeStatus(): Promise<ManagedRuntimeStatus> {
-  return parseManagedRuntimeStatus(await invokeDesktopCommand('managed_runtime_status'))
+export async function getDesktopDaemonStatus(): Promise<DesktopDaemonStatus> {
+  return parseDesktopDaemonStatus(await invokeDesktopCommand('desktop_daemon_status'))
 }
 
-export async function getManagedDaemonStatus(): Promise<ManagedDaemonStatus> {
-  return parseManagedDaemonStatus(await invokeDesktopCommand('managed_daemon_status'))
+export async function startDesktopDaemon(): Promise<DesktopDaemonStatus> {
+  return parseDesktopDaemonStatus(await invokeDesktopCommand('start_desktop_daemon'))
 }
 
-export async function startManagedDaemon(): Promise<ManagedDaemonStatus> {
-  return parseManagedDaemonStatus(await invokeDesktopCommand('start_managed_daemon'))
+export async function stopDesktopDaemon(): Promise<DesktopDaemonStatus> {
+  return parseDesktopDaemonStatus(await invokeDesktopCommand('stop_desktop_daemon'))
 }
 
-export async function stopManagedDaemon(): Promise<ManagedDaemonStatus> {
-  return parseManagedDaemonStatus(await invokeDesktopCommand('stop_managed_daemon'))
+export async function restartDesktopDaemon(): Promise<DesktopDaemonStatus> {
+  return parseDesktopDaemonStatus(await invokeDesktopCommand('restart_desktop_daemon'))
 }
 
-export async function restartManagedDaemon(): Promise<ManagedDaemonStatus> {
-  return parseManagedDaemonStatus(await invokeDesktopCommand('restart_managed_daemon'))
+export async function getDesktopDaemonLogs(): Promise<DesktopDaemonLogs> {
+  return parseDesktopDaemonLogs(await invokeDesktopCommand('desktop_daemon_logs'))
 }
 
-export async function getManagedDaemonLogs(): Promise<ManagedDaemonLogs> {
-  return parseManagedDaemonLogs(await invokeDesktopCommand('managed_daemon_logs'))
-}
-
-export async function getManagedDaemonPairing(): Promise<ManagedPairingOffer> {
-  return parseManagedPairingOffer(await invokeDesktopCommand('managed_daemon_pairing'))
+export async function getDesktopDaemonPairing(): Promise<DesktopPairingOffer> {
+  return parseDesktopPairingOffer(await invokeDesktopCommand('desktop_daemon_pairing'))
 }
 
 export function parseCliSymlinkInstructions(raw: unknown): CliSymlinkInstructions {
@@ -171,27 +162,18 @@ export async function getCliSymlinkInstructions(): Promise<CliSymlinkInstruction
   return parseCliSymlinkInstructions(await invokeDesktopCommand('cli_symlink_instructions'))
 }
 
-export async function updateManagedDaemonTcpSettings(
-  settings: ManagedTcpSettings
-): Promise<ManagedDaemonStatus> {
-  return parseManagedDaemonStatus(
-    await invokeDesktopCommand('update_managed_daemon_tcp_settings', { settings })
-  )
-}
-
 export type LocalTransportEventUnlisten = () => void
 export type LocalTransportEventHandler = (payload: LocalTransportEventPayload) => void
 
 export async function listenToLocalTransportEvents(
   handler: LocalTransportEventHandler
 ): Promise<LocalTransportEventUnlisten> {
-  const listen = getTauri()?.event?.listen
+  const listen = getDesktopHost()?.events?.on
   if (typeof listen !== 'function') {
-    throw new Error('Tauri event API is unavailable.')
+    throw new Error('Desktop events API is unavailable.')
   }
-  const unlisten = await listen('local-daemon-transport-event', (event: unknown) => {
-    const payload = isRecord(event) && isRecord(event.payload) ? event.payload : null
-    if (!payload) {
+  const unlisten = await listen('local-daemon-transport-event', (payload: unknown) => {
+    if (!isRecord(payload)) {
       return
     }
     handler({

packages/app/src/desktop/electron/events.ts

@@ -0,0 +1,27 @@
+import { getDesktopHost } from "@/desktop/host";
+
+export type DesktopEventUnlisten = () => void;
+
+type EventEnvelope = {
+  payload?: unknown;
+};
+
+export async function listenToDesktopEvent<TPayload>(
+  event: string,
+  handler: (payload: TPayload) => void
+): Promise<DesktopEventUnlisten> {
+  const listen = getDesktopHost()?.events?.on;
+  if (typeof listen !== "function") {
+    throw new Error("Desktop event API is unavailable.");
+  }
+
+  const unlisten = await listen(event, (rawEvent: unknown) => {
+    const payload =
+      typeof rawEvent === "object" && rawEvent !== null && "payload" in rawEvent
+        ? (rawEvent as EventEnvelope).payload
+        : rawEvent;
+    handler(payload as TPayload);
+  });
+
+  return typeof unlisten === "function" ? unlisten : () => {};
+}

packages/app/src/desktop/electron/host.ts

@@ -0,0 +1,12 @@
+import type { DesktopHostBridge } from "@/desktop/host";
+
+export function getElectronHost(): DesktopHostBridge | null {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  const host = window.paseoDesktop;
+  if (!host || typeof host !== "object") {
+    return null;
+  }
+  return host;
+}

packages/app/src/desktop/electron/invoke.ts

@@ -1,13 +1,12 @@
-import { getTauri } from "@/utils/tauri";
+import { getDesktopHost } from "@/desktop/host";
 
 export async function invokeDesktopCommand<T>(
   command: string,
   args?: Record<string, unknown>
 ): Promise<T> {
-  const invoke = getTauri()?.core?.invoke;
+  const invoke = getDesktopHost()?.invoke;
   if (typeof invoke !== "function") {
-    throw new Error("Tauri invoke() is unavailable in this environment.");
+    throw new Error("Desktop invoke() is unavailable in this environment.");
   }
-
   return (await invoke(command, args)) as T;
 }

packages/app/src/desktop/electron/window.ts

@@ -0,0 +1,29 @@
+import { getDesktopHost, type DesktopWindowBridge } from "@/desktop/host";
+
+export function getDesktopWindow(): DesktopWindowBridge | null {
+  const getter = getDesktopHost()?.window?.getCurrentWindow;
+  if (typeof getter !== "function") {
+    return null;
+  }
+  try {
+    return getter() ?? null;
+  } catch {
+    return null;
+  }
+}
+
+export async function toggleDesktopMaximize(): Promise<void> {
+  const win = getDesktopWindow();
+  if (!win || typeof win.toggleMaximize !== "function") {
+    return;
+  }
+  await win.toggleMaximize();
+}
+
+export async function isDesktopFullscreen(): Promise<boolean> {
+  const win = getDesktopWindow();
+  if (!win || typeof win.isFullscreen !== "function") {
+    return false;
+  }
+  return await win.isFullscreen();
+}

packages/app/src/desktop/host.ts

@@ -0,0 +1,113 @@
+import { Platform } from "react-native";
+import { getElectronHost } from "@/desktop/electron/host";
+
+export type DesktopNotificationPermission = "granted" | "denied" | "default";
+
+export interface DesktopDialogAskOptions {
+  title?: string;
+  okLabel?: string;
+  cancelLabel?: string;
+  kind?: "info" | "warning" | "error";
+}
+
+export interface DesktopDialogOpenOptions {
+  title?: string;
+  defaultPath?: string;
+  directory?: boolean;
+  multiple?: boolean;
+  filters?: Array<{
+    name: string;
+    extensions: string[];
+  }>;
+}
+
+export interface DesktopDialogBridge {
+  ask?: (message: string, options?: DesktopDialogAskOptions) => Promise<boolean>;
+  open?: (
+    options?: DesktopDialogOpenOptions
+  ) => Promise<string | string[] | null>;
+}
+
+export interface DesktopNotificationBridge {
+  isSupported?: () => Promise<boolean>;
+  sendNotification?: (
+    payload: string | { title: string; body?: string; data?: Record<string, unknown> }
+  ) => Promise<boolean>;
+}
+
+export interface DesktopOpenerBridge {
+  openUrl?: (url: string) => Promise<void>;
+}
+
+export interface DesktopWindowBridge {
+  label?: string;
+  startMove?: (screenX: number, screenY: number) => void;
+  moving?: (screenX: number, screenY: number) => void;
+  endMove?: () => void;
+  toggleMaximize?: () => Promise<void>;
+  isFullscreen?: () => Promise<boolean>;
+  onResized?: <TEvent = unknown>(
+    handler: (event: TEvent) => void
+  ) => Promise<() => void> | (() => void);
+  setBadgeCount?: (count?: number) => Promise<void>;
+  onDragDropEvent?: <TEvent = unknown>(
+    handler: (event: TEvent) => void
+  ) => Promise<() => void> | (() => void);
+}
+
+export interface DesktopWindowModuleBridge {
+  getCurrentWindow?: () => DesktopWindowBridge;
+}
+
+export interface DesktopEventsBridge {
+  on?: (
+    event: string,
+    handler: (payload: unknown) => void
+  ) => Promise<() => void> | (() => void);
+}
+
+export interface DesktopInvokeBridge {
+  invoke?: (command: string, args?: Record<string, unknown>) => Promise<unknown>;
+}
+
+export interface DesktopHostBridge {
+  platform?: string;
+  invoke?: DesktopInvokeBridge["invoke"];
+  events?: DesktopEventsBridge;
+  window?: DesktopWindowModuleBridge;
+  dialog?: DesktopDialogBridge;
+  notification?: DesktopNotificationBridge;
+  opener?: DesktopOpenerBridge;
+}
+
+declare global {
+  interface Window {
+    paseoDesktop?: DesktopHostBridge;
+  }
+}
+
+export function getDesktopHost(): DesktopHostBridge | null {
+  if (Platform.OS !== "web") {
+    return null;
+  }
+  return getElectronHost();
+}
+
+export function isDesktop(): boolean {
+  return getDesktopHost() !== null;
+}
+
+export function isDesktopMac(): boolean {
+  if (!isDesktop()) {
+    return false;
+  }
+  if (typeof navigator === "undefined") {
+    return false;
+  }
+  const hostPlatform = getDesktopHost()?.platform?.toLowerCase();
+  if (hostPlatform === "darwin" || hostPlatform === "mac" || hostPlatform === "macos") {
+    return true;
+  }
+  const ua = navigator.userAgent;
+  return ua.includes("Mac OS") || ua.includes("Macintosh");
+}

packages/app/src/desktop/managed-runtime/managed-runtime.test.ts

@@ -1,24 +0,0 @@
-import { describe, expect, it } from "vitest";
-import { parseCliSymlinkInstructions } from "./managed-runtime";
-
-describe("parseCliSymlinkInstructions", () => {
-  it("parses CLI symlink instructions from the desktop backend", () => {
-    expect(
-      parseCliSymlinkInstructions({
-        title: "Add paseo to your shell",
-        detail: "Create a symlink to the Paseo desktop executable.",
-        commands: "sudo ln -sf /Applications/Paseo.app/Contents/MacOS/Paseo /usr/local/bin/paseo",
-      })
-    ).toEqual({
-      title: "Add paseo to your shell",
-      detail: "Create a symlink to the Paseo desktop executable.",
-      commands: "sudo ln -sf /Applications/Paseo.app/Contents/MacOS/Paseo /usr/local/bin/paseo",
-    });
-  });
-
-  it("rejects non-object payloads", () => {
-    expect(() => parseCliSymlinkInstructions(null)).toThrow(
-      "Unexpected CLI symlink instructions response."
-    );
-  });
-});

packages/app/src/desktop/notifications/desktop-notifications.ts

@@ -1,58 +0,0 @@
-import { invokeDesktopCommand } from "@/desktop/tauri/invoke-desktop-command";
-import { getTauri } from "@/utils/tauri";
-
-export const DESKTOP_NOTIFICATION_CLICK_EVENT = "desktop-notification-click";
-
-export interface DesktopNotificationInput {
-  title: string;
-  body?: string;
-  data?: Record<string, unknown>;
-}
-
-export interface DesktopNotificationClickPayload {
-  data?: Record<string, unknown>;
-}
-
-export type DesktopNotificationClickHandler = (
-  payload: DesktopNotificationClickPayload
-) => void;
-
-export type DesktopNotificationClickUnlisten = () => void;
-
-function isRecord(value: unknown): value is Record<string, unknown> {
-  return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-
-export async function sendDesktopNotification(
-  input: DesktopNotificationInput
-): Promise<boolean> {
-  try {
-    await invokeDesktopCommand("send_desktop_notification", { input });
-    return true;
-  } catch (error) {
-    console.warn("[OSNotifications][Desktop] Failed to send desktop notification", error);
-    return false;
-  }
-}
-
-export async function listenToDesktopNotificationClicks(
-  handler: DesktopNotificationClickHandler
-): Promise<DesktopNotificationClickUnlisten> {
-  const listen = getTauri()?.event?.listen;
-  if (typeof listen !== "function") {
-    throw new Error("Tauri event API is unavailable.");
-  }
-
-  const unlisten = await listen(DESKTOP_NOTIFICATION_CLICK_EVENT, (event: unknown) => {
-    const payload = isRecord(event) && isRecord(event.payload) ? event.payload : null;
-    if (!payload) {
-      return;
-    }
-
-    handler({
-      data: isRecord(payload.data) ? payload.data : undefined,
-    });
-  });
-
-  return typeof unlisten === "function" ? unlisten : () => {};
-}

packages/app/src/desktop/permissions/desktop-permissions.test.ts

@@ -4,14 +4,17 @@ type MockPlatform = 'web' | 'ios' | 'android'
 
 type GlobalSnapshot = {
   Notification: unknown
-  __TAURI__: unknown
   navigatorDescriptor?: PropertyDescriptor
+  paseoDesktop: unknown
 }
 
 const originalGlobals: GlobalSnapshot = {
   Notification: (globalThis as { Notification?: unknown }).Notification,
-  __TAURI__: (globalThis as { __TAURI__?: unknown }).__TAURI__,
   navigatorDescriptor: Object.getOwnPropertyDescriptor(globalThis, 'navigator'),
+  paseoDesktop:
+    typeof window === 'undefined'
+      ? undefined
+      : (window as { paseoDesktop?: unknown }).paseoDesktop,
 }
 
 function setNavigator(value: unknown): void {
@@ -24,13 +27,16 @@ function setNavigator(value: unknown): void {
 
 function restoreGlobals(): void {
   ;(globalThis as { Notification?: unknown }).Notification = originalGlobals.Notification
-  ;(globalThis as { __TAURI__?: unknown }).__TAURI__ = originalGlobals.__TAURI__
 
   if (originalGlobals.navigatorDescriptor) {
     Object.defineProperty(globalThis, 'navigator', originalGlobals.navigatorDescriptor)
   } else {
     delete (globalThis as { navigator?: unknown }).navigator
   }
+
+  if (typeof window !== 'undefined') {
+    ;(window as { paseoDesktop?: unknown }).paseoDesktop = originalGlobals.paseoDesktop
+  }
 }
 
 async function loadModuleForPlatform(platform: MockPlatform) {
@@ -47,20 +53,20 @@ describe('desktop-permissions', () => {
     restoreGlobals()
   })
 
-  it('shows section only in Tauri web runtime', async () => {
+  it('shows section only in desktop web runtime', async () => {
     const { shouldShowDesktopPermissionSection } = await loadModuleForPlatform('web')
 
     expect(shouldShowDesktopPermissionSection()).toBe(false)
 
-    ;(globalThis as { __TAURI__?: unknown }).__TAURI__ = { notification: {} }
+    ;(window as { paseoDesktop?: unknown }).paseoDesktop = {}
     expect(shouldShowDesktopPermissionSection()).toBe(true)
   })
 
   it('reads notification and microphone status', async () => {
-    const isPermissionGranted = vi.fn(async () => false)
-    ;(globalThis as { __TAURI__?: unknown }).__TAURI__ = {
-      notification: { isPermissionGranted },
+    class MockNotification {
+      static permission = 'default'
     }
+    ;(globalThis as { Notification?: unknown }).Notification = MockNotification
     setNavigator({
       permissions: {
         query: vi.fn(async () => ({ state: 'granted' })),
@@ -73,9 +79,8 @@ describe('desktop-permissions', () => {
     const { getDesktopPermissionSnapshot } = await loadModuleForPlatform('web')
     const snapshot = await getDesktopPermissionSnapshot()
 
-    expect(snapshot.notifications.state).toBe('not-granted')
+    expect(snapshot.notifications.state).toBe('prompt')
     expect(snapshot.microphone.state).toBe('granted')
-    expect(isPermissionGranted).toHaveBeenCalledTimes(1)
     expect(snapshot.checkedAt).toBeTypeOf('number')
   })
 
@@ -127,20 +132,21 @@ describe('desktop-permissions', () => {
     )
   })
 
-  it('requests notification permission via Tauri', async () => {
-    const requestPermission = vi.fn(async () => 'granted')
-    ;(globalThis as { __TAURI__?: unknown }).__TAURI__ = {
-      notification: { requestPermission },
+  it('requests notification permission via the browser Notification API', async () => {
+    class MockNotification {
+      static permission = 'default'
+      static requestPermission = vi.fn(async () => 'granted')
     }
+    ;(globalThis as { Notification?: unknown }).Notification = MockNotification
 
     const { requestDesktopPermission } = await loadModuleForPlatform('web')
     const result = await requestDesktopPermission({ kind: 'notifications' })
 
     expect(result.state).toBe('granted')
-    expect(requestPermission).toHaveBeenCalledTimes(1)
+    expect(MockNotification.requestPermission).toHaveBeenCalledTimes(1)
   })
 
-  it('falls back to browser Notification permission when Tauri API is unavailable', async () => {
+  it('reads browser Notification permission when available', async () => {
     class MockNotification {
       static permission = 'denied'
     }

packages/app/src/desktop/permissions/desktop-permissions.ts

@@ -1,5 +1,5 @@
 import { Platform } from 'react-native'
-import { getTauri, type TauriNotificationPermission } from '@/utils/tauri'
+import { getDesktopHost } from '@/desktop/host'
 
 export type DesktopPermissionKind = 'notifications' | 'microphone'
 
@@ -45,7 +45,7 @@ type NavigatorLike = {
 }
 
 export function shouldShowDesktopPermissionSection(): boolean {
-  return Platform.OS === 'web' && getTauri() !== null
+  return Platform.OS === 'web' && getDesktopHost() !== null
 }
 
 function status(input: DesktopPermissionStatus): DesktopPermissionStatus {
@@ -132,27 +132,6 @@ function mapNotificationPermissionString(permission: string): DesktopPermissionS
   })
 }
 
-function mapTauriNotificationPermissionResult(
-  permission: TauriNotificationPermission
-): DesktopPermissionStatus {
-  if (permission === 'granted') {
-    return status({
-      state: 'granted',
-      detail: 'Notifications are allowed by the OS.',
-    })
-  }
-  if (permission === 'denied') {
-    return status({
-      state: 'denied',
-      detail: 'Notifications are denied in system settings.',
-    })
-  }
-  return status({
-    state: 'prompt',
-    detail: 'Notifications have not been granted yet.',
-  })
-}
-
 async function getNotificationPermissionStatus(): Promise<DesktopPermissionStatus> {
   if (Platform.OS !== 'web') {
     return status({
@@ -161,44 +140,30 @@ async function getNotificationPermissionStatus(): Promise<DesktopPermissionStatu
     })
   }
 
-  const tauriNotification = getTauri()?.notification
-  if (tauriNotification) {
-    if (typeof tauriNotification.isPermissionGranted !== 'function') {
-      return status({
-        state: 'unavailable',
-        detail: 'Tauri notification plugin is missing isPermissionGranted().',
-      })
-    }
-
+  const desktopHost = getDesktopHost()
+  if (desktopHost && typeof desktopHost.notification?.isSupported === 'function') {
     try {
-      const granted = await tauriNotification.isPermissionGranted()
-      if (granted) {
-        return status({
-          state: 'granted',
-          detail: 'Tauri reports notifications are granted.',
-        })
-      }
+      const supported = await desktopHost.notification.isSupported()
       return status({
-        state: 'not-granted',
-        detail: 'Tauri reports notifications are not granted. Use Request to prompt.',
-      })
-    } catch (error) {
-      return status({
-        state: 'unknown',
-        detail: `Failed to read notification status: ${getErrorMessage(error)}`,
+        state: supported ? 'granted' : 'unavailable',
+        detail: supported
+          ? 'Desktop notifications are supported.'
+          : 'Desktop notifications are not supported on this platform.',
       })
+    } catch {
+      // Fall through to web API check
     }
   }
 
   const NotificationConstructor = getWebNotificationConstructor()
-  if (!NotificationConstructor || typeof NotificationConstructor.permission !== 'string') {
-    return status({
-      state: 'unavailable',
-      detail: 'Web Notification API is unavailable in this environment.',
-    })
+  if (NotificationConstructor && typeof NotificationConstructor.permission === 'string') {
+    return mapNotificationPermissionString(NotificationConstructor.permission)
   }
 
-  return mapNotificationPermissionString(NotificationConstructor.permission)
+  return status({
+    state: 'unavailable',
+    detail: 'Web Notification API is unavailable in this environment.',
+  })
 }
 
 async function getMicrophonePermissionStatus(): Promise<DesktopPermissionStatus> {
@@ -279,18 +244,11 @@ async function requestNotificationPermissionStatus(): Promise<DesktopPermissionS
     })
   }
 
-  const tauriNotification = getTauri()?.notification
-  if (tauriNotification) {
-    if (typeof tauriNotification.requestPermission !== 'function') {
-      return status({
-        state: 'unavailable',
-        detail: 'Tauri notification plugin is missing requestPermission().',
-      })
-    }
-
+  const NotificationConstructor = getWebNotificationConstructor()
+  if (NotificationConstructor && typeof NotificationConstructor.requestPermission === 'function') {
     try {
-      const permission = await tauriNotification.requestPermission()
-      return mapTauriNotificationPermissionResult(permission)
+      const permission = await NotificationConstructor.requestPermission()
+      return mapNotificationPermissionString(permission)
     } catch (error) {
       return status({
         state: 'unknown',
@@ -299,23 +257,10 @@ async function requestNotificationPermissionStatus(): Promise<DesktopPermissionS
     }
   }
 
-  const NotificationConstructor = getWebNotificationConstructor()
-  if (!NotificationConstructor || typeof NotificationConstructor.requestPermission !== 'function') {
-    return status({
-      state: 'unavailable',
-      detail: 'Web Notification API requestPermission() is unavailable.',
-    })
-  }
-
-  try {
-    const permission = await NotificationConstructor.requestPermission()
-    return mapNotificationPermissionString(permission)
-  } catch (error) {
-    return status({
-      state: 'unknown',
-      detail: `Failed to request notification permission: ${getErrorMessage(error)}`,
-    })
-  }
+  return status({
+    state: 'unavailable',
+    detail: 'Web Notification API requestPermission() is unavailable.',
+  })
 }
 
 async function requestMicrophonePermissionStatus(): Promise<DesktopPermissionStatus> {

packages/app/src/desktop/permissions/use-desktop-permissions.ts

@@ -6,14 +6,17 @@ import {
   type DesktopPermissionKind,
   type DesktopPermissionSnapshot,
 } from "@/desktop/permissions/desktop-permissions";
+import { sendOsNotification } from "@/utils/os-notifications";
 
 export interface UseDesktopPermissionsReturn {
   isDesktop: boolean;
   snapshot: DesktopPermissionSnapshot | null;
   isRefreshing: boolean;
   requestingPermission: DesktopPermissionKind | null;
+  isSendingTestNotification: boolean;
   refreshPermissions: () => Promise<void>;
   requestPermission: (kind: DesktopPermissionKind) => Promise<void>;
+  sendTestNotification: () => Promise<void>;
 }
 
 const EMPTY_NOTIFICATION_STATUS = {
@@ -34,6 +37,7 @@ export function useDesktopPermissions(): UseDesktopPermissionsReturn {
   const [requestingPermission, setRequestingPermission] = useState<DesktopPermissionKind | null>(
     null
   );
+  const [isSendingTestNotification, setIsSendingTestNotification] = useState(false);
 
   useEffect(() => {
     return () => {
@@ -109,6 +113,29 @@ export function useDesktopPermissions(): UseDesktopPermissionsReturn {
     [isDesktop, refreshPermissions]
   );
 
+  const sendTestNotification = useCallback(async () => {
+    if (!isDesktop) {
+      return;
+    }
+
+    setIsSendingTestNotification(true);
+    try {
+      const sent = await sendOsNotification({
+        title: "Paseo notification test",
+        body: "If you can see this, desktop notifications work.",
+      });
+      if (!sent) {
+        console.warn("[Settings] Desktop test notification was not delivered");
+      }
+    } catch (error) {
+      console.error("[Settings] Failed to send desktop test notification", error);
+    } finally {
+      if (isMountedRef.current) {
+        setIsSendingTestNotification(false);
+      }
+    }
+  }, [isDesktop]);
+
   useEffect(() => {
     if (!isDesktop) {
       return;
@@ -122,7 +149,9 @@ export function useDesktopPermissions(): UseDesktopPermissionsReturn {
     snapshot,
     isRefreshing,
     requestingPermission,
+    isSendingTestNotification,
     refreshPermissions,
     requestPermission,
+    sendTestNotification,
   };
 }

packages/app/src/desktop/pick-directory.ts

@@ -0,0 +1,23 @@
+import { getDesktopHost } from '@/desktop/host'
+
+export async function pickDirectory(): Promise<string | null> {
+  const open = getDesktopHost()?.dialog?.open
+  if (typeof open !== 'function') {
+    throw new Error('Desktop dialog open() is unavailable in this environment.')
+  }
+
+  const selection = await open({
+    directory: true,
+    multiple: false,
+  })
+
+  if (selection === null) {
+    return null
+  }
+
+  if (typeof selection === 'string') {
+    return selection
+  }
+
+  throw new Error('Unexpected directory picker response.')
+}

packages/app/src/desktop/updates/desktop-updates.ts

@@ -1,6 +1,6 @@
 import { Platform } from 'react-native'
-import { getTauri } from '@/utils/tauri'
-import { invokeDesktopCommand } from '@/desktop/tauri/invoke-desktop-command'
+import { isDesktop } from '@/desktop/host'
+import { invokeDesktopCommand } from '@/desktop/electron/invoke'
 
 export interface DesktopAppUpdateCheckResult {
   hasUpdate: boolean
@@ -49,7 +49,7 @@ function toNumberOr(defaultValue: number, value: unknown): number {
 }
 
 export function shouldShowDesktopUpdateSection(): boolean {
-  return Platform.OS === 'web' && getTauri() !== null
+  return Platform.OS === 'web' && isDesktop()
 }
 
 export function parseLocalDaemonVersionResult(raw: unknown): LocalDaemonVersionResult {

packages/app/src/hooks/image-attachment-picker.test.ts

@@ -1,21 +1,21 @@
 import { describe, expect, it, vi, beforeEach } from "vitest";
 
-const tauriState = vi.hoisted(() => ({
+const desktopHostState = vi.hoisted(() => ({
   api: null as any,
 }));
 
-vi.mock("@/utils/tauri", () => ({
-  getTauri: () => tauriState.api,
+vi.mock("@/desktop/host", () => ({
+  getDesktopHost: () => desktopHostState.api,
 }));
 
 import {
   normalizePickedImageAssets,
-  openImagePathsWithTauriDialog,
+  openImagePathsWithDesktopDialog,
 } from "./image-attachment-picker";
 
 describe("image-attachment-picker", () => {
   beforeEach(() => {
-    tauriState.api = null;
+    desktopHostState.api = null;
   });
 
   it("normalizes a picked File into a blob source", async () => {
@@ -69,13 +69,13 @@ describe("image-attachment-picker", () => {
     expect(result[0]?.mimeType).toBe("image/png");
   });
 
-  it("uses the tauri dialog api when available", async () => {
+  it("uses the desktop dialog api when available", async () => {
     const open = vi.fn().mockResolvedValue(["/tmp/one.png", "/tmp/two.jpg"]);
-    tauriState.api = {
+    desktopHostState.api = {
       dialog: { open },
     };
 
-    const result = await openImagePathsWithTauriDialog();
+    const result = await openImagePathsWithDesktopDialog();
 
     expect(open).toHaveBeenCalledWith(
       expect.objectContaining({
@@ -87,21 +87,11 @@ describe("image-attachment-picker", () => {
     expect(result).toEqual(["/tmp/one.png", "/tmp/two.jpg"]);
   });
 
-  it("falls back to core invoke for the tauri dialog plugin", async () => {
-    const invoke = vi.fn().mockResolvedValue("/tmp/one.png");
-    tauriState.api = {
-      core: { invoke },
-    };
+  it("throws when desktop dialog API is not available", async () => {
+    desktopHostState.api = {};
 
-    const result = await openImagePathsWithTauriDialog();
-
-    expect(invoke).toHaveBeenCalledWith("plugin:dialog|open", {
-      options: expect.objectContaining({
-        multiple: true,
-        directory: false,
-        title: "Attach images",
-      }),
-    });
-    expect(result).toEqual(["/tmp/one.png"]);
+    await expect(openImagePathsWithDesktopDialog()).rejects.toThrow(
+      "Desktop dialog API is not available."
+    );
   });
 });

packages/app/src/hooks/image-attachment-picker.ts

@@ -1,4 +1,4 @@
-import { getTauri } from "@/utils/tauri";
+import { getDesktopHost } from "@/desktop/host";
 
 export type PickedImageSource =
   | { kind: "file_uri"; uri: string }
@@ -77,15 +77,15 @@ export async function normalizePickedImageAssets(
   );
 }
 
-function normalizeTauriDialogSelection(selection: string | string[] | null): string[] {
+function normalizeDesktopDialogSelection(selection: string | string[] | null): string[] {
   if (!selection) {
     return [];
   }
   return Array.isArray(selection) ? selection : [selection];
 }
 
-export async function openImagePathsWithTauriDialog(): Promise<string[]> {
-  const tauri = getTauri();
+export async function openImagePathsWithDesktopDialog(): Promise<string[]> {
+  const desktop = getDesktopHost();
   const options = {
     directory: false,
     multiple: true,
@@ -93,18 +93,10 @@ export async function openImagePathsWithTauriDialog(): Promise<string[]> {
     title: "Attach images",
   };
 
-  const dialogOpen = tauri?.dialog?.open;
-  if (typeof dialogOpen === "function") {
-    return normalizeTauriDialogSelection(await dialogOpen(options));
+  const dialogOpen = desktop?.dialog?.open;
+  if (typeof dialogOpen !== "function") {
+    throw new Error("Desktop dialog API is not available.");
   }
 
-  const invoke = tauri?.core?.invoke;
-  if (typeof invoke !== "function") {
-    throw new Error("Tauri dialog API is not available.");
-  }
-
-  const result = await invoke("plugin:dialog|open", { options });
-  return normalizeTauriDialogSelection(
-    Array.isArray(result) || typeof result === "string" || result === null ? result : null
-  );
+  return normalizeDesktopDialogSelection(await dialogOpen(options));
 }

packages/app/src/hooks/use-agent-autocomplete.ts

@@ -5,7 +5,7 @@ import { useAgentCommandsQuery, type DraftCommandConfig } from './use-agent-comm
 import { orderAutocompleteOptions } from '@/components/ui/autocomplete-utils'
 import { useAutocomplete } from './use-autocomplete'
 import { useSessionStore } from '@/stores/session-store'
-import { useHostRuntimeSession } from '@/runtime/host-runtime'
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from '@/runtime/host-runtime'
 import {
   applyFileMentionReplacement,
   findActiveFileMention,
@@ -138,7 +138,8 @@ export function useAgentAutocomplete(input: UseAgentAutocompleteInput): AgentAut
     return agentCwd.trim()
   }, [agentCwd, isDraftContext, queryDraftConfig])
 
-  const { client, isConnected } = useHostRuntimeSession(serverId)
+  const client = useHostRuntimeClient(serverId)
+  const isConnected = useHostRuntimeIsConnected(serverId)
 
   const mode: 'command' | 'file' | null = showFileAutocomplete
     ? 'file'

packages/app/src/hooks/use-agent-commands-query.ts

@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import type { AgentProvider } from "@server/server/agent/agent-sdk-types";
 
 const COMMANDS_STALE_TIME = 60_000; // Commands rarely change, cache for 1 minute
@@ -48,7 +48,8 @@ export function useAgentCommandsQuery({
   enabled = true,
   draftConfig,
 }: UseAgentCommandsQueryOptions) {
-  const { client, isConnected } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
+  const isConnected = useHostRuntimeIsConnected(serverId);
 
   const query = useQuery({
     queryKey: commandsQueryKey(serverId, agentId, draftConfig),

packages/app/src/hooks/use-agent-form-state.ts

@@ -10,7 +10,7 @@ import type {
   AgentProvider,
 } from "@server/server/agent/agent-sdk-types";
 import { useHosts } from "@/runtime/host-runtime";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import { useFormPreferences, type FormPreferences } from "./use-form-preferences";
 
 // Explicit overrides from URL params or "New Agent" button
@@ -367,7 +367,8 @@ export function useAgentFormState(
   }, [isVisible]);
 
   // Session state for provider model listing
-  const { client, isConnected } = useHostRuntimeSession(formState.serverId ?? "");
+  const client = useHostRuntimeClient(formState.serverId ?? "");
+  const isConnected = useHostRuntimeIsConnected(formState.serverId ?? "");
 
   const availableProvidersQuery = useQuery({
     queryKey: ["availableProviders", formState.serverId],

packages/app/src/hooks/use-all-agents-list.ts

@@ -3,8 +3,8 @@ import { useHosts } from "@/runtime/host-runtime";
 import { useSessionStore, type Agent } from "@/stores/session-store";
 import {
   getHostRuntimeStore,
-  isHostRuntimeDirectoryLoading,
-  useHostRuntimeSession,
+  useHostRuntimeConnectionStatus,
+  useHostRuntimeIsDirectoryLoading,
 } from "@/runtime/host-runtime";
 import type {
   AggregatedAgent,
@@ -88,14 +88,14 @@ export function useAllAgentsList(options?: {
   const liveAgents = useSessionStore((state) =>
     serverId ? state.sessions[serverId]?.agents ?? null : null
   );
-  const { snapshot } = useHostRuntimeSession(serverId ?? "");
+  const connectionStatus = useHostRuntimeConnectionStatus(serverId ?? "");
 
   const refreshAll = useCallback(() => {
-    if (!serverId || snapshot?.connectionStatus !== "online") {
+    if (!serverId || connectionStatus !== "online") {
       return;
     }
     void runtime.refreshAgentDirectory({ serverId }).catch(() => undefined);
-  }, [runtime, serverId, snapshot?.connectionStatus]);
+  }, [runtime, serverId, connectionStatus]);
 
   const agents = useMemo(() => {
     if (!serverId || !liveAgents) {
@@ -111,7 +111,7 @@ export function useAllAgentsList(options?: {
     });
   }, [daemons, includeArchived, liveAgents, serverId]);
 
-  const isDirectoryLoading = Boolean(serverId && isHostRuntimeDirectoryLoading(snapshot));
+  const isDirectoryLoading = useHostRuntimeIsDirectoryLoading(serverId ?? "");
   const isInitialLoad = isDirectoryLoading && agents.length === 0;
   const isRevalidating = isDirectoryLoading && agents.length > 0;
 

packages/app/src/hooks/use-archive-agent.ts

@@ -194,20 +194,13 @@ export function useArchiveAgent() {
     },
   });
 
+  const archiveMutateAsync = archiveMutation.mutateAsync;
+
   const archiveAgent = useCallback(
     async (input: ArchiveAgentInput): Promise<void> => {
-      if (
-        isAgentArchiving({
-          queryClient,
-          serverId: input.serverId,
-          agentId: input.agentId,
-        })
-      ) {
-        return;
-      }
-      await archiveMutation.mutateAsync(input);
+      await archiveMutateAsync(input);
     },
-    [archiveMutation, queryClient]
+    [archiveMutateAsync]
   );
 
   const isArchivingAgent = useCallback(

packages/app/src/hooks/use-audio-recorder.web.ts

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { AttemptCancelledError, AttemptGuard } from "@/utils/attempt-guard";
-import { getTauri } from "@/utils/tauri";
+import { isDesktop } from "@/desktop/host";
 
 export interface AudioCaptureConfig {
   sampleRate?: number;
@@ -157,20 +157,20 @@ export function useAudioRecorder(config?: AudioCaptureConfig) {
         : true;
     const currentOrigin =
       typeof window !== "undefined" && window.location ? window.location.origin : "unknown";
-    const isTauri = getTauri() !== null;
+    const isDesktopApp = isDesktop();
 
     if (missingNavigator) {
       throw new Error("Microphone capture is not supported in this environment");
     }
 
-    if (!secureContext && !isTauri) {
+    if (!secureContext && !isDesktopApp) {
       throw new Error(
         `Microphone access requires HTTPS or localhost. Current origin: ${currentOrigin}`
       );
     }
-    if (!secureContext && isTauri) {
+    if (!secureContext && isDesktopApp) {
       console.warn(
-        "[AudioRecorder][Web] Insecure context reported under Tauri; attempting getUserMedia anyway",
+        "[AudioRecorder][Web] Insecure context reported under Desktop; attempting getUserMedia anyway",
         { currentOrigin }
       );
     }

packages/app/src/hooks/use-checkout-diff-query.ts

@@ -2,7 +2,7 @@ import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useCallback, useEffect, useId, useMemo } from "react";
 import { UnistylesRuntime } from "react-native-unistyles";
 import { usePanelStore } from "@/stores/panel-store";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import type { SubscribeCheckoutDiffResponse } from "@server/shared/messages";
 import { orderCheckoutDiffFiles } from "./checkout-diff-order";
 
@@ -56,7 +56,8 @@ export function useCheckoutDiffQuery({
   enabled = true,
 }: UseCheckoutDiffQueryOptions) {
   const queryClient = useQueryClient();
-  const { client, isConnected } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
+  const isConnected = useHostRuntimeIsConnected(serverId);
   const isMobile =
     UnistylesRuntime.breakpoint === "xs" || UnistylesRuntime.breakpoint === "sm";
   const mobileView = usePanelStore((state) => state.mobileView);

packages/app/src/hooks/use-checkout-pr-status-query.ts

@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import type { CheckoutPrStatusResponse } from "@server/shared/messages";
 
 const CHECKOUT_PR_STATUS_STALE_TIME = 20_000;
@@ -21,7 +21,8 @@ export function useCheckoutPrStatusQuery({
   cwd,
   enabled = true,
 }: UseCheckoutPrStatusQueryOptions) {
-  const { client, isConnected } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
+  const isConnected = useHostRuntimeIsConnected(serverId);
 
   const query = useQuery({
     queryKey: checkoutPrStatusQueryKey(serverId, cwd),

packages/app/src/hooks/use-checkout-status-query.ts

@@ -2,7 +2,7 @@ import { useQuery } from "@tanstack/react-query";
 import { useEffect, useMemo, useRef } from "react";
 import { UnistylesRuntime } from "react-native-unistyles";
 import { usePanelStore } from "@/stores/panel-store";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import type { CheckoutStatusResponse } from "@server/shared/messages";
 import {
   checkoutStatusRevalidationKey,
@@ -30,7 +30,8 @@ function fetchCheckoutStatus(
 }
 
 export function useCheckoutStatusQuery({ serverId, cwd }: UseCheckoutStatusQueryOptions) {
-  const { client, isConnected } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
+  const isConnected = useHostRuntimeIsConnected(serverId);
   const isMobile =
     UnistylesRuntime.breakpoint === "xs" || UnistylesRuntime.breakpoint === "sm";
   const mobileView = usePanelStore((state) => state.mobileView);
@@ -87,7 +88,7 @@ export function useCheckoutStatusQuery({ serverId, cwd }: UseCheckoutStatusQuery
  * only the visible agents.
  */
 export function useCheckoutStatusCacheOnly({ serverId, cwd }: UseCheckoutStatusQueryOptions) {
-  const { client } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
 
   return useQuery({
     queryKey: checkoutStatusQueryKey(serverId, cwd),

packages/app/src/hooks/use-command-center.ts

@@ -6,18 +6,17 @@ import { keyboardActionDispatcher } from "@/keyboard/keyboard-action-dispatcher"
 import { useHosts } from "@/runtime/host-runtime";
 import { useAllAgentsList } from "@/hooks/use-all-agents-list";
 import type { AggregatedAgent } from "@/hooks/use-aggregated-agents";
+import { useOpenProjectPicker } from "@/hooks/use-open-project-picker";
 import {
   clearCommandCenterFocusRestoreElement,
   takeCommandCenterFocusRestoreElement,
 } from "@/utils/command-center-focus-restore";
 import {
-  buildHostOpenProjectRoute,
-  buildHostWorkspaceAgentRoute,
   buildHostSettingsRoute,
-  parseHostAgentRouteFromPathname,
   parseServerIdFromPathname,
 } from "@/utils/host-routes";
 import type { ShortcutKey } from "@/utils/format-shortcut";
+import { prepareWorkspaceTab } from "@/utils/workspace-navigation";
 import { focusWithRetries } from "@/utils/web-focus";
 
 const EMPTY_AGENTS: AggregatedAgent[] = [];
@@ -54,7 +53,7 @@ type CommandCenterActionDefinition = {
   icon?: "plus" | "settings";
   shortcutKeys?: ShortcutKey[];
   keywords: string[];
-  buildRoute: (params: { newAgentRoute: Href; settingsRoute: Href }) => Href;
+  routeKind: "settings" | "none";
 };
 
 const COMMAND_CENTER_ACTIONS: readonly CommandCenterActionDefinition[] = [
@@ -64,14 +63,14 @@ const COMMAND_CENTER_ACTIONS: readonly CommandCenterActionDefinition[] = [
     icon: "plus",
     shortcutKeys: ["mod", "shift", "O"],
     keywords: ["open", "project", "folder", "workspace", "repo"],
-    buildRoute: ({ newAgentRoute }) => newAgentRoute,
+    routeKind: "none",
   },
   {
     id: "settings",
     title: "Settings",
     icon: "settings",
     keywords: ["settings", "preferences", "config", "configuration"],
-    buildRoute: ({ settingsRoute }) => settingsRoute,
+    routeKind: "settings",
   },
 ];
 
@@ -92,7 +91,7 @@ export type CommandCenterActionItem = {
   id: string;
   title: string;
   icon?: "plus" | "settings";
-  route: Href;
+  route?: Href;
   shortcutKeys?: ShortcutKey[];
 };
 
@@ -148,11 +147,6 @@ export function useCommandCenter() {
     return filtered;
   }, [agents, open, query]);
 
-  const newAgentRoute = useMemo<Href>(() => {
-    const serverIdFromPath = activeServerId;
-    return serverIdFromPath ? (buildHostOpenProjectRoute(serverIdFromPath) as Href) : "/";
-  }, [activeServerId]);
-
   const settingsRoute = useMemo<Href>(() => {
     const serverIdFromPath = activeServerId;
     return serverIdFromPath ? (buildHostSettingsRoute(serverIdFromPath) as Href) : "/";
@@ -169,10 +163,10 @@ export function useCommandCenter() {
       id: action.id,
       title: action.title,
       icon: action.icon,
-      route: action.buildRoute({ newAgentRoute, settingsRoute }),
+      route: action.routeKind === "settings" ? settingsRoute : undefined,
       shortcutKeys: action.shortcutKeys,
     }));
-  }, [newAgentRoute, open, query, settingsRoute]);
+  }, [open, query, settingsRoute]);
 
   const items = useMemo(() => {
     if (!open) {
@@ -201,34 +195,35 @@ export function useCommandCenter() {
   const handleSelectAgent = useCallback(
     (agent: AggregatedAgent) => {
       didNavigateRef.current = true;
-      const shouldReplace = Boolean(parseHostAgentRouteFromPathname(pathname));
-      const navigate = shouldReplace ? router.replace : router.push;
 
       // Don't restore focus back to the prior element after we navigate.
       clearCommandCenterFocusRestoreElement();
       setOpen(false);
-      const route: Href = buildHostWorkspaceAgentRoute(
-        agent.serverId,
-        agent.cwd,
-        agent.id
-      ) as Href;
-      navigate(route);
+      const route = prepareWorkspaceTab({
+        serverId: agent.serverId,
+        workspaceId: agent.cwd,
+        target: { kind: "agent", agentId: agent.id },
+      });
+      router.navigate(route as any);
     },
-    [pathname, setOpen]
+    [setOpen]
   );
 
-  const setProjectPickerOpen = useKeyboardShortcutsStore((s) => s.setProjectPickerOpen);
+  const openProjectPicker = useOpenProjectPicker(activeServerId);
 
   const handleSelectAction = useCallback((action: CommandCenterActionItem) => {
     clearCommandCenterFocusRestoreElement();
     setOpen(false);
     if (action.id === "new-agent") {
-      setProjectPickerOpen(true);
+      void openProjectPicker();
+      return;
+    }
+    if (!action.route) {
       return;
     }
     didNavigateRef.current = true;
     router.push(action.route);
-  }, [setOpen, setProjectPickerOpen]);
+  }, [openProjectPicker, setOpen]);
 
   const handleSelectItem = useCallback(
     (item: CommandCenterItem) => {

packages/app/src/hooks/use-delayed-history-refresh-toast.tsx

@@ -1,6 +1,6 @@
-import { useEffect, useRef } from "react";
+import { useEffect, useRef, type ReactNode } from "react";
 import { ActivityIndicator } from "react-native";
-import { useToast } from "@/contexts/toast-context";
+import type { ToastShowOptions } from "@/components/toast-host";
 
 const HISTORY_REFRESH_TOAST_DELAY_MS = 1000;
 const HISTORY_REFRESH_TOAST_DURATION_MS = 2200;
@@ -8,22 +8,23 @@ const HISTORY_REFRESH_TOAST_DURATION_MS = 2200;
 interface UseDelayedHistoryRefreshToastParams {
   isCatchingUp: boolean;
   indicatorColor: string;
+  showToast: (content: ReactNode, options?: ToastShowOptions) => void;
 }
 
 export function useDelayedHistoryRefreshToast({
   isCatchingUp,
   indicatorColor,
+  showToast,
 }: UseDelayedHistoryRefreshToastParams): void {
-  const toast = useToast();
   const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const wasCatchingUpRef = useRef(false);
   const isCatchingUpRef = useRef(false);
-  const toastRef = useRef(toast);
+  const showToastRef = useRef(showToast);
   const indicatorColorRef = useRef(indicatorColor);
 
   useEffect(() => {
-    toastRef.current = toast;
-  }, [toast]);
+    showToastRef.current = showToast;
+  }, [showToast]);
 
   useEffect(() => {
     indicatorColorRef.current = indicatorColor;
@@ -44,7 +45,7 @@ export function useDelayedHistoryRefreshToast({
         if (!isCatchingUpRef.current) {
           return;
         }
-        toastRef.current.show("Refreshing", {
+        showToastRef.current("Refreshing", {
           icon: (
             <ActivityIndicator
               size="small"

packages/app/src/hooks/use-dictation-audio-source.web.ts

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { parsePcm16Wav } from "@/utils/pcm16-wav";
-import { getTauri } from "@/utils/tauri";
+import { isDesktop } from "@/desktop/host";
 
 import type { DictationAudioSource, DictationAudioSourceConfig } from "./use-dictation-audio-source.types";
 
@@ -158,17 +158,17 @@ export function useDictationAudioSource(config: DictationAudioSourceConfig): Dic
         : true;
     const currentOrigin =
       typeof window !== "undefined" && window.location ? window.location.origin : "unknown";
-    const isTauri = getTauri() !== null;
+    const isDesktopApp = isDesktop();
 
     if (missingNavigator) {
       throw new Error("Microphone capture is not supported in this environment");
     }
-    if (!secureContext && !isTauri) {
+    if (!secureContext && !isDesktopApp) {
       throw new Error(`Microphone access requires HTTPS or localhost. Current origin: ${currentOrigin}`);
     }
-    if (!secureContext && isTauri) {
+    if (!secureContext && isDesktopApp) {
       console.warn(
-        "[DictationAudio][Web] Insecure context reported under Tauri; attempting getUserMedia anyway",
+        "[DictationAudio][Web] Insecure context reported under Desktop; attempting getUserMedia anyway",
         { currentOrigin }
       );
     }

packages/app/src/hooks/use-favicon-status.ts

@@ -1,8 +1,8 @@
 import { useEffect, useRef, useState } from "react";
 import { Platform } from "react-native";
-import { getIsTauriMac } from "@/constants/layout";
+import { getIsDesktopMac } from "@/constants/layout";
 import { useAggregatedAgents } from "./use-aggregated-agents";
-import { getCurrentTauriWindow } from "@/utils/tauri";
+import { getDesktopHost } from "@/desktop/host";
 
 type FaviconStatus = "none" | "running" | "attention";
 type ColorScheme = "dark" | "light";
@@ -92,15 +92,15 @@ function getSystemColorScheme(): ColorScheme {
 }
 
 async function updateMacDockBadge(count?: number) {
-  if (Platform.OS !== "web" || !getIsTauriMac()) return;
+  if (Platform.OS !== "web" || !getIsDesktopMac()) return;
 
-  const tauriWindow = getCurrentTauriWindow();
-  if (!tauriWindow || typeof tauriWindow.setBadgeCount !== "function") {
+  const desktopWindow = getDesktopHost()?.window?.getCurrentWindow?.();
+  if (!desktopWindow || typeof desktopWindow.setBadgeCount !== "function") {
     return;
   }
 
   try {
-    await tauriWindow.setBadgeCount(count);
+    await desktopWindow.setBadgeCount(count);
   } catch (error) {
     console.warn("[useFaviconStatus] Failed to update macOS dock badge", error);
   }

packages/app/src/hooks/use-file-drop-zone.ts

@@ -1,7 +1,7 @@
 import { useState, useRef, useEffect } from "react";
 import { Platform } from "react-native";
 import type { ImageAttachment } from "@/components/message-input";
-import { getCurrentTauriWindow, getTauri } from "@/utils/tauri";
+import { getDesktopHost } from "@/desktop/host";
 import {
   persistAttachmentFromBlob,
   persistAttachmentFromFileUri,
@@ -33,7 +33,7 @@ const IMAGE_MIME_BY_EXTENSION: Record<string, string> = {
   ".tiff": "image/tiff",
 };
 
-type TauriDragDropPayload =
+type DesktopDragDropPayload =
   | {
       type: "enter";
       paths: string[];
@@ -49,8 +49,8 @@ type TauriDragDropPayload =
       type: "leave";
     };
 
-type TauriDragDropEvent = {
-  payload: TauriDragDropPayload;
+type DesktopDragDropEvent = {
+  payload: DesktopDragDropPayload;
 };
 
 function isImageFile(file: File): boolean {
@@ -121,26 +121,27 @@ export function useFileDropZone({
       didCleanup = true;
       try {
         void Promise.resolve(cleanupFn()).catch((error) => {
-          console.warn("[useFileDropZone] Failed to remove Tauri drag-drop listener:", error);
+          console.warn("[useFileDropZone] Failed to remove desktop drag-drop listener:", error);
         });
       } catch (error) {
-        console.warn("[useFileDropZone] Failed to remove Tauri drag-drop listener:", error);
+        console.warn("[useFileDropZone] Failed to remove desktop drag-drop listener:", error);
       }
     }
 
-    async function setupTauriDragDrop(): Promise<boolean> {
-      if (getTauri() === null) {
+    async function setupDesktopDragDrop(): Promise<boolean> {
+      const desktopHost = getDesktopHost();
+      if (desktopHost === null) {
         return false;
       }
 
-      const tauriWindow = getCurrentTauriWindow();
-      if (!tauriWindow || typeof tauriWindow.onDragDropEvent !== "function") {
+      const desktopWindow = desktopHost.window?.getCurrentWindow?.();
+      if (!desktopWindow || typeof desktopWindow.onDragDropEvent !== "function") {
         return false;
       }
 
       try {
-        const unlisten = await tauriWindow.onDragDropEvent(
-          (event: TauriDragDropEvent) => {
+        const unlisten = await desktopWindow.onDragDropEvent(
+          (event: DesktopDragDropEvent) => {
             const payload = event.payload;
             if (payload.type === "leave") {
               setIsDragging(false);
@@ -185,7 +186,7 @@ export function useFileDropZone({
         cleanup = unlisten;
         return true;
       } catch (error) {
-        console.warn("[useFileDropZone] Failed to listen for Tauri drag-drop:", error);
+        console.warn("[useFileDropZone] Failed to listen for desktop drag-drop:", error);
         return false;
       }
     }
@@ -269,8 +270,8 @@ export function useFileDropZone({
     }
 
     void (async () => {
-      const tauriListenersAttached = await setupTauriDragDrop();
-      if (disposed || tauriListenersAttached) {
+      const desktopListenersAttached = await setupDesktopDragDrop();
+      if (disposed || desktopListenersAttached) {
         return;
       }
       setupDomDragDrop();

packages/app/src/hooks/use-image-attachment-picker.ts

@@ -2,10 +2,10 @@ import { useCallback, useRef } from "react";
 import { Alert } from "react-native";
 import { Platform } from "react-native";
 import * as ImagePicker from "expo-image-picker";
-import { isTauriEnvironment } from "@/utils/tauri";
+import { isDesktop } from "@/desktop/host";
 import {
   normalizePickedImageAssets,
-  openImagePathsWithTauriDialog,
+  openImagePathsWithDesktopDialog,
   type PickedImageAttachmentInput,
 } from "@/hooks/image-attachment-picker";
 
@@ -42,8 +42,8 @@ export function useImageAttachmentPicker(): UseImageAttachmentPickerResult {
     isPickingRef.current = true;
 
     try {
-      if (Platform.OS === "web" && isTauriEnvironment()) {
-        const selectedPaths = await openImagePathsWithTauriDialog();
+      if (Platform.OS === "web" && isDesktop()) {
+        const selectedPaths = await openImagePathsWithDesktopDialog();
         if (selectedPaths.length === 0) {
           return null;
         }

packages/app/src/hooks/use-is-local-daemon.ts

@@ -0,0 +1,40 @@
+import { useQuery } from '@tanstack/react-query'
+import { getDesktopDaemonStatus, shouldUseDesktopDaemon } from '@/desktop/daemon/desktop-daemon'
+
+const DESKTOP_DAEMON_SERVER_ID_QUERY_KEY = ['desktop-daemon-server-id'] as const
+
+interface DesktopDaemonServerIdResult {
+  serverId: string | null
+}
+
+async function loadDesktopDaemonServerId(): Promise<DesktopDaemonServerIdResult> {
+  const status = await getDesktopDaemonStatus()
+  const serverId = status.serverId.trim()
+  return {
+    serverId: serverId.length > 0 ? serverId : null,
+  }
+}
+
+export function useIsLocalDaemon(serverId: string): boolean {
+  const normalizedServerId = serverId.trim()
+  const isDesktop = shouldUseDesktopDaemon()
+
+  const query = useQuery({
+    queryKey: DESKTOP_DAEMON_SERVER_ID_QUERY_KEY,
+    queryFn: loadDesktopDaemonServerId,
+    enabled: isDesktop,
+    staleTime: Infinity,
+    gcTime: Infinity,
+    refetchInterval: (query) => (query.state.data?.serverId ? false : 1000),
+    refetchOnMount: false,
+    refetchOnReconnect: false,
+    refetchOnWindowFocus: false,
+    retry: false,
+  })
+
+  if (!isDesktop || normalizedServerId.length === 0) {
+    return false
+  }
+
+  return query.data?.serverId === normalizedServerId
+}

packages/app/src/hooks/use-keyboard-shortcuts.ts

@@ -1,11 +1,13 @@
 import { useEffect } from "react";
 import { Platform } from "react-native";
 import { usePathname } from "expo-router";
-import { getIsTauri } from "@/constants/layout";
+import { getIsDesktop } from "@/constants/layout";
+import { useHosts } from "@/runtime/host-runtime";
 import { useKeyboardShortcutsStore } from "@/stores/keyboard-shortcuts-store";
 import { setCommandCenterFocusRestoreElement } from "@/utils/command-center-focus-restore";
 import {
   parseHostAgentRouteFromPathname,
+  parseServerIdFromPathname,
   parseHostWorkspaceRouteFromPathname,
 } from "@/utils/host-routes";
 import { navigateToWorkspace } from "@/hooks/use-workspace-navigation";
@@ -18,6 +20,7 @@ import { keyboardActionDispatcher } from "@/keyboard/keyboard-action-dispatcher"
 import { resolveKeyboardShortcut } from "@/keyboard/keyboard-shortcuts";
 import { resolveKeyboardFocusScope } from "@/keyboard/focus-scope";
 import { getShortcutOs } from "@/utils/shortcut-platform";
+import { useOpenProjectPicker } from "@/hooks/use-open-project-picker";
 
 export function useKeyboardShortcuts({
   enabled,
@@ -33,14 +36,21 @@ export function useKeyboardShortcuts({
   toggleFileExplorer?: () => void;
 }) {
   const pathname = usePathname();
+  const hosts = useHosts();
   const resetModifiers = useKeyboardShortcutsStore((s) => s.resetModifiers);
+  const activeServerIdFromPath = parseServerIdFromPathname(pathname);
+  const activeServerId =
+    hosts.find((host) => host.serverId === activeServerIdFromPath)?.serverId ??
+    hosts[0]?.serverId ??
+    null;
+  const openProjectPickerAction = useOpenProjectPicker(activeServerId);
 
   useEffect(() => {
     if (!enabled) return;
     if (Platform.OS !== "web") return;
     if (isMobile) return;
 
-    const isTauri = getIsTauri();
+    const isDesktopApp = getIsDesktop();
     const isMac = getShortcutOs() === "mac";
 
     const shouldHandle = () => {
@@ -92,7 +102,7 @@ export function useKeyboardShortcuts({
     };
 
     const openProjectPicker = (): boolean => {
-      useKeyboardShortcutsStore.getState().setProjectPickerOpen(true);
+      void openProjectPickerAction();
       return true;
     };
 
@@ -249,7 +259,7 @@ export function useKeyboardShortcuts({
       if (key === "Alt" && !event.shiftKey) {
         useKeyboardShortcutsStore.getState().setAltDown(true);
       }
-      if (isTauri && (key === "Meta" || key === "Control") && !event.shiftKey) {
+      if (isDesktopApp && (key === "Meta" || key === "Control") && !event.shiftKey) {
         useKeyboardShortcutsStore.getState().setCmdOrCtrlDown(true);
       }
       if (key === "Shift") {
@@ -268,7 +278,7 @@ export function useKeyboardShortcuts({
         event,
         context: {
           isMac,
-          isTauri,
+          isDesktop: isDesktopApp,
           focusScope,
           commandCenterOpen: store.commandCenterOpen,
           hasSelectedAgent: canToggleFileExplorerShortcut({
@@ -304,7 +314,7 @@ export function useKeyboardShortcuts({
       if (key === "Alt") {
         useKeyboardShortcutsStore.getState().setAltDown(false);
       }
-      if (isTauri && (key === "Meta" || key === "Control")) {
+      if (isDesktopApp && (key === "Meta" || key === "Control")) {
         useKeyboardShortcutsStore.getState().setCmdOrCtrlDown(false);
       }
     };
@@ -326,6 +336,7 @@ export function useKeyboardShortcuts({
   }, [
     enabled,
     isMobile,
+    openProjectPickerAction,
     pathname,
     resetModifiers,
     selectedAgentId,

packages/app/src/hooks/use-open-project-picker.ts

@@ -0,0 +1,32 @@
+import { useCallback } from "react";
+import { pickDirectory } from "@/desktop/pick-directory";
+import { useKeyboardShortcutsStore } from "@/stores/keyboard-shortcuts-store";
+import { useIsLocalDaemon } from "./use-is-local-daemon";
+import { useOpenProject } from "./use-open-project";
+
+export function useOpenProjectPicker(serverId: string | null): () => Promise<void> {
+  const normalizedServerId = serverId?.trim() ?? "";
+  const isLocalDaemon = useIsLocalDaemon(normalizedServerId);
+  const setProjectPickerOpen = useKeyboardShortcutsStore(
+    (state) => state.setProjectPickerOpen
+  );
+  const openProject = useOpenProject(serverId);
+
+  return useCallback(async () => {
+    if (!normalizedServerId) {
+      return;
+    }
+
+    if (!isLocalDaemon) {
+      setProjectPickerOpen(true);
+      return;
+    }
+
+    const path = await pickDirectory();
+    if (path === null) {
+      return;
+    }
+
+    await openProject(path);
+  }, [isLocalDaemon, normalizedServerId, openProject, setProjectPickerOpen]);
+}

packages/app/src/hooks/use-open-project.ts

@@ -0,0 +1,62 @@
+import { router } from "expo-router";
+import { useCallback } from "react";
+import { useToast } from "@/contexts/toast-context";
+import { useHostRuntimeClient } from "@/runtime/host-runtime";
+import {
+  normalizeWorkspaceDescriptor,
+  useSessionStore,
+} from "@/stores/session-store";
+import { prepareWorkspaceTab } from "@/utils/workspace-navigation";
+
+export function useOpenProject(
+  serverId: string | null
+): (path: string) => Promise<boolean> {
+  const normalizedServerId = serverId?.trim() ?? "";
+  const toast = useToast();
+  const client = useHostRuntimeClient(normalizedServerId);
+  const mergeWorkspaces = useSessionStore((state) => state.mergeWorkspaces);
+  const setHasHydratedWorkspaces = useSessionStore(
+    (state) => state.setHasHydratedWorkspaces
+  );
+
+  return useCallback(
+    async (path: string) => {
+      const trimmedPath = path.trim();
+      if (!trimmedPath || !client || !normalizedServerId) {
+        return false;
+      }
+
+      try {
+        const payload = await client.openProject(trimmedPath);
+        if (payload.error || !payload.workspace) {
+          throw new Error(payload.error || "Failed to open project");
+        }
+
+        mergeWorkspaces(normalizedServerId, [
+          normalizeWorkspaceDescriptor(payload.workspace),
+        ]);
+        setHasHydratedWorkspaces(normalizedServerId, true);
+        router.replace(
+          prepareWorkspaceTab({
+            serverId: normalizedServerId,
+            workspaceId: payload.workspace.id,
+            target: { kind: "draft", draftId: "new" },
+          }) as any
+        );
+        return true;
+      } catch (error) {
+        toast.error(
+          error instanceof Error ? error.message : "Failed to open project"
+        );
+        return false;
+      }
+    },
+    [
+      client,
+      mergeWorkspaces,
+      normalizedServerId,
+      setHasHydratedWorkspaces,
+      toast,
+    ]
+  );
+}

packages/app/src/hooks/use-project-icon-query.ts

@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { useHostRuntimeSession } from "@/runtime/host-runtime";
+import { useHostRuntimeClient, useHostRuntimeIsConnected } from "@/runtime/host-runtime";
 import type { ProjectIcon } from "@server/shared/messages";
 
 export function projectIconQueryKey(serverId: string, cwd: string) {
@@ -12,7 +12,8 @@ interface UseProjectIconQueryOptions {
 }
 
 export function useProjectIconQuery({ serverId, cwd }: UseProjectIconQueryOptions) {
-  const { client, isConnected } = useHostRuntimeSession(serverId);
+  const client = useHostRuntimeClient(serverId);
+  const isConnected = useHostRuntimeIsConnected(serverId);
 
   const query = useQuery({
     queryKey: projectIconQueryKey(serverId, cwd),

packages/app/src/hooks/use-sidebar-shortcut-model.ts

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react'
 import type { SidebarProjectEntry } from '@/hooks/use-sidebar-workspaces-list'
 import { useKeyboardShortcutsStore } from '@/stores/keyboard-shortcuts-store'
 import { buildSidebarShortcutModel } from '@/utils/sidebar-shortcuts'
+import { isSidebarProjectFlattened } from '@/utils/sidebar-project-row-model'
 
 export function useSidebarShortcutModel(projects: SidebarProjectEntry[]) {
   const [collapsedProjectKeys, setCollapsedProjectKeys] = useState<Set<string>>(new Set())
@@ -23,10 +24,14 @@ export function useSidebarShortcutModel(projects: SidebarProjectEntry[]) {
 
   useEffect(() => {
     setCollapsedProjectKeys((prev) => {
-      const validProjectKeys = new Set(projects.map((project) => project.projectKey))
+      const collapsibleProjectKeys = new Set(
+        projects
+          .filter((project) => !isSidebarProjectFlattened(project))
+          .map((project) => project.projectKey)
+      )
       const next = new Set<string>()
       for (const key of prev) {
-        if (validProjectKeys.has(key)) {
+        if (collapsibleProjectKeys.has(key)) {
           next.add(key)
         }
       }
@@ -63,9 +68,22 @@ export function useSidebarShortcutModel(projects: SidebarProjectEntry[]) {
     })
   }, [])
 
+  const setProjectCollapsed = useCallback((projectKey: string, collapsed: boolean) => {
+    setCollapsedProjectKeys((prev) => {
+      const next = new Set(prev)
+      if (collapsed) {
+        next.add(projectKey)
+      } else {
+        next.delete(projectKey)
+      }
+      return next
+    })
+  }, [])
+
   return {
     collapsedProjectKeys,
     shortcutIndexByWorkspaceKey: shortcutModel.shortcutIndexByWorkspaceKey,
+    setProjectCollapsed,
     toggleProjectCollapsed,
   }
 }

packages/app/src/keyboard/keyboard-shortcuts.test.ts

@@ -23,7 +23,7 @@ function shortcutContext(
 ): KeyboardShortcutContext {
   return {
     isMac: false,
-    isTauri: false,
+    isDesktop: false,
     focusScope: "other",
     commandCenterOpen: false,
     hasSelectedAgent: true,
@@ -84,7 +84,7 @@ type HelpSectionCase = {
   name: string;
   context: {
     isMac: boolean;
-    isTauri: boolean;
+    isDesktop: boolean;
   };
   expectedKeys: Record<string, string[]>;
 };
@@ -106,42 +106,42 @@ describe("keyboard-shortcuts", () => {
     {
       name: "matches workspace index jump on web via Alt+digit",
       event: { key: "2", code: "Digit2", altKey: true },
-      context: { isTauri: false },
+      context: { isDesktop: false },
       action: "workspace.navigate.index",
       payload: { index: 2 },
     },
     {
-      name: "matches workspace index jump on tauri via Mod+digit",
+      name: "matches workspace index jump on desktop via Mod+digit",
       event: { key: "2", code: "Digit2", metaKey: true },
-      context: { isMac: true, isTauri: true },
+      context: { isMac: true, isDesktop: true },
       action: "workspace.navigate.index",
       payload: { index: 2 },
     },
     {
-      name: "matches tab index jump on tauri via Alt+digit",
+      name: "matches tab index jump on desktop via Alt+digit",
       event: { key: "2", code: "Digit2", altKey: true },
-      context: { isTauri: true },
+      context: { isDesktop: true },
       action: "workspace.tab.navigate.index",
       payload: { index: 2 },
     },
     {
       name: "matches tab index jump on web via Alt+Shift+digit",
       event: { key: "@", code: "Digit2", altKey: true, shiftKey: true },
-      context: { isTauri: false },
+      context: { isDesktop: false },
       action: "workspace.tab.navigate.index",
       payload: { index: 2 },
     },
     {
       name: "matches workspace relative navigation on web via Alt+[",
       event: { key: "[", code: "BracketLeft", altKey: true },
-      context: { isTauri: false },
+      context: { isDesktop: false },
       action: "workspace.navigate.relative",
       payload: { delta: -1 },
     },
     {
-      name: "matches workspace relative navigation on tauri via Mod+]",
+      name: "matches workspace relative navigation on desktop via Mod+]",
       event: { key: "]", code: "BracketRight", ctrlKey: true },
-      context: { isTauri: true },
+      context: { isDesktop: true },
       action: "workspace.navigate.relative",
       payload: { delta: 1 },
     },
@@ -160,15 +160,33 @@ describe("keyboard-shortcuts", () => {
     {
       name: "matches Alt+Shift+W to close current tab on web",
       event: { key: "W", code: "KeyW", altKey: true, shiftKey: true },
-      context: { isTauri: false },
+      context: { isDesktop: false },
       action: "workspace.tab.close.current",
     },
     {
-      name: "matches Mod+W to close current tab on tauri",
+      name: "matches Cmd+W to close current tab on mac desktop",
       event: { key: "w", code: "KeyW", metaKey: true },
-      context: { isMac: true, isTauri: true },
+      context: { isMac: true, isDesktop: true },
       action: "workspace.tab.close.current",
     },
+    {
+      name: "matches Ctrl+W to close current tab on non-mac desktop",
+      event: { key: "w", code: "KeyW", ctrlKey: true },
+      context: { isMac: false, isDesktop: true },
+      action: "workspace.tab.close.current",
+    },
+    {
+      name: "matches Ctrl+Shift+O to create new agent on non-mac",
+      event: { key: "O", code: "KeyO", ctrlKey: true, shiftKey: true },
+      context: { isMac: false },
+      action: "agent.new",
+    },
+    {
+      name: "matches Ctrl+K for command center on non-mac",
+      event: { key: "k", code: "KeyK", ctrlKey: true },
+      context: { isMac: false },
+      action: "command-center.toggle",
+    },
     {
       name: "matches Cmd+Backslash to split pane right on macOS",
       event: { key: "\\", code: "Backslash", metaKey: true },
@@ -268,6 +286,26 @@ describe("keyboard-shortcuts", () => {
       event: { key: "?", code: "Slash", shiftKey: true },
       context: { focusScope: "message-input" },
     },
+    {
+      name: "does not close tab with Ctrl+W on mac desktop (Cmd+W only)",
+      event: { key: "w", code: "KeyW", ctrlKey: true },
+      context: { isMac: true, isDesktop: true },
+    },
+    {
+      name: "does not close tab with Ctrl+W on non-mac desktop when terminal is focused",
+      event: { key: "w", code: "KeyW", ctrlKey: true },
+      context: { isMac: false, isDesktop: true, focusScope: "terminal" },
+    },
+    {
+      name: "does not match Ctrl+T on mac (Cmd only)",
+      event: { key: "t", code: "KeyT", ctrlKey: true },
+      context: { isMac: true },
+    },
+    {
+      name: "does not match Ctrl+K for command center on non-mac in terminal",
+      event: { key: "k", code: "KeyK", ctrlKey: true },
+      context: { isMac: false, focusScope: "terminal" },
+    },
     {
       name: "does not bind Ctrl+B on non-mac",
       event: { key: "b", code: "KeyB", ctrlKey: true },
@@ -312,7 +350,7 @@ describe("keyboard-shortcut help sections", () => {
   const helpCases: HelpSectionCase[] = [
     {
       name: "uses web defaults for workspace and tab jump",
-      context: { isMac: true, isTauri: false },
+      context: { isMac: true, isDesktop: false },
       expectedKeys: {
         "new-agent": ["mod", "shift", "O"],
         "workspace-tab-new": ["mod", "T"],
@@ -324,21 +362,28 @@ describe("keyboard-shortcut help sections", () => {
       },
     },
     {
-      name: "uses tauri defaults for workspace and tab jump",
-      context: { isMac: true, isTauri: true },
+      name: "uses desktop defaults for workspace and tab jump",
+      context: { isMac: true, isDesktop: true },
       expectedKeys: {
         "new-agent": ["mod", "shift", "O"],
         "workspace-tab-new": ["mod", "T"],
         "workspace-jump-index": ["mod", "1-9"],
         "workspace-tab-jump-index": ["alt", "1-9"],
-        "workspace-tab-close-current": ["mod", "W"],
+        "workspace-tab-close-current": ["meta", "W"],
         "workspace-pane-split-right": ["mod", "\\"],
         "workspace-pane-close": ["mod", "shift", "W"],
       },
     },
+    {
+      name: "shows Ctrl+W close tab for non-mac desktop",
+      context: { isMac: false, isDesktop: true },
+      expectedKeys: {
+        "workspace-tab-close-current": ["ctrl", "W"],
+      },
+    },
     {
       name: "uses mod+period as non-mac left sidebar shortcut",
-      context: { isMac: false, isTauri: false },
+      context: { isMac: false, isDesktop: false },
       expectedKeys: {
         "toggle-left-sidebar": ["mod", "."],
       },

packages/app/src/panels/pane-context.tsx

@@ -6,6 +6,7 @@ export interface PaneContextValue {
   serverId: string;
   workspaceId: string;
   tabId: string;
+  isPaneFocused: boolean;
   target: WorkspaceTabTarget;
   openTab(target: WorkspaceTabTarget): void;
   closeCurrentTab(): void;

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

@@ -16,9 +16,9 @@ import {
 import { decodeOfferFragmentPayload, normalizeHostPort } from "@/utils/daemon-endpoints";
 import { ConnectionOfferSchema, type ConnectionOffer } from "@server/shared/connection-offer";
 import {
-  shouldUseManagedDesktopDaemon,
-  startManagedDaemon,
-} from "@/desktop/managed-runtime/managed-runtime";
+  shouldUseDesktopDaemon,
+  startDesktopDaemon,
+} from "@/desktop/daemon/desktop-daemon";
 import { connectToDaemon } from "@/utils/test-daemon-connection";
 import {
   buildDaemonWebSocketUrl,
@@ -32,9 +32,8 @@ import {
 } from "@/utils/connection-selection";
 import {
   buildLocalDaemonTransportUrl,
-  createTauriLocalDaemonTransportFactory,
-} from "@/utils/managed-tauri-daemon-transport";
-import { createTauriWebSocketTransportFactory } from "@/utils/tauri-daemon-transport";
+  createDesktopLocalDaemonTransportFactory,
+} from "@/desktop/daemon/desktop-daemon-transport";
 import { applyFetchedAgentDirectory } from "@/utils/agent-directory-sync";
 import { useSessionStore, type Agent } from "@/stores/session-store";
 
@@ -433,8 +432,7 @@ function probeIntervalForConnection(
 function createDefaultDeps(): HostRuntimeControllerDeps {
   return {
     createClient: ({ host, connection, clientId, runtimeGeneration }) => {
-      const tauriTransportFactory = createTauriWebSocketTransportFactory();
-      const localTransportFactory = createTauriLocalDaemonTransportFactory();
+      const localTransportFactory = createDesktopLocalDaemonTransportFactory();
       const base = {
         suppressSendErrors: true,
         clientId,
@@ -454,17 +452,11 @@ function createDefaultDeps(): HostRuntimeControllerDeps {
       if (connection.type === "directTcp") {
         return new DaemonClient({
           ...base,
-          ...(tauriTransportFactory
-            ? { transportFactory: tauriTransportFactory }
-            : {}),
           url: buildDaemonWebSocketUrl(connection.endpoint),
         });
       }
       return new DaemonClient({
         ...base,
-        ...(tauriTransportFactory
-          ? { transportFactory: tauriTransportFactory }
-          : {}),
         url: buildRelayWebSocketUrl({
           endpoint: connection.relayEndpoint,
           serverId: host.serverId,
@@ -1196,7 +1188,7 @@ export class HostRuntimeStore {
       return;
     }
 
-    if (shouldUseManagedDesktopDaemon()) {
+    if (shouldUseDesktopDaemon()) {
       await this.bootstrapDesktop();
     } else {
       await this.bootstrapLocalhost();
@@ -1205,43 +1197,22 @@ export class HostRuntimeStore {
 
   private async bootstrapDesktop(): Promise<void> {
     try {
-      await Promise.allSettled([
-        (async () => {
-          const daemon = await startManagedDaemon();
-          if (!daemon.serverId) {
-            return;
-          }
-          const connection = connectionFromListen(daemon.listen);
-          if (!connection) {
-            return;
-          }
-          await this.upsertHostConnection({
-            serverId: daemon.serverId,
-            label: daemon.hostname ?? undefined,
-            connection,
-          });
-        })().catch((error) => {
-          console.warn("[HostRuntime] Failed to bootstrap desktop daemon connection", error);
-        }),
-        (async () => {
-          const { client, serverId, hostname } = await connectToDaemon(
-            {
-              id: `bootstrap:${DEFAULT_LOCALHOST_ENDPOINT}`,
-              type: "directTcp",
-              endpoint: DEFAULT_LOCALHOST_ENDPOINT,
-            },
-            { timeoutMs: DEFAULT_LOCALHOST_BOOTSTRAP_TIMEOUT_MS }
-          );
-          await this.upsertDirectConnection({
-            serverId,
-            endpoint: DEFAULT_LOCALHOST_ENDPOINT,
-            label: hostname ?? undefined,
-            existingClient: client,
-          });
-        })().catch(() => undefined),
-      ]);
+      const daemon = await startDesktopDaemon();
+      const connection = connectionFromListen(daemon.listen);
+      if (!connection) {
+        return;
+      }
+      const { client, serverId, hostname } = await connectToDaemon(connection, {
+        timeoutMs: DEFAULT_LOCALHOST_BOOTSTRAP_TIMEOUT_MS,
+      });
+      await this.upsertHostConnection({
+        serverId,
+        label: hostname ?? daemon.hostname ?? undefined,
+        connection,
+        existingClient: client,
+      });
     } catch (error) {
-      console.warn("[HostRuntime] Failed to bootstrap desktop startup host connections", error);
+      console.warn("[HostRuntime] Failed to bootstrap desktop daemon connection", error);
     }
   }
 
@@ -1763,17 +1734,13 @@ export function useHostRuntimeSnapshot(
   );
 }
 
-export function useHostRuntimeSession(serverId: string): {
-  snapshot: HostRuntimeSnapshot | null;
-  client: DaemonClient | null;
-  isConnected: boolean;
-} {
-  const snapshot = useHostRuntimeSnapshot(serverId);
-  return {
-    snapshot,
-    client: snapshot?.client ?? null,
-    isConnected: isHostRuntimeConnected(snapshot),
-  };
+export function useHostRuntimeClient(serverId: string): DaemonClient | null {
+  const store = getHostRuntimeStore();
+  return useSyncExternalStore(
+    (onStoreChange) => store.subscribe(serverId, onStoreChange),
+    () => store.getSnapshot(serverId)?.client ?? null,
+    () => store.getSnapshot(serverId)?.client ?? null
+  );
 }
 
 export function useHostRuntimeIsConnected(serverId: string): boolean {
@@ -1785,6 +1752,46 @@ export function useHostRuntimeIsConnected(serverId: string): boolean {
   );
 }
 
+export function useHostRuntimeConnectionStatus(
+  serverId: string
+): HostRuntimeConnectionStatus {
+  const store = getHostRuntimeStore();
+  return useSyncExternalStore(
+    (onStoreChange) => store.subscribe(serverId, onStoreChange),
+    () => store.getSnapshot(serverId)?.connectionStatus ?? "connecting",
+    () => store.getSnapshot(serverId)?.connectionStatus ?? "connecting"
+  );
+}
+
+export function useHostRuntimeLastError(serverId: string): string | null {
+  const store = getHostRuntimeStore();
+  return useSyncExternalStore(
+    (onStoreChange) => store.subscribe(serverId, onStoreChange),
+    () => store.getSnapshot(serverId)?.lastError ?? null,
+    () => store.getSnapshot(serverId)?.lastError ?? null
+  );
+}
+
+export function useHostRuntimeAgentDirectoryStatus(
+  serverId: string
+): HostRuntimeAgentDirectoryStatus {
+  const store = getHostRuntimeStore();
+  return useSyncExternalStore(
+    (onStoreChange) => store.subscribe(serverId, onStoreChange),
+    () => store.getSnapshot(serverId)?.agentDirectoryStatus ?? "idle",
+    () => store.getSnapshot(serverId)?.agentDirectoryStatus ?? "idle"
+  );
+}
+
+export function useHostRuntimeIsDirectoryLoading(serverId: string): boolean {
+  const store = getHostRuntimeStore();
+  return useSyncExternalStore(
+    (onStoreChange) => store.subscribe(serverId, onStoreChange),
+    () => isHostRuntimeDirectoryLoading(store.getSnapshot(serverId)),
+    () => isHostRuntimeDirectoryLoading(store.getSnapshot(serverId))
+  );
+}
+
 export function useHosts(): HostProfile[] {
   const store = getHostRuntimeStore();
   return useSyncExternalStore(

packages/app/src/screens/agent/draft-agent-screen.tsx

@@ -2,7 +2,7 @@ import { useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore
 import { createNameId } from 'mnemonic-id'
 import type { ImageAttachment } from '@/components/message-input'
 import { View, Text, Pressable, ScrollView, Keyboard, Platform } from 'react-native'
-import { useLocalSearchParams, useRouter, type Href } from 'expo-router'
+import { useLocalSearchParams, useRouter } from 'expo-router'
 import { useIsFocused } from '@react-navigation/native'
 import { StyleSheet, UnistylesRuntime, useUnistyles } from 'react-native-unistyles'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
@@ -33,7 +33,7 @@ import { buildWorkingDirectorySuggestions } from '@/utils/working-directory-sugg
 import { useExplorerOpenGesture } from '@/hooks/use-explorer-open-gesture'
 import { useSessionStore } from '@/stores/session-store'
 import { generateDraftId } from '@/stores/draft-keys'
-import { getHostRuntimeStore, useHostRuntimeSession } from '@/runtime/host-runtime'
+import { getHostRuntimeStore, useHostRuntimeClient, useHostRuntimeIsConnected } from '@/runtime/host-runtime'
 import { ExplorerSidebarAnimationProvider } from '@/contexts/explorer-sidebar-animation-context'
 import { usePanelStore, type ExplorerCheckoutContext } from '@/stores/panel-store'
 import { MAX_CONTENT_WIDTH } from '@/constants/layout'
@@ -46,8 +46,8 @@ import type {
   AgentSessionConfig,
 } from '@server/server/agent/agent-sdk-types'
 import { AGENT_PROVIDER_DEFINITIONS } from '@server/server/agent/provider-manifest'
-import { buildHostWorkspaceAgentRoute } from '@/utils/host-routes'
-import { useTauriDragHandlers } from '@/utils/tauri-window'
+import { prepareWorkspaceTab } from '@/utils/workspace-navigation'
+import { useDesktopDragHandlers } from '@/utils/desktop-window'
 import { useKeyboardShiftStyle } from '@/hooks/use-keyboard-shift-style'
 import { normalizeAgentSnapshot } from '@/utils/agent-snapshots'
 import { useDraftAgentCreateFlow } from '@/hooks/use-draft-agent-create-flow'
@@ -238,7 +238,7 @@ function DraftAgentScreenContent({
   const activateExplorerTabForCheckout = usePanelStore(
     (state) => state.activateExplorerTabForCheckout
   )
-  const tauriDragHandlers = useTauriDragHandlers()
+  const dragHandlers = useDesktopDragHandlers()
   const isExplorerOpen = isMobile ? mobileView === 'file-explorer' : desktopFileExplorerOpen
   const draftIdRef = useRef(generateDraftId())
   const draftAgentIdRef = useRef(generateDraftId())
@@ -317,9 +317,8 @@ function DraftAgentScreenContent({
     return collectAgentWorkingDirectorySuggestions([...liveSources, ...fetchedSources])
   }, [allAgents, sessionAgents])
 
-  const { client: runtimeClient, isConnected: isHostOnline } = useHostRuntimeSession(
-    selectedServerId ?? ''
-  )
+  const runtimeClient = useHostRuntimeClient(selectedServerId ?? '')
+  const isHostOnline = useHostRuntimeIsConnected(selectedServerId ?? '')
   const sessionClient = runtimeClient
   const trimmedWorkingDir = workingDir.trim()
   const shouldInspectRepo = trimmedWorkingDir.length > 0
@@ -929,12 +928,12 @@ function DraftAgentScreenContent({
       }
     },
     onCreateSuccess: ({ result }) => {
-      const route: Href = buildHostWorkspaceAgentRoute(
-        selectedServerId as string,
-        result.cwd,
-        result.id
-      ) as Href
-      router.replace(route)
+      const route = prepareWorkspaceTab({
+        serverId: selectedServerId as string,
+        workspaceId: result.cwd,
+        target: { kind: 'agent', agentId: result.id },
+      })
+      router.replace(route as any)
     },
   })
   useEffect(() => {
@@ -974,7 +973,7 @@ function DraftAgentScreenContent({
   const explorerServerId = draftExplorerCheckout?.serverId ?? null
   const explorerIsGit = draftExplorerCheckout?.isGit ?? false
   const mainContent = (
-    <View style={styles.container} {...tauriDragHandlers}>
+    <View style={styles.container} {...dragHandlers}>
       <View style={styles.outerContainer}>
         <View style={styles.agentPanel}>
           <View

packages/app/src/screens/agents-screen.tsx

@@ -1,5 +1,6 @@
 import { useMemo, useState, useCallback, useEffect } from "react";
 import { View } from "react-native";
+import { useIsFocused } from "@react-navigation/native";
 import { StyleSheet } from "react-native-unistyles";
 import { BackHeader } from "@/components/headers/back-header";
 import { AgentList } from "@/components/agent-list";
@@ -8,6 +9,16 @@ import { router } from "expo-router";
 import { buildHostRootRoute } from "@/utils/host-routes";
 
 export function AgentsScreen({ serverId }: { serverId: string }) {
+  const isFocused = useIsFocused();
+
+  if (!isFocused) {
+    return <View style={styles.container} />;
+  }
+
+  return <AgentsScreenContent serverId={serverId} />;
+}
+
+function AgentsScreenContent({ serverId }: { serverId: string }) {
   const { agents, isRevalidating, refreshAll } = useAllAgentsList({
     serverId,
     includeArchived: true,

packages/app/src/screens/open-project-screen.tsx

@@ -5,23 +5,23 @@ import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { FolderOpen } from "lucide-react-native";
 import { PaseoLogo } from "@/components/icons/paseo-logo";
 import { SidebarMenuToggle } from "@/components/headers/menu-header";
-import { useKeyboardShortcutsStore } from "@/stores/keyboard-shortcuts-store";
+import { useOpenProjectPicker } from "@/hooks/use-open-project-picker";
 import { usePanelStore } from "@/stores/panel-store";
-import { getIsTauriMac } from "@/constants/layout";
-import { useTauriDragHandlers, useTrafficLightPadding } from "@/utils/tauri-window";
+import { getIsDesktopMac } from "@/constants/layout";
+import { useDesktopDragHandlers, useTrafficLightPadding } from "@/utils/desktop-window";
 
-export function OpenProjectScreen({ serverId: _serverId }: { serverId: string }) {
+export function OpenProjectScreen({ serverId }: { serverId: string }) {
   const { theme } = useUnistyles();
   const insets = useSafeAreaInsets();
   const trafficLightPadding = useTrafficLightPadding();
   const desktopAgentListOpen = usePanelStore((s) => s.desktop.agentListOpen);
   const openAgentList = usePanelStore((s) => s.openAgentList);
-  const setProjectPickerOpen = useKeyboardShortcutsStore((s) => s.setProjectPickerOpen);
+  const openProjectPicker = useOpenProjectPicker(serverId);
 
   const isMobile = UnistylesRuntime.breakpoint === "xs" || UnistylesRuntime.breakpoint === "sm";
-  const needsTrafficLightInset = !isMobile && !desktopAgentListOpen && getIsTauriMac();
+  const needsTrafficLightInset = !isMobile && !desktopAgentListOpen && getIsDesktopMac();
   const trafficLightInset = needsTrafficLightInset ? trafficLightPadding.left : 0;
-  const dragHandlers = useTauriDragHandlers();
+  const dragHandlers = useDesktopDragHandlers();
 
   useEffect(() => {
     if (!isMobile) {
@@ -42,7 +42,9 @@ export function OpenProjectScreen({ serverId: _serverId }: { serverId: string })
             styles.openButton,
             hovered && styles.openButtonHovered,
           ]}
-          onPress={() => setProjectPickerOpen(true)}
+          onPress={() => {
+            void openProjectPicker();
+          }}
           testID="open-project-submit"
         >
           <FolderOpen size={16} color={theme.colors.foregroundMuted} />

packages/app/src/screens/settings-screen.tsx

@@ -24,7 +24,9 @@ import { useSessionStore } from "@/stores/session-store";
 import {
   getHostRuntimeStore,
   isHostRuntimeConnected,
-  useHostRuntimeSession,
+  useHostRuntimeClient,
+  useHostRuntimeIsConnected,
+  useHostRuntimeSnapshot,
 } from "@/runtime/host-runtime";
 import { AddHostMethodModal } from "@/components/add-host-method-modal";
 import { AddHostModal } from "@/components/add-host-modal";
@@ -41,12 +43,14 @@ import {
 import { AdaptiveModalSheet, AdaptiveTextInput } from "@/components/adaptive-modal-sheet";
 import { DesktopPermissionsSection } from "@/desktop/components/desktop-permissions-section";
 import { LocalDaemonSection } from "@/desktop/components/desktop-updates-section";
+import { isDesktop as isDesktopHost } from "@/desktop/host";
 import { useDesktopAppUpdater } from "@/desktop/updates/use-desktop-app-updater";
 import { formatVersionWithPrefix } from "@/desktop/updates/desktop-updates";
 import { resolveAppVersion } from "@/utils/app-version";
 import { settingsStyles } from "@/styles/settings";
 import { THINKING_TONE_NATIVE_PCM_BASE64 } from "@/utils/thinking-tone.native-pcm";
 import { useVoiceAudioEngineOptional } from "@/contexts/voice-context";
+import { useIsLocalDaemon } from "@/hooks/use-is-local-daemon";
 
 const delay = (ms: number) =>
   new Promise<void>((resolve) => {
@@ -512,7 +516,8 @@ export default function SettingsScreen() {
   const isLoading = settingsLoading;
   const isMountedRef = useRef(true);
   const lastHandledEditHostRef = useRef<string | null>(null);
-  const isDesktop = Platform.OS === "web";
+  const isDesktop = isDesktopHost();
+  const isLocalDaemon = useIsLocalDaemon(routeServerId);
   const appVersion = resolveAppVersion();
   const appVersionText = formatVersionWithPrefix(appVersion);
   const editingServerId = editingDaemon?.serverId ?? null;
@@ -906,7 +911,12 @@ export default function SettingsScreen() {
           </View>
 
           {isDesktop ? <DesktopPermissionsSection /> : null}
-          {isDesktop ? <LocalDaemonSection appVersion={appVersion} /> : null}
+          {isDesktop ? (
+            <LocalDaemonSection
+              appVersion={appVersion}
+              showLifecycleControls={isLocalDaemon}
+            />
+          ) : null}
 
           <View style={settingsStyles.section}>
             <Text style={settingsStyles.sectionTitle}>Diagnostics</Text>
@@ -985,9 +995,9 @@ function HostDetailModal({
   const connections = host?.connections ?? [];
 
   // Restart logic (moved from DaemonCard)
-  const { snapshot: runtimeSnapshot, client: runtimeClient, isConnected } = useHostRuntimeSession(
-    host?.serverId ?? ""
-  );
+  const runtimeSnapshot = useHostRuntimeSnapshot(host?.serverId ?? "");
+  const runtimeClient = useHostRuntimeClient(host?.serverId ?? "");
+  const isConnected = useHostRuntimeIsConnected(host?.serverId ?? "");
   const runtime = getHostRuntimeStore();
   const daemonClient = runtimeClient;
   const daemonVersion = useSessionStore((state) => host ? (state.sessions[host.serverId]?.serverInfo?.version ?? null) : null);
@@ -1382,7 +1392,7 @@ function DaemonCard({
   onOpenSettings,
 }: DaemonCardProps) {
   const { theme } = useUnistyles();
-  const { snapshot } = useHostRuntimeSession(daemon.serverId);
+  const snapshot = useHostRuntimeSnapshot(daemon.serverId);
   const connectionStatus = snapshot?.connectionStatus ?? "connecting";
   const activeConnection = snapshot?.activeConnection ?? null;
   const lastError = snapshot?.lastError ?? null;

packages/app/src/screens/startup-splash-screen.tsx

@@ -1,7 +1,7 @@
 import { Text, View } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
 import { PaseoLogo } from "@/components/icons/paseo-logo";
-import { useTauriDragHandlers } from "@/utils/tauri-window";
+import { useDesktopDragHandlers } from "@/utils/desktop-window";
 
 const styles = StyleSheet.create((theme) => ({
   container: {
@@ -18,7 +18,7 @@ const styles = StyleSheet.create((theme) => ({
 }));
 
 export function StartupSplashScreen() {
-  const dragHandlers = useTauriDragHandlers();
+  const dragHandlers = useDesktopDragHandlers();
 
   return (
     <View style={styles.container} {...dragHandlers}>