Einsatz & Stationsliste mit Scroll Element #55

apps/dispatch/app/_components/left/SituationBoard.tsx

@@ -70,7 +70,7 @@ export const SituationBoard = () => {
 			{situationTabOpen && (
 				<div
 					tabIndex={0}
-					className="dropdown-content card bg-base-200 shadow-md z-[1100] ml-2 border-1 border-info"
+					className="dropdown-content card bg-base-200 shadow-md z-[1100] ml-2 border-1 border-info min-w-[900px] max-h-[300px]"
 				>
 					<div className="card-body flex flex-row gap-4">
 						<div className="flex-1">
@@ -90,7 +90,7 @@ export const SituationBoard = () => {
 									</label>
 								</div>
 							</div>
-							<div className="overflow-x-auto">
+							<div className="overflow-x-auto overflow-y-auto max-h-[170px] select-none">
 								<table className="table table-xs">
 									{/* head */}
 									<thead>
@@ -106,6 +106,10 @@ export const SituationBoard = () => {
 											(mission) =>
 												(dispatcherConnected || mission.state !== "draft") && (
 													<tr
+														className={cn(
+															"cursor-pointer",
+															mission.state === "draft" && "missionListItem",
+														)}
 														onDoubleClick={() => {
 															setOpenMissionMarker({
 																open: [
@@ -125,9 +129,8 @@ export const SituationBoard = () => {
 															});
 														}}
 														key={mission.id}
-														className={cn(mission.state === "draft" && "missionListItem")}
 													>
-														<td>{mission.publicId}</td>
+														<td>{mission.publicId.replace("ENr.: ", "")}</td>
 														<td>{mission.missionKeywordAbbreviation}</td>
 														<td>{mission.addressCity}</td>
 														<td>
@@ -147,7 +150,7 @@ export const SituationBoard = () => {
 							<h2 className="inline-flex items-center gap-2 text-lg font-bold mb-2">
 								<Plane /> Stationen
 							</h2>
-							<div className="overflow-x-auto">
+							<div className="overflow-x-auto overflow-y-auto max-h-[200px] select-none">
 								<table className="table table-xs">
 									<thead>
 										<tr>
@@ -159,6 +162,7 @@ export const SituationBoard = () => {
 									<tbody>
 										{connectedAircrafts?.map((station) => (
 											<tr
+												className="cursor-pointer"
 												key={station.id}
 												onDoubleClick={() => {
 													setOpenAircraftMarker({

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

@@ -0,0 +1,45 @@
+"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} /> Operations Center
+						</Link>
+					</li>
+				)}
+				<li>
+					<Link href={"/tracker"}>
+						<Radar size={22} /> Tracker
+					</Link>
+				</li>
+			</ul>
+		</div>
+	);
+}