* feat(app): open files and subagents in a closable sheet on compact On phones, opening a file, a provider subagent, or a Paseo subagent now shows it in a bottom sheet over the current tab instead of adding a tab, so the tab strip stays for terminals and root agents. Paseo subagents get "Open as tab" to move the same tab (same tabId and state) into a full tab with a composer; agents in a sheet hide the composer. The decision lives in the workspace layout store's openTab, driven by a per-kind `compactSheet` rule in the panel manifest, so every open path (chat links, Explorer, subagents track, notifications, plugins) follows it without call-site branching, and a new kind opts in with one manifest entry. The app shell publishes the layout mode (compact / single-pane / split-panes) once, so callers stop passing isCompact for placement. A sheet holding unsaved edits is never implicitly displaced; later opens go to tabs underneath, and closing it goes through the existing discard guard. The editor host is position: sticky because CodeMirror's scrollIntoView otherwise scrolls the bottom sheet's container and drags the sheet to full height. * test(app): fail the compact sheet snap check when the sheet is oversized --------- Co-authored-by: paseo-bot[bot] <paseo-bot[bot]@users.noreply.github.com>
21 KiB
CLAUDE.md
Paseo is a mobile app for monitoring and controlling your local AI coding agents from anywhere. Your dev environment, in your pocket. Connects directly to your actual development environment — your code stays on your machine.
Supported agents: Claude Code, Codex, GitHub Copilot, OpenCode, Pi, Antigravity, and Muse Code.
Repository map
This is an npm workspace monorepo:
packages/server— Daemon: agent lifecycle, WebSocket API, MCP serverpackages/app— Mobile + web client (Expo)packages/cli— Docker-style CLI (paseo run/ls/logs/wait)packages/relay— E2E encrypted relay for remote accesspackages/desktop— Electron desktop wrapperpackages/website— Marketing site (paseo.sh)
Docs
docs/ is the source of truth for system-level and process-level knowledge. "The docs", "check the docs", or "check the X docs" always mean this directory — not the web. Look here before fetching anything online; the docs capture gotchas and conventions you cannot derive from the code or external sources.
At the start of non-trivial work, list docs/ and skim anything relevant to the task.
| Doc | What's in it |
|---|---|
| docs/product.md | What Paseo is, who it's for, where it's going |
| docs/architecture.md | System design, package layering, WebSocket protocol, agent lifecycle, data flow |
| docs/agent-lifecycle.md | Agent states, parent/child relationships, archive semantics, tabs vs archive, subagents track |
| docs/data-model.md | File-based JSON persistence, Zod schemas, atomic writes, no migrations |
| docs/glossary.md | Authoritative terminology — UI label wins, no synonyms |
| docs/coding-standards.md | Type hygiene, error handling, state design, React patterns, file organization |
| docs/design.md | Design system — tokens, buttons, hierarchy, density, alignment rails, states, what's forbidden |
| docs/forms.md | Form architecture — non-React form model, form kit, load-state gating; the schedule form is the golden example |
| docs/hover.md | Hover — the canonical pattern (plain View + onPointerEnter/Leave, separate inner Pressable) and the three ways agents break it |
| docs/unistyles.md | Unistyles gotchas — useUnistyles() is forbidden, alternatives in order |
| docs/floating-panels.md | Anchored popovers — Portal/Modal escape for Android, lifecycle gates, keyboard-shared-value, status-bar offset, the flash |
| docs/menus.md | The menu engine — popover vs sheet, submenu pages, hover intent, when a decision earns a submenu |
| docs/expo-router.md | Expo Router route ownership, startup restore, and native blank-screen gotchas |
| docs/file-icons.md | Material icon theme integration for the file explorer |
| docs/providers.md | Adding a new agent provider end-to-end |
| docs/forge-providers.md | Adding a git forge: registry/manifest, drop-in checklist, self-host/GHES, the two facts tiers |
| docs/custom-providers.md | Custom provider config: Z.AI, Alibaba/Qwen, ACP agents, profiles, custom binaries |
| docs/plugins.md | Local plugin manifest, directory source config, RPCs, native surfaces, and attachment sources |
| docs/service-proxy.md | Service proxy: exposing workspace scripts at public URLs, DNS setup, reverse proxy config |
| docs/development.md | Dev server, build sync gotchas, CLI reference, agent state, Playwright MCP |
| docs/rpc-namespacing.md | WebSocket RPC naming convention — dotted namespaces and .request/.response pairs |
| docs/protocol-compatibility.md | Why app/daemon versions drift, protocol vs feature contract, capability gating, COMPAT tagging |
| docs/protocol-validation.md | zod-aot generated inbound WebSocket validation, patched compiler regressions, schema-purity rules |
| docs/permissions.md | Semantic daemon permissions, principals, credentials, pairing invitations, and Hub authority |
| docs/terminal-performance.md | Terminal latency pipeline, coalescing/backpressure invariants, benchmark + perf spec usage |
| docs/agent-stream-performance.md | Assistant text pipeline — coalescing window, paced reveal, why arrival lumps are smoothed at render |
| docs/file-observation.md | Recursive watcher ownership, Linux constraints, teardown invariants, and Parcel comparison |
| docs/testing.md | TDD workflow, determinism, real dependencies over mocks, test organization |
| docs/qa.md | QA evidence bar for pull requests — platform matrix, version drift, performance, UI proof |
| docs/mobile-testing.md | Maestro and mobile test workflows |
| docs/mobile-panels.md | Compact left/center/right panel ownership, worklet motion, gesture revisions, and Fabric constraints |
| docs/explorer-sidebar.md | Explorer sidebar, side-pane, and compact workspace sheet host contracts, lifecycle, placement, routing preferences |
| docs/ad-hoc-daemon-testing.md | Isolated in-process daemon test harness |
| docs/browser-capture-harness.md | Real-Electron browser screenshot harness and compositor-surface gotcha |
| docs/android.md | App variants, local/cloud builds, EAS workflows, version codes, F-Droid source builds and store metadata |
| docs/docker.md | Running the daemon and bundled web UI in Docker, volumes, agent images, security |
| docs/release.md | Release playbook, draft releases, completion checklist |
| docs/terminal-activity.md | Terminal activity indicators — source-agnostic tracker, agent hook reporting, adding a new hook provider |
| SECURITY.md | Relay threat model, E2E encryption, DNS rebinding, agent auth |
| public-docs/hub/security.md | Public Hub guide — trust boundaries, untrusted triggers, provider controls, and output authority |
Writing docs
- Integrate, don't append. Find the doc that owns the subject and rewrite the part that is now wrong. The standard failure is finishing a task and adding a paragraph to the bottom of the closest-looking doc; ten tasks later the doc is a pile of paragraphs in discovery order.
docs/custom-providers.mdis what that looks like. - Don't document logic. Prose that restates code drifts from the code and loses. Write down what the code can't tell you: why something is shaped the way it is, the gotcha that cost an afternoon, conventions nothing enforces, constraints that span packages or versions. If a reader could get it in two minutes by opening the file, cut it.
- One fact, one doc. Every other mention is a link. If you are about to write the same paragraph in two docs, one of them is a link.
- Respect the layers.
CONTRIBUTING.mdand this file name things and link out. Activity docs likedocs/qa.mdanddocs/testing.mdset the bar for a kind of work. Subject docs likedocs/unistyles.mdown one thing completely. A layer never re-explains the one below it. - One subject per doc. If the subject doesn't fit in a sentence, split the doc. A section per provider, vendor, or platform is a table plus one worked example.
- Delete. Obsolete sections go. Prefer a
packages/app/src/thing.ts:120reference over a pasted block. - New doc? Add a row to the table above and link it from the docs that should send readers there.
- Code-level facts belong in comments next to the code, not here.
Doc voice
Plain and short. Second person. State the rule, then the reason when the reason isn't obvious. Match the doc you're editing.
Do not:
- Write a sentence to land a point. "It's not X, it's Y", "That's not a Z, that's a W", and every other setup-and-punchline shape.
- Add a clause that only asserts importance: "and that matters", "which is what keeps it working", "this is critical".
- Use "honest", "robust", "seamless", "powerful", "simply", "just", "delightful".
- Restate something you already said, in different words, for emphasis.
- Hedge with "generally", "typically", or "you may want to" when the answer is "do this".
- Clear your throat: "It's worth noting that", "In order to", "This section covers".
Quick start
npm run dev # Start the dev daemon
npm run dev:app # Start Expo against the dev daemon
npm run dev:desktop # Start Electron desktop dev
npm run cli -- ls -a -g # List all agents
npm run cli -- daemon status # Check daemon status
npm run typecheck # Always run after changes
npm run lint # Always run after changes
npm run format # Auto-format with Biome
npm run format:check # Check formatting without writing
Repo dev commands use checkout-local state by default. In this checkout, PASEO_HOME resolves to .dev/paseo-home, and npm run cli -- ... targets that same dev home automatically. The packaged desktop app and production-style daemon keep using ~/.paseo on port 6767.
See docs/development.md for full setup, build sync requirements, and debugging.
Release branches
When the user says "this goes to next", create or
retarget the PR to next and preserve that destination through delivery. Follow
release branch discipline for creating
and updating next, integrating it after a release, and releasing a hotfix from a tag.
Critical rules
- NEVER restart the main Paseo daemon on port 6767 without permission — it manages all running agents. If you're an agent, restarting it kills your own process.
- NEVER assume a timeout means the service needs restarting — timeouts can be transient.
- NEVER add auth checks to tests — agent providers handle their own auth.
- Before changing app routes, startup routing, remembered workspace restore, or active workspace selection, read docs/expo-router.md.
- NEVER run the full test suite locally. The test suites are heavy and will freeze the machine, especially if multiple agents run them in parallel. Rules:
- Run only the specific test file you changed:
npx vitest run <file> --bail=1 - Never run
npm run testfor an entire workspace unless explicitly asked. - If you must run a broad suite, pipe output to a file and read it afterward:
npx vitest run <file> --bail=1 > /tmp/test-output.txt 2>&1then read the file. - Never re-run a test suite that another agent already ran and reported green — trust the result.
- For full suite verification, push to CI and check GitHub Actions instead.
- Run only the specific test file you changed:
- Add tests to existing suites and reuse their npm scripts and CI jobs instead of creating feature-specific ones.
- Always run typecheck and lint after every change.
- Build workspace packages before diagnosing cross-package type errors. This repo consumes generated declarations across workspaces. If typecheck fails in a package that depends on another workspace, rebuild the owning stack first so
distdeclarations are current:npm run build:client— rebuild protocol and client declarations.npm run build:server— rebuild highlight, relay, protocol, client, server, and CLI when server/CLI types may be stale.- Do not patch inferred callback parameters or add local duplicate types just to silence stale declaration errors.
- Run
npm run formatbefore committing. This repo uses Biome for formatting. Do not manually fix formatting — let the formatter handle it. - Always use npm scripts for linting and formatting. Do not run tools directly with
npx eslint,npx oxfmt,npx oxlint, or package-local binaries. For targeted checks, pass file paths through the npm script:npm run lint -- packages/app/src/components/message.tsxnpm run format:files -- CLAUDE.md packages/app/src/components/message.tsx
- The protocol stays backward-compatible. Features don't have to. Read docs/protocol-compatibility.md before touching
packages/protocol. The short version:- Protocol contract (always): an old client parses messages from a new daemon, and a new daemon parses messages from an old client. New fields are optional; never narrow, never remove, never require. Wire schemas stay pure — no
.transform(),.catch(), or.preprocess(). - Feature contract (per-feature): gate the capability once on
server_info.features.*, then run the feature or tell the user to update the host. No fallback paths, no defensive branches. - Every shim is tagged.
// COMPAT(name): added in vX, remove after <date>at the site that has to be deleted.rg "COMPAT\("is the cleanup backlog; untagged back-compat is permanent by accident. - New RPCs use dotted namespaces with direction suffixes. Follow docs/rpc-namespacing.md:
domain.provider.operation.requestpairs withdomain.provider.operation.response. Existing flat RPC names will migrate over time; don't add new ones.
- Protocol contract (always): an old client parses messages from a new daemon, and a new daemon parses messages from an old client. New fields are optional; never narrow, never remove, never require. Wire schemas stay pure — no
Platform gating
The app runs on iOS, Android, web (browser), and web (Electron desktop). Code is cross-platform by default. Gate only when you must. Import gates from @/constants/platform.
The four gates
| Gate | Type | When to use |
|---|---|---|
isWeb |
constant | DOM APIs — document, window, <div>, addEventListener, ResizeObserver. This is the exception, not the default. |
isNative |
constant | Native-only APIs — Haptics, StatusBar.currentHeight, push tokens, camera/scanner, expo-av. |
getIsElectron() |
cached fn | Desktop wrapper features — file dialogs, titlebar drag region, daemon management, app updates, dock badges. |
useIsCompactFormFactor() |
hook | Layout decisions — sidebar overlay vs pinned, modal vs full screen, single-panel vs split. From @/constants/layout. |
Decision matrix
| I need to... | Use |
|---|---|
Access DOM (document, window, <div>, addEventListener) |
if (isWeb) |
| Use a native-only API (Haptics, push tokens, camera) | if (isNative) |
| Use an Electron bridge (file dialog, titlebar, updates) | if (getIsElectron()) |
| Switch layout between phone and tablet/desktop | useIsCompactFormFactor() |
| Show something on hover, always-visible on native | isHovered || isNative || isCompact (hover only works on web) |
| Gate to iOS or Android specifically | Platform.OS === "ios" / Platform.OS === "android" (rare, keep inline) |
Rules
- Default is cross-platform. Don't gate unless you have a specific reason.
- Prefer Metro file extensions over
ifstatements. When a module has fundamentally different implementations per platform, use.web.ts/.native.tsfile extensions instead of runtimeif (isWeb)branches. Metro resolves the correct file at build time — the unused platform code is never bundled. Reserveif (isWeb)for small, inline checks (a single line or a few props). If you find yourself writing a largeif (isWeb) { ... } else { ... }block, split into separate files instead.Import ashooks/ use-audio-recorder.web.ts ← uses Web Audio API use-audio-recorder.native.ts ← uses expo-audio@/hooks/use-audio-recorder— Metro picks the right file automatically. - Use
.electron.ts/.electron.tsxfor Electron-only web modules. Electron is still the Metrowebplatform, but desktop dev/build setsPASEO_WEB_PLATFORM=electron, so Metro first looks for.electron.*files and falls back to normal.web.*files. Use this when the implementation depends on Electron-only behavior such aswebviewTag, desktop preload APIs, or the Electron bridge. Keep plain browser web in.web.*, and keep native fallbacks in the base file or.native.*.Import asdesktop/browser/pane/ index.electron.tsx ← Electron <webview> implementation index.web.tsx ← plain web fallback index.tsx ← native fallback@/desktop/browser/pane— Electron desktop gets the.electron.tsxfile, browser web gets.web.tsx, and native gets the native/base implementation. - NEVER use raw DOM APIs without
isWebguard. DOM APIs crash native. Casting a RN ref toHTMLElementis a red flag — ensure the block is web-only. - NEVER use
onPointerEnter/onPointerLeave. They don't fire on native iOS. - Hover only works on web. React Native's
onHoverIn/onHoverOutonPressabledoes NOT fire on native iOS/iPad — the underlying W3C pointer events are behind disabled experimental flags. For hover-to-show UI (kebab menus, action buttons), useisHovered || isNative || isCompactso the controls are always visible on native and hover-to-show on web. - Don't use Platform.OS as a proxy for layout capabilities. Use breakpoints for layout decisions, not platform checks.
- Import
isWeb/isNativefrom@/constants/platform. Never writeconst isWeb = Platform.OS === "web"locally.
Debugging
Find the complete daemon logs and traces in the $PASEO_HOME/daemon.log