refactor(resources): migrate sanction-check fetchers (#1034)

Author: ChibiBlasphem

packages/app-builder/src/components/Sanctions/EnrichMatchButton.tsx

@@ -0,0 +1,26 @@
+import { sanctionsI18n } from '@app-builder/components/Sanctions/sanctions-i18n';
+import { useLoaderRevalidator } from '@app-builder/contexts/LoaderRevalidatorContext';
+import { useEnrichMatchMutation } from '@app-builder/queries/screening/enrich-match';
+import { useCallbackRef } from '@app-builder/utils/hooks';
+import { useTranslation } from 'react-i18next';
+import { Button } from 'ui-design-system';
+import { Icon } from 'ui-icons';
+
+export function EnrichMatchButton({ matchId }: { matchId: string }) {
+  const { t } = useTranslation(sanctionsI18n);
+  const enrichMatchMutation = useEnrichMatchMutation();
+  const revalidate = useLoaderRevalidator();
+
+  const handleButtonClick = useCallbackRef(() => {
+    enrichMatchMutation.mutateAsync(matchId).then(() => {
+      revalidate();
+    });
+  });
+
+  return (
+    <Button type="button" variant="secondary" className="h-8" onClick={handleButtonClick}>
+      <Icon icon="download" className="size-5" />
+      {t('sanctions:enrich_button')}
+    </Button>
+  );
+}

packages/app-builder/src/components/Sanctions/MatchCard/MatchCard.tsx

@@ -1,5 +1,5 @@
+import { EnrichMatchButton } from '@app-builder/components/Sanctions/EnrichMatchButton';
 import { type SanctionCheckMatch } from '@app-builder/models/sanction-check';
-import { EnrichMatchButton } from '@app-builder/routes/ressources+/sanction-check+/enrich-match.$matchId';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { CollapsibleV2, Tag } from 'ui-design-system';

packages/app-builder/src/queries/screening/enrich-match.ts

@@ -0,0 +1,21 @@
+import { getRoute } from '@app-builder/utils/routes';
+import { fromUUIDtoSUUID } from '@app-builder/utils/short-uuid';
+import { useMutation } from '@tanstack/react-query';
+
+const endpoint = (matchId: string) =>
+  getRoute('/ressources/sanction-check/enrich-match/:matchId', {
+    matchId: fromUUIDtoSUUID(matchId),
+  });
+
+export const useEnrichMatchMutation = () => {
+  return useMutation({
+    mutationKey: ['screening', 'enrich-match'],
+    mutationFn: async (matchId: string) => {
+      const response = await fetch(endpoint(matchId), {
+        method: 'POST',
+      });
+
+      return response.json();
+    },
+  });
+};

packages/app-builder/src/routes/ressources+/sanction-check+/enrich-match.$matchId.tsx

@@ -1,15 +1,9 @@
 import { setToastMessage } from '@app-builder/components/MarbleToaster';
-import { sanctionsI18n } from '@app-builder/components/Sanctions/sanctions-i18n';
 import { isStatusConflictHttpError } from '@app-builder/models';
 import { initServerServices } from '@app-builder/services/init.server';
-import { useCallbackRef } from '@app-builder/utils/hooks';
 import { getRoute } from '@app-builder/utils/routes';
-import { fromParams, fromUUIDtoSUUID } from '@app-builder/utils/short-uuid';
+import { fromParams } from '@app-builder/utils/short-uuid';
 import { type ActionFunctionArgs } from '@remix-run/node';
-import { useFetcher } from '@remix-run/react';
-import { useTranslation } from 'react-i18next';
-import { Button } from 'ui-design-system';
-import { Icon } from 'ui-icons';
 
 export async function action({ request, params }: ActionFunctionArgs) {
   const {
@@ -26,17 +20,15 @@ export async function action({ request, params }: ActionFunctionArgs) {
   const t = await getFixedT(request, ['common', 'sanctions']);
 
   try {
-    const match = await sanctionCheck.enrichMatch({ matchId });
+    await sanctionCheck.enrichMatch({ matchId });
 
     setToastMessage(session, {
       type: 'success',
       message: t('sanctions:success.match_enriched'),
     });
 
     return Response.json(
-      {
-        match,
-      },
+      {},
       {
         headers: { 'Set-Cookie': await commitSession(session) },
       },
@@ -55,33 +47,10 @@ export async function action({ request, params }: ActionFunctionArgs) {
     });
 
     return Response.json(
-      { match: null },
+      {},
       {
         headers: { 'Set-Cookie': await commitSession(session) },
       },
     );
   }
 }
-
-export function EnrichMatchButton({ matchId }: { matchId: string }) {
-  const { t } = useTranslation(sanctionsI18n);
-  const fetcher = useFetcher<typeof action>();
-  const handleButtonClick = useCallbackRef(() => {
-    fetcher.submit(
-      {},
-      {
-        method: 'POST',
-        action: getRoute('/ressources/sanction-check/enrich-match/:matchId', {
-          matchId: fromUUIDtoSUUID(matchId),
-        }),
-      },
-    );
-  });
-
-  return (
-    <Button type="button" variant="secondary" className="h-8" onClick={handleButtonClick}>
-      <Icon icon="download" className="size-5" />
-      {t('sanctions:enrich_button')}
-    </Button>
-  );
-}