# bariskisir/pokedex architecture

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

- Interactive diagram: https://gitdiagram.com/bariskisir/pokedex
- Repository: https://github.com/bariskisir/pokedex

## Overview

pokedex-electron is a desktop Pokédex whose main workflow is: a user opens the handheld, browses or filters Pokémon, selects an entry, and explores its profile and related information. The React renderer coordinates catalog and detail requests through a controller, which uses the PokéAPI client and local persistence; the device hook manages lid, audio, and native window sizing. The README also documents alternate forms and generation/region labels. Some components and the preload bridge were not sampled, so their internal wiring is shown only where documented or supported by the tree.

Main entry points: [`src/renderer/components/App.tsx`](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/App.tsx) (App shell), [`src/renderer/components/PokemonProfile.tsx`](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/PokemonProfile.tsx) (Pokémon profile), [`src/renderer/hooks/usePokedex.ts`](https://github.com/bariskisir/pokedex/blob/master/src/renderer/hooks/usePokedex.ts) (Pokédex controller), [`src/renderer/hooks/useDevice.ts`](https://github.com/bariskisir/pokedex/blob/master/src/renderer/hooks/useDevice.ts) (Device state)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_desktop["Desktop shell"]
  node_electron["Electron window<br/>[main.cts]"]
  node_preload["Preload bridge<br/>[preload.cts]"]
end

subgraph group_renderer["Pokédex interface"]
  node_mount["Renderer entry<br/>[main.tsx]"]
  node_app["App shell<br/>[App.tsx]"]
  node_catalog["Catalog<br/>[Catalog.tsx]"]
  node_profile["Pokémon profile<br/>[PokemonProfile.tsx]"]
  node_artwork["Artwork display<br/>[Artwork.tsx]"]
  node_stats["Stats and matchups<br/>[Stats.tsx]"]
  node_matchups["Type matchups<br/>[TypeMatchups.tsx]"]
  node_evolution["Evolution tree<br/>[EvolutionTree.tsx]"]
  node_moves["Moves list<br/>[Moves.tsx]"]
end

subgraph group_data["Data and domain"]
  node_controller["Pokédex controller<br/>[usePokedex.ts]"]
  node_domain["Search and transformations<br/>[pokemon.ts]"]
  node_client["PokéAPI client<br/>[client.ts]"]
  node_schemas["Response schemas<br/>[schemas.ts]"]
  node_storage[("Local preferences and cache<br/>[storage.ts]")]
end

subgraph group_device["Device experience"]
  node_device["Device state<br/>[useDevice.ts]"]
  node_controls["Device controls<br/>[DeviceControls.tsx]"]
  node_cover["Folding cover<br/>[DeviceCover.tsx]"]
  node_audio["Synthesized audio<br/>[device-audio.ts]"]
end

node_user(("Desktop user"))
node_api["PokéAPI v2"]

node_user -->|"launches"| node_electron
node_electron -->|"loads renderer"| node_mount
node_mount -->|"mounts"| node_app
node_user -->|"browses"| node_app
node_app -->|"requests data"| node_controller
node_app -->|"renders"| node_catalog
node_catalog -->|"filters and selects"| node_controller
node_controller -->|"filters and labels"| node_domain
node_controller -->|"requests resources"| node_client
node_client -->|"validates with"| node_schemas
node_client -->|"fetches resources"| node_api
node_client -->|"reads and caches"| node_storage
node_controller -->|"saves favorites"| node_storage
node_app -->|"shows selected entry"| node_profile
node_profile -->|"renders artwork"| node_artwork
node_profile -->|"renders stats"| node_stats
node_profile -->|"renders matchups"| node_matchups
node_profile -->|"renders evolutions"| node_evolution
node_profile -->|"renders moves"| node_moves
node_app -->|"coordinates state"| node_device
node_app -->|"renders controls"| node_controls
node_app -->|"renders cover"| node_cover
node_controls -->|"navigates and favorites"| node_controller
node_controls -->|"toggles device"| node_device
node_device -->|"plays cues"| node_audio
node_device -->|"persists mute setting"| node_storage
node_device -->|"requests window sizing"| node_preload
node_preload -->|"dispatches IPC"| node_electron

click node_electron "https://github.com/bariskisir/pokedex/blob/master/src/electron/main.cts"
click node_preload "https://github.com/bariskisir/pokedex/blob/master/src/electron/preload.cts"
click node_mount "https://github.com/bariskisir/pokedex/blob/master/src/renderer/main.tsx"
click node_app "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/App.tsx"
click node_catalog "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Catalog.tsx"
click node_controller "https://github.com/bariskisir/pokedex/blob/master/src/renderer/hooks/usePokedex.ts"
click node_domain "https://github.com/bariskisir/pokedex/blob/master/src/renderer/domain/pokemon.ts"
click node_client "https://github.com/bariskisir/pokedex/blob/master/src/renderer/api/client.ts"
click node_schemas "https://github.com/bariskisir/pokedex/blob/master/src/renderer/api/schemas.ts"
click node_storage "https://github.com/bariskisir/pokedex/blob/master/src/renderer/services/storage.ts"
click node_profile "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/PokemonProfile.tsx"
click node_artwork "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Artwork.tsx"
click node_stats "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Stats.tsx"
click node_matchups "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/TypeMatchups.tsx"
click node_evolution "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/EvolutionTree.tsx"
click node_moves "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Moves.tsx"
click node_device "https://github.com/bariskisir/pokedex/blob/master/src/renderer/hooks/useDevice.ts"
click node_controls "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/device/DeviceControls.tsx"
click node_cover "https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/device/DeviceCover.tsx"
click node_audio "https://github.com/bariskisir/pokedex/blob/master/src/renderer/services/device-audio.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_electron,node_preload,node_user toneBlue
class node_mount,node_app,node_catalog,node_profile,node_artwork,node_stats,node_matchups,node_evolution,node_moves toneAmber
class node_controller,node_domain,node_client,node_schemas,node_storage,node_api toneMint
class node_device,node_controls,node_cover,node_audio toneRose
```

## Components

### Desktop shell

- [Electron window](https://github.com/bariskisir/pokedex/blob/master/src/electron/main.cts): `src/electron/main.cts`
- [Preload bridge](https://github.com/bariskisir/pokedex/blob/master/src/electron/preload.cts): `src/electron/preload.cts`

### Pokédex interface

- [Renderer entry](https://github.com/bariskisir/pokedex/blob/master/src/renderer/main.tsx): `src/renderer/main.tsx`
- [App shell](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/App.tsx): `src/renderer/components/App.tsx`
- [Catalog](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Catalog.tsx): `src/renderer/components/Catalog.tsx`
- [Pokémon profile](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/PokemonProfile.tsx): `src/renderer/components/PokemonProfile.tsx`
- [Artwork display](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Artwork.tsx): `src/renderer/components/Artwork.tsx`
- [Stats and matchups](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Stats.tsx): `src/renderer/components/Stats.tsx`
- [Type matchups](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/TypeMatchups.tsx): `src/renderer/components/TypeMatchups.tsx`
- [Evolution tree](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/EvolutionTree.tsx): `src/renderer/components/EvolutionTree.tsx`
- [Moves list](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/Moves.tsx): `src/renderer/components/Moves.tsx`

### Data and domain

- [Pokédex controller](https://github.com/bariskisir/pokedex/blob/master/src/renderer/hooks/usePokedex.ts): `src/renderer/hooks/usePokedex.ts`
- [Search and transformations](https://github.com/bariskisir/pokedex/blob/master/src/renderer/domain/pokemon.ts): `src/renderer/domain/pokemon.ts`
- [PokéAPI client](https://github.com/bariskisir/pokedex/blob/master/src/renderer/api/client.ts): `src/renderer/api/client.ts`
- [Response schemas](https://github.com/bariskisir/pokedex/blob/master/src/renderer/api/schemas.ts): `src/renderer/api/schemas.ts`
- [Local preferences and cache](https://github.com/bariskisir/pokedex/blob/master/src/renderer/services/storage.ts): `src/renderer/services/storage.ts`

### Device experience

- [Device state](https://github.com/bariskisir/pokedex/blob/master/src/renderer/hooks/useDevice.ts): `src/renderer/hooks/useDevice.ts`
- [Device controls](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/device/DeviceControls.tsx): `src/renderer/components/device/DeviceControls.tsx`
- [Folding cover](https://github.com/bariskisir/pokedex/blob/master/src/renderer/components/device/DeviceCover.tsx): `src/renderer/components/device/DeviceCover.tsx`
- [Synthesized audio](https://github.com/bariskisir/pokedex/blob/master/src/renderer/services/device-audio.ts): `src/renderer/services/device-audio.ts`

### Other components

- **Desktop user**
- **PokéAPI v2**

## Connections

- Desktop user → Electron window: launches
- Electron window → Renderer entry: loads renderer
- Renderer entry → App shell: mounts
- Desktop user → App shell: browses
- App shell → Pokédex controller: requests data
- App shell → Catalog: renders
- Catalog → Pokédex controller: filters and selects
- Pokédex controller → Search and transformations: filters and labels
- Pokédex controller → PokéAPI client: requests resources
- PokéAPI client → Response schemas: validates with
- PokéAPI client → PokéAPI v2: fetches resources
- PokéAPI client → Local preferences and cache: reads and caches
- Pokédex controller → Local preferences and cache: saves favorites
- App shell → Pokémon profile: shows selected entry
- Pokémon profile → Artwork display: renders artwork
- Pokémon profile → Stats and matchups: renders stats
- Pokémon profile → Type matchups: renders matchups
- Pokémon profile → Evolution tree: renders evolutions
- Pokémon profile → Moves list: renders moves
- App shell → Device state: coordinates state
- App shell → Device controls: renders controls
- App shell → Folding cover: renders cover
- Device controls → Pokédex controller: navigates and favorites
- Device controls → Device state: toggles device
- Device state → Synthesized audio: plays cues
- Device state → Local preferences and cache: persists mute setting
- Device state → Preload bridge: requests window sizing
- Preload bridge → Electron window: dispatches IPC