Skip to content

feat: Volunteer Camp Signup & QR Code Flow

Praneeth Ashish requested to merge feat/volunteer-signup into develop

Merge Request: Volunteer Camp Signup & QR Code Flow

Description

This MR introduces a complete end-to-end flow for volunteers to sign up for upcoming medical camps and generate a personal QR code for attendance tracking.

Previously, volunteers accessed their dashboard tools immediately upon login. With these changes, volunteers are now required to explicitly "Join" an active medical camp, which generates a QR code. This QR code must then be scanned by an admin/coordinator (using the newly added AttendanceMarker and QRScanner components) before the volunteer can access their operational tools (e.g., Patient Registration, Vitals).

Key Features & Changes

1. New Volunteer Journey Pages

  • [JoinVolunteerPage.tsx]: A landing page explaining volunteer roles and providing the main "Join Medical Camp" action.
  • [CampSignupPage.tsx]: The UI dedicated to fulfilling the camp registration API call.
  • [QRGenerationPage.tsx]: Generates a personal QR code (qrcode library) for the volunteer upon successful signup, complete with a download button and a manual refresh toggle.

2. State Management & Flow Control

  • [VolunteerCampFlow.tsx]: The central brain for the volunteer dashboard. It queries the backend API ([getVolunteerCampSignupStatus] and returns one of three states:
    • Not Signed Up: Displays the Welcome screen redirecting them to the Join page.
    • Signed Up, Not Scanned: Displays the QR generation component.
    • Signed Up & Scanned: Yields rendering back back to the [DashboardPage.tsx] to display their operational tools.
  • Removed Auto-Signup: [VolunteerRegisterPage.tsx] was modified to remove automatic camp enrollment upon account creation. This ensures all new and returning users experience the exact same flow: Account Creation -> Dashboard Welcome Screen -> Join Page -> QR Code.

3. Admin Tools

  • QRScanner.tsx / AttendanceMarker.tsx: Added device camera QR scanning capabilities and nested them into the Admin StaffAttendancePage.tsx. Admins can now scan volunteer devices (or manually override) to mark them as arrived.

4. Resiliency & Bug Fixes

  • Silent Failure Fixes: Fixed a bug where [volunteerSignupForCamp] would fail silently and forcibly redirect the user. It now correctly pipes addNotification error toasts to the UI.
  • Backend Sync Fallbacks: Added logic to handle a state where the backend throws a 400 "already signed up" error, but signup-status returns false. The frontend now intercepts the error, treats it as a success, and logs a temporary volunteer_already_signed_up flag in localStorage (cleaned up on logout via [AuthContext.tsx] to forcibly render the QR code.
  • Type Safety: Ensured new API functions in [src/lib/api.ts] abide by strict typescript standards to satisfy eslint pre-commit hooks.

Files Changed

  • 27 total files (Core UI pages, tests, contexts, config, and API types).

Related issues

Closes #195 (closed)

Testing

  • Automated test coverage added for VolunteerCampFlow, [QRGenerationPage], [CampSignupPage], and AttendanceMarker.
  • Verified logic manually across "Brand New User", "Returning Unregistered User", and "Returning Registered User" states.

Resolves Issues

  • Standardizes volunteer onboarding and physical attendance verification.

Merge request reports