Metar overhaul, added footer, updated schemas

ui/src/components/AirportLayer.tsx

@@ -5,8 +5,7 @@ import debounce from 'lodash.debounce';
 import { getAirports } from '@lib/airport.ts';
 import AirportMarker from '@components/AirportMarker.tsx';
 import { LayerInfo } from '@/App.tsx';
-
-const EXPANSION_FACTOR = 0.5;
+import { LatLng } from 'leaflet';
 
 export default function AirportLayer({
   setAirport,
@@ -18,21 +17,13 @@ export default function AirportLayer({
   selectedLayer: LayerInfo;
 }) {
   const [airports, setAirports] = useState<Airport[]>([]);
-  const lastBoundsRef = useRef<{ ne: any; sw: any } | null>(null);
+  const lastBoundsRef = useRef<{ ne: LatLng; sw: LatLng } | null>(null);
 
   const debouncedLoad = useRef(
     debounce(async (map: any) => {
-      const b = map.getBounds();
-      const north = b.getNorth(),
-        south = b.getSouth();
-      const east = b.getEast(),
-        west = b.getWest();
-      const latDelta = (north - south) * EXPANSION_FACTOR;
-      const lonDelta = (east - west) * EXPANSION_FACTOR;
-
-      // expanded bbox
-      const ne = { lat: north + latDelta, lon: east + lonDelta };
-      const sw = { lat: south - latDelta, lon: west - lonDelta };
+      const bounds = map.getBounds();
+      const ne = bounds.getNorthEast()
+      const sw = bounds.getSouthWest()
       lastBoundsRef.current = { ne, sw };
 
       try {
@@ -58,7 +49,7 @@ export default function AirportLayer({
     return () => {
       debouncedLoad.cancel();
     };
-  }, [map]);
+  }, [map, debouncedLoad]);
 
   return (
     <>