Routing

The Member Portal uses React Router v7 for client-side navigation.

File: memberportal/src/Router.tsx

Route table

Path	Component	Description
/	DashboardPage	Home screen with health summary
/chat	ChatAssistantPage	AI health assistant
/lab-results	LabResultsPage	List of all lab results
/lab-results/:resultId	LabResultDetailPage	Detail view for one lab result
/medications	MedicationsPage	List of all medications
/medications/:medicationId	MedicationDetailPage	Detail view for one medication
/conditions	ConditionsPage	List of all conditions
/visits	VisitsPage	List of all encounters/visits
/visits/:encounterId	VisitDetailPage	Detail view for one visit
/appointments	redirect	Redirects to /visits
/reports	ReportsNotesPage	Medical records and documents
/allergies	AllergiesPage	List of all allergies
/procedures	ProceduresPage	List of all procedures
/immunizations	ImmunizationsPage	List of all immunizations
/health-reports	HealthReportsPage	Visual health summary reports
/profile	ProfilePage	Patient profile information
/settings	SettingsPage	EHR connections, security, preferences
/support	SupportPage	Contact support / submit ticket
/signout	SignOutPage	Signs the patient out
/coming-soon	ComingSoonPage	Placeholder for upcoming features

Public routes (no login required)

These routes are defined in App.tsx and are shown when the patient is not logged in:

Path	Component
/	SignInPage
/register	SignUpPage
/setpassword/:id/:secret	SetPasswordPage
/verifyemail/:id/:secret	VerifyEmailPage

Any other path while logged out redirects to / (sign in).

Pages in progress (not yet routed)

These page files exist in memberportal/src/pages/ but are not wired to any route in Router.tsx.

File	Intended purpose	Status
ObservationPage.tsx	Detail view for a single FHIR Observation resource	Built — not routed

To activate, add a <Route> entry in Router.tsx and a sidebar link in Sidebar.tsx if needed.

How navigation works

• The <Sidebar /> component renders <NavLink> elements for each route.
• Active link highlighting: the sidebar marks a link as active if location.pathname starts with the link's path (except / which requires an exact match).
• Pages navigate programmatically using useNavigate() from React Router.

Adding a new page

1. Create memberportal/src/pages/YourPage.tsx
2. Add the route in memberportal/src/Router.tsx
3. Add a nav link in memberportal/src/components/Sidebar.tsx if it should appear in the sidebar