refactor: POI-Typen in MapComponent von Hook auf Redux umgestellt (v1.1.103)

CHANGELOG.md

@@ -4,6 +4,23 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie
 
 ---
 
+## [1.1.103] – 2025-05-19
+
+### Changed
+
+- 🔁 `MapComponent.js` überarbeitet:
+  - `usePoiTypData` entfernt
+  - POI-Typen werden jetzt über Redux (`poiTypesSlice`) geladen
+  - Zustand `isPoiTypLoaded` durch Redux `status === "succeeded"` ersetzt
+- 🔧 Redux-Selektor und `dispatch(fetchPoiTypes())` ergänzt für automatisches Laden
+
+### Fixed
+
+- ✅ Fehler "Cannot access 'isPoiTypLoaded' before initialization" behoben
+- Build funktioniert wieder nach Hook-Löschung
+
+---
+
 ## [1.1.101] – 2025-05-19
 
 ### Removed

components/mainComponent/MapComponent.js

@@ -27,7 +27,7 @@ import { setupPolylines } from "../../utils/polylines/setupPolylines.js";
 import { setupPOIs } from "../../utils/setupPOIs.js";
 import VersionInfoModal from "../VersionInfoModal.js";
 import useDrawLines from "../../hooks/layers/useDrawLines.js";
-import usePoiTypData from "../../hooks/usePoiTypData.js";
+
 import useLayerVisibility from "../../hooks/useLayerVisibility.js";
 import useLineData from "../../hooks/useLineData.js";
 
@@ -82,6 +82,7 @@ import { setSelectedPoi, clearSelectedPoi } from "../../redux/slices/selectedPoi
 import { setupDevices } from "../../utils/setupDevices";
 import { setDisabled } from "../../redux/slices/polylineEventsDisabledSlice";
 import { setMapId, setUserId } from "../../redux/slices/urlParameterSlice";
+import { fetchPoiTypes } from "../../redux/slices/db/poiTypesSlice";
 
 const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const dispatch = useDispatch();
@@ -100,7 +101,10 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const polylineVisible = useSelector(selectPolylineVisible);
   const [editMode, setEditMode] = useState(false); // editMode Zustand
   const { deviceName, setDeviceName } = useMapComponentState();
-  const { poiTypData, isPoiTypLoaded } = usePoiTypData("/api/talas_v5_DB/poiTyp/readPoiTyp");
+  const poiTypData = useSelector((state) => state.poiTypes.data);
+  const poiTypStatus = useSelector((state) => state.poiTypes.status);
+  const isPoiTypLoaded = useSelector((state) => state.poiTypes.status === "succeeded");
+
   //const [deviceName, setDeviceName] = useState("");
   const [locationDeviceData, setLocationDeviceData] = useState([]);
   const [priorityConfig, setPriorityConfig] = useState([]);
@@ -399,6 +403,12 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   ]);
 
   //--------------------------------------------
+  useEffect(() => {
+    if (poiTypStatus === "idle") {
+      dispatch(fetchPoiTypes());
+    }
+  }, [poiTypStatus, dispatch]);
+
   //--------------------------------------------
   useEffect(() => {
     const fetchData = async () => {

config/appVersion.js

@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.102";
+export const APP_VERSION = "1.1.104";

hooks/usePoiTypData.js

@@ -1,54 +0,0 @@
-// hooks/usePoiTypData.js
-import { useState, useEffect, useRef } from "react";
-import { toast } from "react-toastify"; // Toast für Warnungen importieren
-
-const usePoiTypData = (url) => {
-  const [poiTypData, setPoiTypData] = useState([]);
-  const [isPoiTypLoaded, setIsPoiTypLoaded] = useState(false);
-  const retryCountRef = useRef(0);
-  const maxRetries = 2;
-
-  useEffect(() => {
-    const fetchPoiTypData = async () => {
-      try {
-        const response = await fetch(url);
-        const data = await response.json();
-
-        if (!Array.isArray(data)) {
-          console.warn(`Unerwartetes Format: ${JSON.stringify(data)}`);
-
-          if (data.warning) {
-            toast.warn(data.warning, { position: "top-center", autoClose: 5000 });
-            setPoiTypData([]); // Leeres Array setzen
-            setIsPoiTypLoaded(true);
-            return;
-          }
-
-          throw new Error("Daten sind kein Array");
-        }
-
-        // Erfolgreich geladen, also Reset des Retry-Zählers
-        setPoiTypData(data);
-        setIsPoiTypLoaded(true);
-        retryCountRef.current = 0;
-      } catch (error) {
-        console.error("Fehler beim Abrufen der poiTyp-Daten in usePoiTypData.js :", error);
-
-        if (retryCountRef.current < maxRetries) {
-          retryCountRef.current++;
-          console.log(`Neuer Versuch (${retryCountRef.current}/${maxRetries}) in 5 Sekunden...`);
-          setTimeout(fetchPoiTypData, 5000);
-        } else {
-          console.error("Maximale Anzahl an Fehlversuchen erreicht. Stoppe weitere Abrufe.");
-          setIsPoiTypLoaded(true);
-        }
-      }
-    };
-
-    fetchPoiTypData();
-  }, [url]);
-
-  return { poiTypData, isPoiTypLoaded };
-};
-
-export default usePoiTypData;