From 962853d0e47270a806522c8e7d46becd3c37783e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=B4me=20Burkard?= <burkardjerome@gmail.com>
Date: Wed, 5 Jul 2023 17:52:24 +0200
Subject: [PATCH] fix wrong appellation when contacting by email

---
 .../app/components/search/ContactByEmail.tsx  | 31 ++++++++++++-------
 1 file changed, 19 insertions(+), 12 deletions(-)

diff --git a/front/src/app/components/search/ContactByEmail.tsx b/front/src/app/components/search/ContactByEmail.tsx
index 21e3b2a60a..9a87ca49a7 100644
--- a/front/src/app/components/search/ContactByEmail.tsx
+++ b/front/src/app/components/search/ContactByEmail.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect } from "react";
 import { FormProvider, useForm } from "react-hook-form";
 import { fr } from "@codegouvfr/react-dsfr";
 import Alert from "@codegouvfr/react-dsfr/Alert";
@@ -66,13 +66,20 @@ export const ContactByEmail = ({
     mode: "onTouched",
     defaultValues: initialValues,
   });
+
   const {
     register,
     handleSubmit,
     formState,
     formState: { isSubmitting },
+    getValues,
+    reset,
   } = methods;
 
+  useEffect(() => {
+    reset({ ...getValues(), appellationCode: initialValues.appellationCode });
+  }, [appellations]);
+
   const getFieldError = makeFieldError(formState);
 
   const onFormValid = async (values: ContactEstablishmentByMailDto) => {
@@ -82,6 +89,7 @@ export const ContactByEmail = ({
     });
     onSuccess();
   };
+
   return (
     <FormProvider {...methods}>
       <form onSubmit={handleSubmit(onFormValid)}>
@@ -122,17 +130,16 @@ export const ContactByEmail = ({
             {...getFieldError("immersionObjective")}
           />
 
-          {appellations.length > 1 && (
-            <Select
-              label={"Métier sur lequel porte la demande d'immersion *"}
-              options={appellationListOfOptions}
-              placeholder={"Sélectionnez un métier"}
-              nativeSelectProps={{
-                ...register("appellationCode"),
-              }}
-              {...getFieldError("appellationCode")}
-            />
-          )}
+          <Select
+            disabled={appellations.length === 1}
+            label={"Métier sur lequel porte la demande d'immersion *"}
+            options={appellationListOfOptions}
+            placeholder={"Sélectionnez un métier"}
+            nativeSelectProps={{
+              ...register("appellationCode"),
+            }}
+            {...getFieldError("appellationCode")}
+          />
 
           <Input
             label="Votre message à l’entreprise *"