Merge pull request #7790 from marmelab/fix-edit-show-controllers-falsy-ids

Fix edit and show controllers do not handle falsy identifiers

Author: slax57

packages/ra-core/src/controller/edit/useEditController.spec.tsx

@@ -69,6 +69,44 @@ describe('useEditController', () => {
         await waitFor(() => {
             expect(getOne).toHaveBeenCalledWith('posts', { id: 'test?' });
         });
+        await waitFor(() => {
+            expect(screen.queryAllByText('hello')).toHaveLength(1);
+        });
+    });
+
+    it('should use the id provided through props if any', async () => {
+        const getOne = jest
+            .fn()
+            .mockImplementationOnce(() =>
+                Promise.resolve({ data: { id: 0, title: 'hello' } })
+            );
+        const dataProvider = ({ getOne } as unknown) as DataProvider;
+        const history = createMemoryHistory({
+            initialEntries: ['/posts/test%3F'],
+        });
+
+        render(
+            <CoreAdminContext dataProvider={dataProvider} history={history}>
+                <Routes>
+                    <Route
+                        path="/posts/:id"
+                        element={
+                            <EditController id={0} resource="posts">
+                                {({ record }) => (
+                                    <div>{record && record.title}</div>
+                                )}
+                            </EditController>
+                        }
+                    />
+                </Routes>
+            </CoreAdminContext>
+        );
+        await waitFor(() => {
+            expect(getOne).toHaveBeenCalledWith('posts', { id: 0 });
+        });
+        await waitFor(() => {
+            expect(screen.queryAllByText('hello')).toHaveLength(1);
+        });
     });
 
     it('should accept custom client query options', async () => {

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

@@ -61,7 +61,7 @@ export const useEditController = <
     const redirect = useRedirect();
     const refresh = useRefresh();
     const { id: routeId } = useParams<'id'>();
-    const id = propsId || decodeURIComponent(routeId);
+    const id = propsId != null ? propsId : decodeURIComponent(routeId);
     const { onSuccess, onError, ...otherMutationOptions } = mutationOptions;
     const {
         registerMutationMiddleware,

packages/ra-core/src/controller/show/useShowController.spec.tsx

@@ -66,6 +66,45 @@ describe('useShowController', () => {
         await waitFor(() => {
             expect(getOne).toHaveBeenCalledWith('posts', { id: 'test?' });
         });
+        await waitFor(() => {
+            expect(screen.queryAllByText('hello')).toHaveLength(1);
+        });
+    });
+
+    it('should use the id provided through props if any', async () => {
+        const getOne = jest
+            .fn()
+            .mockImplementationOnce(() =>
+                Promise.resolve({ data: { id: 0, title: 'hello' } })
+            );
+        const dataProvider = ({ getOne } as unknown) as DataProvider;
+        render(
+            <CoreAdminContext
+                dataProvider={dataProvider}
+                history={createMemoryHistory({
+                    initialEntries: ['/posts/test%3F'],
+                })}
+            >
+                <Routes>
+                    <Route
+                        path="posts/:id"
+                        element={
+                            <ShowController id={0} resource="posts">
+                                {({ record }) => (
+                                    <div>{record && record.title}</div>
+                                )}
+                            </ShowController>
+                        }
+                    />
+                </Routes>
+            </CoreAdminContext>
+        );
+        await waitFor(() => {
+            expect(getOne).toHaveBeenCalledWith('posts', { id: 0 });
+        });
+        await waitFor(() => {
+            expect(screen.queryAllByText('hello')).toHaveLength(1);
+        });
     });
 
     it('should accept custom client query options', async () => {

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

@@ -54,7 +54,7 @@ export const useShowController = <RecordType extends RaRecord = any>(
     const redirect = useRedirect();
     const refresh = useRefresh();
     const { id: routeId } = useParams<'id'>();
-    const id = propsId || decodeURIComponent(routeId);
+    const id = propsId != null ? propsId : decodeURIComponent(routeId);
 
     const { data: record, error, isLoading, isFetching, refetch } = useGetOne<
         RecordType