# analogInputsHistoryReduxFlow.md

## Flussdiagramm: Redux-Datenfluss der historischen analogen Eingänge

```mermaid
flowchart TD

Component["React-Komponente: AnalogInputsChart"] --> DispatchThunk["dispatch → fetchAnalogInputsHistoryThunk"]
DispatchThunk --> ThunkLogik["Thunk-Logik"]
ThunkLogik --> fetchService["fetchAnalogInputsHistoryService"]

fetchService -->|DEV| APIHandler["/api/cpl/fetchAnalogInputsHistory"]
fetchService -->|PROD| CPLWebserver["CPL: DIA0-Endpunkt"]

APIHandler --> DatenMock["Mockdaten geladen"]
CPLWebserver --> DatenLive["Live-Daten geladen"]

DatenMock --> Fulfilled["fulfilled → Redux aktualisieren"]
DatenLive --> Fulfilled["fulfilled → Redux aktualisieren"]

Fulfilled --> Slice["analogInputsHistorySlice speichert"]
Slice --> Update["Chart.js aktualisiert sich"]


```

---

## Erklärung:

- Die Komponente dispatcht den Thunk beim Laden.
- Der Service entscheidet, ob Mock-Daten oder Live-Daten geholt werden.
- Das Redux-Slice speichert die Daten zentral im State.
- Sobald die Daten da sind, aktualisiert sich das Chart automatisch.

---

**Stand:** 29.04.2025  
**Projekt:** CPLv4.0 Weboberfläche