// hooks/useMarkerLayers.js
import { useEffect } from "react";
import { useRecoilValue } from "recoil";
import { mapLayersState } from "../store/atoms/mapLayersState";

const useMarkerLayers = (map, markers, layerType) => {
  const mapLayersVisibility = useRecoilValue(mapLayersState);

  useEffect(() => {
    if (!map || !markers) return;

    const toggleLayer = (isVisible) => {
      markers.forEach((marker) => {
        if (isVisible) {
          marker.addTo(map);
        } else {
          map.removeLayer(marker);
        }
      });
    };

    toggleLayer(mapLayersVisibility[layerType]);
  }, [map, markers, mapLayersVisibility, layerType]);
};

export default useMarkerLayers;