happy-pain

As a user, I want to use the frontend Landing page so I can view the happy-pain home page, understand the platform's purpose, and navigate to Sign Up or Log In. Implement all sections from the existing Landing (v2) JSX design: NavBar, Hero with interactive NPRS pain scale visualization, NurseAvailabilityBanner, FeatureHighlights, InteractivePainScale, HowItWorks, UserPersonas, Testimonials, TrustAndSecurity, CallToAction, and Footer. The hero section must include the signature micro-interaction animated pain slider (0–10 with emoji faces and color transitions). Links to Auth: Sign Up and Auth: Log In pages.

As a user, I want to use the frontend Auth pages so I can sign up as a new patient or log in as an existing patient or nurse. Implement Login and Sign Up pages based on the existing Auth (v2) JSX design. Login page: email/password form, role selector (Patient/Nurse), 'Forgot password' link, link to Sign Up. Sign Up page: name, email, password, role selection (Patient/Nurse), GDPR consent checkbox, submit CTA. On success: patients are redirected to Dashboard: View History; nurses are redirected to Dashboard: View Patient Alerts.

As a nurse, I want to use the frontend Dashboard page so I can view incoming patient alerts, see real-time pain level notifications, and navigate to individual patient reports. Implement based on existing Dashboard (v2) JSX design adapted for the nurse persona. Includes: patient alert list with NPRS severity indicators, nurse availability toggle, unread report badges, quick-navigate to Patient Report page. Links to: Patient Report: Review Pain Level.

As a patient, I want to use the backend API for logging pain so I can submit my NPRS pain level, pain context (location, type, notes), and timestamps to the server for persistent storage. Implement FastAPI endpoints: POST /pain-logs (create new log), GET /pain-logs (patient history), GET /pain-logs/{id} (single log detail). Store in MySQL via Alembic migration. Trigger nurse notification on successful log creation.

As a patient, I want to use the frontend Dashboard page so I can view my pain and medication history, see past pain logs with timestamps, and navigate to the Pain Logger to submit a new report. Implement based on existing Dashboard (v2) JSX design. Includes: pain history chart/list, recent medication logs, quick-action 'Log Pain Now' CTA, notifications panel for nurse responses. Links to: Pain Logger page, Notifications page.

As a patient, I want to use the backend API for nurse availability so I can see on the Landing page and Pain Logger whether a nurse is currently online and available to respond. Implement FastAPI endpoints: GET /nurses/availability (returns count of online nurses and status). Nurses update their status via PUT /nurses/me/status. Powers the real-time nurse availability indicator on the Landing page and Sidebar.

As a nurse, I want to use the frontend Patient Report page so I can review a patient's submitted pain level, pain context, and full medication history in one view before sending a treatment recommendation. Implement based on existing Patient Report (v2) JSX design. Includes: NPRS score display with color severity indicator, pain description and notes, medication table (name, dosage, last taken), timestamps. Links to: Treatment: Send Recommendation page.

As a patient, I want to use the frontend Notifications page so I can view nurse treatment recommendations and responses to my pain reports. Implement based on existing Notifications (v2) JSX design. Includes: list of notifications with nurse name, timestamp, recommendation text, read/unread status indicators, and links back to the relevant pain report. Navigation back to Dashboard.

As a patient, I want to use the backend API for medications so I can save, retrieve, and update my regular medications, dosages, and last-taken timestamps. Implement FastAPI endpoints: POST /medications (save new medication), GET /medications (list saved medications for patient), PUT /medications/{id} (update), DELETE /medications/{id} (remove). Persist in MySQL. Medication records are linked to pain logs on submission.

As a patient, I want to use the frontend Pain Logger page so I can select my NPRS pain level (0–10) using the interactive slider, describe pain context, and proceed to the medication entry step. Implement based on existing Pain Logger (v2) JSX design. Includes: TopBar with breadcrumb, Sidebar navigation, NPRS slider with emoji faces and dynamic color transitions (green→amber→red), pain context form (location, type, notes), and step-by-step flow. On completion of step 1, navigates to Medication page.

As a nurse, I want to use the backend API for notifications so I can receive real-time alerts when a patient submits a pain report, including their NPRS level, medication history, and last dosage. Implement FastAPI endpoints: GET /notifications (nurse's unread alerts), PUT /notifications/{id}/read (mark as read). Use WebSocket or polling for real-time delivery. Notifications include patient name, NPRS score, medication snapshot, and timestamp.

As a nurse, I want to use the backend API for treatment recommendations so I can submit a recommendation for a patient's pain report and have it delivered as a notification to the patient. Implement FastAPI endpoints: POST /recommendations (create recommendation linked to pain log), GET /recommendations (patient's received recommendations). Trigger patient notification on creation. Integrate with AI suggestion endpoint.

As a user, I want the backend to comply with GDPR regulations so that my sensitive health data is stored securely and I can request data deletion or export. Implement: data encryption at rest for pain logs and medication records, consent flag on signup, data retention policy (5-year limit with automated cleanup via scheduled job), and a DELETE /users/me/data endpoint for right-to-erasure requests. Add privacy notice to signup and confirmation pages.

As a patient, I want to use the frontend Medication page so I can enter and save my current medications, dosages, and last-taken timestamps before submitting my pain report. Implement based on existing Medication (v2) JSX design. Includes: pre-populated saved medications from profile (chip toggles), repeatable medication entry blocks (name, dosage, unit, datetime), 'No medications taken' toggle, 'Add Another Medication' button (max 5). On completion, navigates to Confirmation page.

As a nurse, I want to use the frontend Treatment page so I can compose and send a treatment recommendation back to the patient after reviewing their pain report. Implement based on existing Treatment (v2) JSX design. Includes: patient summary panel (NPRS level, medications), rich text or guided recommendation composer, AI-assisted suggestion panel (GPT-powered treatment options via LangChain), 'Send Recommendation' CTA, confirmation on send. After sending, navigates back to Dashboard: Monitor Patients.

As a patient, I want to use the backend API for notifications so I can receive real-time alerts when a nurse has sent a treatment recommendation in response to my pain report. Implement FastAPI endpoint GET /patient/notifications (list unread recommendations/messages), PUT /patient/notifications/{id}/read. Integrate with the Notifications page. Support in-app messaging delivery as per SRD assumptions.

As a nurse, I want to use the AI API for treatment suggestions so I can receive GPT-powered contextual treatment recommendations based on a patient's NPRS score, pain type, and medication history. Implement a FastAPI endpoint POST /ai/suggest-treatment that calls GPT-5.2 via LiteLLM and LangChain, passing structured patient context. Return ranked treatment suggestions with explanations. Integrate into the Treatment Recommendation page's composer panel.

As a patient, I want to use the frontend Confirmation page so I can review my pain report summary and submit it to notify my nurse. Implement based on existing Confirmation (v2) JSX design. Includes: summary of selected NPRS level, pain type, medication count, 'Submit Pain Report' CTA with pulse animation and success state (green checkmark + 'Report Sent!'), privacy/GDPR note. On successful submission, navigates to Notifications page.

As a developer, I want to connect all frontend pages to their corresponding backend APIs so that the full patient and nurse user flows are functional end-to-end. Wire up: Landing page nurse availability indicator → /nurses/availability; Pain Logger → POST /pain-logs; Medication page → GET/POST /medications; Confirmation page → submission trigger; Notifications page → GET /patient/notifications; Nurse Dashboard → GET /notifications; Patient Report → GET /pain-logs/{id}; Treatment page → POST /recommendations + POST /ai/suggest-treatment. Use React Query or Axios for data fetching.