@strapi/admin 4.6.0-beta.2 → 4.6.1

package/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/ComboboxFilter/index.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useIntl } from 'react-intl';
+import { Combobox, ComboboxOption } from '@strapi/design-system';
+
+const ComboboxFilter = ({ value, options, onChange }) => {
+  const { formatMessage } = useIntl();
+  const ariaLabel = formatMessage({
+    id: 'Settings.permissions.auditLogs.filter.aria-label',
+    defaultMessage: 'Search and select an option to filter',
+  });
+
+  return (
+    <Combobox aria-label={ariaLabel} value={value} onChange={onChange}>
+      {options.map(({ label, customValue }) => {
+        return (
+          <ComboboxOption key={customValue} value={customValue}>
+            {label}
+          </ComboboxOption>
+        );
+      })}
+    </Combobox>
+  );
+};
+
+ComboboxFilter.defaultProps = {
+  value: null,
+};
+
+ComboboxFilter.propTypes = {
+  value: PropTypes.string,
+  options: PropTypes.arrayOf(
+    PropTypes.shape({
+      label: PropTypes.string.isRequired,
+      customValue: PropTypes.string.isRequired,
+    }).isRequired
+  ).isRequired,
+  onChange: PropTypes.func.isRequired,
+};
+
+export default ComboboxFilter;

package/{admin/src → ee/admin}/pages/SettingsPage/pages/AuditLogs/ListView/Modal/ActionBody.js

@@ -7,8 +7,7 @@ import { Box } from '@strapi/design-system/Box';
 import { Flex } from '@strapi/design-system/Flex';
 import { Typography } from '@strapi/design-system/Typography';
 import { JSONInput } from '@strapi/design-system/JSONInput';
-import { pxToRem } from '@strapi/helper-plugin';
-import getDefaultMessage from '../utils/getActionTypesDefaultMessages';
+import { getDefaultMessage } from '../utils/getActionTypesDefaultMessages';
 import ActionItem from './ActionItem';
 
 const ActionBody = ({ status, data, formattedDate }) => {
@@ -83,7 +82,6 @@ const ActionBody = ({ status, data, formattedDate }) => {
       <JSONInput
         value={JSON.stringify(payload, null, 2)}
         disabled
-        height={pxToRem(150)}
         label={formatMessage({
           id: 'Settings.permissions.auditLogs.payload',
           defaultMessage: 'Payload',

package/{admin/src → ee/admin}/pages/SettingsPage/pages/AuditLogs/ListView/Modal/index.js

@@ -14,6 +14,10 @@ const Modal = ({ handleClose, logId }) => {
   const fetchAuditLog = async (id) => {
     const { data } = await get(`/admin/audit-logs/${id}`);
 
+    if (!data) {
+      throw new Error('Audit log not found');
+    }
+
     return data;
   };
 
@@ -46,7 +50,7 @@ const Modal = ({ handleClose, logId }) => {
 
 Modal.propTypes = {
   handleClose: PropTypes.func.isRequired,
-  logId: PropTypes.number.isRequired,
+  logId: PropTypes.string.isRequired,
 };
 
 export default Modal;

package/{admin/src → ee/admin}/pages/SettingsPage/pages/AuditLogs/ListView/TableRows/index.js

@@ -8,7 +8,7 @@ import { Tbody, Td, Tr } from '@strapi/design-system/Table';
 import Eye from '@strapi/icons/Eye';
 import { onRowClick, stopPropagation } from '@strapi/helper-plugin';
 import useFormatTimeStamp from '../hooks/useFormatTimeStamp';
-import getDefaultMessage from '../utils/getActionTypesDefaultMessages';
+import { getDefaultMessage } from '../utils/getActionTypesDefaultMessages';
 
 const TableRows = ({ headers, rows, onOpenModal }) => {
   const { formatMessage } = useIntl();

package/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/hooks/useAuditLogsData.js

@@ -0,0 +1,47 @@
+import { useQuery } from 'react-query';
+import { useNotification, useFetchClient } from '@strapi/helper-plugin';
+import { useLocation } from 'react-router-dom';
+
+const useAuditLogsData = ({ canRead }) => {
+  const { get } = useFetchClient();
+  const { search } = useLocation();
+  const toggleNotification = useNotification();
+
+  const fetchAuditLogsPage = async ({ queryKey }) => {
+    const search = queryKey[1];
+    const { data } = await get(`/admin/audit-logs${search}`);
+
+    return data;
+  };
+
+  const fetchAllUsers = async () => {
+    const { data } = await get(`/admin/users`);
+
+    return data;
+  };
+
+  const queryOptions = {
+    enabled: canRead,
+    keepPreviousData: true,
+    retry: false,
+    staleTime: 1000 * 20, // 20 seconds
+    onError: (error) => toggleNotification({ type: 'warning', message: error.message }),
+  };
+
+  const {
+    data: auditLogs,
+    isLoading,
+    isError: isAuditLogsError,
+  } = useQuery(['auditLogs', search], fetchAuditLogsPage, queryOptions);
+
+  const { data: users, isError: isUsersError } = useQuery(['auditLogsUsers'], fetchAllUsers, {
+    ...queryOptions,
+    staleTime: 2 * (1000 * 60), // 2 minutes
+  });
+
+  const hasError = isAuditLogsError || isUsersError;
+
+  return { auditLogs, users: users?.data, isLoading, hasError };
+};
+
+export default useAuditLogsData;

package/{admin/src → ee/admin}/pages/SettingsPage/pages/AuditLogs/ListView/index.js

@@ -1,53 +1,41 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { useIntl } from 'react-intl';
 import {
   SettingsPageTitle,
   DynamicTable,
   useRBAC,
-  useNotification,
   useFocusWhenNavigate,
-  useFetchClient,
+  useQueryParams,
+  AnErrorOccurred,
 } from '@strapi/helper-plugin';
-import { HeaderLayout, ContentLayout } from '@strapi/design-system/Layout';
-import { Main } from '@strapi/design-system/Main';
-import { useLocation } from 'react-router-dom';
-import { useQuery } from 'react-query';
-import adminPermissions from '../../../../../permissions';
+import {
+  Box,
+  HeaderLayout,
+  ContentLayout,
+  ActionLayout,
+  Layout,
+  Main,
+} from '@strapi/design-system';
+import adminPermissions from '../../../../../../../admin/src/permissions';
 import TableRows from './TableRows';
 import tableHeaders from './utils/tableHeaders';
 import PaginationFooter from './PaginationFooter';
 import Modal from './Modal';
+import Filters from '../../../../../../../admin/src/pages/SettingsPage/components/Filters';
+import getDisplayedFilters from './utils/getDisplayedFilters';
+import useAuditLogsData from './hooks/useAuditLogsData';
 
 const ListView = () => {
   const { formatMessage } = useIntl();
-  const toggleNotification = useNotification();
   const {
     allowedActions: { canRead },
   } = useRBAC(adminPermissions.settings.auditLogs);
-  const { get } = useFetchClient();
-  const { search } = useLocation();
+  const [{ query }, setQuery] = useQueryParams();
+  const { auditLogs, users, isLoading, hasError } = useAuditLogsData({ canRead });
 
   useFocusWhenNavigate();
 
-  const fetchAuditLogsPage = async ({ queryKey }) => {
-    const search = queryKey[1];
-    const { data } = await get(`/admin/audit-logs${search}`);
-
-    return data;
-  };
-
-  const { data, isLoading } = useQuery(['auditLogs', search], fetchAuditLogsPage, {
-    enabled: canRead,
-    keepPreviousData: true,
-    retry: false,
-    staleTime: 1000 * 20,
-    onError() {
-      toggleNotification({
-        type: 'warning',
-        message: { id: 'notification.error', defaultMessage: 'An error occured' },
-      });
-    },
-  });
+  const displayedFilters = getDisplayedFilters({ formatMessage, users });
 
   const title = formatMessage({
     id: 'global.auditLogs',
@@ -62,7 +50,17 @@ const ListView = () => {
     },
   }));
 
-  const [modalLogId, setModalLogId] = useState(null);
+  if (hasError) {
+    return (
+      <Layout>
+        <ContentLayout>
+          <Box paddingTop={8}>
+            <AnErrorOccurred />
+          </Box>
+        </ContentLayout>
+      </Layout>
+    );
+  }
 
   return (
     <Main aria-busy={isLoading}>
@@ -74,23 +72,24 @@ const ListView = () => {
           defaultMessage: 'Logs of all the activities that happened in your environment',
         })}
       />
+      <ActionLayout startActions={<Filters displayedFilters={displayedFilters} />} />
       <ContentLayout canRead={canRead}>
         <DynamicTable
           contentType="Audit logs"
           headers={headers}
-          rows={data?.results || []}
+          rows={auditLogs?.results || []}
           withBulkActions
           isLoading={isLoading}
         >
           <TableRows
             headers={headers}
-            rows={data?.results || []}
-            onOpenModal={(id) => setModalLogId(id)}
+            rows={auditLogs?.results || []}
+            onOpenModal={(id) => setQuery({ id })}
           />
         </DynamicTable>
-        <PaginationFooter pagination={data?.pagination} />
+        <PaginationFooter pagination={auditLogs?.pagination} />
       </ContentLayout>
-      {modalLogId && <Modal handleClose={() => setModalLogId(null)} logId={modalLogId} />}
+      {query?.id && <Modal handleClose={() => setQuery({ id: null }, 'remove')} logId={query.id} />}
     </Main>
   );
 };

package/{admin/src → ee/admin}/pages/SettingsPage/pages/AuditLogs/ListView/utils/getActionTypesDefaultMessages.js

@@ -1,12 +1,15 @@
-const actionTypes = {
-  'entry.create': 'Create entry ({model})',
-  'entry.update': 'Update entry ({model})',
-  'entry.delete': 'Delete entry ({model})',
-  'entry.publish': 'Publish entry ({model})',
-  'entry.unpublish': 'Unpublish entry ({model})',
+export const actionTypes = {
+  'entry.create': 'Create entry{model, select, undefined {} other { ({model})}}',
+  'entry.update': 'Update entry{model, select, undefined {} other { ({model})}}',
+  'entry.delete': 'Delete entry{model, select, undefined {} other { ({model})}}',
+  'entry.publish': 'Publish entry{model, select, undefined {} other { ({model})}}',
+  'entry.unpublish': 'Unpublish entry{model, select, undefined {} other { ({model})}}',
   'media.create': 'Create media',
   'media.update': 'Update media',
   'media.delete': 'Delete media',
+  'media-folder.create': 'Create media folder',
+  'media-folder.update': 'Update media folder',
+  'media-folder.delete': 'Delete media folder',
   'user.create': 'Create user',
   'user.update': 'Update user',
   'user.delete': 'Delete user',
@@ -26,8 +29,6 @@ const actionTypes = {
   'permission.delete': 'Delete permission',
 };
 
-const getDefaultMessage = (value) => {
+export const getDefaultMessage = (value) => {
   return actionTypes[value] || value;
 };
-
-export default getDefaultMessage;

package/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/utils/getDisplayedFilters.js

@@ -0,0 +1,88 @@
+import ComboboxFilter from '../ComboboxFilter';
+import { getDefaultMessage, actionTypes } from './getActionTypesDefaultMessages';
+
+const customOperators = [
+  {
+    intlLabel: { id: 'components.FilterOptions.FILTER_TYPES.$eq', defaultMessage: 'is' },
+    value: '$eq',
+  },
+  {
+    intlLabel: { id: 'components.FilterOptions.FILTER_TYPES.$ne', defaultMessage: 'is not' },
+    value: '$ne',
+  },
+];
+
+const getDisplayedFilters = ({ formatMessage, users }) => {
+  const actionOptions = Object.keys(actionTypes).map((action) => {
+    return {
+      label: formatMessage(
+        {
+          id: `Settings.permissions.auditLogs.${action}`,
+          defaultMessage: getDefaultMessage(action),
+        },
+        { model: undefined }
+      ),
+      customValue: action,
+    };
+  });
+
+  const userOptions =
+    users &&
+    users.results.map((user) => {
+      return {
+        label: formatMessage(
+          {
+            id: 'Settings.permissions.auditLogs.user.fullname',
+            defaultMessage: '{firstname} {lastname}',
+          },
+          {
+            firstname: user.firstname,
+            lastname: user.lastname,
+          }
+        ),
+        // Combobox expects a string value
+        customValue: user.id.toString(),
+      };
+    });
+
+  return [
+    {
+      name: 'action',
+      metadatas: {
+        customOperators,
+        label: formatMessage({
+          id: 'Settings.permissions.auditLogs.action',
+          defaultMessage: 'Action',
+        }),
+        options: actionOptions,
+        customInput: ComboboxFilter,
+      },
+      fieldSchema: { type: 'enumeration' },
+    },
+    {
+      name: 'date',
+      metadatas: {
+        label: formatMessage({
+          id: 'Settings.permissions.auditLogs.date',
+          defaultMessage: 'Date',
+        }),
+      },
+      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' } },
+    },
+  ];
+};
+
+export default getDisplayedFilters;

package/{admin/src → ee/admin}/pages/SettingsPage/pages/AuditLogs/ProtectedListPage/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { CheckPagePermissions } from '@strapi/helper-plugin';
-import adminPermissions from '../../../../../permissions';
+import adminPermissions from '../../../../../../../admin/src/permissions';
 import ListView from '../ListView';
 
 const ProtectedListPage = () => (

package/ee/admin/pages/SettingsPage/pages/Roles/ListPage/index.js

@@ -4,6 +4,7 @@ import {
   LoadingIndicatorPage,
   SearchURLQuery,
   SettingsPageTitle,
+  getFetchClient,
   useNotification,
   useQueryParams,
   useRBAC,
@@ -23,7 +24,6 @@ import { get } from 'lodash';
 import matchSorter from 'match-sorter';
 import { useIntl } from 'react-intl';
 import { useHistory } from 'react-router-dom';
-import { axiosInstance } from '../../../../../../../admin/src/core/utils';
 import { useRolesList } from '../../../../../../../admin/src/hooks';
 import adminPermissions from '../../../../../../../admin/src/permissions';
 import EmptyRole from '../../../../../../../admin/src/pages/SettingsPage/pages/Roles/ListPage/components/EmptyRole';
@@ -72,13 +72,15 @@ const useRoleActions = ({ getData, canCreate, canDelete, canUpdate }) => {
     initialState
   );
 
+  const { post } = getFetchClient();
+
   const handleDeleteData = async () => {
     try {
       dispatch({
         type: 'ON_REMOVE_ROLES',
       });
 
-      await axiosInstance.post('/admin/roles/batch-delete', {
+      await post('/admin/roles/batch-delete', {
         ids: [roleToDelete],
       });
 

package/ee/admin/pages/SettingsPage/{SingleSignOn → pages/SingleSignOn}/index.js

@@ -17,9 +17,9 @@ import { Select, Option } from '@strapi/design-system/Select';
 import { Grid, GridItem } from '@strapi/design-system/Grid';
 import { useIntl } from 'react-intl';
 import isEqual from 'lodash/isEqual';
-import { getRequestUrl } from '../../../../../admin/src/utils';
-import { useRolesList, useSettingsForm } from '../../../../../admin/src/hooks';
-import adminPermissions from '../../../../../admin/src/permissions';
+import { getRequestUrl } from '../../../../../../admin/src/utils';
+import { useRolesList, useSettingsForm } from '../../../../../../admin/src/hooks';
+import adminPermissions from '../../../../../../admin/src/permissions';
 import schema from './utils/schema';
 
 const ssoPermissions = {

package/ee/admin/pages/SettingsPage/utils/customRoutes.js

@@ -1,19 +1,31 @@
-const ssoRoutes = strapi.features.isEnabled(strapi.features.SSO)
-  ? [
-      {
-        async Component() {
-          const component = await import(
-            /* webpackChunkName: "sso-settings-page" */ '../SingleSignOn'
-          );
+const routes = [];
 
-          return component;
-        },
-        to: '/settings/single-sign-on',
-        exact: true,
-      },
-    ]
-  : [];
+if (strapi.features.isEnabled(strapi.features.SSO)) {
+  routes.push({
+    async Component() {
+      const component = await import(
+        /* webpackChunkName: "sso-settings-page" */ '../pages/SingleSignOn'
+      );
 
-const customRoutes = [...ssoRoutes];
+      return component;
+    },
+    to: '/settings/single-sign-on',
+    exact: true,
+  });
+}
 
-export default customRoutes;
+if (strapi.features.isEnabled(strapi.features.AUDIT_LOGS)) {
+  routes.push({
+    async Component() {
+      const component = await import(
+        /* webpackChunkName: "audit-logs-settings-page" */ '../pages/AuditLogs/ProtectedListPage'
+      );
+
+      return component;
+    },
+    to: '/settings/audit-logs',
+    exact: true,
+  });
+}
+
+export default routes;

package/ee/server/bootstrap.js

@@ -17,5 +17,7 @@ module.exports = async () => {
     await actionProvider.registerMany(actions.auditLogs);
   }
 
+  // TODO: check admin seats
+
   await executeCEBootstrap();
 };

package/ee/server/migrations/audit-logs-table.js

@@ -0,0 +1,45 @@
+'use strict';
+
+/**
+ * Migrate the audit logs table name for users coming from v4.6.0
+ */
+async function migrateAuditLogsTable({ oldContentTypes, contentTypes }) {
+  // Check if the audit logs table name was changed
+  const oldName = oldContentTypes?.['admin::audit-log']?.collectionName;
+  const newName = contentTypes['admin::audit-log']?.collectionName;
+  const hasRenamedAuditLogsTable = oldName === 'audit_logs' && newName === 'strapi_audit_logs';
+
+  if (!hasRenamedAuditLogsTable) {
+    return;
+  }
+
+  // Check if the previous audit log tables exist
+  const hasAuditLogsTable = await strapi.db.getSchemaConnection().hasTable('audit_logs');
+  const hasLinkTable = await strapi.db.getSchemaConnection().hasTable('audit_logs_user_links');
+
+  if (!hasAuditLogsTable || !hasLinkTable) {
+    return;
+  }
+
+  // Check if the existing tables match the expected schema
+  const auditLogsColumnInfo = await strapi.db.connection('audit_logs').columnInfo();
+  const linkColumnInfo = await strapi.db.connection('audit_logs_user_links').columnInfo();
+
+  if (
+    !auditLogsColumnInfo.action ||
+    !auditLogsColumnInfo.date ||
+    !auditLogsColumnInfo.payload ||
+    !linkColumnInfo.audit_log_id ||
+    !linkColumnInfo.user_id
+  ) {
+    return;
+  }
+
+  // Do the actual migrations
+  await strapi.db.getSchemaConnection().renameTable('audit_logs', 'strapi_audit_logs');
+  await strapi.db
+    .getSchemaConnection()
+    .renameTable('audit_logs_user_links', 'strapi_audit_logs_user_links');
+}
+
+module.exports = migrateAuditLogsTable;

package/ee/server/register.js

@@ -2,10 +2,12 @@
 
 const { features } = require('@strapi/strapi/lib/utils/ee');
 const executeCERegister = require('../../server/register');
+const migrateAuditLogsTable = require('./migrations/audit-logs-table');
 const createAuditLogsService = require('./services/audit-logs');
 
 module.exports = async ({ strapi }) => {
   if (features.isEnabled('audit-logs')) {
+    strapi.hook('strapi::content-types.beforeSync').register(migrateAuditLogsTable);
     const auditLogsService = createAuditLogsService(strapi);
     strapi.container.register('audit-logs', auditLogsService);
     await auditLogsService.register();