// src/components/MapBoundsManager.tsx
import React, { useEffect } from 'react';
import { useMap } from 'react-leaflet';
import L from 'leaflet';
import type { HeatmapPoint } from '../App';

interface MapBoundsManagerProps {
  data: HeatmapPoint[];
}

const MapBoundsManager: React.FC<MapBoundsManagerProps> = ({ data }) => {
  const map = useMap();

  useEffect(() => {
    if (data && data.length > 0) {
      const bounds = L.latLngBounds(data.map(p => [p.lat, p.lon]));
      if (bounds.isValid()) {
        map.fitBounds(bounds, { padding: [50, 50] });
      }
    }
  }, [data, map]);

  return null; // This component does not render anything
};

export default MapBoundsManager;