Show how many people saved an event #27

Open
opened 2026-10-03 19:44:35 +00:00 by jalenluorion · 0 comments
Member

Goal
"Saved by 24 people" helps students spot popular events. Return a save count from the API and show it on Explore results and in the event popover.

What you'll learn
A SQL count in a Flask route, returning it in JSON, and displaying it in React.

Resources

Where to start

  • api/app/api/events.py, get_all_events (GET /api/events/): add a saved_count field to each event. Use a correlated scalar subquery: select(func.count()).where(UserSavedEvent.event_id == Event.id).scalar_subquery().
  • Same file, get_specific_events (GET /api/events/<id>): add saved_count there too.
  • api/app/models/models.py: UserSavedEvent has one row per (user, event).
  • web/src/app/types/EventType.ts: add saved_count?: number.
  • web/src/app/components/SearchResultSidebar.tsx and EventPopover.tsx: display it.

Done when

  • Both routes return saved_count as an integer, including 0
  • Explore results show "Saved by N people" (singular for 1, hidden for 0)
  • The popover shows it when it is present
  • A pytest in api/tests/api/ saves an event for two users and checks the count (the conftest gives you a SQLite database and signed tokens)
  • Works in light and dark mode

Notes
Extend the existing responses; do not add a new route. Avoid a join plus GROUP BY: the tag filter in get_all_events already groups by Event.id, and the subquery avoids that conflict. Return only the count, never who saved. Unblocks "Most saved" sorting in the Explore sort issue.

**Goal** "Saved by 24 people" helps students spot popular events. Return a save count from the API and show it on Explore results and in the event popover. **What you'll learn** A SQL count in a Flask route, returning it in JSON, and displaying it in React. **Resources** - [SQLAlchemy SELECT tutorial (see func.count and subqueries)](https://docs.sqlalchemy.org/en/20/tutorial/data_select.html) - [Testing Flask apps](https://flask.palletsprojects.com/en/stable/testing/) **Where to start** - `api/app/api/events.py`, `get_all_events` (`GET /api/events/`): add a `saved_count` field to each event. Use a correlated scalar subquery: `select(func.count()).where(UserSavedEvent.event_id == Event.id).scalar_subquery()`. - Same file, `get_specific_events` (`GET /api/events/<id>`): add `saved_count` there too. - `api/app/models/models.py`: `UserSavedEvent` has one row per (user, event). - `web/src/app/types/EventType.ts`: add `saved_count?: number`. - `web/src/app/components/SearchResultSidebar.tsx` and `EventPopover.tsx`: display it. **Done when** - [ ] Both routes return `saved_count` as an integer, including 0 - [ ] Explore results show "Saved by N people" (singular for 1, hidden for 0) - [ ] The popover shows it when it is present - [ ] A pytest in `api/tests/api/` saves an event for two users and checks the count (the conftest gives you a SQLite database and signed tokens) - [ ] Works in light and dark mode **Notes** Extend the existing responses; do not add a new route. Avoid a join plus `GROUP BY`: the tag filter in `get_all_events` already groups by `Event.id`, and the subquery avoids that conflict. Return only the count, never who saved. Unblocks "Most saved" sorting in the Explore sort issue.
jalenluorion added this to the Phase 1 milestone 2026-10-03 19:44:35 +00:00
jalenluorion added this to the CMUCal project 2026-10-03 19:45:09 +00:00
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
ScottyLabs/cal#27
No description provided.