71 lines
3.0 KiB
Markdown
71 lines
3.0 KiB
Markdown
# 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/content-catalog/read/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.
|
|
- 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.
|
|
- 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.
|
|
- Test-only fixtures may live in selector tests or `frontend/src/test-seeds/`.
|