Zyquo Cloud Web — Build Plan & Phase Log
Strict phase order 0 → 8. Each phase gets a checklist here, checked off as work lands, plus a 3–5 line summary at its checkpoint.
Phase 0 — Research + Zyquo Cloud study
- Locate native Zyquo Cloud repo (
~/Desktop/zyquo-cloud) - Study provider layer (ProviderID, ProviderRegistry, OpenAICompatibleClient, AnthropicClient, StreamingService/SSEParser, ProviderProtocol)
- Study AIModel / capabilities / pricing / ParameterSupport model
- Study ZyquoTheme design tokens
- Extract complete model catalog (170 models, 12 providers — port from ModelCatalogData.swift, NOT the drifted catalog-summary.md)
- Study native UX (views, model picker, personas, prompt library, brand glyph) →
docs/NATIVE-UX.md - Empirical CORS probes, all 12 providers (preflight + real POST with Origin)
- Anthropic browser header confirmed (
anthropic-dangerous-direct-browser-access: true) - Web research: documented CORS stance per provider (cited in CORS-MATRIX)
- Write
docs/CORS-MATRIX.md - Write
docs/PROVIDER-REUSE.md
Phase 0 summary. Native repo studied end-to-end: only two wire formats
(OpenAI chat/completions ×11 incl. Gemini-compat; Anthropic Messages ×1), one
SSE parser, 170-model catalog, ZyquoTheme tokens extracted. Empirical CORS
probes with real keys: all 12 providers callable directly from the browser
(Anthropic needs anthropic-dangerous-direct-browser-access: true); documented
stances researched and cited. Proxy/Zyquo Router override still ships since
only Anthropic documents CORS officially. Gate satisfied: PROVIDER-REUSE.md +
CORS-MATRIX.md complete.
Phase 1 — Project setup (React + TS + Vite)
- Vite + React 19 + TypeScript strict (project references,
noUncheckedIndexedAccess) - Styling: CSS variables implementing ZyquoTheme (
src/design/tokens.css+global.css) — no Tailwind (dependency minimalism = smaller XSS surface) - State: Zustand installed
- ESLint (flat config) + Prettier; scripts
dev/build/preview/lint/typecheck/check - PWA scaffold (vite-plugin-pwa): app-shell precache only, NO API/key caching, manifest (light theme-color)
- Strict CSP meta in
index.html:connect-src= exact 12 provider origins + localhost (Zyquo Router); no inline/third-party scripts - Phase checkpoint:
npm run checkgreen (typecheck, lint, build)
Phase 1 summary. Hand-scaffolded Vite/React/TS-strict app with mandatory headers everywhere, ZyquoTheme tokens as CSS variables (light default + dark + 5 accents), a locked-down CSP whose connect-src is exactly the 12 provider origins plus localhost for Zyquo Router, and an app-shell-only PWA. Build, lint, and typecheck all green on first checkpoint.