can1357
71be058144
- Added `packages/collab-web/src/tool-render/`: a per-tool React renderer suite (one view per built-in tool) with common `ToolView` chrome, a `tv-` CSS design system, a registry, and an `<omp-tool-view>` web-component wrapper (`element.tsx`, `standalone.tsx`). - Switched collab-web transcript `ToolCard` to the per-tool renderers instead of the generic args/result JSON dump, and threaded a `ToolRenderHost` through `Transcript`/`AgentDrawer`/`app.tsx` so task-card agent chips drill into the matching subagent drawer. - Added `scripts/build-tool-views.ts` plus the `build:tool-views` script bundling the renderers (React included, `</script` escaped) into the gitignored `coding-agent/src/export/html/tool-views.generated.js`. - Modernized the coding-agent HTML export chrome in `template.html/css/js` to the tool-card design language and added the `<template-tool-views/>` injection point. - Showed the standard done checkmark for completed rows in the `job` tool renderer; its changelog line shares a changed run with the restyle entries. - The session-operations doc gained two adjacent lines; the subagent-transcript one belongs to the upcoming /share commit but is inseparable from the tool-view line.
@oh-my-pi/collab-web
Web client for omp collab sessions. Paste a /collab link into the browser and you get the same live session guests see in the TUI: streaming transcript, tool-call cards, subagent panel with live transcripts, and a composer that prompts (or interrupts) the host agent.
Quick start
# dev server (Bun HTML dev server with HMR) — http://localhost:3000
bun run dev
# offline demo: local relay + scripted mock host; prints a ws://localhost link
bun run mock-host
Host a session from any omp instance (/collab, or /collab ws://localhost:7466 to use the mock relay), then paste the printed link into the connect screen. Deep links work too: http://localhost:3000/#<roomId>#<key> auto-connects on load.
Build & deploy
bun run build # static site in dist/
dist/ is a fully static SPA — host it anywhere. JS/CSS bundles are content-hashed; favicons, manifest.webmanifest, robots.txt, sitemap.xml, and og-image.png come from public/ and are emitted at the site root under stable names (canonical URL: https://my.omp.sh/). Two runtime requirements:
- Secure context: room keys are unwrapped with WebCrypto (
crypto.subtle), which browsers expose only onhttps://orlocalhost. - Relay reachability: the client connects straight to the relay over WebSocket (
wss://for anything that isn't localhost). The default relay iswss://my.omp.sh; bare<roomId>#<key>links resolve against it.
The room key never leaves the URL fragment — it is not sent to the relay or any server.
Architecture
src/lib/— vendored wire codec (codec.tsAES-256-GCM,link.tsenvelope + link grammar),socket.tsreconnecting relay socket,client.tsguest session store (GuestClient+ immutable snapshots foruseSyncExternalStore). Shared protocol shapes come from@oh-my-pi/pi-wire.src/components/—transcript/(entries, markdown, tool cards),agents/(panel + transcript drawer),shell/(connect screen, header, composer, banners, toasts).src/tool-render/— per-tool React renderers shared with coding-agent HTML session exports: one view per built-in tool, commonToolViewchrome, theme-adaptivetv-design tokens, and an<omp-tool-view>web-component wrapper. TheToolRenderHostseam lets hosts wire agent-id chips to a sub-session view (drawer here, overlay in exports).scripts/—local-relay.ts(content-blind relay onBun.serve),mock-host.ts+fixture.ts(scripted host for offline dev),build-tool-views.ts(bundlessrc/tool-render/+ React intopackages/coding-agent/src/export/html/tool-views.generated.jsfor self-contained exports).
The package is intentionally standalone — no dependency on @oh-my-pi/pi-coding-agent at runtime or type level. Wire-shape drift is prevented by consuming the same @oh-my-pi/pi-wire contracts as the host, with sealed-frame interop still covered by test/codec.test.ts.