added Callback and custon notification Toast, client notification event handler

apps/dispatch/app/_components/customToasts/BaseNotification.tsx

@@ -0,0 +1,19 @@
+import { cn } from "helpers/cn";
+
+export const BaseNotification = ({
+	children,
+	className,
+	icon,
+}: {
+	children: React.ReactNode;
+	className?: string;
+	icon?: React.ReactNode;
+}) => {
+	return (
+		<div className={cn("alert alert-vertical flex flex-row gap-4")}>
+			{icon}
+
+			<div className={className}>{children}</div>
+		</div>
+	);
+};

apps/dispatch/app/_components/customToasts/HPGnotification.tsx

@@ -0,0 +1,57 @@
+import { NotificationPayload } from "@repo/db";
+import { BaseNotification } from "_components/customToasts/BaseNotification";
+import { MapStore, useMapStore } from "_store/mapStore";
+import { Check, Cross } from "lucide-react";
+import toast, { Toast } from "react-hot-toast";
+
+export const HPGnotificationToast = ({
+	event,
+	t,
+	mapStore,
+}: {
+	event: NotificationPayload;
+	t: Toast;
+	mapStore: MapStore;
+}) => {
+	const handleClick = () => {
+		toast.dismiss(t.id);
+		mapStore.setOpenMissionMarker({
+			open: [{ id: event.data.mission.id, tab: "home" }],
+			close: [],
+		});
+		mapStore.setMap({
+			center: [event.data.mission.addressLat, event.data.mission.addressLng],
+			zoom: 14,
+		});
+	};
+
+	if (event.status === "failed") {
+		return (
+			<BaseNotification icon={<Cross />} className="flex flex-row">
+				<div className="flex-1">
+					<h1 className="text-red-500 font-bold">HPG validierung fehlgeschlagen</h1>
+					<p>{event.message}</p>
+				</div>
+				<div className="ml-11">
+					<button className="btn" onClick={handleClick}>
+						anzeigen
+					</button>
+				</div>
+			</BaseNotification>
+		);
+	} else {
+		return (
+			<BaseNotification icon={<Check />} className="flex flex-row">
+				<div className="flex-1">
+					<h1 className="text-green-600 font-bold">HPG validierung erfolgreich</h1>
+					<p className="text-sm">{event.message}</p>
+				</div>
+				<div className="ml-11">
+					<button className="btn" onClick={handleClick}>
+						anzeigen
+					</button>
+				</div>
+			</BaseNotification>
+		);
+	}
+};