rapid-meditrack

As a frontend developer, I want to implement the Login page based on the existing v2 JSX design so that both patients and doctors can sign in. The page should handle persona-aware routing post-login (Patient → Home timeline, Doctor → Home timeline) and display validation errors. Follows user flow: Login → Home.

As a frontend developer, I want to implement the Landing page based on the existing v2 JSX design so that visitors can view product information, navigate to Login, and navigate to Signup. The page should feature the interactive health timeline concept from SRD Section 6, pulsing node animations, smooth scroll transitions, and micro-interaction notifications. Follows user flow: Landing → Login, Landing → Register.

As a frontend developer, I want to implement the Signup page based on the existing v2 JSX design so that new users (patients and doctors) can create an account. The page should include persona toggle (Patient / Doctor), full name, email, mobile (+91 prefix), password with show/hide, conditional DOB or Medical Registration Number field, and language preference. Follows user flow: Landing → Register → Signup → Home.

As a backend developer, I want to implement registration and login REST API endpoints so that both patients and doctors can create accounts and authenticate. Includes POST /api/auth/register (with persona field), POST /api/auth/login, JWT issuance, and refresh token handling. Supports the Login and Signup pages.

As a frontend developer, I want to implement the Home page based on the existing v2 JSX design so that logged-in patients and doctors can view their interactive health timeline. Patients see past appointments, prescriptions, and upcoming consultations as clickable nodes. Doctors see their schedule and patient interactions. Follows user flow: Home → Search (patient), Home → Messages (doctor), Home → Health Records.

As a frontend developer, I want to implement the Schedule page based on the existing v2 JSX design so that doctors can manage their availability and view their appointments. Includes a weekly/monthly calendar view, availability slot editor, appointment list with patient details, and block/unblock time controls. Follows user flow: Doctor Home → Schedule → View Appointments.

As a frontend developer, I want to implement the Search page based on the existing v2 JSX design so that patients can find doctors by specialization and location. The page includes a search hero bar, active filters bar, collapsible filter sidebar (specialization, availability, consultation type, experience, rating, gender, language), a results summary bar, a doctor results grid with skeleton loaders and empty state, and a pagination bar. Follows user flow: Home → Search → Doctor Profile.

As a frontend developer, I want to implement the Messages page based on the existing v2 JSX design so that doctors and patients can communicate securely. Includes a conversation list sidebar, message thread view, text input with send action, and unread badges. Follows user flow: Doctor Home → Messages.

As a frontend developer, I want to implement the Health Records page based on the existing v2 JSX design so that patients can view their historical health data and doctors can update records post-consultation. Includes timeline view of records, filters, upload functionality, and record detail modals. Follows user flow: Home → Health Records → Prescriptions (patient); Patient Profile → Health Records (doctor).

As a backend developer, I want to implement a doctor search REST API so that patients can filter doctors by specialization, location, availability, consultation type, experience, rating, gender, and language. Includes GET /api/doctors with query params, pagination, and sorting. Supports the Search page.

As a backend developer, I want to implement a secure messaging REST API (and WebSocket channel) so that doctors and patients can exchange messages in real time. Includes GET /api/messages/:conversationId, POST /api/messages, and a WebSocket event channel with JWT authentication. Supports the Messages page.

As a frontend developer, I want to implement the Doctor Profile page based on the existing v2 JSX design so that patients can view a doctor's full profile and book an appointment. Includes doctor details, specialization, experience, ratings, consultation types, availability calendar, and a Book Appointment CTA. Follows user flow: Search → Doctor Profile → Appointments.

As a frontend developer, I want to implement the Patient Profile page based on the existing v2 JSX design so that doctors can view a patient's full history, prescriptions, and past consultations. Includes patient demographics, health summary, appointment history, and a link to update health records. Follows user flow: Schedule → View Appointments → Patient Profile → Health Records.

As a frontend developer, I want to implement the Prescriptions page based on the existing v2 JSX design so that patients can view prescription details and medical advice from their doctors. Includes prescription cards, medication list, doctor notes, and download/share options. Follows user flow: Health Records → Prescriptions.

As a frontend developer, I want to implement the Appointments page based on the existing v2 JSX design so that patients can confirm bookings and both patients and doctors can view upcoming and past appointments. Includes appointment cards, status badges, confirmation flow, and cancellation/rescheduling options. Follows user flow: Doctor Profile → Appointments.

As a backend developer, I want to implement a doctor schedule and availability REST API so that doctors can set their available time slots and patients can query open slots when booking. Includes GET /api/schedule/:doctorId, POST /api/schedule/slots, DELETE /api/schedule/slots/:id. Supports the Schedule and Doctor Profile pages.

As a backend developer, I want to implement health records REST API endpoints so that patients can view records and doctors can create and update records post-consultation. Includes GET /api/records/:patientId, POST /api/records, PUT /api/records/:id. Supports the Health Records and Patient Profile pages.

As a backend developer, I want to implement appointments REST API endpoints so that patients can book, confirm, cancel, and reschedule appointments and doctors can view their appointment list. Includes POST /api/appointments, GET /api/appointments, PATCH /api/appointments/:id. Supports the Appointments and Schedule pages.

As a backend developer, I want to implement prescriptions REST API endpoints so that patients can retrieve their prescription history and doctors can create new prescriptions. Includes GET /api/prescriptions/:patientId, POST /api/prescriptions. Supports the Prescriptions page.

As a backend developer, I want to implement a notifications REST API and push notification service so that patients and doctors receive alerts for upcoming appointments and messages. Includes GET /api/notifications, POST /api/notifications/mark-read, and integration with a push service (e.g., web-push). Supports the Home timeline and Appointments pages.

As a frontend developer, I want to integrate all page components with the live backend REST APIs (auth, doctors, appointments, health records, prescriptions, messages, notifications, schedule) replacing mock/static data with real API calls, handle loading and error states, and ensure JWT tokens are attached to requests via an Axios interceptor.

As a frontend developer, I want to configure the PWA manifest (name, icons, theme color #007BFF, display standalone) and a service worker with a cache-first strategy for static assets so that the app is installable and loads within 2 seconds on standard devices.

As a frontend developer, I want to add i18n support (English, Hindi, Marathi) using react-i18next so that users can switch languages from the settings/profile page, meeting the WCAG 2.1 AA accessibility and localization requirements.