Fix users permissions throwing an error on audit logs page

packages/core/admin/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/hooks/useAuditLogsData.js

@@ -2,7 +2,7 @@ import { useQuery } from 'react-query';
 import { useNotification, useFetchClient } from '@strapi/helper-plugin';
 import { useLocation } from 'react-router-dom';
 
-const useAuditLogsData = ({ canRead }) => {
+const useAuditLogsData = ({ canReadAuditLogs, canReadUsers }) => {
   const { get } = useFetchClient();
   const { search } = useLocation();
   const toggleNotification = useNotification();
@@ -21,7 +21,6 @@ const useAuditLogsData = ({ canRead }) => {
   };
 
   const queryOptions = {
-    enabled: canRead,
     keepPreviousData: true,
     retry: false,
     staleTime: 1000 * 20, // 20 seconds
@@ -32,10 +31,14 @@ const useAuditLogsData = ({ canRead }) => {
     data: auditLogs,
     isLoading,
     isError: isAuditLogsError,
-  } = useQuery(['auditLogs', search], fetchAuditLogsPage, queryOptions);
+  } = useQuery(['auditLogs', search], fetchAuditLogsPage, {
+    ...queryOptions,
+    enabled: canReadAuditLogs,
+  });
 
   const { data: users, isError: isUsersError } = useQuery(['auditLogsUsers'], fetchAllUsers, {
     ...queryOptions,
+    enabled: canReadUsers,
     staleTime: 2 * (1000 * 60), // 2 minutes
   });
 

packages/core/admin/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/index.js

@@ -28,14 +28,22 @@ import useAuditLogsData from './hooks/useAuditLogsData';
 const ListView = () => {
   const { formatMessage } = useIntl();
   const {
-    allowedActions: { canRead },
+    allowedActions: { canRead: canReadAuditLogs },
   } = useRBAC(adminPermissions.settings.auditLogs);
+
+  const {
+    allowedActions: { canRead: canReadUsers },
+  } = useRBAC(adminPermissions.settings.users);
+
   const [{ query }, setQuery] = useQueryParams();
-  const { auditLogs, users, isLoading, hasError } = useAuditLogsData({ canRead });
+  const { auditLogs, users, isLoading, hasError } = useAuditLogsData({
+    canReadAuditLogs,
+    canReadUsers,
+  });
 
   useFocusWhenNavigate();
 
-  const displayedFilters = getDisplayedFilters({ formatMessage, users });
+  const displayedFilters = getDisplayedFilters({ formatMessage, users, canReadUsers });
 
   const title = formatMessage({
     id: 'global.auditLogs',
@@ -73,7 +81,7 @@ const ListView = () => {
         })}
       />
       <ActionLayout startActions={<Filters displayedFilters={displayedFilters} />} />
-      <ContentLayout canRead={canRead}>
+      <ContentLayout canRead={canReadAuditLogs}>
         <DynamicTable
           contentType="Audit logs"
           headers={headers}

packages/core/admin/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/utils/getDisplayedFilters.js

@@ -12,11 +12,12 @@ const customOperators = [
   },
 ];
 
-const getDisplayedFilters = ({ formatMessage, users }) => {
+const getDisplayedFilters = ({ formatMessage, users, canReadUsers }) => {
   const getDisplaynameFromUser = (user) => {
     if (user.username) {
       return user.username;
     }
+
     if (user.firstname && user.lastname) {
       return formatMessage(
         {
@@ -56,7 +57,7 @@ const getDisplayedFilters = ({ formatMessage, users }) => {
       };
     });
 
-  return [
+  const filters = [
     {
       name: 'action',
       metadatas: {
@@ -80,20 +81,28 @@ const getDisplayedFilters = ({ formatMessage, users }) => {
       },
       fieldSchema: { type: 'datetime' },
     },
-    {
-      name: 'user',
-      metadatas: {
-        customOperators,
-        label: formatMessage({
-          id: 'Settings.permissions.auditLogs.user',
-          defaultMessage: 'User',
-        }),
-        options: userOptions,
-        customInput: ComboboxFilter,
-      },
-      fieldSchema: { type: 'relation', mainField: { name: 'id' } },
-    },
   ];
+
+  if (canReadUsers) {
+    return [
+      ...filters,
+      {
+        name: 'user',
+        metadatas: {
+          customOperators,
+          label: formatMessage({
+            id: 'Settings.permissions.auditLogs.user',
+            defaultMessage: 'User',
+          }),
+          options: userOptions,
+          customInput: ComboboxFilter,
+        },
+        fieldSchema: { type: 'relation', mainField: { name: 'id' } },
+      },
+    ];
+  }
+
+  return filters;
 };
 
 export default getDisplayedFilters;