# heykelh/finance-data-hub architecture

> Architecture diagram of the GitHub repository heykelh/finance-data-hub, 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/heykelh/finance-data-hub
- Repository: https://github.com/heykelh/finance-data-hub
- Video tour (about a minute): https://gitdiagram.com/heykelh/finance-data-hub/video

## Overview

Finance Data Hub is a browser-based executive and practitioner dashboard for a bank’s data-governance transformation. Users inspect a phased program through maturity diagnosis, governance, catalog, quality, lineage, AI-model governance, and executive views; the shared phase state changes the displayed status and metrics. The sampled store derives phase-specific values from local timeline and reference data, rather than showing a live data-platform integration. Page excerpts are partial, so links are limited to imports and behavior visible in the supplied source.

Main entry points: [`src/lib/useProjectState.ts`](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/useProjectState.ts) (Project state), [`src/components/Sidebar.tsx`](https://github.com/heykelh/finance-data-hub/blob/main/src/components/Sidebar.tsx) (Navigation), [`src/app/page.tsx`](https://github.com/heykelh/finance-data-hub/blob/main/src/app/page.tsx) (Executive dashboard), [`src/lib/LanguageContext.tsx`](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/LanguageContext.tsx) (Language context)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_ui["Navigation and shell"]
  node_shell["App shell<br/>[layout.tsx]"]
  node_navigation["Navigation<br/>[Sidebar.tsx]"]
  node_phase_ui["Phase selector<br/>[PhaseSelector.tsx]"]
  node_language["Language context"]
end

subgraph group_oversight["Program oversight"]
  node_dashboard["Executive dashboard<br/>[page.tsx]"]
  node_comex["Comex briefing<br/>[page.tsx]"]
  node_diagnostic["Maturity diagnosis<br/>[page.tsx]"]
end

subgraph group_dataops["Data governance"]
  node_governance["Data governance<br/>[page.tsx]"]
  node_catalog["Data catalog<br/>[page.tsx]"]
  node_quality["Data quality<br/>[page.tsx]"]
  node_lineage["Data lineage<br/>[page.tsx]"]
  node_ai_gov["AI governance<br/>[page.tsx]"]
end

subgraph group_state["Shared phase data"]
  node_project_state["Project state<br/>[useProjectState.ts]"]
  node_timeline["Phase timeline<br/>[timeline.ts]"]
  node_reference_data["Reference data<br/>[data.ts]"]
  node_translations["Translations<br/>[fr.ts]"]
  node_english["English translations<br/>[en.ts]"]
end

node_visitor(("Dashboard user"))

node_visitor -->|"selects view"| node_navigation
node_visitor -->|"selects phase"| node_phase_ui
node_navigation -->|"opens route"| node_dashboard
node_navigation -->|"opens route"| node_comex
node_navigation -->|"opens route"| node_diagnostic
node_navigation -->|"opens route"| node_governance
node_navigation -->|"opens route"| node_catalog
node_navigation -->|"opens route"| node_quality
node_navigation -->|"opens route"| node_lineage
node_navigation -->|"opens route"| node_ai_gov
node_shell -->|"renders"| node_navigation
node_phase_ui -->|"sets phase"| node_project_state
node_project_state -->|"reads phase data"| node_timeline
node_project_state -->|"merges reference values"| node_reference_data
node_project_state -->|"provides state"| node_dashboard
node_project_state -->|"provides state"| node_diagnostic
node_project_state -->|"provides state"| node_governance
node_project_state -->|"provides state"| node_catalog
node_project_state -->|"provides state"| node_quality
node_project_state -->|"provides state"| node_lineage
node_project_state -->|"provides state"| node_ai_gov
node_dashboard -->|"reads roadmap"| node_reference_data
node_dashboard -->|"reads translations"| node_language
node_language -->|"selects locale"| node_translations
node_language -->|"selects locale"| node_english

click node_shell "https://github.com/heykelh/finance-data-hub/blob/main/src/app/layout.tsx"
click node_navigation "https://github.com/heykelh/finance-data-hub/blob/main/src/components/Sidebar.tsx"
click node_phase_ui "https://github.com/heykelh/finance-data-hub/blob/main/src/components/PhaseSelector.tsx"
click node_language "https://github.com/heykelh/finance-data-hub/blob/main/src/lib/LanguageContext.tsx"
click node_dashboard "https://github.com/heykelh/finance-data-hub/blob/main/src/app/page.tsx"
click node_comex "https://github.com/heykelh/finance-data-hub/blob/main/src/app/comex/page.tsx"
click node_diagnostic "https://github.com/heykelh/finance-data-hub/blob/main/src/app/diagnostic/page.tsx"
click node_governance "https://github.com/heykelh/finance-data-hub/blob/main/src/app/gouvernance/page.tsx"
click node_catalog "https://github.com/heykelh/finance-data-hub/blob/main/src/app/catalog/page.tsx"
click node_quality "https://github.com/heykelh/finance-data-hub/blob/main/src/app/qualite/page.tsx"
click node_lineage "https://github.com/heykelh/finance-data-hub/blob/main/src/app/lineage/page.tsx"
click node_ai_gov "https://github.com/heykelh/finance-data-hub/blob/main/src/app/ia-governance/page.tsx"
click node_project_state "https://github.com/heykelh/finance-data-hub/blob/main/src/lib/useProjectState.ts"
click node_timeline "https://github.com/heykelh/finance-data-hub/blob/main/src/lib/timeline.ts"
click node_reference_data "https://github.com/heykelh/finance-data-hub/blob/main/src/lib/data.ts"
click node_translations "https://github.com/heykelh/finance-data-hub/blob/main/src/lib/i18n/fr.ts"
click node_english "https://github.com/heykelh/finance-data-hub/blob/main/src/lib/i18n/en.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_shell,node_navigation,node_phase_ui,node_language,node_visitor toneBlue
class node_dashboard,node_comex,node_diagnostic toneAmber
class node_governance,node_catalog,node_quality,node_lineage,node_ai_gov toneMint
class node_project_state,node_timeline,node_reference_data,node_translations,node_english toneRose
```

## Components

### Navigation and shell

- [App shell](https://github.com/heykelh/finance-data-hub/blob/main/src/app/layout.tsx): `src/app/layout.tsx`
- [Navigation](https://github.com/heykelh/finance-data-hub/blob/main/src/components/Sidebar.tsx): `src/components/Sidebar.tsx`
- [Phase selector](https://github.com/heykelh/finance-data-hub/blob/main/src/components/PhaseSelector.tsx): `src/components/PhaseSelector.tsx`
- [Language context](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/LanguageContext.tsx): `src/lib/LanguageContext.tsx`

### Program oversight

- [Executive dashboard](https://github.com/heykelh/finance-data-hub/blob/main/src/app/page.tsx): `src/app/page.tsx`
- [Comex briefing](https://github.com/heykelh/finance-data-hub/blob/main/src/app/comex/page.tsx): `src/app/comex/page.tsx`
- [Maturity diagnosis](https://github.com/heykelh/finance-data-hub/blob/main/src/app/diagnostic/page.tsx): `src/app/diagnostic/page.tsx`

### Data governance

- [Data governance](https://github.com/heykelh/finance-data-hub/blob/main/src/app/gouvernance/page.tsx): `src/app/gouvernance/page.tsx`
- [Data catalog](https://github.com/heykelh/finance-data-hub/blob/main/src/app/catalog/page.tsx): `src/app/catalog/page.tsx`
- [Data quality](https://github.com/heykelh/finance-data-hub/blob/main/src/app/qualite/page.tsx): `src/app/qualite/page.tsx`
- [Data lineage](https://github.com/heykelh/finance-data-hub/blob/main/src/app/lineage/page.tsx): `src/app/lineage/page.tsx`
- [AI governance](https://github.com/heykelh/finance-data-hub/blob/main/src/app/ia-governance/page.tsx): `src/app/ia-governance/page.tsx`

### Shared phase data

- [Project state](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/useProjectState.ts): `src/lib/useProjectState.ts`
- [Phase timeline](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/timeline.ts): `src/lib/timeline.ts`
- [Reference data](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/data.ts): `src/lib/data.ts`
- [Translations](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/i18n/fr.ts): `src/lib/i18n/fr.ts`
- [English translations](https://github.com/heykelh/finance-data-hub/blob/main/src/lib/i18n/en.ts): `src/lib/i18n/en.ts`

### Other components

- **Dashboard user**

## Connections

- Dashboard user → Navigation: selects view
- Dashboard user → Phase selector: selects phase
- Navigation → Executive dashboard: opens route
- Navigation → Comex briefing: opens route
- Navigation → Maturity diagnosis: opens route
- Navigation → Data governance: opens route
- Navigation → Data catalog: opens route
- Navigation → Data quality: opens route
- Navigation → Data lineage: opens route
- Navigation → AI governance: opens route
- App shell → Navigation: renders
- Phase selector → Project state: sets phase
- Project state → Phase timeline: reads phase data
- Project state → Reference data: merges reference values
- Project state → Executive dashboard: provides state
- Project state → Maturity diagnosis: provides state
- Project state → Data governance: provides state
- Project state → Data catalog: provides state
- Project state → Data quality: provides state
- Project state → Data lineage: provides state
- Project state → AI governance: provides state
- Executive dashboard → Reference data: reads roadmap
- Executive dashboard → Language context: reads translations
- Language context → Translations: selects locale
- Language context → English translations: selects locale