# akhmadov-360/weather-nuu architecture

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

- Interactive diagram: https://gitdiagram.com/akhmadov-360/weather-nuu
- Repository: https://github.com/akhmadov-360/weather-nuu

## Overview

Weather NUU is a React weather dashboard for room and street sensor data. Users enter a routed dashboard, load current and historical readings, inspect metric summaries and interactive charts, and optionally select ranges or export data. The dashboard combines REST-query state with a WebSocket update path; the socket explicitly writes readings into the same query cache. The graph also preserves documented chart selection, export, localization, and theme capabilities. Some chart/export and API internals are unsampled, so their less-certain links are omitted.

Main entry points: [`src/widgets/dashboard-layout/ui/DashboardLayout.tsx`](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/dashboard-layout/ui/DashboardLayout.tsx) (Dashboard layout), [`src/widgets/sensor-charts/ui/SensorCharts.tsx`](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/sensor-charts/ui/SensorCharts.tsx) (Sensor charts), [`src/entities/weather/api/useWeatherSocket.ts`](https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/useWeatherSocket.ts) (Weather socket), [`src/app/providers/router/router.tsx`](https://github.com/akhmadov-360/weather-nuu/blob/main/src/app/providers/router/router.tsx) (Route dispatch)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["Application shell"]
  node_app_entry["React entry<br/>[main.tsx]"]
  node_router["Route dispatch<br/>[router.tsx]"]
end

subgraph group_dashboard["Dashboard experience"]
  node_room_page["Room page"]
  node_street_page["Street page"]
  node_layout["Dashboard layout"]
  node_topbar["Top bar<br/>[TopBar.tsx]"]
  node_language["Language switcher"]
  node_summary["Weather summary<br/>[MetricCard.tsx]"]
  node_temp_card["Temperature card<br/>[TempHeroCard.tsx]"]
  node_live_streams["Live streams<br/>[LiveStreams.tsx]"]
end

subgraph group_weather["Weather data"]
  node_weather_queries["Weather queries<br/>[weather.queries.ts]"]
  node_weather_api["Weather API<br/>[weather.api.ts]"]
  node_query_cache[("Query cache")]
  node_websocket["Weather socket"]
  node_weather_model["Weather model<br/>[weather.mapper.ts]"]
  node_history_model["History append"]
end

subgraph group_analysis["Charts and export"]
  node_sensor_charts["Sensor charts<br/>[SensorCharts.tsx]"]
  node_chart_selector["Chart selector<br/>[ChartSelector.tsx]"]
  node_range_controls["Range controls"]
  node_date_picker["Date picker"]
  node_export_menu["Export menu<br/>[ExportMenu.tsx]"]
  node_export_service["Export service<br/>[weather-export.ts]"]
end

node_user(("Dashboard user"))

node_user -->|"opens dashboard"| node_app_entry
node_app_entry -->|"renders app"| node_router
node_router -->|"routes to"| node_room_page
node_router -->|"routes to"| node_street_page
node_room_page -->|"configures"| node_layout
node_street_page -->|"configures"| node_layout
node_layout -->|"loads readings"| node_weather_queries
node_layout -->|"subscribes"| node_websocket
node_weather_queries -->|"requests data"| node_weather_api
node_weather_api -.->|"provides query data"| node_query_cache
node_websocket -->|"maps updates"| node_weather_model
node_websocket -->|"writes updates"| node_query_cache
node_websocket -->|"appends history"| node_history_model
node_layout -->|"renders metrics"| node_summary
node_layout -->|"renders temperature"| node_temp_card
node_layout -->|"renders charts"| node_sensor_charts
node_layout -->|"renders navigation"| node_topbar
node_layout -->|"renders streams"| node_live_streams
node_topbar -->|"renders switcher"| node_language
node_sensor_charts -->|"renders selector"| node_chart_selector
node_sensor_charts -->|"renders ranges"| node_range_controls
node_sensor_charts -->|"renders date picker"| node_date_picker
node_sensor_charts -->|"renders export"| node_export_menu
node_export_menu -->|"exports data"| node_export_service

click node_app_entry "https://github.com/akhmadov-360/weather-nuu/blob/main/src/app/main.tsx"
click node_router "https://github.com/akhmadov-360/weather-nuu/blob/main/src/app/providers/router/router.tsx"
click node_room_page "https://github.com/akhmadov-360/weather-nuu/blob/main/src/pages/dashboard-room/ui/DashboardRoomPage.tsx"
click node_street_page "https://github.com/akhmadov-360/weather-nuu/blob/main/src/pages/dashboard-street/ui/DashboardStreetPage.tsx"
click node_layout "https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/dashboard-layout/ui/DashboardLayout.tsx"
click node_topbar "https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/topbar/ui/TopBar.tsx"
click node_language "https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/language-switcher/ui/LanguageSwitcher.tsx"
click node_summary "https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/weather-summary/ui/MetricCard.tsx"
click node_temp_card "https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/weather-summary/ui/TempHeroCard.tsx"
click node_live_streams "https://github.com/akhmadov-360/weather-nuu/blob/main/src/components/LiveStreams.tsx"
click node_weather_queries "https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/weather.queries.ts"
click node_weather_api "https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/weather.api.ts"
click node_websocket "https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/useWeatherSocket.ts"
click node_weather_model "https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/model/weather.mapper.ts"
click node_history_model "https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/model/append-history-point.ts"
click node_sensor_charts "https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/sensor-charts/ui/SensorCharts.tsx"
click node_chart_selector "https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/chart-selector/ui/ChartSelector.tsx"
click node_range_controls "https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/time-range-selector/ui/TimeRangeSelector.tsx"
click node_date_picker "https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/date-range-picker/ui/DateRangePicker.tsx"
click node_export_menu "https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/export-data/ui/ExportMenu.tsx"
click node_export_service "https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/weather-export.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_entry,node_router,node_user toneBlue
class node_room_page,node_street_page,node_layout,node_topbar,node_language,node_summary,node_temp_card,node_live_streams toneAmber
class node_weather_queries,node_weather_api,node_query_cache,node_websocket,node_weather_model,node_history_model toneMint
class node_sensor_charts,node_chart_selector,node_range_controls,node_date_picker,node_export_menu,node_export_service toneRose
```

## Components

### Application shell

- [React entry](https://github.com/akhmadov-360/weather-nuu/blob/main/src/app/main.tsx): `src/app/main.tsx`
- [Route dispatch](https://github.com/akhmadov-360/weather-nuu/blob/main/src/app/providers/router/router.tsx): `src/app/providers/router/router.tsx`

### Dashboard experience

- [Room page](https://github.com/akhmadov-360/weather-nuu/blob/main/src/pages/dashboard-room/ui/DashboardRoomPage.tsx): `src/pages/dashboard-room/ui/DashboardRoomPage.tsx`
- [Street page](https://github.com/akhmadov-360/weather-nuu/blob/main/src/pages/dashboard-street/ui/DashboardStreetPage.tsx): `src/pages/dashboard-street/ui/DashboardStreetPage.tsx`
- [Dashboard layout](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/dashboard-layout/ui/DashboardLayout.tsx): `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`
- [Top bar](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/topbar/ui/TopBar.tsx): `src/widgets/topbar/ui/TopBar.tsx`
- [Language switcher](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/language-switcher/ui/LanguageSwitcher.tsx): `src/widgets/language-switcher/ui/LanguageSwitcher.tsx`
- [Weather summary](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/weather-summary/ui/MetricCard.tsx): `src/widgets/weather-summary/ui/MetricCard.tsx`
- [Temperature card](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/weather-summary/ui/TempHeroCard.tsx): `src/widgets/weather-summary/ui/TempHeroCard.tsx`
- [Live streams](https://github.com/akhmadov-360/weather-nuu/blob/main/src/components/LiveStreams.tsx): `src/components/LiveStreams.tsx`

### Weather data

- [Weather queries](https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/weather.queries.ts): `src/entities/weather/api/weather.queries.ts`
- [Weather API](https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/weather.api.ts): `src/entities/weather/api/weather.api.ts`
- **Query cache**
- [Weather socket](https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/useWeatherSocket.ts): `src/entities/weather/api/useWeatherSocket.ts`
- [Weather model](https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/model/weather.mapper.ts): `src/entities/weather/model/weather.mapper.ts`
- [History append](https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/model/append-history-point.ts): `src/entities/weather/model/append-history-point.ts`

### Charts and export

- [Sensor charts](https://github.com/akhmadov-360/weather-nuu/blob/main/src/widgets/sensor-charts/ui/SensorCharts.tsx): `src/widgets/sensor-charts/ui/SensorCharts.tsx`
- [Chart selector](https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/chart-selector/ui/ChartSelector.tsx): `src/features/chart-selector/ui/ChartSelector.tsx`
- [Range controls](https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/time-range-selector/ui/TimeRangeSelector.tsx): `src/features/time-range-selector/ui/TimeRangeSelector.tsx`
- [Date picker](https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/date-range-picker/ui/DateRangePicker.tsx): `src/features/date-range-picker/ui/DateRangePicker.tsx`
- [Export menu](https://github.com/akhmadov-360/weather-nuu/blob/main/src/features/export-data/ui/ExportMenu.tsx): `src/features/export-data/ui/ExportMenu.tsx`
- [Export service](https://github.com/akhmadov-360/weather-nuu/blob/main/src/entities/weather/api/weather-export.ts): `src/entities/weather/api/weather-export.ts`

### Other components

- **Dashboard user**

## Connections

- Dashboard user → React entry: opens dashboard (evidence: `src/app/main.tsx`)
- React entry → Route dispatch: renders app
- Route dispatch → Room page: routes to (evidence: `src/app/providers/router/router.tsx`)
- Route dispatch → Street page: routes to (evidence: `src/app/providers/router/router.tsx`)
- Room page → Dashboard layout: configures (evidence: `src/pages/dashboard-room/ui/DashboardRoomPage.tsx`)
- Street page → Dashboard layout: configures (evidence: `src/pages/dashboard-street/ui/DashboardStreetPage.tsx`)
- Dashboard layout → Weather queries: loads readings (evidence: `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`)
- Dashboard layout → Weather socket: subscribes (evidence: `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`)
- Weather queries → Weather API: requests data (evidence: `src/entities/weather/api/weather.queries.ts`)
- Weather API → Query cache: provides query data
- Weather socket → Weather model: maps updates (evidence: `src/entities/weather/api/useWeatherSocket.ts`)
- Weather socket → Query cache: writes updates (evidence: `src/entities/weather/api/useWeatherSocket.ts`)
- Weather socket → History append: appends history (evidence: `src/entities/weather/api/useWeatherSocket.ts`)
- Dashboard layout → Weather summary: renders metrics (evidence: `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`)
- Dashboard layout → Temperature card: renders temperature (evidence: `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`)
- Dashboard layout → Sensor charts: renders charts (evidence: `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`)
- Dashboard layout → Top bar: renders navigation (evidence: `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`)
- Dashboard layout → Live streams: renders streams (evidence: `src/widgets/dashboard-layout/ui/DashboardLayout.tsx`)
- Top bar → Language switcher: renders switcher (evidence: `src/widgets/topbar/ui/TopBar.tsx`)
- Sensor charts → Chart selector: renders selector (evidence: `src/widgets/sensor-charts/ui/SensorCharts.tsx`)
- Sensor charts → Range controls: renders ranges (evidence: `src/widgets/sensor-charts/ui/SensorCharts.tsx`)
- Sensor charts → Date picker: renders date picker (evidence: `src/widgets/sensor-charts/ui/SensorCharts.tsx`)
- Sensor charts → Export menu: renders export (evidence: `src/widgets/sensor-charts/ui/SensorCharts.tsx`)
- Export menu → Export service: exports data (evidence: `src/features/export-data/ui/ExportMenu.tsx`)