From b1641adbfad6b06e2e5cefe6360ba2e53776ff3c Mon Sep 17 00:00:00 2001
From: alexandre-kakal <84040142+alexandre-kakal@users.noreply.github.com>
Date: Wed, 26 Jun 2024 11:02:00 +0200
Subject: [PATCH] Ak event form (#23)

fix: authOptions callback
init event form

---------

Co-authored-by: alexandre-kakal-akarah <alexandre.kakal@akarah.com>
Co-authored-by: GuillaumeD <guillaume.deman@viacesi.fr>
---
 package-lock.json                           |  33 ++++
 package.json                                |   1 +
 src/app/(app)/layout.tsx                    |   2 +
 src/app/(app)/parcours/[id]/page.tsx        |  16 +-
 src/app/(app)/profil/page.tsx               |   3 +-
 src/app/api/journeys/route.ts               |   2 +-
 src/app/layout.tsx                          |  13 +-
 src/components/form/event/EventForm.tsx     | 208 ++++++++++++++++++++
 src/components/form/journey/JourneyForm.tsx |  17 +-
 src/components/ui/button.tsx                |  43 +++-
 src/components/ui/slider.tsx                |  28 +++
 src/lib/authOptions.ts                      |  15 +-
 src/providers/Providers.tsx                 |   5 +
 src/store/eventFormStore.ts                 |  25 +++
 src/types/enums/button.ts                   |   5 +
 src/validators/EventFormSchema.ts           |  51 +++++
 16 files changed, 439 insertions(+), 28 deletions(-)
 create mode 100644 src/components/form/event/EventForm.tsx
 create mode 100644 src/components/ui/slider.tsx
 create mode 100644 src/store/eventFormStore.ts
 create mode 100644 src/types/enums/button.ts
 create mode 100644 src/validators/EventFormSchema.ts

diff --git a/package-lock.json b/package-lock.json
index e35e4c1..80475dc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -16,6 +16,7 @@
         "@radix-ui/react-popover": "^1.1.1",
         "@radix-ui/react-radio-group": "^1.2.0",
         "@radix-ui/react-select": "^2.1.1",
+        "@radix-ui/react-slider": "^1.2.0",
         "@radix-ui/react-slot": "^1.1.0",
         "bcrypt": "^5.1.1",
         "class-variance-authority": "^0.7.0",
@@ -3419,6 +3420,38 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-slider": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-slider/-/react-slider-1.2.0.tgz",
+      "integrity": "sha512-dAHCDA4/ySXROEPaRtaMV5WHL8+JB/DbtyTbJjYkY0RXmKMO2Ln8DFZhywG5/mVQ4WqHDBc8smc14yPXPqZHYA==",
+      "dependencies": {
+        "@radix-ui/number": "1.1.0",
+        "@radix-ui/primitive": "1.1.0",
+        "@radix-ui/react-collection": "1.1.0",
+        "@radix-ui/react-compose-refs": "1.1.0",
+        "@radix-ui/react-context": "1.1.0",
+        "@radix-ui/react-direction": "1.1.0",
+        "@radix-ui/react-primitive": "2.0.0",
+        "@radix-ui/react-use-controllable-state": "1.1.0",
+        "@radix-ui/react-use-layout-effect": "1.1.0",
+        "@radix-ui/react-use-previous": "1.1.0",
+        "@radix-ui/react-use-size": "1.1.0"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+        "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@radix-ui/react-slot": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.1.0.tgz",
diff --git a/package.json b/package.json
index ec5b298..c056c91 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "@radix-ui/react-popover": "^1.1.1",
     "@radix-ui/react-radio-group": "^1.2.0",
     "@radix-ui/react-select": "^2.1.1",
+    "@radix-ui/react-slider": "^1.2.0",
     "@radix-ui/react-slot": "^1.1.0",
     "bcrypt": "^5.1.1",
     "class-variance-authority": "^0.7.0",
diff --git a/src/app/(app)/layout.tsx b/src/app/(app)/layout.tsx
index dc31b80..3657450 100644
--- a/src/app/(app)/layout.tsx
+++ b/src/app/(app)/layout.tsx
@@ -1,6 +1,7 @@
 import React from "react";
 import Nav from "@/components/Nav";
 import { ReactParallaxProvider } from "@/providers/Providers";
+import EventForm from "@/components/form/event/EventForm";
 
 export default function AppLayout({
   children,
@@ -10,6 +11,7 @@ export default function AppLayout({
   return (
     <ReactParallaxProvider>
       {children}
+      <EventForm />
       <Nav />
     </ReactParallaxProvider>
   );
diff --git a/src/app/(app)/parcours/[id]/page.tsx b/src/app/(app)/parcours/[id]/page.tsx
index 82398bf..bbe715d 100644
--- a/src/app/(app)/parcours/[id]/page.tsx
+++ b/src/app/(app)/parcours/[id]/page.tsx
@@ -2,6 +2,8 @@ import React from "react";
 import ParallaxImage from "@/components/clients/ParallaxImage";
 import Rating from "@/components/Rating";
 import { Icons } from "@/components/Icons";
+import { Button } from "@/components/ui/button";
+import { buttonAction } from "@/types/enums/button";
 
 type Params = { id: string };
 
@@ -9,8 +11,18 @@ const JourneyDetail = ({ params }: { params: Params }) => {
   // get journey by id
   return (
     <main className="flex min-h-screen flex-col bg-gray">
-      <ParallaxImage />
-      <div className="relative flex-1 -translate-y-4 rounded-t-2xl px-5 pb-40 pt-14">
+      <div className="relative">
+        <ParallaxImage />
+        <Button
+          action={buttonAction.SET_JOURNEY_ID}
+          ressourceId={parseInt(params.id)}
+          className="absolute right-5 top-5 border-orange bg-gray"
+        >
+          <span>Créer un évènement</span>
+          <Icons.arrowLink fill="#d8552b" className="ml-2" />
+        </Button>
+      </div>
+      <div className="relative flex-1 rounded-t-2xl px-5 pb-40 pt-14">
         <div className="absolute left-4 top-0 flex gap-[6px]">
           <div className="flex items-center rounded-b-md bg-white px-2 py-[6px]">
             <Icons.dumbbel />
diff --git a/src/app/(app)/profil/page.tsx b/src/app/(app)/profil/page.tsx
index 293e760..7dfd01b 100644
--- a/src/app/(app)/profil/page.tsx
+++ b/src/app/(app)/profil/page.tsx
@@ -3,6 +3,7 @@ import TopBar from "@/components/TopBar";
 import Link from "next/link";
 import { Icons } from "@/components/Icons";
 import { Button } from "@/components/ui/button";
+import { buttonAction } from "@/types/enums/button";
 
 const Profil = () => {
   return (
@@ -55,7 +56,7 @@ const Profil = () => {
             <span className="font-semibold">Mentions légales</span>
           </Link>
         </section>
-        <Button isSignOut variant="danger">
+        <Button action={buttonAction.SIGN_OUT} variant="danger">
           Déconnexion
         </Button>
         <Button variant="dangerFilled">Supprimer mon compte</Button>
diff --git a/src/app/api/journeys/route.ts b/src/app/api/journeys/route.ts
index a878f40..9a09036 100644
--- a/src/app/api/journeys/route.ts
+++ b/src/app/api/journeys/route.ts
@@ -1,4 +1,4 @@
-import { handleException } from "@/app/utils/errorHandlerUtils";
+import { handleException } from "@/utils/errorHandlerUtils";
 import {
   getAllJourneys,
   registerOrModifyJourney,
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index c70d794..b32aaf5 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import type { Metadata, Viewport } from "next";
 import { Inter } from "next/font/google";
 import "./globals.css";
+import { NextAuthProvider } from "@/providers/Providers";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -55,10 +56,12 @@ export default function RootLayout({
   children: React.ReactNode;
 }>) {
   return (
-    <html lang="fr">
-      <body className={`${inter.className} min-h-screen bg-background`}>
-        {children}
-      </body>
-    </html>
+    <NextAuthProvider>
+      <html lang="fr">
+        <body className={`${inter.className} min-h-screen bg-background`}>
+          {children}
+        </body>
+      </html>
+    </NextAuthProvider>
   );
 }
diff --git a/src/components/form/event/EventForm.tsx b/src/components/form/event/EventForm.tsx
new file mode 100644
index 0000000..72b5011
--- /dev/null
+++ b/src/components/form/event/EventForm.tsx
@@ -0,0 +1,208 @@
+"use client";
+import React, { useState } from "react";
+import { eventFormSchema } from "@/validators/EventFormSchema";
+import { z } from "zod";
+import { useEventFormStore } from "@/store/eventFormStore";
+import { useForm, SubmitHandler } from "react-hook-form";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/components/ui/form";
+import { Button } from "@/components/ui/button";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Icons } from "@/components/Icons";
+import { Input } from "@/components/ui/input";
+import { Label } from "@radix-ui/react-label";
+import { Event } from "@prisma/client";
+import { Textarea } from "@/components/ui/textarea";
+
+type EventRequestBody = Omit<Event, "id" | "createdAt" | "updatedAt">;
+export type EventFormValues = z.infer<typeof eventFormSchema>;
+
+const EventForm = () => {
+  const { isVisible, hideModal, journeyIdValue, setJourneyIdValue } =
+    useEventFormStore();
+  const [formStatus, setFormStatus] = useState<"idle" | "errored">("idle");
+
+  const form = useForm<EventFormValues>({
+    resolver: zodResolver(eventFormSchema),
+    defaultValues: {
+      title: "",
+      description: "",
+      numberPlayerMin: 1,
+      numberPlayerMax: 40,
+      isPrivate: false,
+      accessCode: undefined,
+    },
+  });
+
+  if (!isVisible) return null;
+
+  const processForm: SubmitHandler<EventFormValues> = async (data) => {
+    const parsedData = eventFormSchema.safeParse(data);
+    if (!parsedData.success || !journeyIdValue) {
+      setFormStatus("errored");
+      return;
+    }
+    try {
+      const body: EventRequestBody = {
+        journeyId: journeyIdValue,
+        authorId: 1,
+        title: data.title,
+        description: data.description,
+        numberPlayerMin: data.numberPlayerMin,
+        numberPlayerMax: data.numberPlayerMax,
+        isPrivate: data.isPrivate,
+        accessCode: data.accessCode || null,
+        endAt: data.endAt,
+        startAt: data.startAt,
+        image: "",
+      };
+      const response = await fetch("/api/events", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify(body),
+      });
+
+      console.log(response, "create event response");
+    } catch (error) {
+      console.log(error);
+    }
+    console.log(data);
+  };
+
+  const dismissModal = () => {
+    hideModal();
+    form.reset();
+    setFormStatus("idle");
+    setJourneyIdValue(null);
+  };
+
+  return (
+    <div className="fixed left-0 top-0 z-10 flex size-full flex-col overflow-scroll bg-background px-5  pb-12 pt-5">
+      <div className="flex justify-end">
+        <Button onClick={dismissModal}>
+          <span>Quitter</span>
+          <Icons.close width={14} height={14} className="ml-2" />
+        </Button>
+      </div>
+      <Form {...form}>
+        {!form.formState.isSubmitSuccessful && formStatus === "idle" && (
+          <form onSubmit={form.handleSubmit(processForm)}>
+            <FormField
+              control={form.control}
+              name="title"
+              render={({ field }) => (
+                <FormItem>
+                  <FormControl>
+                    <>
+                      <Label htmlFor="title">Titre*</Label>
+                      <Input {...field} id="title" />
+                    </>
+                  </FormControl>
+                  <FormMessage className="text-red-500" />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="description"
+              render={({ field }) => (
+                <FormItem>
+                  <FormControl>
+                    <>
+                      <Label htmlFor="description">Description*</Label>
+                      <Textarea {...field} id="description" />
+                    </>
+                  </FormControl>
+                  <FormMessage className="text-red-500" />
+                </FormItem>
+              )}
+            />
+            <div className="flex gap-5">
+              <FormField
+                control={form.control}
+                name="numberPlayerMin"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <>
+                        <Label htmlFor="numberPlayerMin">
+                          Nombre mininum de participants*
+                        </Label>
+                        <Input {...field} type="number" id="numberPlayerMin" />
+                      </>
+                    </FormControl>
+                    <FormMessage className="text-red-500" />
+                  </FormItem>
+                )}
+              />
+              <FormField
+                control={form.control}
+                name="numberPlayerMax"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <>
+                        <Label htmlFor="numberPlayerMax">
+                          Nombre maximum de participants*
+                        </Label>
+                        <Input {...field} type="number" id="numberPlayerMax" />
+                      </>
+                    </FormControl>
+                    <FormMessage className="text-red-500" />
+                  </FormItem>
+                )}
+              />
+            </div>
+          </form>
+        )}
+
+        {form.formState.isSubmitSuccessful && formStatus !== "errored" && (
+          <div className="mt-[10vh]">
+            <h2 className="mb-8 text-4xl font-bold">
+              Votre évènement a bien été enregistré !
+            </h2>
+            <p className="mb-6">
+              Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quasi
+              nam illo iste veniam ea! Doloremque distinctio mollitia omnis.
+            </p>
+            <Button type="button" onClick={dismissModal}>
+              <span>Terminer</span>
+              <Icons.check
+                width={14}
+                height={14}
+                className="ml-2"
+                fill="#d8552b"
+              />
+            </Button>
+          </div>
+        )}
+
+        {formStatus === "errored" && (
+          <div className="mt-[10vh]">
+            <h2 className="mb-8 text-4xl font-bold">
+              Oups, une erreur est survenue...
+            </h2>
+            <p className="mb-6">
+              Votre évènement n'a pas pu être créé, veuillez réessayer plus
+              tard.
+            </p>
+            <Button type="button" onClick={dismissModal}>
+              <span>Fermer</span>
+              <Icons.close width={14} height={14} className="ml-2" />
+            </Button>
+          </div>
+        )}
+      </Form>
+    </div>
+  );
+};
+
+export default EventForm;
diff --git a/src/components/form/journey/JourneyForm.tsx b/src/components/form/journey/JourneyForm.tsx
index 72d58c3..1686b43 100644
--- a/src/components/form/journey/JourneyForm.tsx
+++ b/src/components/form/journey/JourneyForm.tsx
@@ -18,6 +18,7 @@ import Steps from "./steps/Steps";
 import { Icons } from "@/components/Icons";
 import { StepWithoutDates } from "@/types/step";
 import { JourneyWithoutDates } from "@/types/journey";
+import { useSession } from "next-auth/react";
 
 export type JourneyFormValues = z.infer<typeof journeyFormSchema>;
 type FieldName = keyof JourneyFormValues;
@@ -59,6 +60,8 @@ const JourneyForm = () => {
   const [formStatus, setFormStatus] = useState<"idle" | "errored">("idle");
   const [currentStep, setCurrentStep] = useState(0);
   const [dir, setDir] = useState<"ltr" | "rtl">("ltr");
+  const { data: session } = useSession();
+  console.log(session, "session in journey form");
 
   const form = useForm<JourneyFormValues>({
     resolver: zodResolver(journeyFormSchema),
@@ -76,7 +79,6 @@ const JourneyForm = () => {
   });
 
   const processForm: SubmitHandler<JourneyFormValues> = async (data) => {
-    console.log("processing form");
     const { steps, ...journey } = data;
 
     const parsedSteps: JourneyStep = JSON.parse(steps);
@@ -142,16 +144,9 @@ const JourneyForm = () => {
     const fields = steps[currentStep].fields;
     const output = await form.trigger(fields as FieldName[]);
     if (!output) return;
-    if (currentStep < steps.length) {
-      if (currentStep === steps.length - 1) {
-        console.log("submitting");
-        // await form.handleSubmit(processForm)();
-      }
-
-      if (currentStep < steps.length - 1) {
-        setCurrentStep((step) => step + 1);
-        setDir("ltr");
-      }
+    if (currentStep < steps.length - 1) {
+      setCurrentStep((step) => step + 1);
+      setDir("ltr");
     }
   };
 
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index d388d11..a644abe 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -3,8 +3,11 @@ import * as React from "react";
 import { Slot } from "@radix-ui/react-slot";
 import { cva, type VariantProps } from "class-variance-authority";
 import { signOut } from "next-auth/react";
-
+import { useEventFormStore } from "@/store/eventFormStore";
 import { cn } from "@/lib/tailwindUtils";
+import { buttonAction } from "@/types/enums/button";
+import { BadRequestException } from "@/types/exceptions";
+import { handleException } from "@/utils/errorHandlerUtils";
 
 const buttonVariants = cva(
   "inline-flex items-center justify-center whitespace-nowrap text-sm font-medium uppercase  disabled:pointer-events-none disabled:opacity-50",
@@ -36,25 +39,55 @@ export interface ButtonProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement>,
     VariantProps<typeof buttonVariants> {
   asChild?: boolean;
-  isSignOut?: boolean;
+  action?: buttonAction;
+  ressourceId?: number;
 }
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   (
-    { className, variant, size, asChild = false, isSignOut = false, ...props },
+    {
+      className,
+      variant,
+      size,
+      asChild = false,
+      action,
+      ressourceId,
+      ...props
+    },
     ref,
   ) => {
     const Comp = asChild ? Slot : "button";
+
+    const { setJourneyIdValue, showModal } = useEventFormStore();
+    const handleAction = async () => {
+      try {
+        switch (action) {
+          case buttonAction.SIGN_OUT:
+            await signOut();
+            break;
+          case buttonAction.SET_JOURNEY_ID:
+            if (!ressourceId) throw new BadRequestException("id is required");
+            setJourneyIdValue(ressourceId);
+            showModal();
+            break;
+          default:
+            break;
+        }
+      } catch (error) {
+        handleException(error);
+      }
+    };
+
     return (
       <Comp
         className={cn(buttonVariants({ variant, size, className }))}
         ref={ref}
         {...props}
         onClick={
-          isSignOut
+          action
             ? async (e) => {
                 e.preventDefault();
-                await signOut();
+                await handleAction();
               }
             : props.onClick
         }
diff --git a/src/components/ui/slider.tsx b/src/components/ui/slider.tsx
new file mode 100644
index 0000000..883dbad
--- /dev/null
+++ b/src/components/ui/slider.tsx
@@ -0,0 +1,28 @@
+"use client";
+
+import * as React from "react";
+import * as SliderPrimitive from "@radix-ui/react-slider";
+
+import { cn } from "@/lib/tailwindUtils";
+
+const Slider = React.forwardRef<
+  React.ElementRef<typeof SliderPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>
+>(({ className, ...props }, ref) => (
+  <SliderPrimitive.Root
+    ref={ref}
+    className={cn(
+      "relative flex w-full touch-none select-none items-center",
+      className,
+    )}
+    {...props}
+  >
+    <SliderPrimitive.Track className="bg-secondary relative h-2 w-full grow overflow-hidden rounded-full">
+      <SliderPrimitive.Range className="bg-primary absolute h-full" />
+    </SliderPrimitive.Track>
+    <SliderPrimitive.Thumb className="border-primary block size-5 rounded-full border-2 bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" />
+  </SliderPrimitive.Root>
+));
+Slider.displayName = SliderPrimitive.Root.displayName;
+
+export { Slider };
diff --git a/src/lib/authOptions.ts b/src/lib/authOptions.ts
index 7724829..004c9a6 100644
--- a/src/lib/authOptions.ts
+++ b/src/lib/authOptions.ts
@@ -1,6 +1,7 @@
 import CredentialsProvider from "next-auth/providers/credentials";
 import { getUserById, signIn } from "@/services/userService";
 import { NextAuthOptions, Session } from "next-auth";
+import { JWT } from "next-auth/jwt";
 
 export const authOptions = {
   secret: process.env.NEXTAUTH_SECRET,
@@ -38,14 +39,22 @@ export const authOptions = {
   ],
   session: { strategy: "jwt" },
   callbacks: {
+    async jwt({ token, user, account, session }) {
+      console.log("account jwt callback", session);
+      if (user) {
+        // @ts-ignore
+        token.id = user.user.id;
+      }
+      return token;
+    },
+
     // @ts-ignore
-    async session(session: Session) {
+    async session(session: Session, token: JWT) {
       // @ts-ignore
-      const dbUser = await getUserById(session.token.id);
+      const dbUser = await getUserById(token?.id || session?.token?.id);
       // @ts-ignore
       session.session.user = {
         id: dbUser?.id,
-        email: dbUser?.email,
         username: dbUser?.username,
         name: dbUser?.name,
         lastName: dbUser?.lastName,
diff --git a/src/providers/Providers.tsx b/src/providers/Providers.tsx
index 9568c8b..2798a5f 100644
--- a/src/providers/Providers.tsx
+++ b/src/providers/Providers.tsx
@@ -1,6 +1,7 @@
 "use client";
 import React from "react";
 import { ParallaxProvider } from "react-scroll-parallax";
+import { SessionProvider } from "next-auth/react";
 
 type ProviderProps = {
   children?: React.ReactNode;
@@ -9,3 +10,7 @@ type ProviderProps = {
 export const ReactParallaxProvider = ({ children }: ProviderProps) => {
   return <ParallaxProvider>{children}</ParallaxProvider>;
 };
+
+export const NextAuthProvider = ({ children }: ProviderProps) => {
+  return <SessionProvider>{children}</SessionProvider>;
+};
diff --git a/src/store/eventFormStore.ts b/src/store/eventFormStore.ts
new file mode 100644
index 0000000..c8b06c1
--- /dev/null
+++ b/src/store/eventFormStore.ts
@@ -0,0 +1,25 @@
+import { create } from "zustand";
+
+interface EventFormStore {
+  isVisible: boolean;
+  showModal: () => void;
+  hideModal: () => void;
+  journeyIdValue: number | null;
+  setJourneyIdValue: (value: number | null) => void;
+}
+
+export const useEventFormStore = create<EventFormStore>((set) => ({
+  isVisible: true,
+  showModal: () => {
+    const body = document.querySelector("body");
+    body?.classList.add("overflow-hidden");
+    set({ isVisible: true });
+  },
+  hideModal: () => {
+    const body = document.querySelector("body");
+    body?.classList.remove("overflow-hidden");
+    set({ isVisible: false });
+  },
+  journeyIdValue: null,
+  setJourneyIdValue: (value) => set({ journeyIdValue: value }),
+}));
diff --git a/src/types/enums/button.ts b/src/types/enums/button.ts
new file mode 100644
index 0000000..914e061
--- /dev/null
+++ b/src/types/enums/button.ts
@@ -0,0 +1,5 @@
+/* eslint-disable no-unused-vars */
+export enum buttonAction {
+  SIGN_OUT = "SIGN_OUT",
+  SET_JOURNEY_ID = "SET_JOURNEY_ID",
+}
diff --git a/src/validators/EventFormSchema.ts b/src/validators/EventFormSchema.ts
new file mode 100644
index 0000000..4cd4081
--- /dev/null
+++ b/src/validators/EventFormSchema.ts
@@ -0,0 +1,51 @@
+import { z } from "zod";
+
+export const eventFormSchema = z.object({
+  title: z.string({
+    required_error: "Ce champ est requis",
+  }),
+  description: z.string({
+    required_error: "Ce champ est requis",
+  }),
+  numberPlayerMin: z
+    .number({
+      required_error: "Ce champ est requis",
+    })
+    .min(1, {
+      message: "Le nombre de joueur minimum doit être supérieur à 0",
+    }),
+  numberPlayerMax: z
+    .number({
+      required_error: "Ce champ est requis",
+    })
+    .max(40, {
+      message: "Le nombre de joueur maximum doit être inférieur à 40",
+    }),
+  isPrivate: z.boolean(),
+  accessCode: z.string().optional(),
+  startAt: z.date({
+    required_error: "Ce champ est requis",
+  }),
+  endAt: z.date({
+    required_error: "Ce champ est requis",
+  }),
+});
+
+eventFormSchema.superRefine((data, ctx) => {
+  if (data.numberPlayerMax <= data.numberPlayerMin) {
+    ctx.addIssue({
+      code: z.ZodIssueCode.custom,
+      message:
+        "Le nombre de joueur maximum doit être supérieur au nombre de joueur minimum",
+      path: ["numberPlayerMax"],
+    });
+  }
+
+  if (data.isPrivate && !data.accessCode) {
+    ctx.addIssue({
+      code: z.ZodIssueCode.custom,
+      message: "Un code d'accès est requis pour une partie privée",
+      path: ["accessCode"],
+    });
+  }
+});