feat(website): vae collective code input page now supports a default codeInscription as an url search param

Author: agarbe

packages/reva-website/src/app/inscription-candidat/vae-collective/_components/VaeCollectiveCodeForm.tsx

@@ -32,7 +32,11 @@ const zodSchema = z.object({
 
 type FormData = z.infer<typeof zodSchema>;
 
-export function VaeCollectiveCodeForm() {
+export function VaeCollectiveCodeForm({
+  defaultValues,
+}: {
+  defaultValues?: FormData;
+}) {
   const router = useRouter();
   const { graphqlClient } = useGraphQlClient();
 
@@ -45,9 +49,7 @@ export function VaeCollectiveCodeForm() {
     clearErrors,
   } = useForm<FormData>({
     resolver: zodResolver(zodSchema),
-    defaultValues: {
-      code: "",
-    },
+    defaultValues,
     reValidateMode: "onSubmit",
   });
 

packages/reva-website/src/app/inscription-candidat/vae-collective/page.tsx

@@ -5,7 +5,13 @@ import { CandidateBackground } from "@/components/layout/full-height-blue-layout
 
 import { VaeCollectiveCodeForm } from "./_components/VaeCollectiveCodeForm";
 
-export default function VaeCollectiveCodePage() {
+export default async function VaeCollectiveCodePage({
+  searchParams,
+}: {
+  searchParams: Promise<{ codeInscription?: string }>;
+}) {
+  const { codeInscription } = await searchParams;
+
   return (
     <MainLayout>
       <CandidateBackground>
@@ -19,7 +25,11 @@ export default function VaeCollectiveCodePage() {
             </p>
             <div className="flex flex-col lg:flex-row lg:justify-between gap-20 lg:gap-28">
               <div className="w-full flex-basis-1/2 my-10">
-                <VaeCollectiveCodeForm />
+                <VaeCollectiveCodeForm
+                  defaultValues={{
+                    code: codeInscription ?? "",
+                  }}
+                />
               </div>
               <div className="flex flex-col flex-basis-1/2 my-auto">
                 <p className="text-xl leading-relaxed">

packages/reva-website/tests/vae-collective.spec.ts

@@ -132,4 +132,16 @@ test.describe("VAE Collective Code Page", () => {
       ),
     ).toBeVisible();
   });
+
+  test("should prefill the code input when a code is provided in the url", async ({
+    page,
+  }) => {
+    await page.goto(
+      "/inscription-candidat/vae-collective?codeInscription=ABCD1234",
+    );
+
+    const codeInput = page.getByRole("textbox");
+
+    await expect(codeInput).toHaveValue("ABCD1234");
+  });
 });