@strapi/admin 4.8.2 → 4.9.0-beta.1

package/admin/src/content-manager/components/DynamicZone/utils/select.js

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { get } from 'lodash';
+import get from 'lodash/get';
 import { useCMEditViewDataManager } from '@strapi/helper-plugin';
 
 function useSelect(name) {

package/admin/src/content-manager/components/FieldComponent/utils/select.js

@@ -1,5 +1,6 @@
 import { useMemo } from 'react';
-import { get, take } from 'lodash';
+import get from 'lodash/get';
+import take from 'lodash/take';
 import { useCMEditViewDataManager } from '@strapi/helper-plugin';
 
 import { getFieldName } from '../../../utils';

package/admin/src/content-manager/components/Inputs/utils/getInputType.js

@@ -1,4 +1,4 @@
-import { toLower } from 'lodash';
+import toLower from 'lodash/toLower';
 
 const getInputType = (type = '') => {
   switch (toLower(type)) {

package/admin/src/content-manager/components/Inputs/utils/select.js

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { get } from 'lodash';
+import get from 'lodash/get';
 import { useCMEditViewDataManager } from '@strapi/helper-plugin';
 
 function useSelect(keys) {

package/admin/src/content-manager/hooks/useContentTypeLayout/index.js

@@ -1,5 +1,4 @@
 import { useCallback } from 'react';
-import { get } from 'lodash';
 import { useSelector } from 'react-redux';
 import selectLayout from '../../pages/EditViewLayoutManager/selectors';
 
@@ -8,7 +7,7 @@ const useContentTypeLayout = () => {
 
   const getComponentLayout = useCallback(
     (componentUid) => {
-      return get(currentLayout, ['components', componentUid], {});
+      return currentLayout?.components?.[componentUid] ?? {};
     },
     [currentLayout]
   );

package/admin/src/content-manager/hooks/useFetchContentTypeLayout/utils/formatLayouts.js

@@ -1,4 +1,7 @@
-import { cloneDeep, get, set } from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
+import get from 'lodash/get';
+import set from 'lodash/set';
+
 import { mergeMetasWithSchema } from '../../../utils';
 
 const getRelationModel = (targetModel, models) => models.find((model) => model.uid === targetModel);

package/admin/src/content-manager/pages/CollectionTypeRecursivePath/index.js

@@ -1,7 +1,6 @@
 import React, { memo, useMemo } from 'react';
 import { Switch, Route } from 'react-router-dom';
 import { ErrorBoundary } from 'react-error-boundary';
-import { get } from 'lodash';
 import PropTypes from 'prop-types';
 import { LoadingIndicatorPage, CheckPagePermissions } from '@strapi/helper-plugin';
 import permissions from '../../../permissions';
@@ -43,7 +42,7 @@ const CollectionTypeRecursivePath = ({
     return { rawContentTypeLayout, rawComponentsLayouts };
   }, [layout]);
 
-  const uid = get(layout, ['contentType', 'uid'], null);
+  const uid = layout?.contentType?.uid ?? null;
 
   // This statement is needed in order to prevent the CollectionTypeFormWrapper effects clean up phase to be run twice.
   // What can happen is that when navigating from one entry to another the cleanup phase of the fetch data effect is run twice : once when

package/admin/src/content-manager/pages/EditSettingsView/init.js

@@ -1,4 +1,6 @@
-import { cloneDeep, set } from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
+import set from 'lodash/set';
+
 import { createLayout, formatLayout } from './utils/layout';
 
 const init = (initialState, mainLayout, components) => {

package/admin/src/content-manager/pages/EditSettingsView/utils/createPossibleMainFieldsForModelsAndComponents.js

@@ -1,8 +1,6 @@
-import { get } from 'lodash';
-
 const createPossibleMainFieldsForModelsAndComponents = (array) => {
   return array.reduce((acc, current) => {
-    const attributes = get(current, ['attributes'], {});
+    const attributes = current?.attributes ?? {};
     const possibleMainFields = Object.keys(attributes).filter((attr) => {
       return ![
         'boolean',
@@ -14,7 +12,7 @@ const createPossibleMainFieldsForModelsAndComponents = (array) => {
         'relation',
         'text',
         'richtext',
-      ].includes(get(attributes, [attr, 'type'], ''));
+      ].includes(attributes?.[attr]?.type ?? '');
     });
 
     acc[current.uid] = possibleMainFields;

package/admin/src/content-manager/pages/EditView/DeleteLink/utils/select.js

@@ -1,4 +1,4 @@
-import { isEmpty } from 'lodash';
+import isEmpty from 'lodash/isEmpty';
 import { useCMEditViewDataManager } from '@strapi/helper-plugin';
 
 function useSelect() {

package/admin/src/content-manager/pages/EditView/utils/createAttributesLayout.js

@@ -1,4 +1,5 @@
-import { get, isEmpty } from 'lodash';
+import get from 'lodash/get';
+import isEmpty from 'lodash/isEmpty';
 
 const createAttributesLayout = (currentContentTypeLayoutData) => {
   if (!currentContentTypeLayoutData.layouts) {

package/admin/src/content-manager/pages/EditView/utils/getFieldsActionMatchingPermissions.js

@@ -1,4 +1,5 @@
-import { uniq, flatMap } from 'lodash';
+import uniq from 'lodash/uniq';
+import flatMap from 'lodash/flatMap';
 import { findMatchingPermissions } from '@strapi/helper-plugin';
 
 const getFieldsActionMatchingPermissions = (userPermissions, slug) => {

package/admin/src/content-manager/utils/checkIfAttributeIsDisplayable.js

@@ -1,4 +1,4 @@
-import { toLower } from 'lodash';
+import toLower from 'lodash/toLower';
 
 const checkIfAttributeIsDisplayable = (attribute) => {
   const type = attribute.type;

package/admin/src/content-manager/utils/createDefaultForm.js

@@ -1,4 +1,4 @@
-import { get } from 'lodash';
+import get from 'lodash/get';
 
 const createDefaultForm = (attributes, allComponentsSchema) => {
   return Object.keys(attributes).reduce((acc, current) => {
@@ -10,7 +10,7 @@ const createDefaultForm = (attributes, allComponentsSchema) => {
     }
 
     if (type === 'component') {
-      const currentComponentSchema = get(allComponentsSchema, [component, 'attributes'], {});
+      const currentComponentSchema = allComponentsSchema?.[component]?.attributes ?? {};
       const currentComponentDefaultForm = createDefaultForm(
         currentComponentSchema,
         allComponentsSchema

package/admin/src/content-manager/utils/formatLayoutToApi.js

@@ -1,4 +1,5 @@
-import { omit, get } from 'lodash';
+import get from 'lodash/get';
+import omit from 'lodash/omit';
 
 const formatLayoutToApi = ({ layouts, metadatas, ...rest }) => {
   const list = layouts.list.map((obj) => {

package/admin/src/content-manager/utils/getFieldName.js

@@ -1,4 +1,4 @@
-import { isNaN } from 'lodash';
+import isNaN from 'lodash/isNaN';
 
 const getFieldName = (stringName) =>
   stringName.split('.').filter((string) => isNaN(parseInt(string, 10)));

package/admin/src/content-manager/utils/mergeMetasWithSchema.js

@@ -1,4 +1,4 @@
-import { set } from 'lodash';
+import set from 'lodash/set';
 
 const mergeMetasWithSchema = (data, schemas, mainSchemaKey) => {
   const findSchema = (refUid) => schemas.find((obj) => obj.uid === refUid);

package/admin/src/content-manager/utils/paths.js

@@ -1,7 +1,7 @@
 /**
  * This file is for all helpers related to `paths` in the CM.
  */
-import { get } from 'lodash';
+import get from 'lodash/get';
 
 /**
  * This is typically used in circumstances where there are re-orderable pieces e.g. Dynamic Zones

package/admin/src/content-manager/utils/removePasswordFieldsFromData.js

@@ -1,4 +1,4 @@
-import { get } from 'lodash';
+import get from 'lodash/get';
 import { getType, getOtherInfos } from '@strapi/helper-plugin';
 
 const removePasswordFieldsFromData = (data, contentTypeSchema, componentSchema) => {

package/admin/src/hooks/useRegenerate/index.js

@@ -1,11 +1,11 @@
 import { useState } from 'react';
-import { get } from 'lodash';
-import { useFetchClient, useNotification } from '@strapi/helper-plugin';
+import { useFetchClient, useNotification, useAPIErrorHandler } from '@strapi/helper-plugin';
 
-const useRegenerate = (url, id, onRegenerate) => {
+const useRegenerate = (url, id, onRegenerate, onError) => {
   const [isLoadingConfirmation, setIsLoadingConfirmation] = useState(false);
   const toggleNotification = useNotification();
   const { post } = useFetchClient();
+  const { formatAPIError } = useAPIErrorHandler();
 
   const regenerateData = async () => {
     try {
@@ -18,10 +18,15 @@ const useRegenerate = (url, id, onRegenerate) => {
       onRegenerate(accessKey);
     } catch (error) {
       setIsLoadingConfirmation(false);
-      toggleNotification({
-        type: 'warning',
-        message: get(error, 'response.data.message', 'notification.error'),
-      });
+
+      if (onError) {
+        onError(error);
+      } else {
+        toggleNotification({
+          type: 'warning',
+          message: formatAPIError(error),
+        });
+      }
     }
   };
 

package/admin/src/hooks/useSettingsForm/index.js

@@ -1,6 +1,6 @@
 import { useEffect, useReducer } from 'react';
 import { request, useNotification, useOverlayBlocker } from '@strapi/helper-plugin';
-import { get, has, omit } from 'lodash';
+import omit from 'lodash/omit';
 import { checkFormValidity, formatAPIErrors } from '../../utils';
 import { initialState, reducer } from './reducer';
 import init from './init';
@@ -102,9 +102,9 @@ const useSettingsForm = (endPoint, schema, cbSuccess, fieldsToPick) => {
           message: { id: 'notification.success.saved' },
         });
       } catch (err) {
-        const data = get(err, 'response.payload', { data: {} });
+        const data = err?.response?.payload ?? { data: {} };
 
-        if (has(data, 'data') && typeof data.data === 'string') {
+        if (!!data?.data && typeof data.data === 'string') {
           toggleNotification({
             type: 'warning',
             message: data.data,

package/admin/src/hooks/useSettingsForm/reducer.js

@@ -1,6 +1,8 @@
 /* eslint-disable consistent-return */
 import produce from 'immer';
-import { pick, set, unset } from 'lodash';
+import pick from 'lodash/pick';
+import set from 'lodash/set';
+import unset from 'lodash/unset';
 
 const initialState = {
   fieldsToPick: [],

package/admin/src/hooks/useSettingsMenu/reducer.js

@@ -1,5 +1,5 @@
 import produce from 'immer';
-import { set } from 'lodash';
+import set from 'lodash/set';
 
 const initialState = {
   menu: [],

package/admin/src/pages/AuthPage/reducer.js

@@ -1,5 +1,5 @@
 import produce from 'immer';
-import { set } from 'lodash';
+import set from 'lodash/set';
 /* eslint-disable consistent-return */
 
 const initialState = {

package/admin/src/pages/SettingsPage/components/Tokens/FormHead/index.js

@@ -15,6 +15,7 @@ const FormHead = ({
   isSubmitting,
   backUrl,
   regenerateUrl,
+  onErrorRegenerate,
 }) => {
   const { formatMessage } = useIntl();
   const handleRegenerate = (newKey) => {
@@ -35,6 +36,7 @@ const FormHead = ({
                 backUrl={regenerateUrl}
                 onRegenerate={handleRegenerate}
                 idToRegenerate={token?.id}
+                onError={onErrorRegenerate}
               />
             )}
             <Button
@@ -95,10 +97,12 @@ FormHead.propTypes = {
     label: PropTypes.string,
   }).isRequired,
   regenerateUrl: PropTypes.string.isRequired,
+  onErrorRegenerate: PropTypes.func,
 };
 
 FormHead.defaultProps = {
   token: undefined,
+  onErrorRegenerate: undefined,
 };
 
 export default FormHead;

package/admin/src/pages/SettingsPage/components/Tokens/Regenerate/index.js

@@ -6,13 +6,14 @@ import { Refresh } from '@strapi/icons';
 import { ConfirmDialog } from '@strapi/helper-plugin';
 import { useRegenerate } from '../../../../../hooks';
 
-export const Regenerate = ({ onRegenerate, idToRegenerate, backUrl }) => {
+export const Regenerate = ({ onRegenerate, idToRegenerate, backUrl, onError }) => {
   const { formatMessage } = useIntl();
   const [showConfirmDialog, setShowConfirmDialog] = useState(false);
   const { regenerateData, isLoadingConfirmation } = useRegenerate(
     backUrl,
     idToRegenerate,
-    onRegenerate
+    onRegenerate,
+    onError
   );
   const handleConfirmRegeneration = async () => {
     regenerateData();
@@ -62,12 +63,13 @@ export const Regenerate = ({ onRegenerate, idToRegenerate, backUrl }) => {
   );
 };
 
-Regenerate.defaultProps = { onRegenerate() {} };
+Regenerate.defaultProps = { onRegenerate() {}, onError: undefined };
 
 Regenerate.propTypes = {
   onRegenerate: PropTypes.func,
   idToRegenerate: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
   backUrl: PropTypes.string.isRequired,
+  onError: PropTypes.func,
 };
 
 export default Regenerate;

package/admin/src/pages/SettingsPage/components/Tokens/TokenTypeSelect/index.js

@@ -4,21 +4,21 @@ import { useIntl } from 'react-intl';
 
 import { Select, Option } from '@strapi/design-system';
 
-const TokenTypeSelect = ({ errors, values, onChange, canEditInputs, options, label }) => {
+const TokenTypeSelect = ({ name, errors, values, onChange, canEditInputs, options, label }) => {
   const { formatMessage } = useIntl();
 
   return (
     <Select
-      name="type"
+      name={name}
       label={formatMessage({
         id: label.id,
         defaultMessage: label.defaultMessage,
       })}
-      value={values?.type}
+      value={values && values[name]}
       error={
-        errors.type
+        errors[name]
           ? formatMessage(
-              errors.type?.id ? errors.type : { id: errors.type, defaultMessage: errors.type }
+              errors[name]?.id ? errors[name] : { id: errors[name], defaultMessage: errors[name] }
             )
           : null
       }
@@ -38,6 +38,7 @@ const TokenTypeSelect = ({ errors, values, onChange, canEditInputs, options, lab
 };
 
 TokenTypeSelect.propTypes = {
+  name: PropTypes.string,
   options: PropTypes.arrayOf(
     PropTypes.shape({
       label: PropTypes.shape({
@@ -62,6 +63,7 @@ TokenTypeSelect.propTypes = {
 };
 
 TokenTypeSelect.defaultProps = {
+  name: 'type',
   errors: {},
   options: [],
 };

package/admin/src/pages/SettingsPage/pages/ApiTokens/EditView/components/CollapsableContentType/index.js

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { capitalize } from 'lodash';
+import capitalize from 'lodash/capitalize';
 import { useIntl } from 'react-intl';
 import {
   Accordion,

package/admin/src/pages/SettingsPage/pages/ApiTokens/EditView/reducer.js

@@ -1,6 +1,6 @@
 /* eslint-disable consistent-return */
 import produce from 'immer';
-import { pull } from 'lodash';
+import pull from 'lodash/pull';
 import { transformPermissionsData } from './utils';
 
 export const initialState = {

package/admin/src/pages/SettingsPage/pages/ApiTokens/EditView/utils/transformPermissionsData.js

@@ -1,5 +1,3 @@
-import { flatten } from 'lodash';
-
 const transformPermissionsData = (data) => {
   const layout = {
     allActionsIds: [],
@@ -9,11 +7,11 @@ const transformPermissionsData = (data) => {
   layout.permissions = Object.keys(data).map((apiId) => ({
     apiId,
     label: apiId.split('::')[1],
-    controllers: flatten(
-      Object.keys(data[apiId].controllers).map((controller) => ({
+    controllers: Object.keys(data[apiId].controllers)
+      .map((controller) => ({
         controller,
-        actions: flatten(
-          data[apiId].controllers[controller].map((action) => {
+        actions: data[apiId].controllers[controller]
+          .map((action) => {
             const actionId = `${apiId}.${controller}.${action}`;
 
             if (apiId.includes('api::')) {
@@ -25,9 +23,9 @@ const transformPermissionsData = (data) => {
               actionId,
             };
           })
-        ),
+          .flat(),
       }))
-    ),
+      .flat(),
   }));
 
   return layout;

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/ConditionsModal/utils/createDefaultConditionsForm.js

@@ -1,4 +1,4 @@
-import { get } from 'lodash';
+import get from 'lodash/get';
 
 const createConditionsForm = (conditions, valueObject) => {
   return conditions.reduce((acc, current) => {

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/ContentTypeCollapse/Collapse/utils/generateCheckboxesActions.js

@@ -1,4 +1,5 @@
-import { get, isEmpty } from 'lodash';
+import get from 'lodash/get';
+import isEmpty from 'lodash/isEmpty';
 import { createArrayOfValues, getCheckboxState } from '../../../utils';
 
 const generateCheckboxesActions = (availableActions, modifiedData, pathToData) => {

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/ContentTypeCollapse/CollapsePropertyMatrix/ActionRow/utils/getRowLabelCheckboxeState.js

@@ -1,4 +1,5 @@
-import { get } from 'lodash';
+import get from 'lodash/get';
+
 import { getCheckboxState } from '../../../../utils';
 
 /**

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/GlobalActions/utils/getRowLabelCheckboxesState.js

@@ -1,4 +1,4 @@
-import { get } from 'lodash';
+import get from 'lodash/get';
 import { getCheckboxState, removeConditionKeyFromData } from '../../utils';
 
 const getActionsIds = (array) => array.map(({ actionId }) => actionId);

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/Permissions/reducer.js

@@ -1,5 +1,10 @@
 import produce from 'immer';
-import { cloneDeep, has, isObject, get, set } from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
+import has from 'lodash/has';
+import isObject from 'lodash/isObject';
+import get from 'lodash/get';
+import set from 'lodash/set';
+
 import updateConditionsToFalse from './utils/updateConditionsToFalse';
 import updateValues from './utils/updateValues';
 

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/Permissions/utils/createDefaultCTFormFromLayout.js

@@ -1,4 +1,8 @@
-import { merge, get, isEmpty, set } from 'lodash';
+import get from 'lodash/get';
+import isEmpty from 'lodash/isEmpty';
+import merge from 'lodash/merge';
+import set from 'lodash/set';
+
 import findMatchingPermission from './findMatchingPermissions';
 /**
  * Creates the default condition form: { [conditionId]: false }

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/Permissions/utils/createDefaultPluginsFormFromLayout.js

@@ -1,4 +1,3 @@
-import { get } from 'lodash';
 import { createDefaultConditionsForm } from './createDefaultCTFormFromLayout';
 import findMatchingPermission from './findMatchingPermissions';
 
@@ -12,7 +11,7 @@ const createSubCategoryForm = (actions, conditions, permissions) => {
       },
       conditions: createDefaultConditionsForm(
         conditions,
-        get(foundMatchingPermission, 'conditions', [])
+        foundMatchingPermission?.conditions ?? []
       ),
     };
 

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/Permissions/utils/formatContentTypesPermissionToAPI.js

@@ -1,4 +1,4 @@
-import { has, isObject } from 'lodash';
+import isObject from 'lodash/isObject';
 import { createArrayOfValues } from '../../utils';
 import { createConditionsArray } from './formatSettingsPermissionsToAPI';
 
@@ -77,7 +77,7 @@ const createSubjectPermissions = (subject, actions) => {
       return acc;
     }
 
-    if (!has(permissions, 'properties.enabled')) {
+    if (!permissions?.properties?.enabled) {
       const createdPermissionsArray = createPermissionWithProperties(
         actionName,
         subject,

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/Permissions/utils/updateConditionsToFalse.js

@@ -1,4 +1,7 @@
-import { isObject, has, omit } from 'lodash';
+import isObject from 'lodash/isObject';
+import has from 'lodash/has';
+import omit from 'lodash/omit';
+
 import { createArrayOfValues } from '../../utils';
 
 /**

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/Permissions/utils/updateValues.js

@@ -1,4 +1,4 @@
-import { isObject } from 'lodash';
+import isObject from 'lodash/isObject';
 
 /**
  * Sets all the none object values of an object to the given one

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/PluginsAndSettings/SubCategory/utils/formatActions.js

@@ -1,4 +1,4 @@
-import { get } from 'lodash';
+import get from 'lodash/get';
 import { createArrayOfValues } from '../../../utils';
 
 /**

package/admin/src/pages/SettingsPage/pages/Roles/EditPage/components/utils/createArrayOfValues.js

@@ -1,4 +1,5 @@
-import { flattenDeep, isObject } from 'lodash';
+import flattenDeep from 'lodash/flattenDeep';
+import isObject from 'lodash/isObject';
 
 const createArrayOfValues = (obj) => {
   if (!isObject(obj)) {

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

@@ -26,7 +26,7 @@ import {
   Typography,
   VisuallyHidden,
 } from '@strapi/design-system';
-import { get } from 'lodash';
+import get from 'lodash/get';
 import matchSorter from 'match-sorter';
 import { useIntl } from 'react-intl';
 import { useHistory } from 'react-router-dom';

package/admin/src/pages/SettingsPage/pages/TransferTokens/EditView/components/FormTransferTokenContainer/index.js

@@ -5,6 +5,7 @@ import { Box, Grid, GridItem, Flex, Typography } from '@strapi/design-system';
 import LifeSpanInput from '../../../../../components/Tokens/LifeSpanInput';
 import TokenName from '../../../../../components/Tokens/TokenName';
 import TokenDescription from '../../../../../components/Tokens/TokenDescription';
+import TokenTypeSelect from '../../../../../components/Tokens/TokenTypeSelect';
 
 const FormTransferTokenContainer = ({
   errors,
@@ -16,6 +17,30 @@ const FormTransferTokenContainer = ({
 }) => {
   const { formatMessage } = useIntl();
 
+  const typeOptions = [
+    {
+      value: 'push',
+      label: {
+        id: 'Settings.transferTokens.types.push',
+        defaultMessage: 'Push',
+      },
+    },
+    {
+      value: 'pull',
+      label: {
+        id: 'Settings.transferTokens.types.pull',
+        defaultMessage: 'Pull',
+      },
+    },
+    {
+      value: 'push-pull',
+      label: {
+        id: 'Settings.transferTokens.types.push-pull',
+        defaultMessage: 'Full Access',
+      },
+    },
+  ];
+
   return (
     <Box
       background="neutral0"
@@ -59,6 +84,22 @@ const FormTransferTokenContainer = ({
               token={transferToken}
             />
           </GridItem>
+          <GridItem key="permissions" col={6} xs={12}>
+            <TokenTypeSelect
+              name="permissions"
+              values={values}
+              errors={errors}
+              label={{
+                id: 'Settings.tokens.form.type',
+                defaultMessage: 'Token type',
+              }}
+              onChange={(value) => {
+                onChange({ target: { name: 'permissions', value } });
+              }}
+              options={typeOptions}
+              canEditInputs={canEditInputs}
+            />
+          </GridItem>
         </Grid>
       </Flex>
     </Box>