Improved Changelog, Changelog in Dispatch

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

@@ -7,14 +7,22 @@ import AdminPanel from "_components/navbar/AdminPanel";
 import { getServerSession } from "api/auth/[...nextauth]/auth";
 import { WarningAlert } from "_components/navbar/PageAlert";
 import { Radar } from "lucide-react";
+import { ChangelogWrapper } from "_components/navbar/ChangelogWrapper";
+import { prisma } from "@repo/db";
 
 export default async function Navbar() {
 	const session = await getServerSession();
+	const latestChangelog = await prisma.changelog.findFirst({
+		orderBy: {
+			createdAt: "desc",
+		},
+	});
 
 	return (
 		<div className="navbar bg-base-100 flex justify-between gap-5 shadow-sm">
 			<div className="flex items-center gap-2">
-				<p className="text-xl font-semibold normal-case">VAR Leitstelle V2</p>
+				<p className="text-xl font-semibold normal-case">VAR Leitstelle</p>
+				<ChangelogWrapper latestChangelog={latestChangelog} />
 				{session?.user.permissions.includes("ADMIN_KICK") && <AdminPanel />}
 			</div>
 			<WarningAlert />

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

@@ -5,12 +5,20 @@ import Link from "next/link";
 import { Settings } from "./_components/Settings";
 import { WarningAlert } from "_components/navbar/PageAlert";
 import { Radar } from "lucide-react";
+import { prisma } from "@repo/db";
+import { ChangelogWrapper } from "_components/navbar/ChangelogWrapper";
 
-export default function Navbar() {
+export default async function Navbar() {
+	const latestChangelog = await prisma.changelog.findFirst({
+		orderBy: {
+			createdAt: "desc",
+		},
+	});
 	return (
 		<div className="navbar bg-base-100 flex justify-between gap-5 shadow-sm">
 			<div className="flex items-center gap-2">
 				<p className="text-xl font-semibold normal-case">VAR Operations Center</p>
+				<ChangelogWrapper latestChangelog={latestChangelog} />
 			</div>
 			<WarningAlert />
 			<div className="flex items-center gap-5">

apps/dispatch/app/_components/SmartPopup.tsx

@@ -113,7 +113,6 @@ export const SmartPopup = (
 	);
 
 	const handleConflict = useCallback(() => {
-		console.log("handleConflict in smartMarker", id, options);
 		const newAnchor = calculateAnchor(id, "popup", options);
 		setAnchor(newAnchor);
 	}, [id, options]);

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

@@ -0,0 +1,34 @@
+"use client";
+import { Changelog } from "@repo/db";
+import { ChangelogModalBtn } from "@repo/shared-components";
+import { useMutation } from "@tanstack/react-query";
+import { editUserAPI } from "_querys/user";
+import { useSession } from "next-auth/react";
+import toast from "react-hot-toast";
+
+export const ChangelogWrapper = ({ latestChangelog }: { latestChangelog: Changelog | null }) => {
+	const { data: session } = useSession();
+	const editUserMutation = useMutation({
+		mutationFn: editUserAPI,
+	});
+
+	const autoOpen = !session?.user.changelogAck && !!latestChangelog;
+
+	if (!latestChangelog) return null;
+	if (!session) return null;
+
+	return (
+		<ChangelogModalBtn
+			hideIcon
+			className="text-sm text-gray-500"
+			latestChangelog={latestChangelog}
+			autoOpen={autoOpen}
+			onClose={async () => {
+				await editUserMutation.mutateAsync({ id: session?.user.id, user: { changelogAck: true } });
+				if (!session?.user.changelogAck) {
+					toast.success("Changelog als gelesen markiert");
+				}
+			}}
+		/>
+	);
+};