Availability based on permissions

frontend/app/(auth)/dashboard/planning/_planning.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import Planning from "@/components/planning";
+import { useApi } from "@/hooks/use-api";
+import ICalendarEvent from "@/interfaces/ICalendarEvent";
+import IUser from "@/interfaces/IUser";
+import hasPermissions from "@/lib/hasPermissions";
+import { Loader2 } from "lucide-react";
+
+export default function PlanningPage({ user }: { user: IUser }) {
+	const {
+		data: requestedEvents,
+		isLoading,
+		success,
+		mutate,
+	} = useApi<ICalendarEvent[]>("/events", undefined, false, false);
+
+	if (isLoading) return <Loader2 className="animate-spin" />;
+	if (success)
+		return (
+			<Planning
+				modifiable={hasPermissions(user.roles, {
+					events: ["update", "insert", "delete"],
+				})}
+				events={requestedEvents ?? []}
+				mutate={mutate}
+			/>
+		);
+}