🎨 Région, département + commune picker

MTES-MCT · Feb 13, 2025 · d5b475c · d5b475c
1 parent 3af64ff
commit d5b475c
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 29 deletions.
diff --git a/packages/applications/legacy/src/modules/project/events/ProjectDataCorrected.ts b/packages/applications/legacy/src/modules/project/events/ProjectDataCorrected.ts
@@ -17,6 +17,8 @@ export interface ProjectDataCorrectedPayload {
     email: string;
     adresseProjet: string;
     codePostalProjet: string;
+    regionProjet: string;
+    departementProjet: string;
     communeProjet: string;
     engagementFournitureDePuissanceAlaPointe: boolean;
     isFinancementParticipatif: boolean;

diff --git a/packages/applications/legacy/src/sagas/lauréat.saga.ts b/packages/applications/legacy/src/sagas/lauréat.saga.ts
@@ -135,6 +135,8 @@ export const register = () => {
                   .join('\n'),
                 communeProjet: event.payload.localité.commune,
                 codePostalProjet: event.payload.localité.codePostal,
+                departementProjet: event.payload.localité.département,
+                regionProjet: event.payload.localité.région,
               },
             },
           }),

diff --git a/...pplications/ssr/src/components/pages/lauréat/modifier/ModifierNomLocalitéLauréat.form.tsx b/...pplications/ssr/src/components/pages/lauréat/modifier/ModifierNomLocalitéLauréat.form.tsx
@@ -12,6 +12,7 @@ import { Form } from '@/components/atoms/form/Form';
 import { SubmitButton } from '@/components/atoms/form/SubmitButton';
 import { ValidationErrors } from '@/utils/formAction';
 import { Heading4 } from '@/components/atoms/headings';
+import { CommunePicker } from '@/components/molecules/CommunePicker';
 
 import {
   modifierNomLocalitéLauréatAction,
@@ -32,6 +33,13 @@ export const ModifierNomLocalitéLauréatForm = ({
     ValidationErrors<ModifierNomLocalitéLauréatFormKeys>
   >({});
 
+  const [commune, setCommune] = useState({
+    commune: localité.commune,
+    codePostal: localité.codePostal,
+    departement: localité.département,
+    region: localité.région,
+  });
+
   return (
     <Form
       action={modifierNomLocalitéLauréatAction}
@@ -92,28 +100,37 @@ export const ModifierNomLocalitéLauréatForm = ({
             defaultValue: localité.adresse2,
           }}
         />
-        <Input
-          state={validationErrors['codePostal'] ? 'error' : 'default'}
-          stateRelatedMessage={validationErrors['codePostal']}
-          label="Code Postal"
-          nativeInputProps={{
-            name: 'codePostal',
-            defaultValue: localité.codePostal,
-            required: true,
-            'aria-required': true,
-          }}
-        />
-        <Input
-          state={validationErrors['commune'] ? 'error' : 'default'}
-          stateRelatedMessage={validationErrors['commune']}
-          label="Commune"
-          nativeInputProps={{
-            name: 'commune',
-            defaultValue: localité.commune,
-            required: true,
-            'aria-required': true,
-          }}
-        />
+        <div className="flex flex-row gap-2 justify-between">
+          <CommunePicker
+            defaultValue={commune}
+            label="Commune"
+            nativeInputProps={{
+              required: true,
+              'aria-required': true,
+            }}
+            onSelected={(commune) => commune && setCommune(commune)}
+            className="mb-6 flex-1"
+          />
+          <input type="hidden" value={commune.commune} name="commune" />
+          {validationErrors['commune']}
+          <input type="hidden" value={commune.departement} name="departement" />
+          {validationErrors['departement']}
+          <input type="hidden" value={commune.region} name="region" />
+          {validationErrors['region']}
+          <Input
+            state={validationErrors['codePostal'] ? 'error' : 'default'}
+            stateRelatedMessage={validationErrors['codePostal']}
+            label="Code Postal"
+            nativeInputProps={{
+              name: 'codePostal',
+              defaultValue: commune.codePostal,
+              required: true,
+              'aria-required': true,
+              minLength: 5,
+              maxLength: 5,
+            }}
+          />
+        </div>
       </div>
     </Form>
   );

diff --git a/...pplications/ssr/src/components/pages/lauréat/modifier/ModifierNomLocalitéLauréat.page.tsx b/...pplications/ssr/src/components/pages/lauréat/modifier/ModifierNomLocalitéLauréat.page.tsx
@@ -26,7 +26,7 @@ export const ModifierNomEtLocalitéProjetPage: FC<ModifierNomEtLocalitéProjetPa
     banner={
       <ProjetBanner identifiantProjet={IdentifiantProjet.bind(identifiantProjet).formatter()} />
     }
-    heading={<Heading1>Modifier le nom du projet</Heading1>}
+    heading={<Heading1>Modifier le projet lauréat</Heading1>}
     leftColumn={{
       children: (
         <ModifierNomLocalitéLauréatForm

diff --git a/...plications/ssr/src/components/pages/lauréat/modifier/modifierNomLocalitéLauréat.action.ts b/...plications/ssr/src/components/pages/lauréat/modifier/modifierNomLocalitéLauréat.action.ts
@@ -12,17 +12,19 @@ import { withUtilisateur } from '@/utils/withUtilisateur';
 const schema = zod.object({
   identifiantProjet: zod.string().min(1),
   nomProjet: zod.string().min(1, { message: 'Champ obligatoire' }),
-  adresse1: zod.string().min(1),
+  adresse1: zod.string().min(1, { message: 'Champ obligatoire' }),
   adresse2: zod.string().optional(),
-  commune: zod.string().min(1),
+  commune: zod.string().min(1, { message: 'Champ obligatoire' }),
   codePostal: zod.string().min(5).max(5),
+  departement: zod.string().min(1, { message: 'Champ obligatoire' }),
+  region: zod.string().min(1, { message: 'Champ obligatoire' }),
 });
 
 export type ModifierNomLocalitéLauréatFormKeys = keyof zod.infer<typeof schema>;
 
 const action: FormAction<FormState, typeof schema> = async (
   _,
-  { identifiantProjet, nomProjet, adresse1, adresse2, codePostal, commune },
+  { identifiantProjet, nomProjet, adresse1, adresse2, codePostal, commune, departement, region },
 ) =>
   withUtilisateur(async (utilisateur) => {
     await mediator.send<Lauréat.ModifierLauréatUseCase>({
@@ -35,8 +37,8 @@ const action: FormAction<FormState, typeof schema> = async (
           adresse2: adresse2 || '',
           codePostal,
           commune,
-          département: '',
-          région: '',
+          département: departement,
+          région: region,
         },
         modifiéLeValue: new Date().toISOString(),
         modifiéParValue: utilisateur.identifiantUtilisateur.email,
@@ -47,7 +49,7 @@ const action: FormAction<FormState, typeof schema> = async (
       status: 'success',
       redirection: {
         url: Routes.Projet.details(identifiantProjet),
-        message: 'Le nom du projet a été modifié',
+        message: 'Le projet a été modifié',
       },
     };
   });