diff --git a/packages/ra-core/package.json b/packages/ra-core/package.json index 2d9c50f8031..849f0b5e738 100644 --- a/packages/ra-core/package.json +++ b/packages/ra-core/package.json @@ -28,6 +28,7 @@ }, "devDependencies": { "@hookform/resolvers": "^3.2.0", + "@tanstack/react-query-devtools": "^5.21.7", "@testing-library/react": "^15.0.7", "@types/jest": "^29.5.2", "@types/jscodeshift": "^0.11.11", diff --git a/packages/ra-core/src/auth/CanAccess.stories.tsx b/packages/ra-core/src/auth/CanAccess.stories.tsx index 97d5109407d..534baaba63e 100644 --- a/packages/ra-core/src/auth/CanAccess.stories.tsx +++ b/packages/ra-core/src/auth/CanAccess.stories.tsx @@ -2,9 +2,10 @@ import * as React from 'react'; import { Location } from 'react-router'; import { QueryClient } from '@tanstack/react-query'; import { AuthProvider } from '../types'; -import { CoreAdminContext } from '../core'; +import { CoreAdminContext } from '../core/CoreAdminContext'; import { CanAccess } from './CanAccess'; -import { TestMemoryRouter } from '..'; +import { TestMemoryRouter } from '../routing/TestMemoryRouter'; +import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; export default { title: 'ra-core/auth/CanAccess', @@ -109,3 +110,49 @@ export const NoAuthProvider = () => ( ); + +const data = Array.from({ length: 1000 }, (_, i) => { + const post = { + id: i + 1, + title: `Post ${i + 1}`, + body: `This is the body of post ${i + 1}`, + }; + + Array.from({ length: 100 }, (_, i) => { + post[`property${i + 1}`] = `Another very long property ${i + 1}`; + }); + + return post; +}); + +export const ManyCalls = ({ + authProvider = defaultAuthProvider, + queryClient, +}: { + authProvider?: AuthProvider | null; + queryClient?: QueryClient; +}) => ( + + +
+ {data.map(post => ( + +
{post.title}
+
+ ))} + +
+
+
+); diff --git a/packages/ra-core/src/auth/useCanAccess.ts b/packages/ra-core/src/auth/useCanAccess.ts index 63db7906666..fd10ca8fe12 100644 --- a/packages/ra-core/src/auth/useCanAccess.ts +++ b/packages/ra-core/src/auth/useCanAccess.ts @@ -62,11 +62,15 @@ export const useCanAccess = < ); } const record = useRecordContext(params); - + const { record: _record, ...restParams } = params; const authProviderHasCanAccess = !!authProvider?.canAccess; const queryResult = useQuery({ - queryKey: ['auth', 'canAccess', { ...params, record, resource }], + queryKey: [ + 'auth', + 'canAccess', + { ...restParams, recordId: record?.id, resource }, + ], queryFn: async ({ signal }) => { if (!authProvider || !authProvider.canAccess) { return true; diff --git a/yarn.lock b/yarn.lock index f78ffb5c651..5ca3bbf8e40 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16028,6 +16028,7 @@ __metadata: dependencies: "@hookform/resolvers": "npm:^3.2.0" "@tanstack/react-query": "npm:^5.21.7" + "@tanstack/react-query-devtools": "npm:^5.21.7" "@testing-library/react": "npm:^15.0.7" "@types/jest": "npm:^29.5.2" "@types/jscodeshift": "npm:^0.11.11"