[Phase 1] Generative Classroom vertical slice (live session UI)

[ahmedfahim21]

Closes #39 — the third unchecked task in the Learnify 2.0 tracker (#50). Builds on the #38 A2UI protocol + Bedrock loop (now on main via #54).

What this does

Enter a topic → land in a live tutoring session where every screen is agent-generated A2UI, rendered from a safe client-side widget catalog.

Renderer (src/components/classroom/)

• SurfaceRenderer.tsx — the single boundary between A2UI and React: a reducer over the four envelope types (createSurface / updateComponents / updateDataModel / deleteSurface). This is the pre-planned hand-rolled fallback the issue allows in place of the @a2ui/react v0.9 preview dependency, behind the same interface. Surfaces are created on demand from append-mode updateComponents, and every top-level component (one not referenced as another's child) renders in arrival order — so streamed Narration and present_ui surfaces compose into one session surface.
• Widgets (Tailwind): Narration (streaming markdown), ExplanationCard, MultipleChoiceCheck (choice → next turn), SessionRecap, Row/Column.
• Markdown.tsx — small, dependency-free markdown for Narration/cards.
• Classroom.tsx — POSTs turn events, reads the fetch body as SSE, feeds envelopes to the renderer, and sends the learner's choice back as the next turn. Auto-starts the first turn on a fresh session.

API + pages

• POST /api/topics (+ GET) and POST /api/sessions (kind: learn), scoped to a hardcoded demo learner (src/lib/demo.ts) until auth lands ([Phase 5] Auth (Better Auth + GitHub OAuth), demo mode & cost guardrails #47).
• /topics — create a topic and jump straight into a session; lists existing topics.
• /session/[sessionId] — the classroom. On refresh it rebuilds the rendered surfaces from the transcript (src/lib/agent/replay.ts: tutor prose → Narration, persisted present_ui input → validated envelope), so a reload restores the session view.
• Landing page links into /topics.

Acceptance criteria

• npm run build and npm run lint pass with no env vars set
• Renderer folds a realistic envelope stream (Narration + present_ui Column with ExplanationCard + MCQ children) into one surface — 3+ widget types render progressively (verified out of band)
• Refresh rebuilds the surface from the event log (verified out of band)
• End-to-end MCQ adaptation (wrong → re-explain, right → advance) — needs AWS Bedrock + Neon to exercise at runtime

Notes

• The /turn route ([Phase 1] A2UI protocol layer + Bedrock streaming agent loop #38) consumes the next learner turn as message text, so a widget interaction is serialized to the chosen option's label and graded by the tutor — no route changes needed.
• Resume re-derives envelopes from the transcript rather than persisting rendered A2UI, matching [Phase 1] A2UI protocol layer + Bedrock streaming agent loop #38's event model.

https://claude.ai/code/session_013riTGcbsp6VCBw7X7Yg3Tp

---

Generated by Claude Code