docs: vollständige Redux-Slices und Webservice-APIs dokumentiert (v1.1.100)

CHANGELOG.md

@@ -4,6 +4,28 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie
 
 ---
 
+## [1.1.100] – 2025-05-19
+
+### Added
+
+- ✅ Vollständige Redux-Dokumentation erstellt:
+  - Alle aktiven Redux-Slices als `.md`-Dateien dokumentiert
+  - Struktur: `docs/frontend/redux/slices/`
+  - API-Funktionen in `docs/frontend/redux/api/fromWebService/`
+- 🌐 Neue Markdown-Dateien u. a. für:
+  - `poiTypesSlice`, `urlParameterSlice`, `zoomTriggerSlice`
+  - `gisStationsStaticSlice`, `gisSystemStaticSlice`, ...
+  - `polylineLayerVisibleSlice`, `polylineContextMenuSlice`, ...
+- Jede Datei enthält:
+  - Initialzustand, Aktionen, Beispielverwendung, Pfadreferenz
+
+### Changed
+
+- `README.md`: Hinweis auf neue Dokumentationsstruktur ergänzt
+- `CHANGELOG.md`: Neuer Abschnitt für Version 1.1.100 eingefügt
+
+---
+
 ## [1.1.98] – 2025-05-19
 
 ### Changed

config/appVersion.js

@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.99";
+export const APP_VERSION = "1.1.101";

docs/frontend/redux/api/fromDB/fetchLocationDevices.md

@@ -0,0 +1,70 @@
+# 🌐 fetchLocationDevices
+
+Diese Funktion lädt alle Geräte für einen bestimmten Standort aus der Datenbank via API-Endpunkt.
+
+---
+
+## 📍 Pfad
+
+```
+/redux/api/fromDB/fetchLocationDevices.js
+```
+
+---
+
+## 📥 Funktion
+
+```ts
+export const fetchLocationDevices = async () => {
+  const response = await fetch("/api/talas_v5_DB/locationDevice/locationDevices");
+  if (!response.ok) {
+    throw new Error("Geräteliste konnte nicht geladen werden");
+  }
+  return await response.json();
+};
+```
+
+---
+
+## 📡 API-Endpunkt
+
+```http
+GET /api/talas_v5_DB/locationDevice/locationDevices
+```
+
+Dieser Endpunkt liefert eine JSON-Liste aller Geräte eines Standorts (z. B. für Map-Rendering, POI-Anzeige, Standortübersicht etc.).
+
+---
+
+## 🧪 Fehlerbehandlung
+
+Falls der Request fehlschlägt (z. B. Statuscode ≠ 2xx), wird folgender Fehler ausgelöst:
+
+```
+"Geräteliste konnte nicht geladen werden"
+```
+
+Dies kann im Redux-Slice über den `.rejected`-Case ausgewertet werden.
+
+---
+
+## 🧩 Verwendung
+
+```ts
+import { fetchLocationDevices } from "@/redux/api/fromDB/fetchLocationDevices";
+
+const result = await fetchLocationDevices();
+console.log(result); // Erwartet: Array von Geräteobjekten
+```
+
+Diese Funktion wird typischerweise im Redux-Thunk `fetchLocationDevicesFromDB` verwendet:
+```ts
+const data = await fetchLocationDevices();
+```
+
+---
+
+## 🔄 Zusammenhang
+
+- Eingebunden in: [`locationDevicesFromDBSlice.js`](./locationDevicesFromDBSlice.md)
+- Redux Thunk: `fetchLocationDevicesFromDB`

docs/frontend/redux/slices/addPoiOnPolylineSlice.md

@@ -0,0 +1,17 @@
+# ➕ addPoiOnPolylineSlice
+
+Verwaltet den Status für das Hinzufügen eines POIs auf einer bestehenden Polyline.
+
+## 🔧 Zustand
+
+```ts
+{
+  isOpen: false,
+  latlng: null
+}
+```
+
+## 🎯 Aktionen
+
+- `openAddPoiOnPolylineModal(latlng)` – öffnet das Modal mit Koordinaten
+- `closeAddPoiOnPolylineModal()` – schließt das Modal

docs/frontend/redux/slices/currentPoiSlice.md

@@ -0,0 +1,22 @@
+# 📍 currentPoiSlice
+
+Verwaltet den aktuell ausgewählten POI (z. B. für Bearbeitung oder Anzeige im Modal).
+
+## 🔧 Zustand
+
+```ts
+{
+  currentPoi: null
+}
+```
+
+## 🎯 Aktionen
+
+- `setCurrentPoi(poi)` – setzt den aktiven POI
+- `clearCurrentPoi()` – löscht aktuellen POI
+
+## 🔎 Selector
+
+```ts
+selectCurrentPoi = (state) => state.currentPoi.currentPoi;
+```

docs/frontend/redux/slices/db/locationDevicesFromDBSlice.md

@@ -0,0 +1,103 @@
+# 📦 locationDevicesFromDBSlice
+
+Zuständig für das Laden und Speichern der Geräteinformationen pro Standort (Location) aus der Datenbank.
+
+## 🧠 Zweck
+
+Dieses Slice verwaltet die Geräte, die mit einem bestimmten Standort (Location) verknüpft sind.  
+Es nutzt ein `createAsyncThunk`, um die Daten vom Webservice bzw. von der lokalen Datenbank zu laden.
+
+---
+
+## 🔁 Datenfluss
+
+1. **Dispatch `fetchLocationDevicesFromDB()`**
+2. **Daten werden über `fetchLocationDevices()` geladen**
+3. **Status wird aktualisiert (`loading`, `succeeded`, `failed`)**
+4. **Geräte-Liste (`devices`) wird gespeichert**
+
+---
+
+## 🧩 Slice-Definition
+
+```js
+initialState: {
+  devices: [],        // Geräte-Liste pro Standort
+  status: "idle",     // "idle" | "loading" | "succeeded" | "failed"
+  error: null         // Fehlernachricht im Fehlerfall
+}
+```
+
+---
+
+## 🔧 Actions
+
+| Action Type                                | Beschreibung                                    |
+|--------------------------------------------|--------------------------------------------------|
+| `fetchLocationDevicesFromDB/pending`       | Startet den Ladeprozess                         |
+| `fetchLocationDevicesFromDB/fulfilled`     | Speichert die empfangenen Geräte in `devices`  |
+| `fetchLocationDevicesFromDB/rejected`      | Speichert die Fehlermeldung in `error`         |
+
+---
+
+## 📥 Async Thunk
+
+```ts
+export const fetchLocationDevicesFromDB = createAsyncThunk(
+  "locationDevicesFromDB/fetchLocationDevicesFromDB",
+  async () => {
+    return fetchLocationDevices(); // API-Aufruf aus services/api
+  }
+);
+```
+
+Die Funktion `fetchLocationDevices()` befindet sich unter:
+
+```
+/redux/api/fromDB/fetchLocationDevices.js
+```
+
+---
+
+## 🧪 Verwendung in Komponenten
+
+### Beispiel mit `useSelector` & `useDispatch`
+
+```tsx
+import { useSelector, useDispatch } from "react-redux";
+import { fetchLocationDevicesFromDB } from "@/redux/slices/db/locationDevicesFromDBSlice";
+
+const dispatch = useDispatch();
+const devices = useSelector((state) => state.locationDevicesFromDB.devices);
+const status = useSelector((state) => state.locationDevicesFromDB.status);
+
+useEffect(() => {
+  dispatch(fetchLocationDevicesFromDB());
+}, []);
+```
+
+---
+
+## 🧩 Integration im Store
+
+```ts
+import locationDevicesFromDBReducer from "./slices/db/locationDevicesFromDBSlice";
+
+export const store = configureStore({
+  reducer: {
+    locationDevicesFromDB: locationDevicesFromDBReducer,
+    // weitere Slices ...
+  },
+});
+```
+
+---
+
+## 📌 Hinweis
+
+Dieses Slice ist Bestandteil der neuen Redux-Architektur (ehemals Recoil)  
+→ siehe auch `CHANGELOG.md` Version `1.1.97` bis `1.1.98`.
+
+```
+Pfad: /redux/slices/db/locationDevicesFromDBSlice.js
+```

docs/frontend/redux/slices/db/poiTypesSlice.md

@@ -0,0 +1,93 @@
+# 🧭 poiTypesSlice
+
+Verwaltet die Point-of-Interest (POI) Typen, die vom Server bereitgestellt werden – z. B. für die Darstellung von Symbolen oder Layer-Kategorien in der Karte.
+
+---
+
+## 📍 Datei
+
+```
+/redux/slices/db/poiTypesSlice.js
+```
+
+---
+
+## 📦 Initialer State
+
+```ts
+{
+  data: [],       // Liste der POI-Typen
+  status: "idle"  // Ladezustand: "idle" | "loading" | "succeeded" | "failed"
+}
+```
+
+---
+
+## ⚙️ Async Thunk: `fetchPoiTypes`
+
+```ts
+export const fetchPoiTypes = createAsyncThunk("poiTypes/fetchPoiTypes", async () => {
+  let API_BASE_URL = "";
+
+  if (typeof window !== "undefined") {
+    API_BASE_URL = `${window.location.protocol}//${window.location.hostname}:3000`;
+  } else {
+    API_BASE_URL = "http://localhost:3000";
+  }
+
+  const response = await fetch(`${API_BASE_URL}/api/talas_v5_DB/poiTyp/readPoiTyp`);
+  return await response.json();
+});
+```
+
+---
+
+## 🔁 Lifecycle im Slice
+
+| Zustand            | Beschreibung                         |
+|--------------------|--------------------------------------|
+| `pending`          | Setzt `status = "loading"`           |
+| `fulfilled`        | Speichert `payload` in `state.data` und setzt `status = "succeeded"` |
+| `rejected`         | Setzt `status = "failed"`            |
+
+---
+
+## 🧪 Verwendung im Component
+
+```tsx
+import { useSelector, useDispatch } from "react-redux";
+import { fetchPoiTypes } from "@/redux/slices/db/poiTypesSlice";
+
+const dispatch = useDispatch();
+const poiTypes = useSelector((state) => state.poiTypes.data);
+const status = useSelector((state) => state.poiTypes.status);
+
+useEffect(() => {
+  dispatch(fetchPoiTypes());
+}, []);
+```
+
+---
+
+## 🧩 Store Integration
+
+```ts
+import poiTypesReducer from "./slices/db/poiTypesSlice";
+
+export const store = configureStore({
+  reducer: {
+    poiTypes: poiTypesReducer,
+    // weitere ...
+  },
+});
+```
+
+---
+
+## 🌐 API-Endpunkt
+
+```http
+GET /api/talas_v5_DB/poiTyp/readPoiTyp
+```
+
+Erwartet JSON-Antwort mit allen verfügbaren POI-Typen für die App.

docs/frontend/redux/slices/lineVisibilitySlice.md

@@ -0,0 +1,16 @@
+# 📶 lineVisibilitySlice
+
+Speichert, welche Linien (Kabelstrecken) aktiv sichtbar sind.
+
+## 🔧 Zustand
+
+```ts
+{
+  activeLines: { [idLD]: true | false }
+}
+```
+
+## 🎯 Aktionen
+
+- `updateLineStatus({ idLD, active })`
+- `setActiveLines({...})`

docs/frontend/redux/slices/mapLayersSlice.md

@@ -0,0 +1,18 @@
+# 🗺️ mapLayersSlice
+
+Verwaltet Sichtbarkeit der verschiedenen Map-Layer pro System (TALAS, ECI, GMA usw.).
+
+## 🔧 Zustand
+
+```ts
+{
+  TALAS: true,
+  ECI: true,
+  ...
+}
+```
+
+## 🎯 Aktionen
+
+- `toggleLayer(layerName)`
+- `setLayerVisibility({ layer, visibility })`

docs/frontend/redux/slices/poiLayerVisibleSlice.md

@@ -0,0 +1,16 @@
+# 👁️ poiLayerVisibleSlice
+
+Steuert, ob der POI-Layer auf der Karte angezeigt wird.
+
+## 🔧 Zustand
+
+```ts
+{
+  visible: true
+}
+```
+
+## 🎯 Aktionen
+
+- `setVisible(true|false)`
+- `toggleVisible()`

docs/frontend/redux/slices/poiReadFromDbTriggerSlice.md

@@ -0,0 +1,16 @@
+# 🔄 poiReadFromDbTriggerSlice
+
+Verwaltet einen Trigger, um POIs aus der DB neu zu laden.
+
+## 🔧 Zustand
+
+```ts
+{
+  trigger: 0
+}
+```
+
+## 🎯 Aktionen
+
+- `incrementTrigger()` – erhöht den Wert (z. B. um useEffect auszulösen)
+- `resetTrigger()` – setzt auf 0 zurück

docs/frontend/redux/slices/polylineContextMenuSlice.md

@@ -0,0 +1,23 @@
+# 📋 polylineContextMenuSlice
+
+Verwaltet das Kontextmenü für Polylinien (z. B. für Aktionen wie POI einfügen).
+
+## 🔧 Zustand
+
+```ts
+{
+  isOpen: false,
+  position: { lat, lng },
+  forceClose: false,
+  timerStart: null,
+  countdown: 20,
+  countdownActive: false
+}
+```
+
+## 🎯 Aktionen
+
+- `openPolylineContextMenu(position)`
+- `closePolylineContextMenu()`
+- `updateCountdown()`
+- `forceCloseContextMenu()`

docs/frontend/redux/slices/polylineEventsDisabledSlice.md

@@ -0,0 +1,16 @@
+# 🚫 polylineEventsDisabledSlice
+
+Steuert, ob Events auf Polylinien (z. B. Klicks) deaktiviert sind.
+
+## 🔧 Zustand
+
+```ts
+{
+  disabled: false
+}
+```
+
+## 🎯 Aktionen
+
+- `setDisabled(true|false)`
+- `toggleDisabled()`

docs/frontend/redux/slices/polylineLayerVisibleSlice.md

@@ -0,0 +1,15 @@
+# 📏 polylineLayerVisibleSlice
+
+Steuert, ob der Layer mit Kabelstrecken (Polylinien) angezeigt wird.
+
+## 🔧 Zustand
+
+```ts
+{
+  visible: false
+}
+```
+
+## 🎯 Aktionen
+
+- `setPolylineVisible(true|false)` → speichert Zustand auch in `localStorage`

docs/frontend/redux/slices/readPoiMarkersStoreSlice.md

@@ -0,0 +1,16 @@
+# 📌 readPoiMarkersStoreSlice
+
+Enthält alle POI-Marker, die von der Datenbank gelesen wurden.
+
+## 🔧 Zustand
+
+```ts
+{
+  poiMarkers: []
+}
+```
+
+## 🎯 Aktionen
+
+- `setPoiMarkers(array)`
+- `clearPoiMarkers()`

docs/frontend/redux/slices/selectedDeviceSlice.md

@@ -0,0 +1,14 @@
+# 🔧 selectedDeviceSlice
+
+Speichert das aktuell ausgewählte Gerät (z. B. für Detailanzeige, Popup oder Bearbeitung).
+
+## 🔧 Zustand
+
+```ts
+null | { ...deviceData }
+```
+
+## 🎯 Aktionen
+
+- `setSelectedDevice(device)`
+- `clearSelectedDevice()`

docs/frontend/redux/slices/selectedPoiSlice.md

@@ -0,0 +1,14 @@
+# 📍 selectedPoiSlice
+
+Speichert den aktuell ausgewählten POI (z. B. für Detailanzeige, Update oder Modal-Interaktion).
+
+## 🔧 Zustand
+
+```ts
+null | { ...poiData }
+```
+
+## 🎯 Aktionen
+
+- `setSelectedPoi(poi)`
+- `clearSelectedPoi()`

docs/frontend/redux/slices/urlParameterSlice.md

@@ -0,0 +1,18 @@
+# 🌐 urlParameterSlice
+
+Verwaltet `mapId` und `userId`, die aus der URL gelesen werden.
+
+## 🔧 Zustand
+
+```ts
+{
+  mapId: null | string,
+  userId: null | string
+}
+```
+
+## 🎯 Aktionen
+
+- `setMapId(id)`
+- `setUserId(id)`
+- `setFromURL({ m, u })` – gleichzeitig beide setzen aus URL-Params

docs/frontend/redux/slices/webService/gisStationsMeasurementsSlice.md

@@ -0,0 +1,26 @@
+# 📈 gisStationsMeasurementsSlice
+
+Verwaltet Messdaten für GIS-Stationen, z. B. Spannungen, Strom, Sensorwerte etc.
+
+## 🔧 Pfad
+`/redux/slices/webService/gisStationsMeasurementsSlice.js`
+
+## 📦 Initial State
+
+```ts
+{
+  data: [],
+  status: "idle",
+  error: null
+}
+```
+
+## 🔁 Thunk: `fetchGisStationsMeasurementsFromWebService`
+
+Verwendet `fetchGisStationsMeasurements()` als API-Quelle.
+
+## 📊 Selector
+
+```ts
+selectGisStationsMeasurements = (state) => state.gisStationsMeasurements.data;
+```

docs/frontend/redux/slices/webService/gisStationsStaticDistrictSlice.md

@@ -0,0 +1,18 @@
+# 🏙️ gisStationsStaticDistrictSlice
+
+Verwaltet statische Daten für GIS-Bezirksstationen.
+
+## 🔧 Pfad
+`/redux/slices/webService/gisStationsStaticDistrictSlice.js`
+
+## 📦 Initial State
+
+```ts
+{
+  data: [],
+  status: "idle",
+  error: null
+}
+```
+
+## 🔁 Thunk: `fetchGisStationsStaticDistrictFromWebService`

docs/frontend/redux/slices/webService/gisStationsStaticSlice.md

@@ -1,92 +1,26 @@
-# Redux Slice Dokumentation: `gisStationsStaticSlice.js`
+# 🛰️ gisStationsStaticSlice
 
-## Zweck
+Verwaltet statische Informationen zu GIS-Stationen – z. B. für das Dropdown im DataSheet-Bereich.
-Dieses Slice verwaltet die Daten für **GisStationsStatic**, welche statische Standorte (z. B. Bereiche oder Stationen) für die Kartenanwendung darstellen. Diese Daten werden im `DataSheet.js` Dropdown-Menü verwendet, um auswählbare Stationen darzustellen.
 
----
+## 🔧 Pfad
+`/redux/slices/webService/gisStationsStaticSlice.js`
 
-## Speicherort
+## 📦 Initial State
-```
-/redux/slices/webService/gisStationsStaticSlice.js
-```
 
----
+```ts
-
-## Zustandsstruktur (`initialState`)
-```js
 {
-  data: null,         // enthält die API-Datenstruktur (z. B. { Points: [...] })
+  data: null,
-  status: "idle",     // "idle" | "loading" | "succeeded" | "failed"
+  status: "idle",
-  error: null         // Fehlernachricht bei einem API-Fehler
+  error: null
 }
 ```
 
----
+## 🔁 Thunk: `fetchGisStationsStatic`
 
-## Enthaltene Funktionen
+Lädt Daten über dynamisch erzeugte URL (`idMap` aus `window.location.search`).
 
-### 1. `fetchGisStationsStatic`
+## 🧪 Logging
-Ein `createAsyncThunk`, der die GIS-Daten vom Webservice lädt.
 
-```js
+```ts
-export const fetchGisStationsStatic = createAsyncThunk(
+console.log("📡 API Request URL in redux slice:", url);
-  "gisStationsStatic/fetchGisStationsStatic",
+```
-  async (_, { rejectWithValue }) => { ... }
-);
-```
-
-- Die URL wird dynamisch aus `window.location.protocol`, `window.location.hostname` und Port 80 zusammengesetzt.
-- `idMap` wird aus der aktuellen URL gelesen (`?m=...`).
-- Es wird erwartet, dass der Webservice JSON im Format `{ Points: [...] }` zurückliefert.
-
-### 2. `gisStationsStaticSlice`
-Das eigentliche Redux-Slice mit `createSlice`:
-
-- Behandelt `pending`, `fulfilled`, `rejected` für `fetchGisStationsStatic`
-- Speichert den Ladezustand und die API-Antwort
-
-### 3. `selectGisStationsStatic`
-Selector zum Zugriff auf `state.gisStationsStatic.data`.
-
-```js
-export const selectGisStationsStatic = (state) => state.gisStationsStatic.data;
-```
-
----
-
-## API-Endpunkt
-Der folgende Endpunkt wird aufgerufen:
-
-```
-http://<hostname>:80/talas5/ClientData/WebServiceMap.asmx/GisStationsStatic?idMap=<id>
-```
-
-Dabei wird `idMap` dynamisch aus der aktuellen Browser-URL geholt.
-
----
-
-## Verwendungsbeispiel
-Wird z. B. in `DataSheet.js` verwendet, um die Dropdown-Auswahl zu befüllen:
-
-```js
-const GisStationsStatic = useSelector(selectGisStationsStatic) || [];
-```
-
----
-
-## Besonderheiten
-- Der API-Port ist **hart auf 80 gesetzt**, da der Webservice sowohl in Dev- als auch Prod-Umgebung darüber erreichbar ist.
-- Eine Browser-basierte URL-Analyse (`window.location`) bestimmt dynamisch den Host.
-- Fehler werden über `rejectWithValue` zurückgegeben und im Slice gespeichert.
-
----
-
-## Verknüpfte Komponenten
-- `DataSheet.js`
-- `useMapComponentState.js`
-- Webservice: `WebServiceMap.asmx`
-
----
-
-## Ziel für Dokumentation
-Empfohlener Pfad: `/docs/gisStationsStaticSlice.md`

docs/frontend/redux/slices/webService/gisStationsStatusDistrictSlice.md

@@ -0,0 +1,18 @@
+# 📶 gisStationsStatusDistrictSlice
+
+Verwaltet Statusinformationen für GIS-Bezirksstationen (z. B. online/offline, Fehlerstatus).
+
+## 🔧 Pfad
+`/redux/slices/webService/gisStationsStatusDistrictSlice.js`
+
+## 📦 Initial State
+
+```ts
+{
+  data: [],
+  status: "idle",
+  error: null
+}
+```
+
+## 🔁 Thunk: `fetchGisStationsStatusDistrictFromWebService`

docs/frontend/redux/slices/webService/gisSystemStaticSlice.md

@@ -0,0 +1,25 @@
+# 🧭 gisSystemStaticSlice
+
+Verwaltet statische GIS-Systemdaten (`Systems[]`), die vom Server zurückgegeben werden.
+
+## 🔧 Pfad
+`/redux/slices/webService/gisSystemStaticSlice.js`
+
+## 📦 Initial State
+
+```ts
+{
+  data: [],       // enthält Systems[]
+  status: "idle", // Ladezustand
+  error: null
+}
+```
+
+## 🔁 Thunk: `fetchGisSystemStaticFromWebService`
+
+Ruft `fetchGisSystemStatic()` auf und speichert nur das Feld `Systems` im Redux-State.
+
+## 🧩 Aktionen
+
+- `setGisSystemStatic(data)` → manuelles Setzen von `Systems[]`
+- `fulfilled` → speichert Systems[]

docs/frontend/redux/slices/zoomTriggerSlice.md

@@ -0,0 +1,16 @@
+# 🔍 zoomTriggerSlice
+
+Löst ein Neuzeichnen oder eine Zoom-Interaktion aus.
+
+## 🔧 Zustand
+
+```ts
+{
+  trigger: 0
+}
+```
+
+## 🎯 Aktionen
+
+- `incrementZoomTrigger()` – erhöht Trigger-Zähler (z. B. zur Synchronisation)
+- `resetZoomTrigger()` – setzt Trigger zurück