README.md
5C Dining — 5C Dining Hall App (Expo SDK 57)
Dining hall menus for the Claremont Colleges, powered by
https://five-c-menu-api.kainoanewton.workers.dev/v1/menus.
Run it
sh
| 1 | npm install |
| 2 | npm run web # browser preview → http://localhost:8081 |
| 3 | npm start # phone via Expo Go (scan QR), press `w` for web |
One-time npm cache fix (macOS root-owned cache):
sh
| 1 | sudo chown -R $(id -u):$(id -g) "/Users/knewton/.npm" |
App structure
text
| 1 | app/(tabs)/ |
| 2 | mcconnell.tsx # MC — McConnell · Pitzer |
| 3 | frary.tsx # FY — Frary · Pomona |
| 4 | hoch.tsx # HC — Hoch-Shanahan · Harvey Mudd |
| 5 | malott.tsx # MA — Malott · Scripps |
| 6 | collins.tsx # CO — Collins · Claremont McKenna |
| 7 | frank.tsx # FK — Frank · Pomona |
| 8 | oldenborg.tsx # OL — Oldenborg · Pomona |
| 9 | settings.tsx # ⚙ default hall, dietary filters, display |
| 10 | index.tsx # redirects to default hall |
| 11 | lib/ |
| 12 | diningHalls.ts # static hall config (pages fixed, menu dynamic) |
| 13 | api.ts # GET /v1/menus/{hall}?date=YYYY-MM-DD + time formatting |
| 14 | dates.ts # Claremont-time week strip (Today + 7 days) |
| 15 | settings.tsx # prefs context, persisted with AsyncStorage |
| 16 | components/ |
| 17 | HallScreen.tsx # header + date strip + meal/station accordions |
| 18 | DiningTabBar.tsx # rectangular bottom bar (7 halls + cog) |
UX decisions
- Hall pages are static routes; only date + menu come from the API.
- Date strip: Today / Tomorrow / weekday cards, two lines (label + M/D), horizontal scroll, today pinned left, 8 days total.
- First meal auto-expands; stations start collapsed with item + VG counts; Expand all / Collapse all per meal.
- Item rows show VG (vegan) / V (vegetarian) chips + calories; descriptions toggleable. Vegan-only / vegetarian-only filters live in Settings.
- Meals with
startTime/endTimeshow e.g. "Dinner · 5:00 PM – 7:30 PM"; Hoch (no times in API) falls back to station/item counts. - Unavailable days (Oldenborg often) get a friendly empty state + retry.
- School badge: colored circle with initials (HM/SC/PZ/CM/PO), right-aligned.
Checks
sh
| 1 | npm run typecheck |
| 2 | npm run lint |
| 3 | npm run export:web # static build → dist/ |