From 51ef9cd90cbfd50ba9f16088975768252a7fc621 Mon Sep 17 00:00:00 2001 From: PxlLoewe <72106766+PxlLoewe@users.noreply.github.com> Date: Mon, 15 Dec 2025 21:19:39 +0100 Subject: [PATCH] use fetch to get Aircraft Marker --- .../app/_components/map/AircraftMarker.tsx | 28 +++++++++++++++---- 1 file changed, 22 insertions(+), 6 deletions(-) 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 {