refactor(hooks): useMapComponentState vollständig auf Redux umgestellt

- fetch-Aufrufe entfernt und durch Redux-Selektoren ersetzt
- poiTypData über poiTypSlice + fetchPoiTypThunk geladen
- locationDeviceData über gisStationsStaticDistrictThunk
- priorityConfig über Redux mit fetchPriorityConfigThunk integriert
- poiLayerVisible direkt aus Redux-State gelesen
- Version auf 1.1.173 erhöht
This commit is contained in:
ISA
2025-05-26 11:42:11 +02:00
parent 03a1f480e0
commit bbca980b5b
4 changed files with 68 additions and 52 deletions

View File

@@ -4,6 +4,41 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie
---
[1.1.173] 2025-05-26
♻️ Refactor
useMapComponentState.js vollständig auf Redux umgestellt:
Entfernt: lokale fetch(...)-Aufrufe
Redux-Integration für:
poiTypData → über poiTypSlice + fetchPoiTypThunk
locationDeviceData → über gisStationsStaticDistrictSlice + fetchGisStationsStaticDistrictThunk
priorityConfig → über priorityConfigSlice + fetchPriorityConfigThunk
poiLayerVisible → direkter Zugriff über Redux-Zustand
🧠 Architektur
useMapComponentState.js ist jetzt rein selektorbasiert
Standardstruktur Service → Thunk → Slice vollständig eingehalten
Komponente reagiert nur noch auf Redux-Status (z.B. poiTypStatus === "succeeded")
✅ Cleanup
useState() für priorityConfig und locationDeviceData entfernt
deviceName wird direkt aus Redux-Daten abgeleitet
Selektor für poiLayerVisible wird direkt inline verwendet
🔧 Version
📦 Version erhöht auf 1.1.173
---
## [1.1.166] 2025-05-25
### 🐞 Fixed

View File

@@ -48,7 +48,7 @@ import { setCurrentPoi } from "../../redux/slices/database/pois/currentPoiSlice.
import { selectGisLines } from "../../redux/slices/database/polylines/gisLinesSlice";
import { selectGisLinesStatus } from "../../redux/slices/webservice/gisLinesStatusSlice";
import { selectPoiTypData, selectPoiTypStatus } from "../../redux/slices/database/pois/poiTypSlice";
import { selectPriorityConfig } from "../../redux/slices/database/priorityConfigSlice";
import { selectPriorityConfig } from "../../redux/slices/database/priorityConfigSlice.js";
import { selectPoiIconsData, selectPoiIconsStatus } from "../../redux/slices/database/pois/poiIconsDataSlice";
import { selectGisLinesStatusFromWebservice } from "../../redux/slices/webservice/gisLinesStatusSlice";
import { selectGisUserRightsFromWebservice } from "../../redux/slices/webservice/userRightsSlice";
@@ -62,7 +62,7 @@ import { fetchGisSystemStaticThunk } from "../../redux/thunks/webservice/fetchGi
import { fetchGisStationsStaticDistrictThunk } from "../../redux/thunks/webservice/fetchGisStationsStaticDistrictThunk";
import { fetchGisStationsStatusDistrictThunk } from "../../redux/thunks/webservice/fetchGisStationsStatusDistrictThunk";
import { fetchLocationDevicesThunk } from "../../redux/thunks/database/fetchLocationDevicesThunk";
import { fetchPriorityConfigThunk } from "../../redux/thunks/database/fetchPriorityConfigThunk";
import { fetchPriorityConfigThunk } from "../../redux/thunks/database/fetchPriorityConfigThunk.js";
import { fetchGisLinesThunk } from "../../redux/thunks/database/polylines/fetchGisLinesThunk.js";
import { fetchGisLinesStatusThunk } from "../../redux/thunks/webservice/fetchGisLinesStatusThunk";
import { fetchUserRightsThunk } from "../../redux/thunks/webservice/fetchUserRightsThunk";

View File

@@ -1,2 +1,2 @@
// /config/appVersion
export const APP_VERSION = "1.1.173";
export const APP_VERSION = "1.1.174";

View File

@@ -1,84 +1,65 @@
// /hooks/useMapComponentState.js
import { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
// Redux: POI-Typen
import { fetchPoiTypThunk } from "../redux/thunks/database/pois/fetchPoiTypThunk";
import { selectPoiTypData, selectPoiTypStatus } from "../redux/slices/database/pois/poiTypSlice";
import { selectPoiLayerVisible } from "../redux/slices/database/pois/poiLayerVisibleSlice";
// Redux: GIS Geräte
import { fetchGisStationsStaticDistrictThunk } from "../redux/thunks/webservice/fetchGisStationsStaticDistrictThunk";
import { selectGisStationsStaticDistrict } from "../redux/slices/webservice/gisStationsStaticDistrictSlice";
// Redux: priorityConfig
import { fetchPriorityConfigThunk } from "../redux/thunks/database/fetchPriorityConfigThunk";
import { selectPriorityConfig } from "../redux/slices/database/priorityConfigSlice";
export const useMapComponentState = () => {
const dispatch = useDispatch();
// Redux: Sichtbarkeit des POI-Layers
const poiLayerVisible = useSelector((state) => state.poiLayerVisible.visible);
// Redux: POI-Typen
const poiTypData = useSelector(selectPoiTypData);
const poiTypStatus = useSelector(selectPoiTypStatus);
// Redux: Sichtbarkeit des POI-Layers
const poiLayerVisible = useSelector((state) => state.poiLayerVisible.visible);
// Redux: Geräte
const locationDeviceData = useSelector(selectGisStationsStaticDistrict);
const deviceName = locationDeviceData?.Points?.[0]?.LD_Name || "";
// Lokaler State: Geräte und Kontextmenü
const [deviceName, setDeviceName] = useState("");
const [locationDeviceData, setLocationDeviceData] = useState([]);
const [priorityConfig, setPriorityConfig] = useState([]); // TODO: Redux
// Redux: Prioritätskonfiguration
const priorityConfig = useSelector(selectPriorityConfig);
// UI-interner Zustand
const [menuItemAdded, setMenuItemAdded] = useState(false);
// Optional: Nur im Mock-Modus POI-Typen lokal setzen
// POI-Typen laden
useEffect(() => {
if (process.env.NEXT_PUBLIC_USE_MOCK_API === "true") {
const mockData = [
{ idPoiTyp: 1, name: "Mock Zähleranschlusskasten", icon: 4, onlySystemTyp: 0 },
{ idPoiTyp: 2, name: "Mock Geräteschrank", icon: 2, onlySystemTyp: 0 },
{ idPoiTyp: 4, name: "Mock Parkplatz", icon: 3, onlySystemTyp: 0 },
{ idPoiTyp: 6, name: "Mock Zufahrt", icon: 4, onlySystemTyp: 0 },
{ idPoiTyp: 20, name: "Mock Zählgerät", icon: 5, onlySystemTyp: 110 },
{ idPoiTyp: 21, name: "Mock Messschleife", icon: 6, onlySystemTyp: 110 },
{ idPoiTyp: 25, name: "Mock Sonstige", icon: 0, onlySystemTyp: 0 },
{ idPoiTyp: 33, name: "Mock Autobahnauffahrt", icon: 4, onlySystemTyp: null },
];
// Du kannst das Redux-Mock-Datenhandling später noch global regeln
console.warn("⚠️ POI-Typen im Mock-Modus geladen.");
console.warn("⚠️ POI-Typen im Mock-Modus Redux-Thunk wird nicht ausgeführt.");
} else if (poiTypStatus === "idle") {
dispatch(fetchPoiTypThunk());
}
}, [dispatch, poiTypStatus]);
// Geräte-Daten lokal laden (kann später durch fetchLocationDevicesThunk ersetzt werden)
// GIS Geräte laden
useEffect(() => {
const fetchDeviceData = async () => {
try {
const protocol = window.location.protocol;
const host = window.location.hostname;
const apiBaseUrl = `${protocol}//${host}/talas5/ClientData/WebServiceMap.asmx`;
dispatch(fetchGisStationsStaticDistrictThunk());
}, [dispatch]);
const params = new URLSearchParams(window.location.search);
const idMap = params.get("m");
const url = `${apiBaseUrl}/GisStationsStatic?idMap=${idMap}`;
console.log("🌐 Geräte-API:", url);
const response = await fetch(url);
const data = await response.json();
setLocationDeviceData(data.Points || []);
if (data.Points && data.Points.length > 0) {
setDeviceName(data.Points[0].LD_Name);
}
} catch (error) {
console.error("❌ Fehler beim Abrufen der Gerätedaten:", error);
}
};
fetchDeviceData();
}, []);
// PriorityConfig laden
useEffect(() => {
dispatch(fetchPriorityConfigThunk());
}, [dispatch]);
return {
poiTypData,
isPoiTypLoaded: poiTypStatus === "succeeded",
deviceName,
setDeviceName,
locationDeviceData,
setLocationDeviceData,
priorityConfig,
setPriorityConfig,
menuItemAdded,
setMenuItemAdded,
poiLayerVisible,