# iagojorge/loltrainer architecture

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

- Interactive diagram: https://gitdiagram.com/iagojorge/loltrainer
- Repository: https://github.com/iagojorge/loltrainer

## Overview

LoL Histórico is a team-focused League of Legends match-analysis platform. A user imports matches by Riot ID/Match ID or uploads a replay; the server transforms and stores match data, which the client presents as match history, team/player/champion analysis, timelines, and coach notes. The graph also includes roster management, SoloQ, authentication, and Riot/Data Dragon integrations. Some route and service implementations were not sampled, so their connections are limited to README statements and SOURCE INDEX references.

Main entry points: [`client/src/App.jsx`](https://github.com/iagojorge/loltrainer/blob/main/client/src/App.jsx) (App routing), [`client/src/api.js`](https://github.com/iagojorge/loltrainer/blob/main/client/src/api.js) (API client), [`server/src/app.js`](https://github.com/iagojorge/loltrainer/blob/main/server/src/app.js) (Express API), [`server/src/db.js`](https://github.com/iagojorge/loltrainer/blob/main/server/src/db.js) (Match database)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Client experience"]
  node_app["App routing<br/>[App.jsx]"]
  node_authui["Session state<br/>[auth.jsx]"]
  node_transport["API client<br/>[api.js]"]
end

subgraph group_ingest["Match ingestion"]
  node_importui["Import workflow<br/>[ImportMatch.jsx]"]
  node_matchroutes["Match endpoints<br/>[matches.js]"]
  node_replayroutes["Replay endpoints<br/>[replays.js]"]
  node_riotroutes["Riot endpoints<br/>[riot.js]"]
  node_riotservice["Riot match import<br/>[riot.js]"]
  node_rofl["Replay parsing<br/>[rofl.js]"]
end

subgraph group_analysis["Analysis features"]
  node_history["Match history<br/>[Dashboard.jsx]"]
  node_teamdash["Team dashboard<br/>[TeamDashboard.jsx]"]
  node_matchview["Match detail<br/>[MatchDetail.jsx]"]
  node_champions["Champion analysis<br/>[ChampionDetail.jsx]"]
  node_player["Player analysis<br/>[PlayerDetail.jsx]"]
  node_playerlist["Player roster view<br/>[Players.jsx]"]
  node_soloq["SoloQ analysis<br/>[Soloq.jsx]"]
  node_stats["Stats aggregation<br/>[stats.js]"]
end

subgraph group_identity["Identity and roster"]
  node_roster["Roster management<br/>[roster.js]"]
  node_authservice["Authentication<br/>[auth.js]"]
end

subgraph group_data["Services and storage"]
  node_server["Express API<br/>[app.js]"]
  node_ddragon["Game metadata<br/>[ddragon.js]"]
  node_database[("Match database<br/>[db.js]")]
end

node_user(("Team analyst"))
node_riot{{"Riot API"}}
node_cdn{{"Data Dragon CDN"}}

node_user -->|"uses"| node_app
node_app -->|"routes to"| node_history
node_app -->|"routes to"| node_teamdash
node_app -->|"routes to"| node_matchview
node_app -->|"routes to"| node_champions
node_app -->|"routes to"| node_player
node_app -->|"routes to"| node_playerlist
node_app -->|"routes to"| node_soloq
node_app -->|"routes to"| node_importui
node_app -->|"reads session"| node_authui
node_authui -->|"requests session"| node_transport
node_history -->|"fetches data"| node_transport
node_teamdash -->|"fetches data"| node_transport
node_matchview -->|"fetches data"| node_transport
node_champions -->|"fetches data"| node_transport
node_player -->|"fetches data"| node_transport
node_playerlist -->|"fetches data"| node_transport
node_soloq -->|"fetches data"| node_transport
node_importui -->|"submits imports"| node_transport
node_transport -->|"calls API"| node_server
node_server -->|"mounts routes"| node_matchroutes
node_server -->|"mounts routes"| node_replayroutes
node_matchroutes -->|"imports matches"| node_riotservice
node_matchroutes -->|"requests stats"| node_stats
node_replayroutes -->|"parses replay"| node_rofl
node_server -->|"mounts routes"| node_riotroutes
node_riotservice -->|"fetches match data"| node_riot
node_riotservice -->|"translates game IDs"| node_ddragon
node_ddragon -->|"fetches metadata"| node_cdn
node_riotservice -->|"persists match data"| node_database
node_rofl -->|"persists replay data"| node_database
node_stats -.->|"queries aggregates"| node_database
node_server -->|"uses identity"| node_authservice
node_authservice -->|"reads and writes"| node_database
node_server -->|"seeds roster"| node_roster
node_roster -->|"reads and writes"| node_database

click node_app "https://github.com/iagojorge/loltrainer/blob/main/client/src/App.jsx"
click node_authui "https://github.com/iagojorge/loltrainer/blob/main/client/src/auth.jsx"
click node_transport "https://github.com/iagojorge/loltrainer/blob/main/client/src/api.js"
click node_history "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/Dashboard.jsx"
click node_teamdash "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/TeamDashboard.jsx"
click node_matchview "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/MatchDetail.jsx"
click node_champions "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/ChampionDetail.jsx"
click node_player "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/PlayerDetail.jsx"
click node_playerlist "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/Players.jsx"
click node_soloq "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/Soloq.jsx"
click node_importui "https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/ImportMatch.jsx"
click node_server "https://github.com/iagojorge/loltrainer/blob/main/server/src/app.js"
click node_matchroutes "https://github.com/iagojorge/loltrainer/blob/main/server/src/routes/matches.js"
click node_replayroutes "https://github.com/iagojorge/loltrainer/blob/main/server/src/routes/replays.js"
click node_riotroutes "https://github.com/iagojorge/loltrainer/blob/main/server/src/routes/riot.js"
click node_riotservice "https://github.com/iagojorge/loltrainer/blob/main/server/src/services/riot.js"
click node_rofl "https://github.com/iagojorge/loltrainer/blob/main/server/src/services/rofl.js"
click node_stats "https://github.com/iagojorge/loltrainer/blob/main/server/src/services/stats.js"
click node_roster "https://github.com/iagojorge/loltrainer/blob/main/server/src/services/roster.js"
click node_authservice "https://github.com/iagojorge/loltrainer/blob/main/server/src/services/auth.js"
click node_ddragon "https://github.com/iagojorge/loltrainer/blob/main/server/src/services/ddragon.js"
click node_database "https://github.com/iagojorge/loltrainer/blob/main/server/src/db.js"

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_authui,node_transport toneBlue
class node_importui,node_matchroutes,node_replayroutes,node_riotroutes,node_riotservice,node_rofl toneAmber
class node_history,node_teamdash,node_matchview,node_champions,node_player,node_playerlist,node_soloq,node_stats,node_riot toneMint
class node_roster,node_authservice toneRose
class node_server,node_ddragon,node_database,node_user,node_cdn toneIndigo
```

## Components

### Client experience

- [App routing](https://github.com/iagojorge/loltrainer/blob/main/client/src/App.jsx): `client/src/App.jsx`
- [Session state](https://github.com/iagojorge/loltrainer/blob/main/client/src/auth.jsx): `client/src/auth.jsx`
- [API client](https://github.com/iagojorge/loltrainer/blob/main/client/src/api.js): `client/src/api.js`

### Match ingestion

- [Import workflow](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/ImportMatch.jsx): `client/src/pages/ImportMatch.jsx`
- [Match endpoints](https://github.com/iagojorge/loltrainer/blob/main/server/src/routes/matches.js): `server/src/routes/matches.js`
- [Replay endpoints](https://github.com/iagojorge/loltrainer/blob/main/server/src/routes/replays.js): `server/src/routes/replays.js`
- [Riot endpoints](https://github.com/iagojorge/loltrainer/blob/main/server/src/routes/riot.js): `server/src/routes/riot.js`
- [Riot match import](https://github.com/iagojorge/loltrainer/blob/main/server/src/services/riot.js): `server/src/services/riot.js`
- [Replay parsing](https://github.com/iagojorge/loltrainer/blob/main/server/src/services/rofl.js): `server/src/services/rofl.js`

### Analysis features

- [Match history](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/Dashboard.jsx): `client/src/pages/Dashboard.jsx`
- [Team dashboard](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/TeamDashboard.jsx): `client/src/pages/TeamDashboard.jsx`
- [Match detail](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/MatchDetail.jsx): `client/src/pages/MatchDetail.jsx`
- [Champion analysis](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/ChampionDetail.jsx): `client/src/pages/ChampionDetail.jsx`
- [Player analysis](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/PlayerDetail.jsx): `client/src/pages/PlayerDetail.jsx`
- [Player roster view](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/Players.jsx): `client/src/pages/Players.jsx`
- [SoloQ analysis](https://github.com/iagojorge/loltrainer/blob/main/client/src/pages/Soloq.jsx): `client/src/pages/Soloq.jsx`
- [Stats aggregation](https://github.com/iagojorge/loltrainer/blob/main/server/src/services/stats.js): `server/src/services/stats.js`

### Identity and roster

- [Roster management](https://github.com/iagojorge/loltrainer/blob/main/server/src/services/roster.js): `server/src/services/roster.js`
- [Authentication](https://github.com/iagojorge/loltrainer/blob/main/server/src/services/auth.js): `server/src/services/auth.js`

### Services and storage

- [Express API](https://github.com/iagojorge/loltrainer/blob/main/server/src/app.js): `server/src/app.js`
- [Game metadata](https://github.com/iagojorge/loltrainer/blob/main/server/src/services/ddragon.js): `server/src/services/ddragon.js`
- [Match database](https://github.com/iagojorge/loltrainer/blob/main/server/src/db.js): `server/src/db.js`

### Other components

- **Team analyst**
- **Riot API**
- **Data Dragon CDN**

## Connections

- Team analyst → App routing: uses (evidence: `README.md`)
- App routing → Match history: routes to (evidence: `client/src/App.jsx`)
- App routing → Team dashboard: routes to (evidence: `client/src/App.jsx`)
- App routing → Match detail: routes to (evidence: `client/src/App.jsx`)
- App routing → Champion analysis: routes to (evidence: `client/src/App.jsx`)
- App routing → Player analysis: routes to (evidence: `client/src/App.jsx`)
- App routing → Player roster view: routes to (evidence: `client/src/App.jsx`)
- App routing → SoloQ analysis: routes to (evidence: `client/src/App.jsx`)
- App routing → Import workflow: routes to (evidence: `client/src/App.jsx`)
- App routing → Session state: reads session (evidence: `client/src/App.jsx`)
- Session state → API client: requests session (evidence: `client/src/auth.jsx`)
- Match history → API client: fetches data (evidence: `client/src/pages/Dashboard.jsx`)
- Team dashboard → API client: fetches data (evidence: `client/src/pages/TeamDashboard.jsx`)
- Match detail → API client: fetches data (evidence: `client/src/pages/MatchDetail.jsx`)
- Champion analysis → API client: fetches data (evidence: `client/src/pages/ChampionDetail.jsx`)
- Player analysis → API client: fetches data
- Player roster view → API client: fetches data
- SoloQ analysis → API client: fetches data (evidence: `client/src/pages/Soloq.jsx`)
- Import workflow → API client: submits imports (evidence: `client/src/pages/ImportMatch.jsx`)
- API client → Express API: calls API (evidence: `README.md`)
- Express API → Match endpoints: mounts routes (evidence: `server/src/app.js`)
- Express API → Replay endpoints: mounts routes (evidence: `server/src/app.js`)
- Match endpoints → Riot match import: imports matches (evidence: `server/src/routes/matches.js`)
- Match endpoints → Stats aggregation: requests stats (evidence: `server/src/routes/matches.js`)
- Replay endpoints → Replay parsing: parses replay (evidence: `server/src/routes/replays.js`)
- Express API → Riot endpoints: mounts routes (evidence: `server/src/app.js`)
- Riot match import → Riot API: fetches match data (evidence: `README.md`)
- Riot match import → Game metadata: translates game IDs (evidence: `server/src/services/riot.js`)
- Game metadata → Data Dragon CDN: fetches metadata (evidence: `server/src/services/ddragon.js`)
- Riot match import → Match database: persists match data (evidence: `README.md`)
- Replay parsing → Match database: persists replay data (evidence: `server/src/services/rofl.js`)
- Stats aggregation → Match database: queries aggregates
- Express API → Authentication: uses identity (evidence: `server/src/app.js`)
- Authentication → Match database: reads and writes (evidence: `server/src/services/auth.js`)
- Express API → Roster management: seeds roster (evidence: `server/src/app.js`)
- Roster management → Match database: reads and writes (evidence: `server/src/services/roster.js`)