# kassemabbassi/connectathon- architecture

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

- Interactive diagram: https://gitdiagram.com/kassemabbassi/connectathon-
- Repository: https://github.com/kassemabbassi/connectathon-

## Overview

SpotEarly is a role-based dental-screening platform. Staff register anonymous patient codes, capture or upload dental views, and request per-image AI detections; results are saved as patient files for institution-scoped dentist review, notes, and validation. Administrators manage institutions and accounts. The graph combines documented product flows with sampled imports and calls; unsampled backend route details are represented only where the README describes them.

Main entry points: [`frontend/src/App.tsx`](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/App.tsx) (Role-based app), [`frontend/src/pages/NewScreening.tsx`](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/NewScreening.tsx) (Anonymous intake), [`backend/main.py`](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/main.py) (REST API and policy), [`frontend/src/pages/PatientFile.tsx`](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/PatientFile.tsx) (Screening result file)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Web experience"]
  node_app["Role-based app<br/>[App.tsx]"]
  node_authstate["Session state<br/>[AuthContext.tsx]"]
  node_authclient["Auth API client<br/>[authApi.ts]"]
  node_languages["English and Arabic"]
  node_adminui["Institution admin<br/>[Admin.tsx]"]
end

subgraph group_screening["Screening workflow"]
  node_intake["Anonymous intake<br/>[NewScreening.tsx]"]
  node_capture["Image capture<br/>[CameraModal.tsx]"]
  node_captureview["Capture slots<br/>[CaptureSlot.tsx]"]
  node_detectclient["Detection client<br/>[detectionApi.ts]"]
  node_patientfile["Screening result file<br/>[PatientFile.tsx]"]
  node_overlay["Detection overlays"]
  node_screeningclient["Screening API client<br/>[screeningApi.ts]"]
  node_dashboard["Dentist review<br/>[Dashboard.tsx]"]
end

subgraph group_services["Backend services"]
  node_inference["Caries inference API<br/>[main.py]"]
  node_yolo["YOLO model weights<br/>[best.pt]"]
  node_api["REST API and policy<br/>[main.py]"]
  node_security["Sessions and roles<br/>[auth.py]"]
end

subgraph group_persistence["Data and storage"]
  node_mongodb[("MongoDB records<br/>[database.py]")]
  node_imagehelper["Image storage service<br/>[storage.py]"]
  node_supabase[("Private image objects")]
end

node_user(("Platform users"))

node_user -->|"uses"| node_app
node_app -->|"provides session"| node_authstate
node_app -->|"routes staff"| node_intake
node_app -->|"routes dentists"| node_dashboard
node_app -->|"routes admins"| node_adminui
node_authstate -->|"calls"| node_authclient
node_adminui -->|"manages accounts"| node_authclient
node_intake -->|"opens camera"| node_capture
node_intake -->|"renders"| node_captureview
node_intake -->|"submits images"| node_detectclient
node_detectclient -->|"uploads image"| node_inference
node_inference -->|"runs inference"| node_yolo
node_intake -->|"opens results"| node_patientfile
node_patientfile -->|"renders detections"| node_overlay
node_patientfile -->|"saves file"| node_screeningclient
node_dashboard -->|"loads and updates"| node_screeningclient
node_dashboard -->|"reviews images"| node_overlay
node_screeningclient -->|"calls REST API"| node_api
node_authclient -->|"calls auth routes"| node_api
node_api -->|"enforces access"| node_security
node_api -->|"reads and writes"| node_mongodb
node_api -->|"stores and signs images"| node_imagehelper
node_imagehelper -->|"uploads and retrieves"| node_supabase

click node_app "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/App.tsx"
click node_authstate "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/context/AuthContext.tsx"
click node_authclient "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/lib/authApi.ts"
click node_languages "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/context/LanguageContext.tsx"
click node_adminui "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/Admin.tsx"
click node_intake "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/NewScreening.tsx"
click node_capture "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/components/screening/CameraModal.tsx"
click node_captureview "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/components/screening/CaptureSlot.tsx"
click node_detectclient "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/lib/detectionApi.ts"
click node_inference "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/main.py"
click node_yolo "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/model/best.pt"
click node_patientfile "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/PatientFile.tsx"
click node_overlay "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/components/screening/DetectionOverlay.tsx"
click node_screeningclient "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/lib/screeningApi.ts"
click node_dashboard "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/Dashboard.tsx"
click node_api "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/main.py"
click node_security "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/auth.py"
click node_mongodb "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/database.py"
click node_imagehelper "https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/storage.py"

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,node_authstate,node_authclient,node_languages,node_adminui,node_user toneBlue
class node_intake,node_capture,node_captureview,node_detectclient,node_patientfile,node_overlay,node_screeningclient,node_dashboard toneAmber
class node_inference,node_yolo,node_api,node_security toneMint
class node_mongodb,node_imagehelper,node_supabase toneRose
```

## Components

### Web experience

- [Role-based app](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/App.tsx): `frontend/src/App.tsx`
- [Session state](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/context/AuthContext.tsx): `frontend/src/context/AuthContext.tsx`
- [Auth API client](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/lib/authApi.ts): `frontend/src/lib/authApi.ts`
- [English and Arabic](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/context/LanguageContext.tsx): `frontend/src/context/LanguageContext.tsx`
- [Institution admin](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/Admin.tsx): `frontend/src/pages/Admin.tsx`

### Screening workflow

- [Anonymous intake](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/NewScreening.tsx): `frontend/src/pages/NewScreening.tsx`
- [Image capture](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/components/screening/CameraModal.tsx): `frontend/src/components/screening/CameraModal.tsx`
- [Capture slots](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/components/screening/CaptureSlot.tsx): `frontend/src/components/screening/CaptureSlot.tsx`
- [Detection client](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/lib/detectionApi.ts): `frontend/src/lib/detectionApi.ts`
- [Screening result file](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/PatientFile.tsx): `frontend/src/pages/PatientFile.tsx`
- [Detection overlays](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/components/screening/DetectionOverlay.tsx): `frontend/src/components/screening/DetectionOverlay.tsx`
- [Screening API client](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/lib/screeningApi.ts): `frontend/src/lib/screeningApi.ts`
- [Dentist review](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/frontend/src/pages/Dashboard.tsx): `frontend/src/pages/Dashboard.tsx`

### Backend services

- [Caries inference API](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/main.py): `backend/main.py`
- [YOLO model weights](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/model/best.pt): `backend/model/best.pt`
- [REST API and policy](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/main.py): `backend/main.py`
- [Sessions and roles](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/auth.py): `backend/auth.py`

### Data and storage

- [MongoDB records](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/database.py): `backend/database.py`
- [Image storage service](https://github.com/kassemabbassi/connectathon-/blob/kassembranch/backend/storage.py): `backend/storage.py`
- **Private image objects**

### Other components

- **Platform users**

## Connections

- Platform users → Role-based app: uses (evidence: `README.md`)
- Role-based app → Session state: provides session (evidence: `frontend/src/App.tsx`)
- Role-based app → Anonymous intake: routes staff (evidence: `frontend/src/App.tsx`)
- Role-based app → Dentist review: routes dentists (evidence: `frontend/src/App.tsx`)
- Role-based app → Institution admin: routes admins (evidence: `frontend/src/App.tsx`)
- Session state → Auth API client: calls (evidence: `frontend/src/context/AuthContext.tsx`)
- Institution admin → Auth API client: manages accounts (evidence: `frontend/src/pages/Admin.tsx`)
- Anonymous intake → Image capture: opens camera (evidence: `frontend/src/pages/NewScreening.tsx`)
- Anonymous intake → Capture slots: renders (evidence: `frontend/src/pages/NewScreening.tsx`)
- Anonymous intake → Detection client: submits images (evidence: `frontend/src/pages/NewScreening.tsx`)
- Detection client → Caries inference API: uploads image (evidence: `README.md`)
- Caries inference API → YOLO model weights: runs inference (evidence: `README.md`)
- Anonymous intake → Screening result file: opens results (evidence: `frontend/src/pages/NewScreening.tsx`)
- Screening result file → Detection overlays: renders detections (evidence: `frontend/src/pages/PatientFile.tsx`)
- Screening result file → Screening API client: saves file (evidence: `frontend/src/pages/PatientFile.tsx`)
- Dentist review → Screening API client: loads and updates (evidence: `frontend/src/pages/Dashboard.tsx`)
- Dentist review → Detection overlays: reviews images (evidence: `frontend/src/pages/Dashboard.tsx`)
- Screening API client → REST API and policy: calls REST API (evidence: `README.md`)
- Auth API client → REST API and policy: calls auth routes (evidence: `frontend/src/lib/authApi.ts`)
- REST API and policy → Sessions and roles: enforces access (evidence: `backend/main.py`)
- REST API and policy → MongoDB records: reads and writes (evidence: `backend/main.py`)
- REST API and policy → Image storage service: stores and signs images (evidence: `backend/main.py`)
- Image storage service → Private image objects: uploads and retrieves (evidence: `backend/storage.py`)