Rework Dispatch Navigation

This commit is contained in:
nocnico
2025-07-14 20:56:15 +02:00
parent d1c304c4de
commit 879e9d1e89
4 changed files with 77 additions and 86 deletions

View File

@@ -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"

View File

@@ -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"

View File

@@ -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>
);
}

View File

@@ -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>
);
);
};