40227-vm/frontend/docs/classroom-support-integration.md
2026-06-17 21:45:57 +02:00

4.5 KiB

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/ClassroomSupportManagementPanel.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
  • frontend/src/components/common/ConfirmationDialog.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/content-catalog/read/classroom-strategies

Organization-level strategy managers update:

  • PUT /api/content-catalog/classroom-strategies
  • POST /api/file/upload/classroom-support/strategy-images

The content payload is seeded in:

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

Each strategy payload supports:

  • id
  • title
  • description
  • category
  • ageGroup
  • zone
  • image (uploaded file private URL for newly managed cards; seeded presets may use static asset paths)
  • implementationTip

Behavior

  • useClassroomSupportPage loads strategies through the shared content catalog hook.
  • The app-shell scope selector exposes this module at organization, school, campus, and class effective tiers when the user has READ_CLASSROOM. Organization-level users can maintain classroom strategy content for descendant schools and campuses through the same backend-owned content catalog.
  • The management panel is shown only when the effective tenant is an organization and the user has MANAGE_CONTENT_CATALOG. The backend enforces the same organization-scope rule for classroom-strategies management endpoints.
  • Add, edit, and delete operations update the organization-scoped classroom-strategies payload. Strategy images are uploaded through the shared file subsystem before the content payload is saved, so production storage uses the configured bucket path and the payload stores the returned private URL.
  • Delete uses the shared confirmation dialog so destructive classroom strategy actions stay consistent with project modal styling.
  • Seeded strategy cards are preset for each organization through content catalog seeding. New school and campus tenants do not receive independent classroom-strategy rows; they read the organization library.
  • Favorite strategy IDs load and persist through GET/POST/DELETE /api/user_progress with progress_type = classroom_strategy_favorite. Favorite controls are enabled only when the user is viewing their own scope; parent users drilled into a child tenant do not load or write child-scope favorites.
  • Selectors handle search, category, age, zone, favorites-only filtering, 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.
  • Keep favorites out of content_catalog; they are per-user rows in user_progress.
  • Keep uploaded card images in the shared file subsystem (classroom-support/strategy-images) and store only the private URL in the strategy payload.
  • Test-only fixtures may live in selector tests or frontend/src/test-seeds/.