Spec 146 phase 12: codev-client tiling, mobile, and the static mount

[pseudoseed]

Spec 146 phase 12. This is the phase that makes the client usable. Phase 11 put apps/client on
main, but Tower does not serve it and the root build does not include it, so today it runs only from
a checkout via pnpm dev:servers + pnpm dev. Until this lands, the client is something you can
open, not something you use.

The plan section is reproduced verbatim so it is not fetched by path.

---

Phase 12: codev-client tiling and mobile

Dependencies: Phase 7, Phase 11

Objective

The tiled pane grid, the architect strip, and the narrow-viewport paging — verified at the exact
measurements the spec gives, because these criteria are arithmetic and a component test cannot
check them.

Files to Create / Modify

• apps/client/src/grid/ — the tile grid.
• apps/client/src/pane/ — a builder pane.
• apps/client/src/architect-strip/
• apps/client/src/responsive/ — paging behaviour.
• apps/client/e2e/tiling.spec.ts, apps/client/e2e/mobile.spec.ts

Deliverables

• Six builders tile at 1440x900 in a 3x2 grid, every pane at least 340x240 CSS px, body
  text at 13px or larger, each pane showing builder id, status, and the last three agent
  messages.
• The architect does not occupy a seventh tile at 1440x900. It gets a persistent strip
  below the grid showing status and its last message, and expands to a full pane on demand,
  replacing the grid. A seventh equal tile is offered only at 1920 or wider.
• At 390px wide the same six page one-per-screen with no horizontal scroll. The grid pages
  rather than shrinks.
• Reachable over a tailnet from an iPad, and able to drive a builder to completion from there.
• Tests for this phase.

Acceptance Criteria

• Criterion 4, measured under Playwright at 1440x900: pane dimensions and computed font size
  asserted from the rendered page, not from the stylesheet.
• Criterion 4b: no seventh tile at 1440x900; the strip is present; expansion replaces the grid;
  a seventh tile appears at 1920.
• Criterion 5, measured at 390px: document.documentElement.scrollWidth does not exceed the
  viewport width.
• Criterion 6: an iPad on the tailnet drives a builder to completion. This one is manual and is
  recorded with what was actually done.
• Build and tests pass.

Test Plan

E2E under Playwright at 1440x900, 1920x1080 and 390px, asserting measured geometry.

Manual: the iPad run, over the tailnet, with the teardown step
(tailscale serve --https=443 off) exercised afterwards so the runbook is tested rather than
written.

---

---

Required scope beyond the plan — #228, inlined by the architect

Phase 12's approved plan predates phase 11's partial merge and mentions none of the following.
All four are required here. Read #228 in full; this is the summary, not the substitute.

1. The static mount. Tower (or a gateway) serves /client/ and proxies /m/<id>/, the way it
   already serves /v2/, including the frame-ancestors header a meta CSP cannot carry. Add
   apps/client to the root build script. Today scripts/serve.mjs is the only server for the
   built bundle.

2. Criterion 3 — a production t3codeSnapshot provider. Phase 11 left it unwired and unticked,
   with spec-146-phase-11-production-wiring.test.ts asserting initAgentRoutes passes no provider.
   Wiring one makes that test fail; that is intended. The reason it was deferred is real:
   t3codeSnapshot is synchronous and a t3 connection is not, so this needs a cached background
   subscription plus per-workspace t3 config Tower does not currently hold. Without it every
   non-blocked row renders UNKNOWN.

3. Criterion 9b — durable asynchronous gate approval. handleGateApprove sets
   refuseIfChecksWouldRun: true, so any ordinary project whose phase has checks is refused and the
   operator must leave the client for the CLI. Do not fix this with a request timeout. A client
   that gives up does not stop porch, so a timeout abandons a call that goes on to approve the gate
   anyway — reporting one outcome while another happened. Submit, poll, report.

4. An operator pairing entry point. PairingStore.issue() has two callers: a dev script and
   tests. There is no afx command a human can run, so the approval path is test-reachable only —
   9b is unreachable in production even with async approval. Shape named in Spec 146 phase 11 partial: criteria 3 and 9b unmet, and no operator pairing entry point #228: afx pair issue/list/revoke, authority recorded from the invoking operator, token printed once to a
   terminal and never to a log or argv. Revocation currently requires a credential the operator
   does not hold (DELETE /api/agent/v1/machines/<id> answers 401 MACHINE_CREDENTIAL_REQUIRED),
   so afx pair revoke must work for someone holding nothing. Minting is cheap and revoking is
   privileged; the asymmetry runs the wrong way.

Architect notes

Stack matches apps/v2 and apps/client: React 19, Vite 6, Vitest 4, Playwright.

A green suite cannot detect design infidelity. Spec 83 shipped a client passing 127 client
tests, 3,394 server tests and 15/15 Playwright — correct tokens, correct containment — that was
unusable, because it had dropped every label prefix, the header bar, and rendered idle sparklines as
invisible dots (#112). Phase 11's own three catches were the same: unstyled raw HTML from CSP
blocking Vite's style tag, every builder reading builder/builder-air-220, and an approval
confirmation that flashed and vanished. Open it and look before calling anything done.

Suites, because a green run is evidence only about what it ran. Five exist:
packages/codev unit, its vitest.e2e.config, its vitest.cli.config, apps/client unit, and
apps/client Playwright. apps/client/__tests__/suite-coverage.test.ts derives that table from the
configs and test.yml and fails if it drifts — extend it rather than hand-editing a list.

Phase 11's known limits, carried: wire types are hand-mirrored in
apps/client/src/connection/types.ts rather than shared via @cluesmith/codev-types;
tools/codev-agent-host imports packages/codev by deep relative path; the snapshot ships
protocol.statuses at 98% of payload that no client reads (#225).

Do not enable thread-backing on any workspace that receives porch --no-enter gate
notifications. A thread-backed architect receives no gate notice — correct for a composer-less
transport, and an open decision.