import { useEffect, useRef } from "react";
import { FeatureGroup, useMap } from "react-leaflet";

const ShowForbiddenBound = ({ bound }) => {
    const map = useMap();
    const featureRef = useRef(null);

    const safeFitBounds = (layer) => {
        if (!layer || !map) return;
        try {
            const latLngs = layer.getLatLngs();
            map.fitBounds(latLngs, {
                paddingTopLeft: [20, 20],
                paddingBottomRight: [20, 20],
            });
        } catch (e) {
            console.warn("fitBounds failed:", e);
        }
    };

    useEffect(() => {
        bound?.editing?.disable();
        featureRef.current.addLayer(bound);
        safeFitBounds(bound);
    }, []);

    return <FeatureGroup ref={featureRef} />;
};
export default ShowForbiddenBound;
