5214c9db3b2649ee0146b14ef61be54e8da8c763
A self-paced onboarding track that introduces a new employee to every KB theme in breadth (not depth), so they grasp how Respellion works day to day and week to week. Offered as a CTA inside the Dashboard "New here?" explainer card; always available regardless of enrollment. Design: - Theme is the trackable unit; the 5 "days" are a read-time presentation grouping, so re-chunking never loses progress. Completion is stored per theme in onboarding_completions. - Per-theme overview generated lazily on first open (fast-tier emit_onboarding_overview tool), cached in onboarding_overviews keyed by theme + a topics_fingerprint that triggers regeneration when the theme's topic set changes. - Reachable via /onboarding-track using the existing skipEnrollmentGate prop, decoupled from the 26-week curriculum (distinct from /onboarding, the enrollment page). Backend: - pb_migrations/1781200000_created_onboarding.js: two collections with authenticated-only rules and unique indexes; TEXT team_member_id (no relation) per the post-#18/#27 convention. Mirrored in scripts/setup-pb-collections.mjs. - src/lib/onboardingService.js: pure helpers (orderThemes, distributeThemesIntoDays, computeTopicsFingerprint, computeOnboardingProgress, buildOnboardingPlan) + generation + I/O. - db.js onboarding helpers use pb.filter() bindings (theme is free text). - LLM tool + Zod schema + registry + simulation stub. Frontend: - src/pages/OnboardingTrack.jsx (day list, per-theme overview, completion banner, progress ring/day bar). - Dashboard "New here?" card CTA + X/5-days progress chip (hidden when the KB has no themes). Docs: data-model, generation-spec (§D), frontend-spec updated. Verified: 22 new unit tests (npm test 134/134), eslint clean on changed files, npm run build OK, PocketBase v0.30.4 boot applies the migration (collections + unique indexes + authed rules confirmed), and a backend contract check (upsert idempotency, unique-index guard, special-char theme filtering). Closes #30 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Respellion Learning Platform
An internal AI-powered learning platform that keeps Respellion employees up to date with the company's evolving knowledge base.
Features
- Onboarding — On first login each employee enrolls into the curriculum with one tap. Their 26-week cycle starts then and there.
- Weekly Learning Station — Each employee gets a topic for their current curriculum week, drawn from the active 26-week schedule (with a deterministic hash fallback when no curriculum is active). They engage via micro-learnings (concept explainer, scenario quiz, flashcard set) and can also generate long-form formats (Article, Slides, Infographic) on demand.
- Weekly Test — A 5-question AI-generated quiz for the week's topic. Results feed the leaderboard.
- Leaderboard & Gamification — Points for correct answers, badges for milestones (First Steps, Veteran, Perfectionist).
- R42 Chatbot — An always-available AI assistant (Claude) grounded in the knowledge graph via local TF-IDF retrieval. It can propose graph updates that admins approve or reject.
- Admin Panel — Manage the knowledge graph, upload source files, review/refine generated content, generate the curriculum, and manage the team.
Tech Stack
| Layer | Technology |
|---|---|
| Frontend | React 19 + Vite 8, React Router 7 |
| Styling | Vanilla CSS (custom properties) + Tailwind v4 utilities |
| Animations | Framer Motion |
| Icons | Lucide React |
| Graph viz | D3.js (admin knowledge graph only) |
| Backend / DB / auth | PocketBase (self-hosted, SQLite) |
| Retrieval | Local TF-IDF (no Qdrant, no embeddings API) |
| AI | Anthropic Claude (via Caddy reverse proxy) |
| Infra | Docker + Caddy; Ansible playbooks under infra/ |
Claude models (by tier): fast = claude-haiku-4-5-20251001, standard = claude-sonnet-4-6, reasoning = claude-opus-4-7.
Getting Started (local dev)
# 1. Install dependencies
npm install
# 2. Start PocketBase
./pocketbase.exe serve
# 3. Bootstrap collections (first run only)
node scripts/setup-pb-collections.mjs
# 4. Start the dev server
npm run dev
Set ANTHROPIC_API_KEY in your environment — the Vite dev server proxies /api/anthropic and injects the key server-side (see vite.config.js). PocketBase migrations in pb_migrations/ apply automatically when the binary starts.
Deployment (Docker)
docker compose up -d
The Caddyfile handles:
- SPA fallback routing
/api/anthropic/*→ Anthropic API (server-side API key injection)/api/*and/_/*→ the PocketBase sidecar
Key Files
| File | Purpose |
|---|---|
src/lib/llm.js |
Core Anthropic wrapper (callLLM): tiers, retry, schema validation, telemetry |
src/lib/db.js |
All PocketBase data access |
src/lib/extractionPipeline.js |
Uploaded file → knowledge-graph extraction |
src/lib/learningService.js |
On-demand content generation (article / slides / infographic) |
src/lib/microLearningService.js |
Micro-learning generation (3 types) |
src/lib/curriculumService.js |
26-week per-user curriculum engine |
src/lib/retrieval.js |
TF-IDF retrieval for R42 |
src/store/AppContext.jsx |
Global state; derives the user's curriculum week from their start date |
AI_AGENT.md |
Detailed context guide for AI coding agents |
Content Types
On-demand long-form content (the content collection), generated per type and merged into the cached object:
| Type | Key in DB | Description |
|---|---|---|
| Article | content.article |
Long-form reading |
| Slides | content.slides |
Slide deck with speaker notes |
| Infographic | content.infographic |
Visual summary with stats and steps |
The podcast type was removed. Do not re-add it.
Micro-learnings (the micro_learnings collection): concept_explainer, scenario_quiz, flashcard_set.
Documentation
CLAUDE.md— project overview and constraints for AI coding agents.AI_AGENT.md— full architectural guide (patterns, gotchas, decisions).docs/— subsystem specs (architecture, data model, ingestion, generation, curriculum, R42, frontend, gamification).
Description
Languages
JavaScript
95.6%
TypeScript
3.6%
CSS
0.8%