Dmitri d4a5378adf Refactor: migrate frontend to Vite/React, add product backend modules

Frontend:
- Replace Next.js with Vite + React + TypeScript
- Add new component architecture (app-shell, sidebar, dashboard modules)
- Implement product modules: FRAME, safety protocols, walkthrough checkin,
  campus/staff attendance, personality quiz, sign language, classroom timer
- Add shadcn/ui component library with Tailwind CSS
- Remove legacy generated components, stores, and pages

Backend:
- Add product migrations: frame_entries, user_progress, safety_quiz_results,
  walkthrough_checkins, communication_events, personality_quiz_results,
  campus_attendance_config/summaries, staff_attendance_records, content_catalog
- Add corresponding models, services, and routes
- Implement cookie-based auth with refresh token rotation
- Add content catalog seeder with product content
- Migrate to ESLint flat config
- Switch from yarn to npm

Infrastructure:
- Update .gitignore for new tooling
- Add project documentation (CLAUDE.md, docs/)
- Remove deprecated config files and yarn.lock

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

2026-06-09 15:18:23 +02:00

2.4 KiB

Raw Blame History

Classroom Support Integration

Purpose

ClassroomSupport renders editable classroom strategy content from the backend content catalog. The frontend owns only UI state, filtering rules, style tokens, and presentation.

Runtime strategy records, images, descriptions, and implementation tips belong to the backend seed payload and can be managed through content catalog APIs.

Frontend Layers

View:

frontend/src/components/frameworks/ClassroomSupport.tsx
frontend/src/components/classroom-support/ClassroomSupportView.tsx
frontend/src/components/classroom-support/ClassroomSupportHeader.tsx
frontend/src/components/classroom-support/ClassroomSupportTryToday.tsx
frontend/src/components/classroom-support/ClassroomSupportFilters.tsx
frontend/src/components/classroom-support/ClassroomStrategyGrid.tsx
frontend/src/components/classroom-support/ClassroomStrategyCard.tsx
frontend/src/components/classroom-support/ClassroomStrategyDetailModal.tsx

Business logic:

frontend/src/business/classroom-support/hooks.ts
frontend/src/business/classroom-support/selectors.ts
frontend/src/business/classroom-support/types.ts

Shared contracts and UI config:

frontend/src/shared/types/app.ts
frontend/src/shared/constants/classroomSupport.ts
frontend/src/shared/constants/contentCatalog.ts

Backend Contract

The page reads:

GET /api/public/content-catalog/classroom-strategies

The content payload is seeded in:

backend/src/db/seeders/content-catalog-data/content-catalog-seed-payloads.js

Each strategy payload supports:

id
title
description
category
ageGroup
zone
image
implementationTip

Behavior

useClassroomSupportPage loads strategies through the shared content catalog hook.
Selectors handle search, category, age, zone, favorites-only filtering, favorite toggling, and the daily strategy selection.
View components receive a prepared page model and do not call API/data access modules.
Loading, empty, and error states are explicit through StatePanel.
The detail modal displays implementationTip only when the backend payload provides it.

Data Ownership Rules

Do not add classroom strategy records to frontend constants.
Do not add frontend fallback strategy payloads.
Keep frontend constants limited to filter options, style classes, query-independent timing values, and UI labels.
Test-only fixtures may live in selector tests or frontend/src/test-seeds/.

2.4 KiB Raw Blame History