listController: fix

Author: slax57

packages/ra-core/src/controller/list/useListController.security.stories.tsx

@@ -11,6 +11,7 @@ import { Resource } from '../../core/Resource';
 import { AuthProvider, DataProvider } from '../../types';
 import { ListControllerProps, useListController } from './useListController';
 import { TestMemoryRouter } from '../../routing/TestMemoryRouter';
+import { useAuthState } from '../..';
 
 export default {
     title: 'ra-core/controller/list/useListController',
@@ -42,6 +43,16 @@ const defaultDataProvider = fakeDataProvider(
     process.env.NODE_ENV === 'development'
 );
 
+const Dashboard = () => {
+    useAuthState();
+    return (
+        <div style={styles.mainContainer}>
+            <div>Dashboard view</div>
+            <Link to="/posts">List</Link>
+        </div>
+    );
+};
+
 const Posts = (props: Partial<ListControllerProps>) => {
     const params = useListController({
         resource: 'posts',
@@ -62,6 +73,7 @@ const Posts = (props: Partial<ListControllerProps>) => {
                     </ul>
                 </div>
             )}
+            <Link to="/">Dashboard</Link>
         </div>
     );
 };
@@ -82,14 +94,16 @@ export const Authenticated = ({
     dataProvider?: DataProvider;
 }) => {
     return (
-        <CoreAdminContext
-            dataProvider={dataProvider}
-            authProvider={authProvider}
-        >
-            <CoreAdminUI>
-                <Resource name="posts" list={Posts} />
-            </CoreAdminUI>
-        </CoreAdminContext>
+        <TestMemoryRouter initialEntries={['/posts']}>
+            <CoreAdminContext
+                dataProvider={dataProvider}
+                authProvider={authProvider}
+            >
+                <CoreAdminUI>
+                    <Resource name="posts" list={Posts} />
+                </CoreAdminUI>
+            </CoreAdminContext>
+        </TestMemoryRouter>
     );
 };
 
@@ -101,16 +115,38 @@ export const DisableAuthentication = ({
     dataProvider?: DataProvider;
 }) => {
     return (
-        <CoreAdminContext
-            dataProvider={dataProvider}
-            authProvider={authProvider}
-        >
-            <CoreAdminUI>
-                <Resource name="posts" list={<Posts disableAuthentication />} />
-            </CoreAdminUI>
-        </CoreAdminContext>
+        <TestMemoryRouter initialEntries={['/posts']}>
+            <CoreAdminContext
+                dataProvider={dataProvider}
+                authProvider={authProvider}
+                dashboard={Dashboard}
+            >
+                <CoreAdminUI dashboard={Dashboard} accessDenied={AccessDenied}>
+                    <Resource
+                        name="posts"
+                        list={<Posts disableAuthentication />}
+                    />
+                </CoreAdminUI>
+            </CoreAdminContext>
+        </TestMemoryRouter>
     );
 };
+DisableAuthentication.args = {
+    authProvider: undefined,
+};
+DisableAuthentication.argTypes = {
+    authProvider: {
+        options: ['default', 'canAccess'],
+        mapping: {
+            default: undefined,
+            canAccess: {
+                ...defaultAuthProvider,
+                canAccess: () => Promise.resolve(false),
+            },
+        },
+        control: { type: 'inline-radio' },
+    },
+};
 
 export const CanAccess = ({
     authProviderDelay = 300,

packages/ra-core/src/controller/list/useListController.spec.tsx

@@ -589,6 +589,42 @@ describe('useListController', () => {
             expect(dataProvider.getList).toHaveBeenCalled();
             expect(authProvider.checkAuth).not.toHaveBeenCalled();
         });
+
+        it('should not call checkAuth nor canAccess when disableAuthentication is true', async () => {
+            const authProvider: AuthProvider = {
+                checkAuth: jest.fn().mockResolvedValue(true),
+                login: () => Promise.resolve(),
+                logout: () => Promise.resolve(),
+                checkError: () => Promise.resolve(),
+                getPermissions: () => Promise.resolve(),
+                canAccess: jest.fn().mockResolvedValue(false),
+            };
+            render(<DisableAuthentication authProvider={authProvider} />);
+            await screen.findByText('Post #1 - 90 votes');
+            expect(authProvider.checkAuth).not.toHaveBeenCalled();
+            expect(authProvider.canAccess).not.toHaveBeenCalled();
+        });
+
+        it('should not call checkAuth nor canAccess when disableAuthentication is true even if useAuthState was called before', async () => {
+            const authProvider: AuthProvider = {
+                checkAuth: jest.fn().mockResolvedValue(true),
+                login: () => Promise.resolve(),
+                logout: () => Promise.resolve(),
+                checkError: () => Promise.resolve(),
+                getPermissions: () => Promise.resolve(),
+                canAccess: jest.fn().mockResolvedValue(false),
+            };
+            render(<DisableAuthentication authProvider={authProvider} />);
+            await screen.findByText('Post #1 - 90 votes');
+            fireEvent.click(await screen.findByText('Dashboard'));
+            await screen.findByText('Dashboard view');
+            fireEvent.click(await screen.findByText('List'));
+            await screen.findByText('Post #1 - 90 votes');
+            // checkAuth is called twice: once by RA (with different params)
+            // and once by our custom Dashboard component
+            expect(authProvider.checkAuth).toHaveBeenCalledTimes(2);
+            expect(authProvider.canAccess).not.toHaveBeenCalled();
+        });
     });
 
     describe('onSelectAll', () => {

packages/ra-core/src/controller/list/useListController.ts

@@ -85,8 +85,7 @@ export const useListController = <
     const { isPending: isPendingCanAccess } = useRequireAccess<RecordType>({
         action: 'list',
         resource,
-        // If disableAuthentication is true then isPendingAuthenticated will always be true so this hook is disabled
-        enabled: !isPendingAuthenticated,
+        enabled: !disableAuthentication && !isPendingAuthenticated,
     });
 
     const translate = useTranslate();