feat: Marker-Layer-Logik in useDynamicMarkerLayers Hook ausgelagert

- Logik zur Initialisierung und Aktualisierung von Marker-Layern aus MapComponent.js ausgelagert. - Neuer Hook: useDynamicMarkerLayers im hooks-Verzeichnis hinzugefügt. - Modularisierung und Wiederverwendbarkeit verbessert.
2024-12-22 07:07:09 +01:00
parent 2392d410be
commit d0811366f5
2 changed files with 105 additions and 91 deletions
--- a/hooks/useDynamicMarkerLayers.js
+++ b/hooks/useDynamicMarkerLayers.js
@@ -0,0 +1,80 @@
+import { useEffect, useRef } from "react";
+import L from "leaflet";
+import { createAndSetDevices } from "../utils/createAndSetDevices.js";
+import { checkOverlappingMarkers } from "../utils/markerUtils";
+import { plusRoundIcon } from "../components/PlusRoundIcon.js";
+
+export const useDynamicMarkerLayers = (
+  map,
+  gisSystemStaticLoaded,
+  GisSystemStatic,
+  priorityConfig,
+  setMarkerStates
+) => {
+  const layerRefs = {
+    gmaLayerRef: useRef(null),
+    talasLayerRef: useRef(null),
+    eciMarkersLayerRef: useRef(null),
+    gsmModemMarkersLayerRef: useRef(null),
+    ciscoRouterMarkersLayerRef: useRef(null),
+    wagoMarkersLayerRef: useRef(null),
+    siemensMarkersLayerRef: useRef(null),
+    otdrMarkersLayerRef: useRef(null),
+    wdmMarkersLayerRef: useRef(null),
+    messstellenMarkersLayerRef: useRef(null),
+    talasiclMarkersLayerRef: useRef(null),
+    dauzMarkersLayerRef: useRef(null),
+    smsfunkmodemMarkersLayerRef: useRef(null),
+    ulafMarkersLayerRef: useRef(null),
+    sonstigeMarkersLayerRef: useRef(null),
+    tkComponentsMarkersRef: useRef(null),
+  };
+
+  useEffect(() => {
+    if (!gisSystemStaticLoaded || !map) return;
+
+    const layerGroups = [
+      { ref: layerRefs.gmaLayerRef, id: 11, setState: setMarkerStates.setGmaMarkers },
+      { ref: layerRefs.talasLayerRef, id: 1, setState: setMarkerStates.setTalasMarkers },
+      { ref: layerRefs.eciMarkersLayerRef, id: 2, setState: setMarkerStates.setEciMarkers },
+      { ref: layerRefs.gsmModemMarkersLayerRef, id: 5, setState: setMarkerStates.setGsmModemMarkers },
+      { ref: layerRefs.ciscoRouterMarkersLayerRef, id: 6, setState: setMarkerStates.setCiscoRouterMarkers },
+      { ref: layerRefs.wagoMarkersLayerRef, id: 7, setState: setMarkerStates.setWagoMarkers },
+      { ref: layerRefs.siemensMarkersLayerRef, id: 8, setState: setMarkerStates.setSiemensMarkers },
+      { ref: layerRefs.otdrMarkersLayerRef, id: 9, setState: setMarkerStates.setOtdrMarkers },
+      { ref: layerRefs.wdmMarkersLayerRef, id: 10, setState: setMarkerStates.setWdmMarkers },
+      { ref: layerRefs.messstellenMarkersLayerRef, id: 13, setState: setMarkerStates.setMessstellenMarkers },
+      { ref: layerRefs.talasiclMarkersLayerRef, id: 100, setState: setMarkerStates.setTalasiclMarkers },
+      { ref: layerRefs.dauzMarkersLayerRef, id: 110, setState: setMarkerStates.setDauzMarkers },
+      { ref: layerRefs.smsfunkmodemMarkersLayerRef, id: 111, setState: setMarkerStates.setSmsfunkmodemMarkers },
+      { ref: layerRefs.ulafMarkersLayerRef, id: 0, setState: setMarkerStates.setUlafMarkers },
+      { ref: layerRefs.sonstigeMarkersLayerRef, id: 200, setState: setMarkerStates.setSonstigeMarkers },
+      { ref: layerRefs.tkComponentsMarkersRef, id: 30, setState: setMarkerStates.setTkComponentsMarkers },
+    ];
+
+    layerGroups.forEach(({ ref }) => {
+      if (!ref.current) {
+        ref.current = new L.LayerGroup().addTo(map);
+      }
+    });
+
+    const updateMarkers = ({ ref, id, setState }) => {
+      if (ref.current) {
+        ref.current.clearLayers();
+      }
+
+      createAndSetDevices(id, (newMarkers) => {
+        setState(newMarkers);
+        newMarkers.forEach((marker) => ref.current.addLayer(marker));
+        checkOverlappingMarkers(map, newMarkers, plusRoundIcon);
+      }, GisSystemStatic, priorityConfig);
+    };
+
+    const updateAllMarkers = () => {
+      layerGroups.forEach(updateMarkers);
+    };
+
+    updateAllMarkers();
+
+  }, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
+};