Cohort is not displayed even when filtering by classroom or teacher

[nemvince]

[coderabbitai]

Coding Plan

Summary

• Extend the existing enrichLessons() batch-fetch pattern to include cohort data via lessonCohortMTM join, ensuring all lesson endpoints benefit from the change
• Thread the activeFilter state through the component hierarchy so LessonCard can conditionally display cohort names
• Show cohorts only when filtering by teacher or classroom (where it provides context) and hide them when filtering by class (where it's redundant)

Implementation Steps

Phase 1: Extend Backend Lesson API with Cohort Data

Add cohort resolution to the shared enrichLessons() function so all lesson endpoints (for cohort, teacher, and classroom) return cohort information in their responses.

Task 1: Add Cohort Resolution to enrichLessons Function

Extend enrichLessons() to fetch cohort associations for each lesson and include them in the output, following the existing pattern used for teachers and classrooms.

• In apps/chronos/src/routes/timetable/lesson.ts, within enrichLessons():
  • Query lessonCohortMTM joined with cohort table for all lesson IDs in the input batch
  • Build a Map<lessonId, cohort[]> to look up cohorts per lesson
  • Add a cohorts array to each enriched lesson object with shape { id, name, short } matching the existing pattern for teachers/classrooms
• The cohort fetch should be added to the existing Promise.all batch to maintain performance

Task 2: Update Zod Schema for OpenAPI Documentation

Update enrichedLessonSchema to include the new cohorts field so OpenAPI documentation reflects the updated response shape.

• In apps/chronos/src/routes/timetable/lesson.ts, add a cohorts field to enrichedLessonSchema:
  • Use the same object shape as teachers/classrooms: z.array(z.object({ id: z.string(), name: z.string(), short: z.string() }))
• No changes needed to responseSchema or other composed schemas since they reference enrichedLessonSchema directly

🤖 Prompt for AI agents

Extend the `enrichLessons()` function in
`apps/chronos/src/routes/timetable/lesson.ts` to resolve and return cohort data
for each lesson.

- Inside `enrichLessons()`, add a new query to the existing `Promise.all` batch
that fetches from `lessonCohortMTM` joined with the `cohort` table, filtered to
all lesson IDs in the input batch
- Build a `Map<lessonId, cohort[]>` from the query results to look up cohorts
per lesson
- Add a `cohorts` array (shape: `{ id, name, short }`) to each enriched lesson
object, following the same pattern used for teachers and classrooms
- In `enrichedLessonSchema`, add a `cohorts` field using `z.array(z.object({ id:
z.string(), name: z.string(), short: z.string() }))`, matching the existing
shape used for teachers/classrooms — no changes needed to `responseSchema` or
other composed schemas

Phase 2: Display Cohort Information in Frontend Timetable

Update the frontend timetable components to display cohort names on lesson cards when the user is filtering by teacher or classroom.

Task 1: Thread activeFilter Through Component Hierarchy

Pass the current filter type from the parent orchestrator down to the lesson card component so it can conditionally render cohort information.

• In apps/iris/src/components/timetable/index.tsx:
  • Pass activeFilter as a new prop to TimetableGrid
• In apps/iris/src/components/timetable/grid.tsx:
  • Accept activeFilter prop and forward it to each LessonCard instance
• In apps/iris/src/components/timetable/types.ts:
  • Update component prop types if explicitly defined (note: LessonItem is auto-inferred from API and will include cohorts automatically after backend change)

Task 2: Render Cohort Names in LessonCard

Modify the lesson card to display cohort names when the active filter is 'teacher' or 'classroom', following the existing display pattern for teachers and rooms.

• In apps/iris/src/components/timetable/lesson-card.tsx:
  • Accept activeFilter as a new prop
  • Create a formatCohorts() helper following the pattern of formatTeachers() and formatRooms()
  • When activeFilter is 'teacher' or 'classroom', display cohort names in both the card face and tooltip
  • When activeFilter is 'class', omit cohort display since it's implicit from the selected filter
• Display cohort on the card face inline with existing info (e.g., after room) and add a cohort row to the tooltip content

🤖 Prompt for AI agents

Update the frontend timetable component hierarchy in the Iris app to thread
`activeFilter` down to `LessonCard` and conditionally display cohort names.

- In `apps/iris/src/components/timetable/index.tsx`, pass `activeFilter` as a
new prop to `TimetableGrid`
- In `apps/iris/src/components/timetable/grid.tsx`, accept the `activeFilter`
prop and forward it to each `LessonCard` instance
- In `apps/iris/src/components/timetable/types.ts`, update any explicitly
defined component prop types to include `activeFilter` (note: `LessonItem` is
auto-inferred from the API and will include `cohorts` automatically after the
backend change)
- In `apps/iris/src/components/timetable/lesson-card.tsx`:
  - Accept `activeFilter` as a new prop
- Add a `formatCohorts()` helper following the same pattern as
`formatTeachers()` and `formatRooms()`
- When `activeFilter` is `'teacher'` or `'classroom'`, display cohort names on
both the card face (inline with existing info, e.g. after room) and in the
tooltip
- When `activeFilter` is `'class'`, omit cohort display entirely since it is
implicit from the selected filter

Research

This is a monorepo with two apps: Chronos (Hono/Drizzle backend API) and Iris (React/TanStack frontend). Lessons are linked to cohorts via the lesson_cohort_mtm join table. The enrichLessons() function in apps/chronos/src/routes/timetable/lesson.ts batch-fetches related entities (teachers, classrooms, subjects) but currently ignores cohort associations. The frontend's LessonCard component displays subject, teacher, and room but has no cohort field, and the activeFilter state is not passed down to the card component. Types in Iris are auto-inferred from Chronos's Hono client.

---

🚀 Next Steps

🤖 All AI agent prompts combined

Task: 1

Extend the `enrichLessons()` function in
`apps/chronos/src/routes/timetable/lesson.ts` to resolve and return cohort data
for each lesson.

- Inside `enrichLessons()`, add a new query to the existing `Promise.all` batch
that fetches from `lessonCohortMTM` joined with the `cohort` table, filtered to
all lesson IDs in the input batch
- Build a `Map<lessonId, cohort[]>` from the query results to look up cohorts
per lesson
- Add a `cohorts` array (shape: `{ id, name, short }`) to each enriched lesson
object, following the same pattern used for teachers and classrooms
- In `enrichedLessonSchema`, add a `cohorts` field using `z.array(z.object({ id:
z.string(), name: z.string(), short: z.string() }))`, matching the existing
shape used for teachers/classrooms — no changes needed to `responseSchema` or
other composed schemas
===============================================================================

Task: 2

Update the frontend timetable component hierarchy in the Iris app to thread
`activeFilter` down to `LessonCard` and conditionally display cohort names.

- In `apps/iris/src/components/timetable/index.tsx`, pass `activeFilter` as a
new prop to `TimetableGrid`
- In `apps/iris/src/components/timetable/grid.tsx`, accept the `activeFilter`
prop and forward it to each `LessonCard` instance
- In `apps/iris/src/components/timetable/types.ts`, update any explicitly
defined component prop types to include `activeFilter` (note: `LessonItem` is
auto-inferred from the API and will include `cohorts` automatically after the
backend change)
- In `apps/iris/src/components/timetable/lesson-card.tsx`:
  - Accept `activeFilter` as a new prop
- Add a `formatCohorts()` helper following the same pattern as
`formatTeachers()` and `formatRooms()`
- When `activeFilter` is `'teacher'` or `'classroom'`, display cohort names on
both the card face (inline with existing info, e.g. after room) and in the
tooltip
- When `activeFilter` is `'class'`, omit cohort display entirely since it is
implicit from the selected filter

💡 Iterate on the plan with: `@coderabbitai` <feedback>

Example Feedback
- `@coderabbitai` You can skip phase 3. Add a simple unit test case for phase 2.
- `@coderabbitai` For design choice 1 go ahead with option 3 and replan.

---

💬 Have feedback or questions? Drop into our discord!