diff --git a/apps/dispatch/app/_components/map/AircraftMarker.tsx b/apps/dispatch/app/_components/map/AircraftMarker.tsx index 6d635675..9c0adaf3 100644 --- a/apps/dispatch/app/_components/map/AircraftMarker.tsx +++ b/apps/dispatch/app/_components/map/AircraftMarker.tsx @@ -2,7 +2,7 @@ import { Marker, Polyline, useMap } from "react-leaflet"; import { DivIcon, Marker as LMarker, Popup as LPopup } from "leaflet"; import { useMapStore } from "_store/mapStore"; import { Fragment, useCallback, useEffect, useRef, useState, useMemo } from "react"; -import { cn } from "@repo/shared-components"; +import { checkSimulatorConnected, cn } from "@repo/shared-components"; import { ChevronsRightLeft, House, MessageSquareText, Minimize2 } from "lucide-react"; import { SmartPopup, calculateAnchor, useSmartPopup } from "_components/SmartPopup"; import FMSStatusHistory, { @@ -396,11 +396,27 @@ const AircraftMarker = ({ aircraft }: { aircraft: ConnectedAircraft & { Station: }; export const AircraftLayer = () => { - const { data: aircrafts } = useQuery({ - queryKey: ["aircrafts-map"], - queryFn: () => getConnectedAircraftsAPI(), - refetchInterval: 10_000, - }); + const [aircrafts, setAircrafts] = useState<(ConnectedAircraft & { Station: Station })[]>([]); + + useEffect(() => { + const fetchAircrafts = async () => { + try { + const res = await fetch("/api/aircrafts"); + if (!res.ok) { + throw new Error("Failed to fetch aircrafts"); + } + const data: (ConnectedAircraft & { Station: Station })[] = await res.json(); + setAircrafts(data.filter((a) => checkSimulatorConnected(a))); + } catch (error) { + console.error("Failed to fetch aircrafts:", error); + } + }; + + fetchAircrafts(); + const interval = setInterval(fetchAircrafts, 10_000); + + return () => clearInterval(interval); + }, []); const { setMap } = useMapStore((state) => state); const map = useMap(); const {