78 lines
2.7 KiB
TypeScript
78 lines
2.7 KiB
TypeScript
"use client";
|
|
|
|
import { Mrt } from "(app)/pilot/_components/mrt/Mrt";
|
|
import { Chat } from "../../_components/left/Chat";
|
|
import { Report } from "../../_components/left/Report";
|
|
import { Dme } from "(app)/pilot/_components/dme/Dme";
|
|
import dynamic from "next/dynamic";
|
|
import { ConnectedDispatcher } from "tracker/_components/ConnectedDispatcher";
|
|
import { useQuery } from "@tanstack/react-query";
|
|
import { usePilotConnectionStore } from "_store/pilot/connectionStore";
|
|
import { getConnectedAircraftsAPI } from "_querys/aircrafts";
|
|
import { checkSimulatorConnected } from "@repo/shared-components";
|
|
import { SimConnectionAlert } from "(app)/pilot/_components/SimConnectionAlert";
|
|
|
|
const Map = dynamic(() => import("_components/map/Map"), {
|
|
ssr: false,
|
|
});
|
|
|
|
const PilotPage = () => {
|
|
const { connectedAircraft, status } = usePilotConnectionStore((state) => state);
|
|
// Query will be cached anyway, due to this, displayed Markers are in sync with own Aircraft connection-warning
|
|
const { data: aircrafts } = useQuery({
|
|
queryKey: ["aircrafts"],
|
|
queryFn: () => getConnectedAircraftsAPI(),
|
|
refetchInterval: 10_000,
|
|
});
|
|
|
|
const ownAircraft = aircrafts?.find((aircraft) => aircraft.id === connectedAircraft?.id);
|
|
const simulatorConnected = ownAircraft ? checkSimulatorConnected(ownAircraft) : false;
|
|
return (
|
|
<div className="relative flex-1 flex transition-all duration-500 ease w-full h-screen overflow-hidden">
|
|
{/* <MapToastCard2 /> */}
|
|
<div className="flex flex-1 relative w-full h-full">
|
|
<div className="absolute left-0 top-1/2 transform -translate-y-1/2 pl-4 z-999999">
|
|
<Chat />
|
|
<div className="mt-2">
|
|
<Report />
|
|
</div>
|
|
</div>
|
|
<div className="flex w-2/3 h-full">
|
|
<div className="relative flex flex-1 h-full">
|
|
<Map />
|
|
<div className="absolute top-5 right-10 z-99999 space-y-2">
|
|
{!simulatorConnected && status === "connected" && (
|
|
<SimConnectionAlert lastUpdated={ownAircraft?.lastHeartbeat} />
|
|
)}
|
|
<ConnectedDispatcher />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="flex w-1/3 h-full">
|
|
<div className="flex flex-col w-full h-full p-4 bg-base-300">
|
|
<h2 className="card-title mb-2">MRT & DME</h2>
|
|
<div className="card bg-base-200 shadow-xl mb-4">
|
|
<div className="card-body w-full h-full flex items-center justify-center">
|
|
<div className=" max-w-150">
|
|
<Mrt />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="card bg-base-200 shadow-xl h-1/2 flex">
|
|
<div className="card-body w-full h-full p-4 mb-0 flex items-center justify-center">
|
|
<div className=" max-w-140">
|
|
<Dme />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
PilotPage.displayName = "DispatchPage";
|
|
|
|
export default PilotPage;
|