Rework Dispatch Navigation

apps/dispatch/app/(app)/dispatch/_components/navbar/Navbar.tsx

@@ -3,10 +3,10 @@ import { Audio } from "../../../../_components/Audio/Audio";
 import { ExitIcon, ExternalLinkIcon } from "@radix-ui/react-icons";
 import Link from "next/link";
 import { Settings } from "_components/navbar/Settings";
-import ModeSwitchDropdown from "_components/navbar/ModeSwitchDropdown";
 import AdminPanel from "_components/navbar/AdminPanel";
 import { getServerSession } from "api/auth/[...nextauth]/auth";
 import { WarningAlert } from "_components/navbar/PageAlert";
+import { Radar } from "lucide-react";
 
 export default async function Navbar() {
 	const session = await getServerSession();
@@ -14,7 +14,7 @@ export default async function Navbar() {
 	return (
 		<div className="navbar bg-base-100 shadow-sm flex gap-5 justify-between">
 			<div className="flex items-center gap-2">
-				<ModeSwitchDropdown />
+				<p className="normal-case text-xl font-semibold">VAR Leitstelle V2</p>
 				{session?.user.permissions.includes("ADMIN_KICK") && <AdminPanel />}
 			</div>
 			<WarningAlert />
@@ -27,6 +27,11 @@ export default async function Navbar() {
 				</div>
 				<div className="flex items-center">
 					<Settings />
+					<Link href={"/tracker"} target="_blank" rel="noopener noreferrer">
+						<button className="btn btn-ghost">
+							<Radar size={19} /> Tracker
+						</button>
+					</Link>
 					<Link
 						href={process.env.NEXT_PUBLIC_HUB_URL || "#!"}
 						target="_blank"

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

@@ -3,13 +3,15 @@ import { Audio } from "_components/Audio/Audio";
 import { ExitIcon, ExternalLinkIcon } from "@radix-ui/react-icons";
 import Link from "next/link";
 import { Settings } from "_components/navbar/Settings";
-import ModeSwitchDropdown from "_components/navbar/ModeSwitchDropdown";
 import { WarningAlert } from "_components/navbar/PageAlert";
+import { Radar } from "lucide-react";
 
 export default function Navbar() {
 	return (
 		<div className="navbar bg-base-100 shadow-sm flex gap-5 justify-between">
-			<ModeSwitchDropdown />
+			<div className="flex items-center gap-2">
+				<p className="normal-case text-xl font-semibold">VAR Operations Center</p>
+			</div>
 			<WarningAlert />
 			<div className="flex items-center gap-5">
 				<div className="flex items-center gap-2">
@@ -20,6 +22,11 @@ export default function Navbar() {
 				</div>
 				<div className="flex items-center">
 					<Settings />
+					<Link href={"/tracker"} target="_blank" rel="noopener noreferrer">
+						<button className="btn btn-ghost">
+							<Radar size={19} /> Tracker
+						</button>
+					</Link>
 					<Link
 						href={process.env.NEXT_PUBLIC_HUB_URL || "#!"}
 						target="_blank"

apps/dispatch/app/_components/navbar/ModeSwitchDropdown.tsx

@@ -1,45 +0,0 @@
-"use client";
-
-import { cn } from "@repo/shared-components";
-import { ArrowLeftRight, Plane, Radar, Workflow } from "lucide-react";
-import { useSession } from "next-auth/react";
-import Link from "next/link";
-import { usePathname } from "next/navigation";
-
-export default function ModeSwitchDropdown({ className }: { className?: string }) {
-	const path = usePathname();
-	const session = useSession();
-
-	return (
-		<div className={cn("dropdown z-999999", className)}>
-			<div tabIndex={0} role="button" className="btn m-1">
-				<ArrowLeftRight size={22} /> {path.includes("pilot") && "Pilot"}
-				{path.includes("dispatch") && "Leitstelle"}
-			</div>
-			<ul
-				tabIndex={0}
-				className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm"
-			>
-				{session.data?.user.permissions?.includes("DISPO") && (
-					<li>
-						<Link href={"/dispatch"}>
-							<Workflow size={22} /> Leitstelle
-						</Link>
-					</li>
-				)}
-				{session.data?.user.permissions?.includes("PILOT") && (
-					<li>
-						<Link href={"/pilot"}>
-							<Plane size={22} /> Pilot
-						</Link>
-					</li>
-				)}
-				<li>
-					<Link href={"/tracker"}>
-						<Radar size={22} /> Tracker
-					</Link>
-				</li>
-			</ul>
-		</div>
-	);
-}

apps/hub/app/_components/Nav.tsx

@@ -12,6 +12,7 @@ import { WarningAlert } from "./ui/PageAlert";
 import { getServerSession } from "api/auth/[...nextauth]/auth";
 import { Error } from "./Error";
 import Image from "next/image";
+import { Radar } from "lucide-react";
 
 export const VerticalNav = async () => {
 	const session = await getServerSession();
@@ -106,7 +107,11 @@ export const VerticalNav = async () => {
 	);
 };
 
-export const HorizontalNav = () => (
+export const HorizontalNav = async () => {
+	const session = await getServerSession();
+	if (!session?.user) return <Error statusCode={401} title="Benutzer nicht authentifiziert!" />;
+
+	return (
 		<div className="navbar bg-base-200 shadow-md rounded-lg mb-4">
 			<div className="flex items-center">
 				<Link href="/" className="flex items-center">
@@ -123,14 +128,32 @@ export const HorizontalNav = () => (
 				<WarningAlert />
 			</div>
 			<div className="flex items-center ml-auto">
-			<ul className="flex space-x-2 px-1">
+				<ul className="flex space-x-2 px-1 items-center">
+					<li>
+						<a
+							href={process.env.NEXT_PUBLIC_DISPATCH_URL + "/tracker"}
+							rel="noopener noreferrer"
+							target="_blank"
+						>
+							<button
+								className="btn btn-sm btn-ghost tooltip tooltip-bottom"
+								data-tip="Zum Tracker"
+							>
+								<Radar size={20} />
+							</button>
+						</a>
+					</li>
 					<li>
 						<a
 							href={process.env.NEXT_PUBLIC_DISPATCH_URL || "#!"}
 							rel="noopener noreferrer"
 							target="_blank"
 						>
-						<button className="btn btn-sm btn-outline btn-primary">Zur Leitstelle</button>
+							<button className="btn btn-sm btn-outline btn-primary">
+								{session.user.permissions.includes("DISPO")
+									? "Zur Leitstelle"
+									: "Zum Operations Center"}
+							</button>
 						</a>
 					</li>
 					<li>
@@ -143,4 +166,5 @@ export const HorizontalNav = () => (
 				</ul>
 			</div>
 		</div>
-);
+	);
+};