# geeick/roadmap-app architecture

> Architecture diagram of the GitHub repository geeick/roadmap-app, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-13). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/geeick/roadmap-app
- Repository: https://github.com/geeick/roadmap-app
- Video tour (about a minute): https://gitdiagram.com/geeick/roadmap-app/video

## Overview

This is a patient-facing care-roadmap app for people and families navigating selected neurological diagnoses. After sign-in or account creation, the app selects a diagnosis-specific roadmap; users open a step to browse matching care, support, education, and research listings. Authentication and listing retrieval use Supabase. The graph reflects the sampled frontend and explicit module references; the schema file is present in the tree, but its contents were not sampled, so schema details are not inferred.

Main entry points: [`src/App.tsx`](https://github.com/geeick/roadmap-app/blob/main/src/App.tsx) (App and route state), [`src/auth.ts`](https://github.com/geeick/roadmap-app/blob/main/src/auth.ts) (Authentication service), [`src/AuthForm.tsx`](https://github.com/geeick/roadmap-app/blob/main/src/AuthForm.tsx) (Sign-in form), [`src/db.ts`](https://github.com/geeick/roadmap-app/blob/main/src/db.ts) (Listing queries)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Patient experience"]
  node_app_entry["App entry<br/>[main.tsx]"]
  node_app_router["App and route state<br/>[App.tsx]"]
  node_auth_form["Sign-in form<br/>[AuthForm.tsx]"]
  node_roadmap_view["Roadmap view<br/>[Roadmap.tsx]"]
  node_step_view["Step and listing cards<br/>[StepPage.tsx]"]
end

subgraph group_care_content["Care roadmap content"]
  node_diagnosis_content["Diagnosis roadmaps<br/>[data.ts]"]
  node_listing_seed["Curated listing data<br/>[seed.ts]"]
end

subgraph group_services["Application services"]
  node_auth_service["Authentication service<br/>[auth.ts]"]
  node_listing_service["Listing queries<br/>[db.ts]"]
  node_supabase_client["Supabase client<br/>[supabase.ts]"]
end

subgraph group_state["Hosted data"]
  node_supabase_store[("Supabase hosted data")]
end

node_patient(("Patient or family"))

node_patient -->|"opens app"| node_app_entry
node_app_entry -->|"renders"| node_app_router
node_app_router -->|"loads session"| node_auth_service
node_app_router -->|"renders when unauthenticated"| node_auth_form
node_auth_form -->|"signs in or up"| node_auth_service
node_auth_form -->|"offers diagnoses"| node_diagnosis_content
node_app_router -->|"selects diagnosis"| node_diagnosis_content
node_app_router -->|"renders roadmap"| node_roadmap_view
node_app_router -->|"renders selected step"| node_step_view
node_step_view -->|"fetches listings"| node_listing_service
node_auth_service -->|"uses client"| node_supabase_client
node_listing_service -->|"uses client"| node_supabase_client
node_supabase_client -->|"connects to"| node_supabase_store
node_auth_service -->|"reads profiles"| node_supabase_store
node_listing_service -->|"reads and inserts listings"| node_supabase_store

click node_app_entry "https://github.com/geeick/roadmap-app/blob/main/src/main.tsx"
click node_app_router "https://github.com/geeick/roadmap-app/blob/main/src/App.tsx"
click node_auth_form "https://github.com/geeick/roadmap-app/blob/main/src/AuthForm.tsx"
click node_roadmap_view "https://github.com/geeick/roadmap-app/blob/main/src/Roadmap.tsx"
click node_step_view "https://github.com/geeick/roadmap-app/blob/main/src/StepPage.tsx"
click node_diagnosis_content "https://github.com/geeick/roadmap-app/blob/main/src/data.ts"
click node_listing_seed "https://github.com/geeick/roadmap-app/blob/main/src/seed.ts"
click node_auth_service "https://github.com/geeick/roadmap-app/blob/main/src/auth.ts"
click node_listing_service "https://github.com/geeick/roadmap-app/blob/main/src/db.ts"
click node_supabase_client "https://github.com/geeick/roadmap-app/blob/main/src/supabase.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app_entry,node_app_router,node_auth_form,node_roadmap_view,node_step_view toneBlue
class node_diagnosis_content,node_listing_seed toneAmber
class node_auth_service,node_listing_service,node_supabase_client toneMint
class node_supabase_store toneRose
class node_patient toneIndigo
```

## Components

### Patient experience

- [App entry](https://github.com/geeick/roadmap-app/blob/main/src/main.tsx): `src/main.tsx`
- [App and route state](https://github.com/geeick/roadmap-app/blob/main/src/App.tsx): `src/App.tsx`
- [Sign-in form](https://github.com/geeick/roadmap-app/blob/main/src/AuthForm.tsx): `src/AuthForm.tsx`
- [Roadmap view](https://github.com/geeick/roadmap-app/blob/main/src/Roadmap.tsx): `src/Roadmap.tsx`
- [Step and listing cards](https://github.com/geeick/roadmap-app/blob/main/src/StepPage.tsx): `src/StepPage.tsx`

### Care roadmap content

- [Diagnosis roadmaps](https://github.com/geeick/roadmap-app/blob/main/src/data.ts): `src/data.ts`
- [Curated listing data](https://github.com/geeick/roadmap-app/blob/main/src/seed.ts): `src/seed.ts`

### Application services

- [Authentication service](https://github.com/geeick/roadmap-app/blob/main/src/auth.ts): `src/auth.ts`
- [Listing queries](https://github.com/geeick/roadmap-app/blob/main/src/db.ts): `src/db.ts`
- [Supabase client](https://github.com/geeick/roadmap-app/blob/main/src/supabase.ts): `src/supabase.ts`

### Hosted data

- **Supabase hosted data**

### Other components

- **Patient or family**

## Connections

- Patient or family → App entry: opens app
- App entry → App and route state: renders (evidence: `src/main.tsx`)
- App and route state → Authentication service: loads session (evidence: `src/App.tsx`)
- App and route state → Sign-in form: renders when unauthenticated (evidence: `src/App.tsx`)
- Sign-in form → Authentication service: signs in or up (evidence: `src/AuthForm.tsx`)
- Sign-in form → Diagnosis roadmaps: offers diagnoses (evidence: `src/AuthForm.tsx`)
- App and route state → Diagnosis roadmaps: selects diagnosis (evidence: `src/App.tsx`)
- App and route state → Roadmap view: renders roadmap (evidence: `src/App.tsx`)
- App and route state → Step and listing cards: renders selected step (evidence: `src/App.tsx`)
- Step and listing cards → Listing queries: fetches listings (evidence: `src/StepPage.tsx`)
- Authentication service → Supabase client: uses client (evidence: `src/auth.ts`)
- Listing queries → Supabase client: uses client (evidence: `src/db.ts`)
- Supabase client → Supabase hosted data: connects to (evidence: `src/supabase.ts`)
- Authentication service → Supabase hosted data: reads profiles (evidence: `src/auth.ts`)
- Listing queries → Supabase hosted data: reads and inserts listings (evidence: `src/db.ts`)