Merge pull request #10776 from marmelab/fix/edit-redirect-loop

Fix(show/edit): Avoid a redirect loop when useGetOne returns an error in shadcn-admin-kit

Author: djhi

packages/ra-core/src/controller/edit/useEditController.ts

@@ -3,7 +3,11 @@ import { useParams } from 'react-router-dom';
 
 import { useAuthenticated, useRequireAccess } from '../../auth';
 import { RaRecord, MutationMode, TransformData } from '../../types';
-import { useRedirect, RedirectionSideEffect } from '../../routing';
+import {
+    useRedirect,
+    RedirectionSideEffect,
+    useCreatePath,
+} from '../../routing';
 import { useNotify } from '../../notification';
 import {
     useGetOne,
@@ -82,6 +86,7 @@ export const useEditController = <
     const getRecordRepresentation = useGetRecordRepresentation(resource);
     const translate = useTranslate();
     const notify = useNotify();
+    const createPath = useCreatePath();
     const redirect = useRedirect();
     const refresh = useRefresh();
     const { id: routeId } = useParams<'id'>();
@@ -121,7 +126,15 @@ export const useEditController = <
                 notify('ra.notification.item_doesnt_exist', {
                     type: 'error',
                 });
-                redirect('list', resource);
+                // We need to flushSync to ensure the redirect happens before the refresh
+                // Otherwise this can cause an infinite loop when the record is not found
+                redirect(() => ({
+                    pathname: createPath({
+                        resource,
+                        type: 'list',
+                    }),
+                    flushSync: true,
+                }));
                 refresh();
             },
             refetchOnReconnect: false,

packages/ra-core/src/controller/show/useShowController.ts

@@ -9,7 +9,7 @@ import {
     UseGetOneOptions,
 } from '../../dataProvider';
 import { useTranslate } from '../../i18n';
-import { useRedirect } from '../../routing';
+import { useCreatePath, useRedirect } from '../../routing';
 import { useNotify } from '../../notification';
 import {
     useResourceContext,
@@ -80,6 +80,7 @@ export const useShowController = <
     const getRecordRepresentation = useGetRecordRepresentation(resource);
     const translate = useTranslate();
     const notify = useNotify();
+    const createPath = useCreatePath();
     const redirect = useRedirect();
     const refresh = useRefresh();
     const { id: routeId } = useParams<'id'>();
@@ -109,7 +110,16 @@ export const useShowController = <
                 notify('ra.notification.item_doesnt_exist', {
                     type: 'error',
                 });
-                redirect('list', resource);
+
+                // We need to flushSync to ensure the redirect happens before the refresh
+                // Otherwise this can cause an infinite loop when the record is not found
+                redirect(() => ({
+                    pathname: createPath({
+                        resource,
+                        type: 'list',
+                    }),
+                    flushSync: true,
+                }));
                 refresh();
             },
             retry: false,