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]); };