From 984eb093a0fc090d8e170a872319ddcd3370fb4b Mon Sep 17 00:00:00 2001
From: nocnico <nicolas@syntaxdev.de>
Date: Mon, 2 Jun 2025 22:01:45 +0200
Subject: [PATCH] Edit Navbar Connection, Fix Tracker Grammar, Auto Redirect on
 Dispatch Main Page, Adjust Toast Position

---
 .../dispatch/app/_components/map/BaseMaps.tsx |  2 +-
 .../navbar/_components/Connection.tsx         | 37 ++++++++++---------
 apps/dispatch/app/layout.tsx                  |  2 +-
 apps/dispatch/app/page.tsx                    | 23 ++++++------
 .../navbar/_components/Connection.tsx         | 10 ++---
 .../_components/ConnectedDispatcher.tsx       |  6 ++-
 6 files changed, 42 insertions(+), 38 deletions(-)

diff --git a/apps/dispatch/app/_components/map/BaseMaps.tsx b/apps/dispatch/app/_components/map/BaseMaps.tsx
index 13b95956..6c377602 100644
--- a/apps/dispatch/app/_components/map/BaseMaps.tsx
+++ b/apps/dispatch/app/_components/map/BaseMaps.tsx
@@ -314,7 +314,7 @@ export const BaseMaps = () => {
 
 	return (
 		<LayersControl position="topleft">
-			<LayersControl.Overlay name={"Funknetzbereiche"}>
+			<LayersControl.Overlay name={"Leitstellenbereiche"}>
 				<RadioAreaLayer />
 			</LayersControl.Overlay>
 			<LayersControl.Overlay name={"Niederschlag"}>
diff --git a/apps/dispatch/app/dispatch/_components/navbar/_components/Connection.tsx b/apps/dispatch/app/dispatch/_components/navbar/_components/Connection.tsx
index 5023e6ab..c25f4581 100644
--- a/apps/dispatch/app/dispatch/_components/navbar/_components/Connection.tsx
+++ b/apps/dispatch/app/dispatch/_components/navbar/_components/Connection.tsx
@@ -2,6 +2,7 @@
 import { useSession } from "next-auth/react";
 import { useDispatchConnectionStore } from "../../../../_store/dispatch/connectionStore";
 import { useRef, useState } from "react";
+import { toast } from "react-hot-toast";
 
 export const ConnectionBtn = () => {
 	const modalRef = useRef<HTMLDialogElement>(null);
@@ -10,6 +11,7 @@ export const ConnectionBtn = () => {
 		logoffTime: "",
 		selectedZone: "LST_01",
 	});
+	const [logoffDebounce, setLogoffDebounce] = useState<NodeJS.Timeout | null>(null);
 	const session = useSession();
 	const uid = session.data?.user?.id;
 	if (!uid) return null;
@@ -22,14 +24,14 @@ export const ConnectionBtn = () => {
 
 			{connection.status == "connected" ? (
 				<button
-					className="btn btn-soft btn-error"
+					className="btn btn-sm btn-soft btn-success"
 					type="submit"
 					onSubmit={() => false}
 					onClick={() => {
-						connection.disconnect();
+						modalRef.current?.showModal();
 					}}
 				>
-					Trennen
+					Verbunden
 				</button>
 			) : (
 				<button
@@ -40,9 +42,7 @@ export const ConnectionBtn = () => {
 					}}
 					className="btn btn-sm btn-soft btn-info"
 				>
-					{connection.status == "disconnected"
-						? "Verbinden"
-						: connection.status}
+					{connection.status == "disconnected" ? "Verbinden" : connection.status}
 				</button>
 			)}
 
@@ -50,10 +50,7 @@ export const ConnectionBtn = () => {
 				<div className="modal-box flex flex-col items-center justify-center">
 					{connection.status == "connected" ? (
 						<h3 className="text-lg font-bold mb-5">
-							Verbunden als{" "}
-							<span className="text-info">
-								&lt;{connection.selectedZone}&gt;
-							</span>
+							Verbunden als <span className="text-info">&lt;{connection.selectedZone}&gt;</span>
 						</h3>
 					) : (
 						<h3 className="text-lg font-bold mb-5">Als Disponent anmelden</h3>
@@ -62,26 +59,30 @@ export const ConnectionBtn = () => {
 						<label className="floating-label w-full text-base">
 							<span>Logoff Zeit (UTC+1)</span>
 							<input
-								onChange={(e) =>
+								onChange={(e) => {
+									const value = e.target.value;
 									setForm({
 										...form,
-										logoffTime: e.target.value,
-									})
-								}
+										logoffTime: value,
+									});
+									if (logoffDebounce) clearTimeout(logoffDebounce);
+									const timeout = setTimeout(() => {
+										toast.success("Änderung gespeichert!");
+									}, 2000);
+									setLogoffDebounce(timeout);
+								}}
 								value={form.logoffTime}
 								type="time"
 								className="input w-full"
 							/>
 						</label>
 						{connection.status == "disconnected" && (
-							<p className="fieldset-label">
-								Du kannst diese Zeit später noch anpassen.
-							</p>
+							<p className="fieldset-label">Du kannst diese Zeit später noch anpassen.</p>
 						)}
 					</fieldset>
 					<div className="modal-action flex justify-between w-full">
 						<form method="dialog" className="w-full flex justify-between">
-							<button className="btn btn-soft">Abbrechen</button>
+							<button className="btn btn-soft">Zurück</button>
 							{connection.status == "connected" ? (
 								<button
 									className="btn btn-soft btn-error"
diff --git a/apps/dispatch/app/layout.tsx b/apps/dispatch/app/layout.tsx
index 2a5062e2..21ee4fe2 100644
--- a/apps/dispatch/app/layout.tsx
+++ b/apps/dispatch/app/layout.tsx
@@ -36,7 +36,7 @@ export default async function RootLayout({
 			>
 				<Toaster
 					containerStyle={{
-						top: 150,
+						top: 200,
 						left: 20,
 						right: 20,
 					}}
diff --git a/apps/dispatch/app/page.tsx b/apps/dispatch/app/page.tsx
index d6c0b20b..eb5e7711 100644
--- a/apps/dispatch/app/page.tsx
+++ b/apps/dispatch/app/page.tsx
@@ -1,26 +1,25 @@
 "use client";
 import { useEffect } from "react";
 import { useRouter } from "next/navigation";
+import { useSession } from "next-auth/react";
 
 export default () => {
 	const router = useRouter();
+	const session = useSession();
 
 	useEffect(() => {
-		// Replace this with actual permission-checking logic
-		const hasDispoPermission = checkUserPermission("DISPO");
+		if (session.status === "authenticated" && session.data?.user) {
+			const hasDispoPermission = session.data.user.permissions?.includes("DISPO");
 
-		if (hasDispoPermission) {
-			router.replace("/dispatch");
+			if (hasDispoPermission) {
+				router.replace("/dispatch");
+			} else {
+				router.replace("/pilot");
+			}
 		} else {
-			router.replace("/pilot");
+			router.replace("/tracker");
 		}
-	}, [router]);
+	}, [router, session]);
 
 	return null;
-
-	// Mock function for permission checking
-	function checkUserPermission(permission: string): boolean {
-		// Replace with real permission logic
-		return permission === "DISPO";
-	}
 };
diff --git a/apps/dispatch/app/pilot/_components/navbar/_components/Connection.tsx b/apps/dispatch/app/pilot/_components/navbar/_components/Connection.tsx
index 6dcc4e86..4c02114e 100644
--- a/apps/dispatch/app/pilot/_components/navbar/_components/Connection.tsx
+++ b/apps/dispatch/app/pilot/_components/navbar/_components/Connection.tsx
@@ -41,14 +41,14 @@ export const ConnectionBtn = () => {
 
 			{connection.status == "connected" ? (
 				<button
-					className="btn btn-soft btn-error"
+					className="btn btn-sm btn-soft btn-success"
 					type="submit"
 					onSubmit={() => false}
 					onClick={() => {
-						connection.disconnect();
+						modalRef.current?.showModal();
 					}}
 				>
-					Trennen
+					Verbunden
 				</button>
 			) : (
 				<button
@@ -115,7 +115,7 @@ export const ConnectionBtn = () => {
 					</fieldset>
 					<div className="modal-action flex justify-between w-full">
 						<form method="dialog" className="w-full flex justify-between">
-							<button className="btn btn-soft">Abbrechen</button>
+							<button className="btn btn-soft">Zurück</button>
 							{connection.status == "connected" ? (
 								<button
 									className="btn btn-soft btn-error"
@@ -125,7 +125,7 @@ export const ConnectionBtn = () => {
 										connection.disconnect();
 									}}
 								>
-									Trennen
+									Verbindung Trennen
 								</button>
 							) : (
 								<button
diff --git a/apps/dispatch/app/tracker/_components/ConnectedDispatcher.tsx b/apps/dispatch/app/tracker/_components/ConnectedDispatcher.tsx
index d23a9f88..37b7fc23 100644
--- a/apps/dispatch/app/tracker/_components/ConnectedDispatcher.tsx
+++ b/apps/dispatch/app/tracker/_components/ConnectedDispatcher.tsx
@@ -17,13 +17,17 @@ export const ConnectedDispatcher = () => {
 		refetchInterval: 10000,
 	});
 
+	const connections = (aircrafts?.length || 0) + (dispatcher?.length || 0);
+
 	return (
 		<div className="absolute top-5 right-10 min-w-120 z-99999">
 			<div className="collapse collapse-arrow bg-base-100 border-base-300 border">
 				<input type="checkbox" />
 				{/* <div className="collapse-title font-semibold">Kein Disponent Online</div> */}
 				<div className="collapse-title font-semibold flex items-center justify-between">
-					<span>{(aircrafts?.length || 0) + (dispatcher?.length || 0)} Verbundene Mitglieder</span>
+					<span>
+						{connections} {connections > 1 ? "Verbundene Mitglieder" : "Verbundenes Mitglied"}
+					</span>
 					<div className="gap-2 flex items-center">
 						<div
 							className={`badge badge-outline ${