# lilfranche/finfee-public architecture

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

- Interactive diagram: https://gitdiagram.com/lilfranche/finfee-public
- Repository: https://github.com/lilfranche/finfee-public

## Overview

Family Finance is a shared household-finance app: members sign in or accept invitations, then manage accounts, transactions, crypto wallets, family settings, and a dashboard of balances and activity. The browser routes users to these views and sends JSON requests to the backend; backend modules cover authentication, family membership, account and transaction operations, currency conversion, dashboard data, wallets, and Telegram. Source excerpts show frontend routing and API usage, but not backend call relationships, so backend wiring is left unconnected.

Main entry points: [`frontend/src/App.tsx`](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/App.tsx) (App router), [`frontend/src/api.ts`](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/api.ts) (JSON API client), [`frontend/src/pages/AuthPage.tsx`](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/AuthPage.tsx) (Sign in and register), [`frontend/src/pages/DashboardPage.tsx`](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/DashboardPage.tsx) (Dashboard view)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Web application"]
  node_app["App router<br/>[App.tsx]"]
  node_api["JSON API client<br/>[api.ts]"]
  node_ui["Shared UI<br/>[ui.tsx]"]
  node_format["Money formatting<br/>[format.ts]"]
  node_authpage["Sign in and register<br/>[AuthPage.tsx]"]
  node_dashpage["Dashboard view<br/>[DashboardPage.tsx]"]
  node_txpage["Transactions view"]
  node_sourcepage["Accounts view<br/>[SourcesPage.tsx]"]
  node_walletpage["Crypto wallets view<br/>[WalletsPage.tsx]"]
  node_familypage["Family view<br/>[FamilyPage.tsx]"]
  node_settingspage["Settings view<br/>[SettingsPage.tsx]"]
end

subgraph group_finance["Finance domain"]
  node_transactions["Transactions<br/>[transactions.go]"]
  node_sources["Accounts<br/>[sources.go]"]
  node_dashboard["Dashboard data<br/>[dashboard.go]"]
  node_currency["Currencies and rates<br/>[currency.go]"]
  node_crypto["Wallet synchronization<br/>[crypto.go]"]
end

subgraph group_family["Identity and family"]
  node_auth["Authentication<br/>[auth.go]"]
  node_familydomain["Family membership<br/>[family.go]"]
end

subgraph group_platform["Backend platform"]
  node_telegram["Telegram bot<br/>[telegram.go]"]
  node_http["HTTP server<br/>[http.go]"]
  node_background["Background jobs<br/>[background.go]"]
  node_config["Configuration<br/>[config.go]"]
  node_database[("Database<br/>[db.go]")]
  node_server["Server entry point<br/>[main.go]"]
end

node_user(("Family member"))

node_user -->|"uses"| node_app
node_app -->|"shows"| node_authpage
node_app -->|"routes to"| node_dashpage
node_app -->|"routes to"| node_txpage
node_app -->|"routes to"| node_sourcepage
node_app -->|"routes to"| node_walletpage
node_app -->|"routes to"| node_familypage
node_app -->|"routes to"| node_settingspage
node_app -->|"fetches profile"| node_api
node_authpage -->|"submits credentials"| node_api
node_txpage -->|"manages transactions"| node_api
node_familypage -->|"manages family"| node_api
node_walletpage -->|"manages wallets"| node_api
node_dashpage -->|"loads dashboard"| node_api
node_settingspage -->|"updates settings"| node_api
node_dashpage -->|"formats amounts"| node_format
node_walletpage -->|"formats dates"| node_format
node_authpage -->|"renders controls"| node_ui
node_api -.->|"sends HTTP requests"| node_http

click node_app "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/App.tsx"
click node_api "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/api.ts"
click node_ui "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/ui.tsx"
click node_format "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/format.ts"
click node_authpage "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/AuthPage.tsx"
click node_dashpage "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/DashboardPage.tsx"
click node_txpage "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/TransactionsPage.tsx"
click node_sourcepage "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/SourcesPage.tsx"
click node_walletpage "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/WalletsPage.tsx"
click node_familypage "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/FamilyPage.tsx"
click node_settingspage "https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/SettingsPage.tsx"
click node_auth "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/auth.go"
click node_familydomain "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/family.go"
click node_transactions "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/transactions.go"
click node_sources "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/sources.go"
click node_dashboard "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/dashboard.go"
click node_currency "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/currency.go"
click node_crypto "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/crypto.go"
click node_telegram "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/telegram.go"
click node_http "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/http.go"
click node_background "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/background.go"
click node_config "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/config.go"
click node_database "https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/db.go"
click node_server "https://github.com/lilfranche/finfee-public/blob/main/backend/cmd/server/main.go"

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_api,node_ui,node_format,node_authpage,node_dashpage,node_txpage,node_sourcepage,node_walletpage,node_familypage,node_settingspage toneBlue
class node_transactions,node_sources,node_dashboard,node_currency,node_crypto toneAmber
class node_auth,node_familydomain toneMint
class node_telegram,node_http,node_background,node_config,node_database,node_server toneRose
class node_user toneIndigo
```

## Components

### Web application

- [App router](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/App.tsx): `frontend/src/App.tsx`
- [JSON API client](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/api.ts): `frontend/src/api.ts`
- [Shared UI](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/ui.tsx): `frontend/src/ui.tsx`
- [Money formatting](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/format.ts): `frontend/src/format.ts`
- [Sign in and register](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/AuthPage.tsx): `frontend/src/pages/AuthPage.tsx`
- [Dashboard view](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/DashboardPage.tsx): `frontend/src/pages/DashboardPage.tsx`
- [Transactions view](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/TransactionsPage.tsx): `frontend/src/pages/TransactionsPage.tsx`
- [Accounts view](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/SourcesPage.tsx): `frontend/src/pages/SourcesPage.tsx`
- [Crypto wallets view](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/WalletsPage.tsx): `frontend/src/pages/WalletsPage.tsx`
- [Family view](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/FamilyPage.tsx): `frontend/src/pages/FamilyPage.tsx`
- [Settings view](https://github.com/lilfranche/finfee-public/blob/main/frontend/src/pages/SettingsPage.tsx): `frontend/src/pages/SettingsPage.tsx`

### Finance domain

- [Transactions](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/transactions.go): `backend/internal/app/transactions.go`
- [Accounts](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/sources.go): `backend/internal/app/sources.go`
- [Dashboard data](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/dashboard.go): `backend/internal/app/dashboard.go`
- [Currencies and rates](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/currency.go): `backend/internal/app/currency.go`
- [Wallet synchronization](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/crypto.go): `backend/internal/app/crypto.go`

### Identity and family

- [Authentication](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/auth.go): `backend/internal/app/auth.go`
- [Family membership](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/family.go): `backend/internal/app/family.go`

### Backend platform

- [Telegram bot](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/telegram.go): `backend/internal/app/telegram.go`
- [HTTP server](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/http.go): `backend/internal/app/http.go`
- [Background jobs](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/background.go): `backend/internal/app/background.go`
- [Configuration](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/config.go): `backend/internal/app/config.go`
- [Database](https://github.com/lilfranche/finfee-public/blob/main/backend/internal/app/db.go): `backend/internal/app/db.go`
- [Server entry point](https://github.com/lilfranche/finfee-public/blob/main/backend/cmd/server/main.go): `backend/cmd/server/main.go`

### Other components

- **Family member**

## Connections

- Family member → App router: uses (evidence: `frontend/src/App.tsx`)
- App router → Sign in and register: shows (evidence: `frontend/src/App.tsx`)
- App router → Dashboard view: routes to (evidence: `frontend/src/App.tsx`)
- App router → Transactions view: routes to (evidence: `frontend/src/App.tsx`)
- App router → Accounts view: routes to (evidence: `frontend/src/App.tsx`)
- App router → Crypto wallets view: routes to (evidence: `frontend/src/App.tsx`)
- App router → Family view: routes to (evidence: `frontend/src/App.tsx`)
- App router → Settings view: routes to (evidence: `frontend/src/App.tsx`)
- App router → JSON API client: fetches profile (evidence: `frontend/src/App.tsx`)
- Sign in and register → JSON API client: submits credentials (evidence: `frontend/src/pages/AuthPage.tsx`)
- Transactions view → JSON API client: manages transactions (evidence: `frontend/src/pages/TransactionsPage.tsx`)
- Family view → JSON API client: manages family (evidence: `frontend/src/pages/FamilyPage.tsx`)
- Crypto wallets view → JSON API client: manages wallets (evidence: `frontend/src/pages/WalletsPage.tsx`)
- Dashboard view → JSON API client: loads dashboard (evidence: `frontend/src/pages/DashboardPage.tsx`)
- Settings view → JSON API client: updates settings (evidence: `frontend/src/pages/SettingsPage.tsx`)
- Dashboard view → Money formatting: formats amounts (evidence: `frontend/src/pages/DashboardPage.tsx`)
- Crypto wallets view → Money formatting: formats dates (evidence: `frontend/src/pages/WalletsPage.tsx`)
- Sign in and register → Shared UI: renders controls (evidence: `frontend/src/pages/AuthPage.tsx`)
- JSON API client → HTTP server: sends HTTP requests