# Round 10 — POC Architecture · The File Tree of Master Jason **Date**: 2026-04-30 **Time**: 40 min (of 3h) **Status**: ✅ COMPLETE — closes Critical Path **Round Type**: Critical Path Final --- ## 🎯 שאלה מרכזית **איך נראה המערכת בfile system? מה building blocks המוחשיים שצריך לכתוב כדי שPOC יעבוד?** --- ## 🏆 Verdict: 11 packages, ~3,400 lines of code total הPOC מורכב מ-11 חבילות בfile system: - 4 חבילות קוד frontend (renderer, components, theme, hooks) - 3 חבילות backend (plugins, catalog server, ws hub) - 2 חבילות assets (CSS, catalogs JSON) - 2 חבילות integration (Vaul wrapper, A2UI bridge) --- ## 📁 File Tree המלא — מה בונים ``` /opt/maariv-jason/ ⬅ הסביבה הראשית │ ├── packages/ ⬅ חבילות (npm workspaces) │ ├── jason-core/ ⬅ הליבה (~600 lines) │ │ ├── src/ │ │ │ ├── A2UIRenderer.tsx ⬅ Round 5 — 100 lines registry │ │ │ ├── DataModel.ts ⬅ JSON Pointer resolver │ │ │ ├── CatalogLoader.ts ⬅ fetches + caches catalog │ │ │ ├── Validator.ts ⬅ JSON Schema 2020-12 + Ajv │ │ │ └── types.ts ⬅ A2UI v0.9 TypeScript types │ │ └── package.json ⬅ deps: ajv, json-pointer │ │ │ ├── jason-components/ ⬅ 64 רכיבים מ-Round 5 (~1500 lines) │ │ ├── src/ │ │ │ ├── layout/ (Column, Row, Card, Surface, ...) │ │ │ ├── content/ (Text, Image, Markdown, Badge, ...) │ │ │ ├── forms/ (TextField, Select, ChoiceSet, ...) │ │ │ ├── domain/ (PressFlowStepper, FiveWBar, ContextCard, ...) │ │ │ └── index.ts ⬅ COMPONENT_REGISTRY = { ... } │ │ └── package.json ⬅ deps: @mui/material, vaul, ... │ │ │ ├── jason-theme/ ⬅ Round 3 + 9 — tokens + master.css │ │ ├── tokens/ │ │ │ ├── primitives.tokens.json ⬅ L1 │ │ │ ├── semantic.tokens.json ⬅ L2 │ │ │ ├── components.tokens.json ⬅ L4 │ │ │ └── tenants/ │ │ │ ├── maariv.tokens.json │ │ │ ├── bbc.tokens.json │ │ │ └── nytimes.tokens.json │ │ ├── style-dictionary.config.js │ │ └── dist/ ⬅ generated CSS files │ │ ├── master.css ⬅ ~80KB │ │ └── tenant-{slug}.css ⬅ ~2KB each │ │ │ ├── jason-hooks/ ⬅ React hooks (~200 lines) │ │ ├── src/ │ │ │ ├── useA2UIStream.ts ⬅ WebSocket consumer │ │ │ ├── useTenantTheme.ts ⬅ load tenant CSS │ │ │ ├── useDataModel.ts ⬅ subscribe to /path │ │ │ └── useAction.ts ⬅ handle user actions → server │ │ └── package.json │ │ │ └── jason-vaul-wrapper/ ⬅ Round 8 wrapper (~50 lines) │ └── src/JasonBottomSheet.tsx │ ├── apps/ │ ├── press-flow/ ⬅ ה-FE app הראשון (POC) │ │ ├── index.html ⬅ entry point │ │ ├── src/ │ │ │ ├── main.tsx ⬅ React 19 root │ │ │ ├── App.tsx ⬅ │ │ │ └── theme-loader.ts ⬅ inject CSS based on tenant │ │ └── vite.config.ts ⬅ port 8143 │ │ │ └── azolai-lobby/ ⬅ Round 46 — observability dashboard │ └── (TBD in Round 46) │ ├── plugins/ ⬅ ה-clastop-mega plugins │ ├── deskai_press_studio/ ⬅ EXISTING (12KB) │ │ ├── plugin.json │ │ └── plugin.py │ │ │ ├── deskai_a2ui_emitter/ ⬅ NEW (Round 6, ~150 lines) │ │ ├── plugin.json │ │ ├── plugin.py ⬅ SSE → A2UI translator │ │ └── mappings.py ⬅ SSE_TO_A2UI dict (43 events) │ │ │ └── deskai_event_bus/ ⬅ EXISTING │ ├── catalogs/ ⬅ A2UI catalog JSON files │ ├── press/v1.json ⬅ 64 components catalog │ ├── article/v1.json ⬅ article-output surface │ └── dossier/v1.json ⬅ entity dossier sheet │ ├── workers/ ⬅ Cloudflare Workers │ ├── assets-router/ ⬅ Round 7 — CDN proxy │ │ ├── src/index.ts │ │ └── wrangler.toml │ ├── research-router/ ⬅ EXISTING (Round 0) │ ├── catalog-versioner/ ⬅ NEW (Round 7) │ └── theme-resolver/ ⬅ NEW (Round 7) │ ├── research/ ⬅ הספר הזה! │ ├── _pipeline/ ⬅ scripts (publish, update-index) │ ├── round-00-pipeline-verification/ │ ├── round-01-google-claim/ │ ├── ... │ └── round-50-skill-synthesis/ ⬅ TBD │ ├── pnpm-workspace.yaml ⬅ npm workspaces config ├── package.json ⬅ root ├── tsconfig.json └── README.md ⬅ המסמך הראשי ``` --- ## 🔄 Sequence Diagram — מה קורה כשuser מדביק טקסט ``` USER BROWSER CLOUDFLARE CLASTOP-MEGA MAARIV-PRESS (WS Hub) (FastAPI :8200) (FastAPI :8105) │ │ │ │ │ │ paste text + click GO │ │ │ │ ├────────────────────────>│ │ │ │ │ │ │ │ │ │ │ POST /api/v1/press/flows │ │ │ │ ├──────────────────────────────────────────────────>│ │ │ │ │ │ │ │ │ │ │ INSERT press_flows │ │ │ │ │ → flow_id=42 │ │ │ │ │ │ │ │ 201 Created {flow_id:42} │ │ │ │ │<───────────────────────────────────────────────────│ │ │ │ │ │ │ │ │ WS subscribe flow:42 │ │ │ │ ├─────────────────────────>│ │ │ │ │ │ │ │ │ │ │ │ on_press_flow_created │ │ │ │ │ hook fires │ │ │ │ │ ↓ │ │ │ │ │ deskai_press_studio │ │ │ │ │ POSTs to press-api │ │ │ │ ├──────────────────────>│ │ │ │ │ │ │ │ │ │ SSE event: │ │ │ │ │ pipeline_start │ │ │ │ │<──────────────────────│ │ │ │ │ │ │ │ │ │ on_press_flow_event │ │ │ │ │ hook fires │ │ │ │ │ ↓ │ │ │ │ │ deskai_a2ui_emitter │ │ │ │ │ translates SSE→A2UI │ │ │ │ │ ↓ │ │ │ │ POST /publish flow:42 │ │ │ │ │<─────────────────────────│ │ │ │ │ │ │ │ │ A2UI msg via WS │ │ │ │ │<─────────────────────────│ │ │ │ │ │ │ │ │ │ JasonRenderer parses │ │ │ │ │ updates DOM │ │ │ │ │ │ │ │ │ user sees: "phase 1" │ │ │ │ │<────────────────────────│ │ │ │ │ │ │ │ │ │ │ │ │ SSE: 5w_partial │ │ │ │ │ (who: משרד הביטחון)│ │ │ │ │<──────────────────────│ │ │ │ ... 43 events total ...│ │ │ │ │ │ │ │ user sees article │ │ │ │ │ stream token-by-token │ │ │ │ │ Lobby dashboard live │ │ │ │ ``` **Total latency**: <100ms between SSE event → user sees DOM update. --- ## 📦 Dependencies — מה npm install מחזיק ### Root package.json ```json { "name": "maariv-jason", "private": true, "workspaces": ["packages/*", "apps/*"], "scripts": { "dev": "pnpm --parallel --filter './apps/*' dev", "build": "pnpm -r build", "tokens:build": "pnpm -F jason-theme build" }, "packageManager": "pnpm@9.0.0" } ``` ### packages/jason-core/package.json ```json { "name": "@maariv/jason-core", "version": "0.1.0", "main": "./dist/index.js", "types": "./dist/index.d.ts", "dependencies": { "ajv": "^8.12.0", "ajv-formats": "^3.0.0", "json-pointer": "^0.6.2" }, "peerDependencies": { "react": "^19", "react-dom": "^19" } } ``` ### packages/jason-components/package.json ```json { "name": "@maariv/jason-components", "version": "0.1.0", "dependencies": { "@maariv/jason-core": "workspace:*", "@mui/material": "^7.3.6", "@mui/x-data-grid": "^8.22.0", "@iconify/react": "^6.0.2", "vaul": "^1.0.0", "@lottiefiles/react-lottie-player": "^3.5.0", "react-markdown": "^9.0.0" } } ``` ### packages/jason-theme/package.json ```json { "name": "@maariv/jason-theme", "version": "0.1.0", "scripts": { "build": "style-dictionary build" }, "devDependencies": { "style-dictionary": "^4.0.0", "@tokens-studio/sd-transforms": "^0.16.0" } } ``` --- ## 🚦 Build Pipeline ```bash # 1. Generate CSS from tokens pnpm tokens:build # → packages/jason-theme/dist/master.css (~80KB) # → packages/jason-theme/dist/tenant-maariv.css (~2KB) # → packages/jason-theme/dist/tenant-bbc.css (~2KB) # 2. Upload to R2 rclone copy packages/jason-theme/dist/ r2:master-jason-css/ # → https://assets.clastop.app/css/master.css # → https://assets.clastop.app/css/tenant-maariv.css # 3. Build catalog JSON pnpm -F catalogs build # → catalogs/press/v1.json (validated) # → catalogs/article/v1.json rclone copy catalogs/ r2:master-jason-catalogs/ # → https://assets.clastop.app/catalogs/press/v1.json # 4. Deploy plugins cd plugins/deskai_a2ui_emitter clastop-mega plugin install . # → registered in plugins_trusted/ # 5. Deploy Workers cd workers/assets-router wrangler deploy # → assets.clastop.app/* → Worker # 6. Build + deploy frontend cd apps/press-flow pnpm build wrangler pages deploy dist # → press.clastop.app ``` --- ## 🎯 Sprint Plan — מ-0 ל-POC עובד ### Sprint 1 (3 ימים) — Foundation - Day 1: pnpm workspace + jason-theme tokens build - Day 2: jason-core (A2UIRenderer + types + validator) - Day 3: jason-components (10 components: Column, Row, Card, Text, Button, ContextCard, FiveWBar, BottomSheet, Image, Iconify) ### Sprint 2 (2 ימים) — Backend - Day 1: deskai_a2ui_emitter plugin + mappings (43 events) - Day 2: assets-router Worker + R2 buckets setup ### Sprint 3 (2 ימים) — Integration - Day 1: WebSocket subscribe in frontend (useA2UIStream hook) - Day 2: end-to-end test — paste → SSE → A2UI → DOM update ### Sprint 4 (1 יום) — Polish - Mobile testing (3 breakpoints) - RTL testing - Dark mode - Performance profiling **Total: 8 ימים → POC עובד**. --- ## 🧮 Code Sizing — סך השורות שצריך לכתוב | Package | Lines | Hours est | |---|---|---| | jason-core | ~600 | 8h | | jason-components | ~1,500 | 24h | | jason-theme/tokens | ~400 (JSON) | 4h | | jason-hooks | ~200 | 4h | | jason-vaul-wrapper | ~50 | 1h | | deskai_a2ui_emitter | ~300 | 6h | | catalog/press/v1.json | ~600 (JSON) | 4h | | assets-router Worker | ~150 | 2h | | Pipeline scripts | ~100 | 1h | | **Total** | **~3,400** | **~54h** | ב-8 ימי עבודה רצופים אזולאי+אני מסיימים POC עובד. **לא 70 שעות. לא 200**. 54. --- ## ✅ Closure — Critical Path Complete קווי A (סבבים 3-10) סגורים. כעת אנחנו יודעים: 1. ✅ **Tokens cascade** — 4 שכבות (Round 3) 2. ✅ **SSE → A2UI mapping** — 43 events מוגדרים (Round 4) 3. ✅ **Catalog** — 64 components ב-A2UI v0.9 (Round 5) 4. ✅ **Plugin engine** — 70% existing + 1 new plugin (Round 6) 5. ✅ **R2 pipeline** — 4 categories + 4 Workers (Round 7) 6. ✅ **Bottom Sheet** — Vaul + canvas push (Round 8) 7. ✅ **Mobile CSS** — 3 breakpoints + Logical Properties (Round 9) 8. ✅ **Architecture** — file tree + sequence + sprints (Round 10) **אפשר לבנות עכשיו**. כל שאלת ארכיטקטורה קריטית — נענתה. --- ## 🛣️ Next: קו B — Tower Stations (44 קומות) 11 סבבים שמתעדים כל station: prompt, input/output Jason, fallback, cost. ✅ **Round 10 closed. Critical Path complete.**