@strapi/admin 4.6.0 → 4.6.1

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/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/index.js

@@ -4,52 +4,38 @@ 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 {
+  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 * 10,
-    onError() {
-      toggleNotification({
-        type: 'warning',
-        message: { id: 'notification.error', defaultMessage: 'An error occured' },
-      });
-    },
-  });
+  const displayedFilters = getDisplayedFilters({ formatMessage, users });
 
   const title = formatMessage({
     id: 'global.auditLogs',
@@ -64,6 +50,18 @@ const ListView = () => {
     },
   }));
 
+  if (hasError) {
+    return (
+      <Layout>
+        <ContentLayout>
+          <Box paddingTop={8}>
+            <AnErrorOccurred />
+          </Box>
+        </ContentLayout>
+      </Layout>
+    );
+  }
+
   return (
     <Main aria-busy={isLoading}>
       <SettingsPageTitle name={title} />
@@ -74,21 +72,22 @@ 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 || []}
+            rows={auditLogs?.results || []}
             onOpenModal={(id) => setQuery({ id })}
           />
         </DynamicTable>
-        <PaginationFooter pagination={data?.pagination} />
+        <PaginationFooter pagination={auditLogs?.pagination} />
       </ContentLayout>
       {query?.id && <Modal handleClose={() => setQuery({ id: null }, 'remove')} logId={query.id} />}
     </Main>

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

@@ -1,9 +1,9 @@
-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',
@@ -29,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/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/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();

package/ee/server/services/audit-logs.js

@@ -58,6 +58,16 @@ const createAuditLogsService = (strapi) => {
   const eventMap = getEventMap(defaultEvents);
 
   const processEvent = (name, ...args) => {
+    const state = strapi.requestContext.get()?.state;
+
+    // Ignore events with auth strategies different from admin
+    const isUsingAdminAuth = state?.auth?.strategy.name === 'admin';
+    const user = state?.user;
+
+    if (!isUsingAdminAuth || !user) {
+      return null;
+    }
+
     const getPayload = eventMap[name];
 
     // Ignore the event if it's not in the map
@@ -75,7 +85,7 @@ const createAuditLogsService = (strapi) => {
       action: name,
       date: new Date().toISOString(),
       payload: getPayload(...args) || {},
-      userId: strapi.requestContext.get()?.state?.user?.id,
+      userId: user.id,
     };
   };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@strapi/admin",
-  "version": "4.6.0",
+  "version": "4.6.1",
   "description": "Strapi Admin",
   "repository": {
     "type": "git",
@@ -38,25 +38,25 @@
     "test:front:ce:cov": "cross-env IS_EE=false jest --config ./jest.config.front.js --coverage"
   },
   "dependencies": {
-    "@babel/core": "7.18.10",
-    "@babel/plugin-transform-runtime": "7.18.10",
-    "@babel/preset-env": "7.18.10",
-    "@babel/preset-react": "7.18.6",
-    "@babel/runtime": "7.18.9",
+    "@babel/core": "^7.20.12",
+    "@babel/plugin-transform-runtime": "^7.19.6",
+    "@babel/preset-env": "^7.20.2",
+    "@babel/preset-react": "^7.18.6",
+    "@babel/runtime": "^7.20.13",
     "@casl/ability": "^5.4.3",
     "@fingerprintjs/fingerprintjs": "3.3.6",
     "@pmmmwh/react-refresh-webpack-plugin": "0.5.10",
-    "@strapi/babel-plugin-switch-ee-ce": "4.6.0",
-    "@strapi/data-transfer": "4.6.0",
-    "@strapi/design-system": "1.6.1",
-    "@strapi/helper-plugin": "4.6.0",
-    "@strapi/icons": "1.6.1",
-    "@strapi/permissions": "4.6.0",
-    "@strapi/provider-audit-logs-local": "4.6.0",
-    "@strapi/typescript-utils": "4.6.0",
-    "@strapi/utils": "4.6.0",
+    "@strapi/babel-plugin-switch-ee-ce": "4.6.1",
+    "@strapi/data-transfer": "4.6.1",
+    "@strapi/design-system": "1.6.3",
+    "@strapi/helper-plugin": "4.6.1",
+    "@strapi/icons": "1.6.3",
+    "@strapi/permissions": "4.6.1",
+    "@strapi/provider-audit-logs-local": "4.6.1",
+    "@strapi/typescript-utils": "4.6.1",
+    "@strapi/utils": "4.6.1",
     "axios": "1.2.2",
-    "babel-loader": "8.2.5",
+    "babel-loader": "^9.1.2",
     "babel-plugin-styled-components": "2.0.2",
     "bcryptjs": "2.4.3",
     "browserslist-to-esbuild": "1.2.0",
@@ -64,10 +64,10 @@
     "chokidar": "^3.5.1",
     "codemirror": "^5.65.11",
     "cross-env": "^7.0.3",
-    "css-loader": "6.7.2",
+    "css-loader": "^6.7.3",
     "date-fns": "2.29.3",
     "dotenv": "8.5.1",
-    "esbuild-loader": "^2.20.0",
+    "esbuild-loader": "^2.21.0",
     "execa": "^1.0.0",
     "fast-deep-equal": "3.1.3",
     "find-root": "1.1.0",
@@ -77,9 +77,9 @@
     "highlight.js": "^10.4.1",
     "history": "^4.9.0",
     "hoist-non-react-statics": "^3.3.0",
-    "html-loader": "3.1.2",
+    "html-loader": "^4.2.0",
     "html-webpack-plugin": "5.5.0",
-    "immer": "9.0.15",
+    "immer": "9.0.19",
     "invariant": "^2.2.4",
     "js-cookie": "2.2.1",
     "jsonwebtoken": "9.0.0",
@@ -99,7 +99,7 @@
     "markdown-it-sub": "^1.0.0",
     "markdown-it-sup": "1.0.0",
     "match-sorter": "^4.0.2",
-    "mini-css-extract-plugin": "2.4.4",
+    "mini-css-extract-plugin": "2.7.2",
     "msw": "0.49.1",
     "node-polyfill-webpack-plugin": "2.0.1",
     "node-schedule": "2.1.0",
@@ -115,7 +115,7 @@
     "react-error-boundary": "3.1.4",
     "react-fast-compare": "^3.2.0",
     "react-helmet": "^6.1.0",
-    "react-intl": "5.25.1",
+    "react-intl": "6.2.7",
     "react-is": "^17.0.2",
     "react-query": "3.24.3",
     "react-redux": "7.2.8",
@@ -132,9 +132,9 @@
     "style-loader": "3.3.1",
     "styled-components": "5.3.3",
     "typescript": "4.6.2",
-    "webpack": "^5.74.0",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.9.3",
+    "webpack": "^5.75.0",
+    "webpack-cli": "^5.0.1",
+    "webpack-dev-server": "^4.11.1",
     "webpackbar": "^5.0.2",
     "yup": "^0.32.9"
   },
@@ -147,7 +147,7 @@
     "glob": "8.0.3",
     "react-test-renderer": "^17.0.2",
     "speed-measure-webpack-plugin": "1.5.0",
-    "webpack-bundle-analyzer": "^4.6.1"
+    "webpack-bundle-analyzer": "^4.7.0"
   },
   "peerDependencies": {
     "@strapi/strapi": "^4.3.4"
@@ -165,5 +165,5 @@
       }
     }
   },
-  "gitHead": "a9e55435c489f3379d88565bf3f729deb29bfb45"
+  "gitHead": "17a7845e3d453ea2e7911bda6ec25ed196dd5f16"
 }

package/server/controllers/admin.js

@@ -1,6 +1,8 @@
 'use strict';
 
 const path = require('path');
+
+const { map, values, sumBy, pipe, flatMap, propEq } = require('lodash/fp');
 const execa = require('execa');
 const _ = require('lodash');
 const { exists } = require('fs-extra');
@@ -97,11 +99,25 @@ module.exports = {
     );
     const isHostedOnStrapiCloud = env('STRAPI_HOSTING', null) === 'strapi.cloud';
 
+    const numberOfAllContentTypes = _.size(strapi.contentTypes);
+    const numberOfComponents = _.size(strapi.components);
+
+    const getNumberOfDynamicZones = () => {
+      return pipe(
+        map('attributes'),
+        flatMap(values),
+        sumBy(propEq('type', 'dynamiczone'))
+      )(strapi.contentTypes);
+    };
+
     return {
       data: {
         useTypescriptOnServer,
         useTypescriptOnAdmin,
         isHostedOnStrapiCloud,
+        numberOfAllContentTypes, // TODO: V5: This event should be renamed numberOfContentTypes in V5 as the name is already taken to describe the number of content types using i18n.
+        numberOfComponents,
+        numberOfDynamicZones: getNumberOfDynamicZones(),
       },
     };
   },

package/admin/src/content-manager/components/InputJSON/FieldWrapper.js

@@ -1,40 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { useIntl } from 'react-intl';
-import { Field } from '@strapi/design-system/Field';
-
-const FieldWrapper = ({ name, hint, error, children, required }) => {
-  const { formatMessage } = useIntl();
-  const errorMessage = error ? formatMessage({ id: error, defaultMessage: error }) : '';
-
-  return (
-    <Field
-      name={name}
-      hint={hint && formatMessage(hint)}
-      error={errorMessage}
-      id={name}
-      required={required}
-    >
-      {children}
-    </Field>
-  );
-};
-
-FieldWrapper.defaultProps = {
-  hint: undefined,
-  error: '',
-  required: false,
-};
-
-FieldWrapper.propTypes = {
-  name: PropTypes.string.isRequired,
-  hint: PropTypes.shape({
-    id: PropTypes.string,
-    defaultMessage: PropTypes.string,
-  }),
-  error: PropTypes.string,
-  children: PropTypes.node.isRequired,
-  required: PropTypes.bool,
-};
-
-export default FieldWrapper;

package/admin/src/content-manager/components/InputJSON/Label.js

@@ -1,35 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { useIntl } from 'react-intl';
-import { FieldLabel } from '@strapi/design-system/Field';
-
-const Label = ({ intlLabel, labelAction, name }) => {
-  const { formatMessage } = useIntl();
-  const label = intlLabel?.id
-    ? formatMessage(
-        { id: intlLabel.id, defaultMessage: intlLabel.defaultMessage },
-        { ...intlLabel.values }
-      )
-    : name;
-
-  return <FieldLabel action={labelAction}>{label}</FieldLabel>;
-};
-
-Label.defaultProps = {
-  id: undefined,
-  intlLabel: undefined,
-  labelAction: undefined,
-};
-
-Label.propTypes = {
-  id: PropTypes.string,
-  intlLabel: PropTypes.shape({
-    id: PropTypes.string.isRequired,
-    defaultMessage: PropTypes.string.isRequired,
-    values: PropTypes.object,
-  }),
-  labelAction: PropTypes.element,
-  name: PropTypes.string.isRequired,
-};
-
-export default Label;

package/admin/src/content-manager/components/InputJSON/components.js

@@ -1,36 +0,0 @@
-import styled from 'styled-components';
-import { Box } from '@strapi/design-system/Box';
-
-/* eslint-disable */
-/* stylelint-disable */
-const EditorWrapper = styled.div`
-  cursor: ${({ disabled }) => (disabled ? 'not-allowed !important' : 'auto')};
-  /* BASICS */
-
-  .colored {
-    background-color: yellow;
-    color: black !important;
-  }
-
-  > div {
-    border-radius: 3px;
-    > div:last-of-type {
-      min-height: 253px;
-      max-height: 506px;
-    }
-  }
-
-  .CodeMirror {
-    /* Set height, width, borders, and global font properties here */
-    font-size: ${14 / 16}rem;
-    direction: ltr;
-    z-index: 0;
-  }
-`;
-
-const StyledBox = styled(Box)`
-  border-radius: ${({ theme }) => theme.borderRadius};
-  border: 1px solid ${({ theme, error }) => (error ? theme.colors.danger600 : 'transparent')};
-`;
-
-export { EditorWrapper, StyledBox };