# ravichow/badminton-tournament-maker-v2 architecture

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

- Interactive diagram: https://gitdiagram.com/ravichow/badminton-tournament-maker-v2
- Repository: https://github.com/ravichow/badminton-tournament-maker-v2

## Overview

Badminton Tournament Maker manages doubles tournaments from roster and format setup through live court scoring, group standings, and knockout playoffs, with organizer and spectator views. React’s App coordinates tournament state and major views; tournament-generation and standings logic lives in the engine. The API service provides local-first persistence and remote synchronization to Cloudflare Pages Functions and D1. README documents offline caching, QR sharing, themes, and exports; some detailed runtime wiring was not sampled, so those links are shown only where supported.

Main entry points: [`src/App.tsx`](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/App.tsx) (App coordinator), [`src/components/SpectatorView.tsx`](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/SpectatorView.tsx) (Spectator view), [`src/components/AdminDashboard.tsx`](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/AdminDashboard.tsx) (Admin dashboard), [`src/services/api.ts`](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/services/api.ts) (API and local cache)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_workflow["Tournament workflow"]
  node_app["App coordinator<br/>[App.tsx]"]
  node_setup["Tournament setup"]
  node_roster["Roster management"]
end

subgraph group_views["Organizer and spectator views"]
  node_admin["Admin dashboard<br/>[AdminDashboard.tsx]"]
  node_court["Court match cards<br/>[CourtCard.tsx]"]
  node_score["Match scoring<br/>[ScoreModal.tsx]"]
  node_bracket["Knockout bracket"]
  node_glance["Tournament glance"]
  node_spectator_view["Spectator view<br/>[SpectatorView.tsx]"]
  node_sharing["QR sharing<br/>[QRCodeModal.tsx]"]
  node_tournament_hub["Tournament hub"]
end

subgraph group_runtime["Tournament logic"]
  node_pairing["Pairing and formats<br/>[engine.ts]"]
  node_tournament_state["Tournament state<br/>[tournament.ts]"]
  node_standings["Standings and tiebreaks<br/>[engine.ts]"]
  node_debrief["Tournament debrief<br/>[debrief.ts]"]
  node_export["PDF and image export<br/>[exportVisuals.ts]"]
end

subgraph group_persistence["Persistence and API"]
  node_api_client["API and local cache<br/>[api.ts]"]
  node_tournament_api["Tournament API<br/>[tournaments.ts]"]
  node_roster_api["Roster API<br/>[roster.ts]"]
  node_d1[("Cloudflare D1")]
end

node_organizer(("Organizer"))
node_spectator(("Spectator"))

node_organizer -->|"uses"| node_app
node_app -->|"opens setup"| node_setup
node_app -->|"renders"| node_admin
node_app -->|"renders"| node_spectator_view
node_setup -.->|"selects players"| node_roster
node_roster -->|"submits roster"| node_app
node_app -.->|"generates tournament"| node_pairing
node_pairing -->|"builds structure"| node_tournament_state
node_app -->|"syncs state"| node_api_client
node_admin -->|"renders courts"| node_court
node_admin -.->|"opens scoring"| node_score
node_admin -->|"calculates standings"| node_standings
node_standings -.->|"seeds playoffs"| node_bracket
node_spectator -->|"views tournament"| node_spectator_view
node_spectator_view -->|"renders bracket"| node_bracket
node_spectator_view -->|"renders summary"| node_glance
node_spectator_view -->|"exports visuals"| node_export
node_spectator_view -.->|"shares link"| node_sharing
node_admin -->|"generates report"| node_debrief
node_app -->|"opens hub"| node_tournament_hub
node_tournament_hub -->|"loads tournaments"| node_api_client
node_api_client -->|"requests tournaments"| node_tournament_api
node_api_client -->|"requests roster"| node_roster_api
node_tournament_api -->|"reads and writes"| node_d1
node_roster_api -->|"reads and writes"| node_d1

click node_app "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/App.tsx"
click node_setup "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/QuickSetupModal.tsx"
click node_roster "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/RosterManagerModal.tsx"
click node_pairing "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/engine.ts"
click node_tournament_state "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/types/tournament.ts"
click node_admin "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/AdminDashboard.tsx"
click node_court "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/CourtCard.tsx"
click node_score "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/ScoreModal.tsx"
click node_standings "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/engine.ts"
click node_bracket "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/KnockoutBracket.tsx"
click node_glance "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/TournamentGlanceView.tsx"
click node_spectator_view "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/SpectatorView.tsx"
click node_sharing "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/QRCodeModal.tsx"
click node_debrief "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/debrief.ts"
click node_export "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/exportVisuals.ts"
click node_tournament_hub "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/TournamentsHubModal.tsx"
click node_api_client "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/services/api.ts"
click node_tournament_api "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/functions/api/tournaments.ts"
click node_roster_api "https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/functions/api/roster.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,node_setup,node_roster toneBlue
class node_admin,node_court,node_score,node_bracket,node_glance,node_spectator_view,node_sharing,node_tournament_hub toneAmber
class node_pairing,node_tournament_state,node_standings,node_debrief,node_export toneMint
class node_api_client,node_tournament_api,node_roster_api,node_d1 toneRose
class node_organizer,node_spectator toneIndigo
```

## Components

### Tournament workflow

- [App coordinator](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/App.tsx): `src/App.tsx`
- [Tournament setup](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/QuickSetupModal.tsx): `src/components/QuickSetupModal.tsx`
- [Roster management](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/RosterManagerModal.tsx): `src/components/RosterManagerModal.tsx`

### Organizer and spectator views

- [Admin dashboard](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/AdminDashboard.tsx): `src/components/AdminDashboard.tsx`
- [Court match cards](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/CourtCard.tsx): `src/components/CourtCard.tsx`
- [Match scoring](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/ScoreModal.tsx): `src/components/ScoreModal.tsx`
- [Knockout bracket](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/KnockoutBracket.tsx): `src/components/KnockoutBracket.tsx`
- [Tournament glance](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/TournamentGlanceView.tsx): `src/components/TournamentGlanceView.tsx`
- [Spectator view](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/SpectatorView.tsx): `src/components/SpectatorView.tsx`
- [QR sharing](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/QRCodeModal.tsx): `src/components/QRCodeModal.tsx`
- [Tournament hub](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/components/TournamentsHubModal.tsx): `src/components/TournamentsHubModal.tsx`

### Tournament logic

- [Pairing and formats](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/engine.ts): `src/utils/engine.ts`
- [Tournament state](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/types/tournament.ts): `src/types/tournament.ts`
- [Standings and tiebreaks](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/engine.ts): `src/utils/engine.ts`
- [Tournament debrief](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/debrief.ts): `src/utils/debrief.ts`
- [PDF and image export](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/utils/exportVisuals.ts): `src/utils/exportVisuals.ts`

### Persistence and API

- [API and local cache](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/src/services/api.ts): `src/services/api.ts`
- [Tournament API](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/functions/api/tournaments.ts): `functions/api/tournaments.ts`
- [Roster API](https://github.com/ravichow/badminton-tournament-maker-v2/blob/main/functions/api/roster.ts): `functions/api/roster.ts`
- **Cloudflare D1**

### Other components

- **Organizer**
- **Spectator**

## Connections

- Organizer → App coordinator: uses (evidence: `README.md`)
- App coordinator → Tournament setup: opens setup (evidence: `src/App.tsx`)
- App coordinator → Admin dashboard: renders (evidence: `src/App.tsx`)
- App coordinator → Spectator view: renders (evidence: `src/App.tsx`)
- Tournament setup → Roster management: selects players
- Roster management → App coordinator: submits roster (evidence: `src/components/RosterManagerModal.tsx`)
- App coordinator → Pairing and formats: generates tournament (evidence: `src/App.tsx`)
- Pairing and formats → Tournament state: builds structure (evidence: `src/utils/engine.ts`)
- App coordinator → API and local cache: syncs state (evidence: `src/App.tsx`)
- Admin dashboard → Court match cards: renders courts (evidence: `src/components/AdminDashboard.tsx`)
- Admin dashboard → Match scoring: opens scoring (evidence: `src/components/AdminDashboard.tsx`)
- Admin dashboard → Standings and tiebreaks: calculates standings (evidence: `src/components/AdminDashboard.tsx`)
- Standings and tiebreaks → Knockout bracket: seeds playoffs (evidence: `src/components/KnockoutBracket.tsx`)
- Spectator → Spectator view: views tournament (evidence: `README.md`)
- Spectator view → Knockout bracket: renders bracket (evidence: `src/components/SpectatorView.tsx`)
- Spectator view → Tournament glance: renders summary (evidence: `src/components/SpectatorView.tsx`)
- Spectator view → PDF and image export: exports visuals (evidence: `src/components/SpectatorView.tsx`)
- Spectator view → QR sharing: shares link
- Admin dashboard → Tournament debrief: generates report (evidence: `src/components/AdminDashboard.tsx`)
- App coordinator → Tournament hub: opens hub (evidence: `src/App.tsx`)
- Tournament hub → API and local cache: loads tournaments (evidence: `src/components/TournamentsHubModal.tsx`)
- API and local cache → Tournament API: requests tournaments (evidence: `src/services/api.ts`)
- API and local cache → Roster API: requests roster (evidence: `src/services/api.ts`)
- Tournament API → Cloudflare D1: reads and writes (evidence: `README.md`)
- Roster API → Cloudflare D1: reads and writes (evidence: `README.md`)