Daten von Mock bekommen

hooks/useMapComponentState.js

@@ -3,6 +3,7 @@ import { useState, useEffect } from "react";
 import usePoiTypData from "./usePoiTypData";
 import { useRecoilValue } from "recoil";
 import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice";
+import { isMockMode } from "../config/config";
 
 export const useMapComponentState = () => {
   const { poiTypData, isPoiTypLoaded } = usePoiTypData("/api/talas_v5_DB/poiTyp/readPoiTyp");
@@ -12,25 +13,32 @@ export const useMapComponentState = () => {
   const [menuItemAdded, setMenuItemAdded] = useState(false);
   const poiLayerVisible = useRecoilValue(poiLayerVisibleState);
 
-  // Fetch devices when the component is mounted
   useEffect(() => {
     const fetchDeviceData = async () => {
-      try {
-        const response = await fetch("/api/talas5/location_device"); // API call to get devices
-        const data = await response.json();
-        setLocationDeviceData(data); // Set the device data
+      if (isMockMode()) {
+        console.log("⚠️ Mock-API: Gerätedaten geladen");
+
+        const mockData = [{ name: "Mock-Gerät 1" }, { name: "Mock-Gerät 2" }];
+        setLocationDeviceData(mockData);
+        setDeviceName(mockData[0].name);
+        return;
+      }
+
+      try {
+        const response = await fetch("/api/talas5/location_device");
+        const data = await response.json();
+        setLocationDeviceData(data);
 
-        // Optional: set a default deviceName if needed
         if (data.length > 0) {
-          setDeviceName(data[0].name); // Set the first device's name
+          setDeviceName(data[0].name);
         }
       } catch (error) {
-        console.error("Error fetching device data:", error);
+        console.error("❌ Fehler beim Abrufen der Gerätedaten:", error);
       }
     };
 
     fetchDeviceData();
-  }, []); // Runs only once when the component is mounted
+  }, []);
 
   return {
     poiTypData,