Simulator nicht verbunden warnung

apps/dispatch/app/(app)/pilot/_components/SimConnectionAlert.tsx

@@ -0,0 +1,39 @@
+import { usePilotConnectionStore } from "_store/pilot/connectionStore";
+import { AlertTriangle } from "lucide-react";
+import { useEffect, useState } from "react";
+
+export const SimConnectionAlert = ({ lastUpdated }: { lastUpdated?: Date }) => {
+	const [lastHearbeetSeconds, setLastHearbeetSeconds] = useState(0);
+	const { disconnect } = usePilotConnectionStore((state) => state);
+	useEffect(() => {
+		const interval = setInterval(() => {
+			if (lastUpdated) {
+				const now = new Date();
+				const diff = Math.floor((now.getTime() - new Date(lastUpdated).getTime()) / 1000);
+				setLastHearbeetSeconds(diff);
+			} else {
+				setLastHearbeetSeconds(0);
+			}
+		}, 1000);
+
+		return () => clearInterval(interval);
+	}, [lastUpdated]);
+
+	return (
+		<div role="alert" className="alert">
+			<AlertTriangle className="w-6 h-6" />
+			<div>
+				<h3 className="font-bold">
+					Keine Simulator Verbindung{" "}
+					{lastHearbeetSeconds ? `seit ${lastHearbeetSeconds} Sekunden` : "gefunden"}
+				</h3>
+				<div className="text-xs">
+					Wenn dein Simulator abgestürzt ist informiere den Disponenten über den Chat links
+				</div>
+			</div>
+			<button className="btn btn-sm btn-warning" onClick={() => disconnect()}>
+				Verbindung trennen
+			</button>
+		</div>
+	);
+};

apps/dispatch/app/(app)/pilot/_components/navbar/_components/Connection.tsx

@@ -7,6 +7,7 @@ import { getStationsAPI } from "_querys/stations";
 import toast from "react-hot-toast";
 import { editConnectedAircraftAPI } from "_querys/aircrafts";
 import { Prisma } from "@repo/db";
+import { debug } from "console";
 
 export const ConnectionBtn = () => {
 	const modalRef = useRef<HTMLDialogElement>(null);
@@ -14,9 +15,11 @@ export const ConnectionBtn = () => {
 	const [form, setForm] = useState<{
 		logoffTime: string | null;
 		selectedStationId: number | null;
+		debugPosition: boolean;
 	}>({
 		logoffTime: null,
 		selectedStationId: null,
+		debugPosition: false,
 	});
 	const [logoffDebounce, setLogoffDebounce] = useState<NodeJS.Timeout | null>(null);
 
@@ -165,6 +168,21 @@ export const ConnectionBtn = () => {
 							<p className="fieldset-label">Du kannst diese Zeit später noch anpassen.</p>
 						)}
 					</fieldset>
+
+					{session.data?.user.permissions.includes("ADMIN_STATION") && (
+						<fieldset className="fieldset bg-base-100 border-base-300 rounded-box w-full border p-4">
+							<legend className="fieldset-legend">Debug-optionen</legend>
+							<label className="label">
+								<input
+									checked={form.debugPosition}
+									onChange={(e) => setForm({ ...form, debugPosition: e.target.checked })}
+									type="checkbox"
+									className="checkbox"
+								/>
+								Zufalls Position für 2h anzeigen
+							</label>
+						</fieldset>
+					)}
 					<div className="modal-action flex justify-between w-full">
 						<form method="dialog" className="w-full flex justify-between">
 							<button className="btn btn-soft">Zurück</button>
@@ -195,6 +213,7 @@ export const ConnectionBtn = () => {
 												form.logoffTime || "",
 												selectedStation,
 												session.data!.user,
+												form.debugPosition,
 											);
 										}
 									}}

apps/dispatch/app/(app)/pilot/page.tsx

@@ -6,12 +6,28 @@ 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 { getAircraftsAPI, getConnectedAircraftsAPI } from "_querys/aircrafts";
+import { checkSimulatorConnected } from "_helpers/simulatorConnected";
+import { SimConnectionAlert } from "(app)/pilot/_components/SimConnectionAlert";
 
 const Map = dynamic(() => import("_components/map/Map"), {
 	ssr: false,
 });
 
 const DispatchPage = () => {
+	const { connectedAircraft, status } = usePilotConnectionStore((state) => state);
+	const { data: ownAircraftArray = [] } = useQuery({
+		queryKey: ["aircrafts", connectedAircraft?.id],
+		queryFn: () =>
+			getAircraftsAPI({
+				id: connectedAircraft?.id,
+			}),
+		refetchInterval: 1000,
+	});
+	const ownAircraft = ownAircraftArray[0];
+	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 /> */}
@@ -25,7 +41,10 @@ const DispatchPage = () => {
 				<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">
+						<div className="absolute top-5 right-10 z-99999 space-y-2">
+							{!simulatorConnected && status === "connected" && (
+								<SimConnectionAlert lastUpdated={ownAircraft?.lastHeartbeat} />
+							)}
 							<ConnectedDispatcher />
 						</div>
 					</div>