week2: Wire StreakModal to live streak data; record completedDates on…

[sruju333]

Summary

Closes the two Week 2 gaps: Activities.completedDates was permanently empty for every student because nothing ever wrote to it, and StreakModal showed a hardcoded streak/date with a placeholder calendar image instead of real data. This PR writes completedDates when a student finishes all daily activities, and wires the modal to the existing /streak and /streak/calendar endpoints.

Type of Change

• New feature
• Bug fix

Key Changes

• middlewareNode/src/routes/activities.js: In the PUT /:username/activity handler, after marking an activity complete, check if all daily activities are now complete. If so, push today's date into completedDates (deduped, so it's not written twice in a day).
• StreakModal.tsx: Fetches GET /streak and GET /streak/calendar on mount. Replaces the hardcoded 9-day streak and static 6/9 date with live values, and replaces the placeholder calendar PNG with a real grid of completed days.
• StreakModal.scss: Added .calendar-grid/.calendar-day styles to replace the old placeholder image styling.
• NewStudentProfile.tsx: Passes username into <StreakModal /> (previously missing, needed for the new data fetches).

Testing

• Unit tests added/updated
• Integration tests added/updated
• Manual testing performed
• All tests pass

Bugs Fixed (if applicable)

• Activities.completedDates was initialized but never written to, so streak/badge stats relying on it were always zero for every student.

TODO (Follow-up Work)

• GET /streak/calendar only returns days with recorded events, not a full padded month — consider filling in empty days client-side if a full calendar grid (aligned to weekdays) is desired.

Additional Notes

None.

[karthikeya1976]

Verified against the real server routes and ran a real TypeScript compile — approving, with a few things worth flagging (none blocking):

Confirmed correct:

• GET /streak and GET /streak/calendar field/param names match exactly (currentStreak, days, ?username=, ?username=&month=YYYY-MM).
• The completedDates write in activities.js is idempotent (checks alreadyRecorded before pushing) and correctly scoped to UTC midnight — won't double-write if a student re-triggers the same activity twice in a day.
• npx tsc --noEmit: clean.
• The environments/environment → environments import fix in NewStudentProfile.tsx is a real, valuable fix (same bug class PR #208 fixed across ~30 files — importing the raw dev module bypasses prod config) — just wasn't called out in the PR description, worth mentioning explicitly next time so reviewers don't have to notice it by accident.

Worth knowing, not blocking this PR:

• routes/streak.js's streak calculation (pre-existing, not touched by this PR) counts calendar-adjacent and non-adjacent completed days the same way — two active days with a gap between them still increment currentStreak. This PR correctly wires the frontend to the real endpoint; the endpoint's own math bug is separate, already-known follow-up work.
• The existing e2e/streak-modal-flow.spec.ts expects .calendar-day.is-today/.is-completed classes and a "Previous month" nav button — this implementation uses plain .completed with no month navigation. That spec isn't wired into CI, so it won't block merge, but it will fail if anyone runs it manually as-is. Worth a quick follow-up to either add month nav or update the spec to match what's actually built.
• No StreakModal unit test exists despite the e2e spec's comment referencing one — pre-existing gap, not introduced here.
• Minor: the all-activities-complete check (read-then-push) isn't atomic against two different activities completing in true parallel — worst case is a harmless duplicate date in a low-stakes array, not worth blocking on.

Approving — the core wiring is correct and verified against live routes.

🤖 Generated with Claude Code