Corrige le déclenchement du calcul de trajectoire

Author: farnoux

apps/app/src/app/pages/collectivite/Indicateurs/detail/IndicateurDetail.tsx

@@ -3,8 +3,8 @@
 import { useCollectiviteId } from '@/api/collectivites';
 import { INDICATEUR_TRAJECTOIRE_IDENTFIANTS } from '@/app/app/pages/collectivite/Trajectoire/constants';
 import SpinnerLoader from '@/app/ui/shared/SpinnerLoader';
-import { useCalculTrajectoire } from '../../Trajectoire/useCalculTrajectoire';
-import { useStatutTrajectoire } from '../../Trajectoire/useStatutTrajectoire';
+import { useStatutTrajectoire } from '../../Trajectoire/use-statut-trajectoire';
+import { useGetTrajectoire } from '../../Trajectoire/use-trajectoire';
 import { useIndicateurDefinition } from '../Indicateur/useIndicateurDefinition';
 import IndicateurLayout from './IndicateurLayout';
 
@@ -37,7 +37,7 @@ export const IndicateurDetail = ({
   const status = trajectoire?.status;
 
   // démarre le calcul de la trajectoire au chargement de la page
-  useCalculTrajectoire({
+  useGetTrajectoire({
     enabled:
       !isPerso &&
       !!definition?.identifiantReferentiel &&

apps/app/src/app/pages/collectivite/Trajectoire/DonneesCollectivite/DonneesCollectivite.tsx

@@ -1,8 +1,7 @@
+import { useCollectiviteId } from '@/api/collectivites';
 import { DATE_DEBUT } from '@/app/app/pages/collectivite/Trajectoire/constants';
-import { useCalculTrajectoire } from '@/app/app/pages/collectivite/Trajectoire/useCalculTrajectoire';
-import SpinnerLoader from '@/app/ui/shared/SpinnerLoader';
 import { Alert, Button, ModalFooter, RenderProps, Tab, Tabs } from '@/ui';
-import { useEffect } from 'react';
+import { useComputeTrajectoire } from '../use-trajectoire';
 import { TABS } from './constants';
 import { Secteur, TableauDonnees } from './TableauDonnees';
 import { useDonneesSectorisees } from './useDonneesSectorisees';
@@ -21,16 +20,15 @@ export const DonneesCollectivite = ({
 }: DonneesCollectiviteProps) => {
   const { donneesCompletes, donneesSectorisees } = useDonneesSectorisees();
   const { mutate: upsertValeur } = useUpsertValeurIndicateur();
-  const { isPending, isSuccess, refetch } = useCalculTrajectoire({
-    nouveauCalcul: true,
-  });
 
-  // ferme le dialogue quand le nouveau calcul est terminé
-  useEffect(() => {
-    if (isSuccess) {
-      modalProps.close();
-    }
-  }, [isSuccess]);
+  const collectiviteId = useCollectiviteId();
+
+  const { mutate: computeTrajectoire, isPending: isComputePending } =
+    useComputeTrajectoire({
+      onSuccess: () => {
+        modalProps.close();
+      },
+    });
 
   return (
     <div className="text-center">
@@ -80,19 +78,15 @@ export const DonneesCollectivite = ({
           Annuler
         </Button>
         <Button
-          icon={!isPending ? 'arrow-right-line' : undefined}
+          icon="arrow-right-line"
           iconPosition="right"
-          disabled={!donneesCompletes || isPending}
-          onClick={() => refetch()}
+          loading={isComputePending}
+          disabled={!donneesCompletes}
+          onClick={() => {
+            computeTrajectoire({ collectiviteId });
+          }}
         >
-          {isPending ? (
-            <>
-              Calcul en cours
-              <SpinnerLoader />
-            </>
-          ) : (
-            'Voir le résultat'
-          )}
+          {isComputePending ? '  Calcul en cours' : 'Voir le résultat'}
         </Button>
       </ModalFooter>
     </div>

apps/app/src/app/pages/collectivite/Trajectoire/Trajectoire.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { useCurrentCollectivite } from '@/api/collectivites';
+import { useTRPC } from '@/api/utils/trpc/client';
 import SpinnerLoader from '@/app/ui/shared/SpinnerLoader';
 import { VerificationTrajectoireStatus } from '@/domain/indicateurs';
 import { Alert, Button, Card, Modal } from '@/ui';
@@ -12,8 +13,8 @@ import DbErrorPicto from './db-error.svg';
 import { DonneesCollectivite } from './DonneesCollectivite/DonneesCollectivite';
 import TrajectoirePicto from './trajectoire.svg';
 import { TrajectoireCalculee } from './TrajectoireCalculee';
-import { useCalculTrajectoire } from './useCalculTrajectoire';
-import { getStatusKey, useStatutTrajectoire } from './useStatutTrajectoire';
+import { useStatutTrajectoire } from './use-statut-trajectoire';
+import { useGetTrajectoire } from './use-trajectoire';
 
 /**
  * Affiche l'écran approprié en fonction du statut du calcul de la trajectoire SNBC
@@ -138,10 +139,11 @@ const ErreurDeChargement = () => {
  * Affiche le message de présentation
  */
 const Presentation = () => {
-  const { isPending, data: trajectoire } = useCalculTrajectoire();
+  const { isPending, data: trajectoire } = useGetTrajectoire();
 
   const queryClient = useQueryClient();
-  const collectivite = useCurrentCollectivite();
+  const trpc = useTRPC();
+  const { collectiviteId } = useCurrentCollectivite();
 
   return (
     <div className="flex flex-col">
@@ -184,7 +186,11 @@ const Presentation = () => {
         <Button
           onClick={() => {
             queryClient.invalidateQueries({
-              queryKey: getStatusKey(collectivite.collectiviteId),
+              queryKey: trpc.indicateurs.trajectoires.snbc.checkStatus.queryKey(
+                {
+                  collectiviteId,
+                }
+              ),
             });
           }}
         >