feat: 5-day theme-level onboarding track from the "New here?" card (#30)
Some checks failed
On Pull Request to Main / test (pull_request) Failing after 24s
On Pull Request to Main / publish (pull_request) Has been skipped
On Pull Request to Main / deploy-dev (pull_request) Has been skipped

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>
This commit is contained in:
RaymondVerhoef
2026-07-13 09:08:38 +02:00
parent 48715df147
commit 5214c9db3b
14 changed files with 1144 additions and 5 deletions

View File

@@ -212,6 +212,34 @@ Best-effort telemetry for every Anthropic call (written by `callLLM`).
---
### `onboarding_overviews`
Cached, breadth-first per-theme overview for the onboarding track (issue #30).
One row per theme, shared across all users. Generated lazily on first open.
| Field | Type | Notes |
|---|---|---|
| theme | text | canonical theme name (from `topics.theme`); **unique** |
| content | json | validated `onboardingOverviewSchema` payload (title, what_it_is, why_it_matters, key_points, topics_covered) |
| topics_fingerprint | text | stable hash of the theme's sorted topic ids; a mismatch triggers regeneration |
Unique index on `(theme)`. Rules: authenticated-only (`@request.auth.id != ""`).
---
### `onboarding_completions`
Per-user, per-theme completion marker for the onboarding track (issue #30).
| Field | Type | Notes |
|---|---|---|
| team_member_id | text | the employee — **plain text**, not a relation (admins can delete members; orphan rows are harmless) |
| theme | text | the theme marked complete |
Unique index on `(team_member_id, theme)` → idempotent. Rules: authenticated-only.
Completion is tracked per **theme**, not per day; the 5 "days" are a read-time
presentation grouping, so re-chunking never loses progress.
---
## Dropped / legacy collections
These existed in earlier iterations and have been removed. Their `db.js` helpers

View File

@@ -10,8 +10,9 @@ A React 19 SPA built with Vite, routed by React Router 7. Entry: `src/main.jsx`
| Route | Screen | Access |
|---|---|---|
| `/login` | `Login.jsx` | public |
| `/onboarding` | `Onboarding.jsx` | logged-in, not yet enrolled |
| `/onboarding` | `Onboarding.jsx` | logged-in, not yet enrolled (enrollment page) |
| `/` | `Dashboard.jsx` | enrolled user |
| `/onboarding-track` | `OnboardingTrack.jsx` | any logged-in user, **any enrollment** (`skipEnrollmentGate`) |
| `/learn` | `Leren.jsx` | enrolled user |
| `/test` | `Testen.jsx` | enrolled user |
| `/leaderboard` | `Leaderboard.jsx` | enrolled user |
@@ -20,9 +21,14 @@ A React 19 SPA built with Vite, routed by React Router 7. Entry: `src/main.jsx`
`ProtectedRoute`:
- redirects to `/login` if not authenticated;
- redirects to `/onboarding` if `enrollment_status !== 'active'`**except** admins
heading to the admin panel, who are exempt;
heading to the admin panel, and routes passing `skipEnrollmentGate` (the onboarding
track), which are exempt;
- enforces `requireAdmin` for `/admin`.
> `/onboarding` (enrollment) and `/onboarding-track` (the 5-day theme intro) are
> distinct. The track is decoupled from enrollment on purpose so it also works as a
> refresher for existing staff.
Navigation chrome (top bar + mobile bottom nav) is rendered by `ProtectedRoute`.
`ChatLauncher` (R42) is mounted globally.
@@ -51,7 +57,17 @@ enrolled are redirected to `/`. See `docs/curriculum-spec.md`.
## Employee screens
- **Dashboard** — current cycle/week, assigned topic, cycle progress ring, quick
links to Learn and Test, mini leaderboard, recent activity.
links to Learn and Test, mini leaderboard, recent activity. The dismissible
"New here?" explainer card also carries the **onboarding-track CTA** (a progress
chip `X/5 days` + a Start/Continue/Review button linking to `/onboarding-track`),
shown only when the KB has themes to introduce.
- **Onboarding Track (`/onboarding-track`)** — a self-paced, breadth-first tour of
every theme, grouped into ≤5 day cards (`OnboardingTrack.jsx`). Opening a theme
lazily generates a short overview (what it is / why it matters for daily & weekly
work / key points / topics) and offers "Mark as done"; a progress ring + day bar
track completion, and a completion banner shows when every theme is done. Available
to any logged-in user regardless of enrollment; completion is stored per theme in
`onboarding_completions`. See `docs/generation-spec.md §D`.
- **Learning Station (`/learn`)** — the week's required topic + the rest of the
knowledge library; opening a topic shows the micro-learning selector
(`src/components/micro_learning/`). Completing ≥1 micro-learning marks the week done.

View File

@@ -74,6 +74,29 @@ explanation, difficulty }`.
---
## D. Onboarding overviews — `src/lib/onboardingService.js`
Powers the 5-day onboarding track (issue #30): a short, breadth-first overview of
**one theme** for a brand-new employee — deliberately light, not a deep lesson.
- **Tool:** `emit_onboarding_overview` · **tier:** `fast` (Haiku) · `maxTokens: 1500`,
60s timeout · schema `onboardingOverviewSchema`.
- **Shape:** `{ title, what_it_is, why_it_matters, key_points[35], topics_covered[{topic_id,label}] }`.
`why_it_matters` is framed around day-to-day / week-to-week work at Respellion.
- **Cache:** `onboarding_overviews`, one row per theme, keyed by theme name plus a
`topics_fingerprint` (stable hash of the theme's sorted topic ids).
`getOrGenerateOnboardingOverview(theme, topics, {force})` returns the cached row when
the fingerprint matches; a mismatch (topic added/removed) or `force` regenerates.
- **Simulation:** `emit_onboarding_overview` has a stub in `SIMULATION_TOOL_STUBS`.
Theme ordering + day grouping are pure helpers in the same module
(`orderThemes`, `distributeThemesIntoDays`, `computeTopicsFingerprint`,
`computeOnboardingProgress`, `buildOnboardingPlan`), unit-tested in
`src/lib/__tests__/onboardingService.test.js`. Completion is recorded per **theme**
in `onboarding_completions` (`{ team_member_id, theme }`), not per day.
---
## Shared infrastructure (`src/lib/llm.js`)
- **Tiers:** `fast` (Haiku 4.5), `standard` (Sonnet 4.6), `reasoning` (Opus 4.7);