# hotel-de-l-avenue/hda-frontend architecture

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

- Interactive diagram: https://gitdiagram.com/hotel-de-l-avenue/hda-frontend
- Repository: https://github.com/hotel-de-l-avenue/hda-frontend

## Overview

HDA Platform is a multi-module hospitality operations application: authenticated staff enter through a shared shell and navigate to hotel, restaurant, bar, casino, finance, client, and administration areas. The main product workflow is selecting an operational module, performing its domain work, and viewing records or reports. The tree documents additional capabilities such as reservations, housekeeping, maintenance, minibar, stock, and casino cash/identity operations. Source excerpts are partial, so only route wiring and the sampled client-hook and authentication calls are shown as explicit relationships.

Main entry points: [`src/components/MainLayout.tsx`](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/components/MainLayout.tsx) (Main layout), [`src/App.tsx`](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/App.tsx) (App routing), [`src/components/ProtectedRoute.tsx`](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/components/ProtectedRoute.tsx) (Access control), [`src/lib/api.ts`](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/lib/api.ts) (HTTP client)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_shell["Application shell"]
  node_app["App routing<br/>[App.tsx]"]
  node_protection["Access control<br/>[ProtectedRoute.tsx]"]
  node_layout["Main layout<br/>[MainLayout.tsx]"]
end

subgraph group_hospitality["Hospitality operations"]
  node_hotel["Hotel operations<br/>[HotelPage.tsx]"]
  node_lodging["Lodging operations"]
end

subgraph group_venue["Venue operations"]
  node_restaurant["Restaurant<br/>[RestaurantPage.tsx]"]
  node_bar["Bar service<br/>[BarPage.tsx]"]
  node_alcohol["Alcohol stock<br/>[AlcoholPage.tsx]"]
  node_casino["Casino operations<br/>[CasinoPage.tsx]"]
end

subgraph group_business["Business administration"]
  node_finances["Finance management<br/>[FinancesPage.tsx]"]
  node_clients["Client management<br/>[ClientsPage.tsx]"]
  node_dashboard["Dashboard<br/>[Dashboard.tsx]"]
  node_people["People operations<br/>[RHPage.tsx]"]
  node_users["User administration"]
  node_settings["Settings and profile<br/>[SettingsPage.tsx]"]
end

subgraph group_services["Shared services"]
  node_clienthook["Client data hook<br/>[useClients.ts]"]
  node_clientservice["Client service<br/>[client.service.ts]"]
  node_authservice["Authentication service<br/>[authService.ts]"]
  node_http["HTTP client<br/>[api.ts]"]
end

node_staff(("Staff user"))
node_backend[("Application backend")]

node_staff -->|"uses"| node_app
node_app -->|"routes through"| node_protection
node_protection -->|"renders protected"| node_layout
node_layout -->|"routes to"| node_hotel
node_layout -->|"routes to"| node_restaurant
node_layout -->|"routes to"| node_bar
node_layout -->|"routes to"| node_alcohol
node_layout -->|"routes to"| node_casino
node_layout -->|"routes to"| node_finances
node_layout -->|"routes to"| node_clients
node_layout -->|"routes to"| node_dashboard
node_layout -->|"routes to"| node_people
node_layout -->|"routes to"| node_users
node_layout -->|"routes to"| node_settings
node_clienthook -->|"calls"| node_clientservice
node_authservice -->|"sends requests"| node_http
node_http -->|"exchanges data"| node_backend

click node_app "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/App.tsx"
click node_protection "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/components/ProtectedRoute.tsx"
click node_layout "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/components/MainLayout.tsx"
click node_hotel "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/HotelPage.tsx"
click node_lodging "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/HebergementPage.tsx"
click node_restaurant "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/RestaurantPage.tsx"
click node_bar "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/BarPage.tsx"
click node_alcohol "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/AlcoholPage.tsx"
click node_casino "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/CasinoPage.tsx"
click node_finances "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/FinancesPage.tsx"
click node_clients "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/ClientsPage.tsx"
click node_dashboard "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/Dashboard.tsx"
click node_people "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/RHPage.tsx"
click node_users "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/UtilisateursPage.tsx"
click node_settings "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/SettingsPage.tsx"
click node_clienthook "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/hooks/useClients.ts"
click node_clientservice "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/services/client.service.ts"
click node_authservice "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/services/authService.ts"
click node_http "https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/lib/api.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_protection,node_layout,node_staff toneBlue
class node_hotel,node_lodging,node_backend toneAmber
class node_restaurant,node_bar,node_alcohol,node_casino toneMint
class node_finances,node_clients,node_dashboard,node_people,node_users,node_settings toneRose
class node_clienthook,node_clientservice,node_authservice,node_http toneIndigo
```

## Components

### Application shell

- [App routing](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/App.tsx): `src/App.tsx`
- [Access control](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/components/ProtectedRoute.tsx): `src/components/ProtectedRoute.tsx`
- [Main layout](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/components/MainLayout.tsx): `src/components/MainLayout.tsx`

### Hospitality operations

- [Hotel operations](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/HotelPage.tsx): `src/pages/HotelPage.tsx`
- [Lodging operations](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/HebergementPage.tsx): `src/pages/HebergementPage.tsx`

### Venue operations

- [Restaurant](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/RestaurantPage.tsx): `src/pages/RestaurantPage.tsx`
- [Bar service](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/BarPage.tsx): `src/pages/BarPage.tsx`
- [Alcohol stock](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/AlcoholPage.tsx): `src/pages/AlcoholPage.tsx`
- [Casino operations](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/CasinoPage.tsx): `src/pages/CasinoPage.tsx`

### Business administration

- [Finance management](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/FinancesPage.tsx): `src/pages/FinancesPage.tsx`
- [Client management](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/ClientsPage.tsx): `src/pages/ClientsPage.tsx`
- [Dashboard](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/Dashboard.tsx): `src/pages/Dashboard.tsx`
- [People operations](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/RHPage.tsx): `src/pages/RHPage.tsx`
- [User administration](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/UtilisateursPage.tsx): `src/pages/UtilisateursPage.tsx`
- [Settings and profile](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/pages/SettingsPage.tsx): `src/pages/SettingsPage.tsx`

### Shared services

- [Client data hook](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/hooks/useClients.ts): `src/hooks/useClients.ts`
- [Client service](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/services/client.service.ts): `src/services/client.service.ts`
- [Authentication service](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/services/authService.ts): `src/services/authService.ts`
- [HTTP client](https://github.com/hotel-de-l-avenue/hda-frontend/blob/main/src/lib/api.ts): `src/lib/api.ts`

### Other components

- **Staff user**
- **Application backend**

## Connections

- Staff user → App routing: uses
- App routing → Access control: routes through
- Access control → Main layout: renders protected
- Main layout → Hotel operations: routes to
- Main layout → Restaurant: routes to
- Main layout → Bar service: routes to
- Main layout → Alcohol stock: routes to
- Main layout → Casino operations: routes to
- Main layout → Finance management: routes to
- Main layout → Client management: routes to
- Main layout → Dashboard: routes to
- Main layout → People operations: routes to
- Main layout → User administration: routes to
- Main layout → Settings and profile: routes to
- Client data hook → Client service: calls
- Authentication service → HTTP client: sends requests
- HTTP client → Application backend: exchanges data