🐛 Fix: url for success box ssr (#2657)

MTES-MCT · Jan 24, 2025 · b9e7e21 · b9e7e21
1 parent e0693eb
commit b9e7e21
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 6 deletions.
diff --git a/packages/applications/legacy/src/views/components/UI/molecules/Alertes/SuccessBox.tsx b/packages/applications/legacy/src/views/components/UI/molecules/Alertes/SuccessBox.tsx
@@ -1,4 +1,4 @@
-import React, { ComponentProps, FC } from 'react';
+import React, { ComponentProps, FC, useEffect } from 'react';
 import { Alerte } from './Alerte';
 
 type AlertBoxProps = ComponentProps<'div'> & { title?: string };
@@ -8,4 +8,13 @@ export const SuccessBox: FC<AlertBoxProps> = ({
   children,
   className = '',
   ...props
-}: AlertBoxProps) => <Alerte {...{ ...props, type: 'Succès', title, className, children }} />;
+}: AlertBoxProps) => {
+  useEffect(() => {
+    window.scrollTo({
+      top: 0,
+      left: 0,
+    });
+  }, []);
+
+  return <Alerte {...{ ...props, type: 'Succès', title, className, children }} />;
+};
diff --git a/packages/applications/ssr/src/components/atoms/form/FormSuccessAlert.tsx b/packages/applications/ssr/src/components/atoms/form/FormSuccessAlert.tsx
@@ -1,4 +1,5 @@
 import Alert from '@codegouvfr/react-dsfr/Alert';
+import { useRouter, useSearchParams } from 'next/navigation';
 import { FC, useEffect } from 'react';
 
 type Props = {
@@ -13,9 +14,27 @@ export const FormSuccessAlert: FC<Props> = ({ message }) => {
     });
   }, []);
 
+  const searchParams = useSearchParams();
+  const router = useRouter();
+
+  const handleRemoveQueryParam = () => {
+    const params = new URLSearchParams(searchParams.toString());
+    params.delete('success');
+
+    const newUrl = `${window.location.pathname}?${params.toString()}`;
+    router.replace(newUrl, { scroll: false });
+  };
+
   return (
     <div className="mb-4">
-      <Alert small closable severity="success" description={<p>{message}</p>} />
+      <Alert
+        small
+        closable
+        severity="success"
+        onClose={handleRemoveQueryParam}
+        description={<p>{message}</p>}
+        className="min-h-10"
+      />
     </div>
   );
 };
diff --git a/.../ssr/src/components/pages/réseau/gestionnaire/ajouter/ajouterGestionnaireRéseau.action.ts b/.../ssr/src/components/pages/réseau/gestionnaire/ajouter/ajouterGestionnaireRéseau.action.ts
@@ -42,7 +42,7 @@ const action: FormAction<FormState, typeof schema> = async (
     status: 'success',
     redirection: {
       url: Routes.Gestionnaire.lister,
-      message: `Gestionnaire réseau ${raisonSociale} ajouté`,
+      message: `Le gestionnaire réseau ${raisonSociale} a été ajouté`,
     },
   };
 };

diff --git a/...components/pages/réseau/raccordement/corriger-par-lot/corrigerRéférencesDossier.action.ts b/...components/pages/réseau/raccordement/corriger-par-lot/corrigerRéférencesDossier.action.ts
@@ -85,7 +85,7 @@ const action: FormAction<FormState, typeof schema> = (_, { fichierCorrections })
         status: 'success',
         redirection: {
           url: Routes.Raccordement.lister,
-          message: `${success} références de dossier de raccordement mises à jour`,
+          message: `${success} références de dossier de raccordement ont été mises à jour`,
         },
       };
     }

diff --git a/.../ssr/src/components/pages/réseau/raccordement/corriger/corrigerRéférenceDossier.action.ts b/.../ssr/src/components/pages/réseau/raccordement/corriger/corrigerRéférenceDossier.action.ts
@@ -41,7 +41,7 @@ const action: FormAction<FormState, typeof schema> = (
         url: role.aLaPermission('raccordement.consulter')
           ? Routes.Raccordement.détail(identifiantProjet)
           : Routes.Raccordement.lister,
-        message: 'Référence du dossier de raccordement modifiée',
+        message: 'La référence du dossier de raccordement a été modifiée',
       },
     };
   });