[PoC] Studio Web: run the Agentic UI in a browser

[lezama]

Related issues

• Related to Agentic UI: Foundation #3646 — this PR is stacked on top of it (base branch interface-improvements). No companion issue yet; opening as a directional proof of concept.

Note: to satisfy the pre-push "up to date with trunk" check, the branch also includes a routine merge of trunk. The actual change is a single commit; reviewers can focus on that.

How AI was used in this PR

This PR was built by an AI agent (Claude Code) — including this description — and then reviewed by me. The agent added the web entry, the web connector, and the CLI web-server, and verified the end-to-end flow in a real browser. Please review with that context in mind.

Proposed Changes

A proof of concept that runs Studio's new Agentic UI (apps/ui) in a plain web browser, as a foundation for "Studio Web."

apps/ui already talks to the backend only through its Connector interface, so this adds a web build target, a non-Electron connector, and a small headless backend — without changing the UI itself:

• You can open the Agentic UI in a browser tab and chat with the Studio Code agent. The agent runs exactly as it does on desktop — the same CLI engine and the same streamed AgentRunEvents — only the transport differs (HTTP + SSE instead of Electron IPC). No A2A in this path.
• The site list is the user's WordPress.com sites, fetched live from the dotcom API, limited to sites they can actually work on in Studio (the existing "syncable" criterion). For atomic sites that have a staging environment, the browser targets staging, not production.
• Everything runs on localhost for now.

This is directional, not production-ready: it shows that one portable Agentic UI can serve both desktop and web by swapping the connector. It deliberately skips the hosted/multi-tenant concerns — per-user isolation/sandboxing, WordPress.com login/OAuth, durable sessions, and deployment — which are the natural follow-ups.

Testing Instructions

Requires being logged in to WordPress.com via the Studio CLI/app (the site list and agent use that token).

1. npm run cli:build
2. Backend: node apps/cli/dist/cli/main.mjs web-server → serves http://localhost:8088
3. Frontend: cd apps/ui && npm run dev:web → serves http://localhost:5300
4. Open http://localhost:5300 — the Agentic UI loads and lists your WordPress.com sites.
5. Pick a site → New chat → send a prompt; the agent's reply streams in. Interrupt and answer-a-question work too.

Quick backend checks without the UI:

curl -s localhost:8088/health
curl -s localhost:8088/sites | python3 -m json.tool

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors? — tsc (apps/cli + apps/ui) and ESLint are clean. One known cosmetic console warning remains on web (a desk-config query returns undefined); it's inherent to the connector contract and non-fatal.

[lezama]

Superseded by #3721 — same PoC, now branched from Automattic/studio directly (no fork remote needed) and extended with the SecEx backend + per-session git workspace and publish flow.