From ec3f33b9bfcc6f5d94311b9b573aa94a050905b0 Mon Sep 17 00:00:00 2001
From: cdricms <36056008+cdricms@users.noreply.github.com>
Date: Tue, 18 Feb 2025 12:59:54 +0100
Subject: [PATCH] Calendar

---
 .../app/(auth)/dashboard/planning/page.tsx    | 25 ++++++++++++++
 frontend/components/app-sidebar.tsx           |  8 ++++-
 frontend/components/planning.tsx              | 33 ++++++++++---------
 3 files changed, 50 insertions(+), 16 deletions(-)
 create mode 100644 frontend/app/(auth)/dashboard/planning/page.tsx

diff --git a/frontend/app/(auth)/dashboard/planning/page.tsx b/frontend/app/(auth)/dashboard/planning/page.tsx
new file mode 100644
index 0000000..4079b32
--- /dev/null
+++ b/frontend/app/(auth)/dashboard/planning/page.tsx
@@ -0,0 +1,25 @@
+"use client";
+
+import Planning from "@/components/planning";
+import { useApi } from "@/hooks/use-api";
+import ICalendarEvent from "@/interfaces/ICalendarEvent";
+import { Loader2 } from "lucide-react";
+
+export default function Page() {
+	const {
+		data: requestedEvents,
+		isLoading,
+		success,
+		mutate,
+	} = useApi<ICalendarEvent[]>("/events", undefined, false, false);
+
+	if (isLoading) return <Loader2 className="animate-spin" />;
+	if (success)
+		return (
+			<Planning
+				modifiable
+				events={requestedEvents ?? []}
+				mutate={mutate}
+			/>
+		);
+}
diff --git a/frontend/components/app-sidebar.tsx b/frontend/components/app-sidebar.tsx
index 15bbbf2..f73ad33 100644
--- a/frontend/components/app-sidebar.tsx
+++ b/frontend/components/app-sidebar.tsx
@@ -63,8 +63,14 @@ const data = {
 		},
 		{
 			title: "Planning",
-			url: "/dashboard/planning",
 			icon: Calendar,
+			url: "/dashboard/planning",
+			items: [
+				{
+					title: "Planning",
+					url: "/dashboard/planning",
+				},
+			],
 		},
 		{
 			title: "Blogs",
diff --git a/frontend/components/planning.tsx b/frontend/components/planning.tsx
index b05f53d..ac5beb6 100644
--- a/frontend/components/planning.tsx
+++ b/frontend/components/planning.tsx
@@ -31,18 +31,20 @@ import mapFrequencyToRrule from "@/lib/mapFrequencyToRrule";
 const Planning: React.FC<{
 	events: ICalendarEvent[];
 	mutate?: KeyedMutator<ApiResponse<ICalendarEvent[]>>;
-}> = ({ events, mutate }) => {
+	modifiable?: boolean;
+}> = ({ events, mutate, modifiable = false }) => {
 	const { resolvedTheme } = useTheme();
 	console.log(resolvedTheme);
 	const isConnected = getCookie("auth_token");
-	const plugins = isConnected
-		? [
-				createEventsServicePlugin(),
-				createDragAndDropPlugin(),
-				createResizePlugin(),
-				createEventRecurrencePlugin(),
-			]
-		: [];
+	const plugins =
+		isConnected && modifiable
+			? [
+					createEventsServicePlugin(),
+					createDragAndDropPlugin(),
+					createResizePlugin(),
+					createEventRecurrencePlugin(),
+				]
+			: [];
 	const [eventSelected, setEventSelected] = useState<ICalendarEvent | null>(
 		null,
 	);
@@ -53,7 +55,7 @@ const Planning: React.FC<{
 	const handleEventUpdate = async (
 		eventSelected: ICalendarEvent | Omit<ICalendarEvent, "id">,
 	) => {
-		if (!isConnected) return;
+		if (!isConnected || !modifiable) return;
 		const event = {
 			...eventSelected,
 			start: `${new Date(eventSelected.start).toISOString()}`,
@@ -114,7 +116,7 @@ const Planning: React.FC<{
 	}, [resolvedTheme]);
 
 	const AddButton: React.FC = () => {
-		if (!isConnected) return <></>;
+		if (!isConnected || !modifiable) return <></>;
 		return (
 			<Button onClick={() => setNewEvent({})} variant="outline">
 				Nouveau
@@ -128,14 +130,14 @@ const Planning: React.FC<{
 				<AddButton />
 				<ScheduleXCalendar calendarApp={calendar} />
 			</div>
-			{newEvent && (
+			{newEvent && isConnected && modifiable && (
 				<EventDialog
 					open={newEvent !== null || false}
 					onOpenChange={(open) => {
 						setNewEvent((e) => (open ? e : null));
 					}}
 					onAdd={async (formValues) => {
-						if (!isConnected) return;
+						if (!isConnected || !modifiable) return;
 						const rrule = mapFrequencyToRrule(
 							formValues.frequency,
 							formValues.frequencyEndDate,
@@ -179,7 +181,7 @@ const Planning: React.FC<{
 					event={newEvent}
 				/>
 			)}
-			{eventSelected && (
+			{eventSelected && modifiable && isConnected && (
 				<EventDialog
 					open={eventSelected !== null || false}
 					onOpenChange={(open) => {
@@ -187,7 +189,7 @@ const Planning: React.FC<{
 					}}
 					event={eventSelected}
 					onDelete={async (id) => {
-						if (!isConnected) return;
+						if (!isConnected || !modifiable) return;
 						calendar?.events?.remove(id);
 						try {
 							const res = await request<undefined>(
@@ -210,6 +212,7 @@ const Planning: React.FC<{
 						setEventSelected(null);
 					}}
 					onUpdate={async (formValues) => {
+						if (!isConnected || !modifiable) return;
 						const rrule = mapFrequencyToRrule(
 							formValues.frequency,
 							formValues.frequencyEndDate,