admin/40227-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
40227-vm/frontend/docs/classroom-timer-integration.md
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

1.6 KiB
Raw Blame History

Classroom Timer Integration

Purpose

The classroom timer uses local Web Audio API sounds. Generated timer audio is not exposed because the backend does not define an audio-generation provider contract.

Current Behavior

  • ClassroomTimer renders visual timer controls, sensory backgrounds, preset/custom durations, fullscreen projection, and built-in timer sounds.
  • frontend/src/components/frameworks/ClassroomTimer.tsx is a thin composition wrapper.
  • Timer state, fullscreen coordination, custom time parsing, progress formatting, urgency color selection, particles, and Web Audio orchestration live in frontend/src/business/classroom-timer/.
  • Timer catalogs are backend-owned content catalog records loaded through the shared content catalog API. frontend/src/shared/constants/classroomTimer.ts keeps only timing and particle-count configuration.
  • Timer view pieces live under frontend/src/components/classroom-timer/.
  • Built-in sounds are generated in-browser through the Web Audio API.
  • Missing timer catalog data renders an explicit backend content error instead of falling back to frontend seed records.
  • AI-generated timer sounds are not exposed in the UI until a backend audio provider contract exists.
  • Remote audio must be added through a typed backend API module and business hook after the backend provider contract exists.

Verification

  • npm run typecheck passes.
  • npm run lint passes without Fast Refresh warnings.
  • npm run test passes.

Remaining Work

  • Add a typed backend/API/business slice for generated audio only after the backend provider contract is defined.