wip: Dynamische Layers /Geräte Gruppen Erkennung , overlapping funktioniert es noch nicht

hooks/layers/useDynamicDeviceLayers.js

@@ -0,0 +1,68 @@
+import { useEffect, useRef, useState } from "react";
+import L from "leaflet";
+import { createAndSetDevices } from "../../utils/devices/createAndSetDevices";
+import { checkOverlappingMarkers } from "../../utils/mapUtils";
+import plusRoundIcon from "../../components/icons/devices/overlapping/PlusRoundIcon";
+
+/**
+ * Dynamisch GIS-System-Marker erstellen & Sichtbarkeit steuern.
+ * @param {object} map - Leaflet Map-Instanz
+ * @param {Array} GisSystemStatic - Liste der Systeme aus Webservice
+ * @param {object} mapLayersVisibility - Redux-Objekt mit Layer-Sichtbarkeiten
+ * @param {object} priorityConfig - Konfig für Prioritäten
+ * @returns {{ markerStates, layerRefs }} Alle Marker und Referenzen
+ */
+const useDynamicDeviceLayers = (map, GisSystemStatic, mapLayersVisibility, priorityConfig) => {
+  const [markerStates, setMarkerStates] = useState({});
+  const layerRefs = useRef({});
+
+  // Marker initialisieren
+  useEffect(() => {
+    if (!map || GisSystemStatic.length === 0) return;
+
+    GisSystemStatic.forEach(({ Name, IdSystem }) => {
+      if (!layerRefs.current[Name]) {
+        layerRefs.current[Name] = new L.LayerGroup().addTo(map);
+      }
+
+      createAndSetDevices(
+        IdSystem,
+        (newMarkers) => {
+          setMarkerStates((prev) => ({ ...prev, [Name]: newMarkers }));
+          newMarkers.forEach((m) => layerRefs.current[Name].addLayer(m));
+          checkOverlappingMarkers(map, newMarkers, plusRoundIcon);
+        },
+        GisSystemStatic,
+        priorityConfig
+      );
+    });
+  }, [map, GisSystemStatic, priorityConfig]);
+
+  // Sichtbarkeit aktualisieren
+  useEffect(() => {
+    if (!map) return;
+    const editMode = localStorage.getItem("editMode") === "true";
+
+    Object.entries(markerStates).forEach(([systemName, markers]) => {
+      const isVisible = mapLayersVisibility[systemName];
+      markers.forEach((marker) => {
+        const hasLayer = map.hasLayer(marker);
+        if (editMode || !isVisible) {
+          if (hasLayer) map.removeLayer(marker);
+        } else {
+          if (!hasLayer) marker.addTo(map);
+        }
+      });
+    });
+
+    const allMarkers = Object.values(markerStates)
+      .filter(Array.isArray) // nur Arrays zulassen
+      .flat();
+
+    checkOverlappingMarkers(map, allMarkers, plusRoundIcon);
+  }, [map, markerStates, mapLayersVisibility]);
+
+  return { markerStates, layerRefs };
+};
+
+export default useDynamicDeviceLayers;