diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/index.js index 19fbee0932..19efcce911 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/index.js @@ -7,12 +7,7 @@ import { useGlobalContext, PopUpWarning, } from 'strapi-helper-plugin'; -import { - useHistory, - useLocation, - useRouteMatch, - Redirect, -} from 'react-router-dom'; +import { useHistory, useLocation, useRouteMatch, Redirect } from 'react-router-dom'; import DataManagerContext from '../../contexts/DataManagerContext'; import getTrad from '../../utils/getTrad'; import makeUnique from '../../utils/makeUnique'; @@ -55,21 +50,17 @@ const DataManagerProvider = ({ allIcons, children }) => { } = reducerState.toJS(); const { pathname } = useLocation(); const { push } = useHistory(); - const contentTypeMatch = useRouteMatch( - `/plugins/${pluginId}/content-types/:uid` - ); + const contentTypeMatch = useRouteMatch(`/plugins/${pluginId}/content-types/:uid`); const componentMatch = useRouteMatch( `/plugins/${pluginId}/component-categories/:categoryUid/:componentUid` ); + const formatMessageRef = useRef(); formatMessageRef.current = formatMessage; - const isInDevelopmentMode = - currentEnvironment === 'development' && autoReload; + const isInDevelopmentMode = currentEnvironment === 'development' && autoReload; const isInContentTypeView = contentTypeMatch !== null; - const firstKeyToMainSchema = isInContentTypeView - ? 'contentType' - : 'component'; + const firstKeyToMainSchema = isInContentTypeView ? 'contentType' : 'component'; const currentUid = isInContentTypeView ? get(contentTypeMatch, 'params.uid', null) : get(componentMatch, 'params.componentUid', null); @@ -80,10 +71,7 @@ const DataManagerProvider = ({ allIcons, children }) => { getDataRef.current = async () => { try { - const [ - { data: componentsArray }, - { data: contentTypesArray }, - ] = await Promise.all( + const [{ data: componentsArray }, { data: contentTypesArray }] = await Promise.all( ['components', 'content-types'].map(endPoint => { return request(`/${pluginId}/${endPoint}`, { method: 'GET', @@ -118,11 +106,11 @@ const DataManagerProvider = ({ allIcons, children }) => { useEffect(() => { // We need to set the modifiedData after the data has been retrieved // and also on pathname change - if (!isLoading) { + if (!isLoading && currentUid) { setModifiedData(); } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [isLoading, pathname]); + }, [isLoading, pathname, currentUid]); useEffect(() => { if (currentEnvironment === 'development' && !autoReload) { @@ -135,8 +123,7 @@ const DataManagerProvider = ({ allIcons, children }) => { }, [autoReload, currentEnvironment]); const didModifiedComponents = - getCreatedAndModifiedComponents(modifiedData.components || {}, components) - .length > 0; + getCreatedAndModifiedComponents(modifiedData.components || {}, components).length > 0; const addAttribute = ( attributeToSet, @@ -158,10 +145,7 @@ const DataManagerProvider = ({ allIcons, children }) => { }); }; - const addCreatedComponentToDynamicZone = ( - dynamicZoneTarget, - componentsToAdd - ) => { + const addCreatedComponentToDynamicZone = (dynamicZoneTarget, componentsToAdd) => { dispatch({ type: 'ADD_CREATED_COMPONENT_TO_DYNAMIC_ZONE', dynamicZoneTarget, @@ -181,10 +165,7 @@ const DataManagerProvider = ({ allIcons, children }) => { componentCategory, shouldAddComponentToData = false ) => { - const type = - schemaType === 'contentType' - ? 'CREATE_SCHEMA' - : 'CREATE_COMPONENT_SCHEMA'; + const type = schemaType === 'contentType' ? 'CREATE_SCHEMA' : 'CREATE_COMPONENT_SCHEMA'; dispatch({ type, @@ -204,15 +185,9 @@ const DataManagerProvider = ({ allIcons, children }) => { }); }; - const removeAttribute = ( - mainDataKey, - attributeToRemoveName, - componentUid = '' - ) => { + const removeAttribute = (mainDataKey, attributeToRemoveName, componentUid = '') => { const type = - mainDataKey === 'components' - ? 'REMOVE_FIELD_FROM_DISPLAYED_COMPONENT' - : 'REMOVE_FIELD'; + mainDataKey === 'components' ? 'REMOVE_FIELD_FROM_DISPLAYED_COMPONENT' : 'REMOVE_FIELD'; if (mainDataKey === 'contentType') { emitEvent('willDeleteFieldOfContentType'); @@ -253,17 +228,11 @@ const DataManagerProvider = ({ allIcons, children }) => { const deleteData = async () => { try { const requestURL = `/${pluginId}/${endPoint}/${currentUid}`; - const isTemporary = get( - modifiedData, - [firstKeyToMainSchema, 'isTemporary'], - false - ); + const isTemporary = get(modifiedData, [firstKeyToMainSchema, 'isTemporary'], false); const userConfirm = window.confirm( formatMessage({ id: getTrad( - `popUpWarning.bodyMessage.${ - isInContentTypeView ? 'contentType' : 'component' - }.delete` + `popUpWarning.bodyMessage.${isInContentTypeView ? 'contentType' : 'component'}.delete` ), }) ); @@ -338,9 +307,7 @@ const DataManagerProvider = ({ allIcons, children }) => { const getAllNestedComponents = () => { const appNestedCompo = retrieveNestedComponents(components); - const editingDataNestedCompos = retrieveNestedComponents( - modifiedData.components || {} - ); + const editingDataNestedCompos = retrieveNestedComponents(modifiedData.components || {}); return makeUnique([...editingDataNestedCompos, ...appNestedCompo]); }; @@ -370,10 +337,7 @@ const DataManagerProvider = ({ allIcons, children }) => { isInContentTypeView ); - const dataShape = orderAllDataAttributesWithImmutable( - newSchemaToSet, - isInContentTypeView - ); + const dataShape = orderAllDataAttributesWithImmutable(newSchemaToSet, isInContentTypeView); // This prevents from losing the created content type or component when clicking on the link from the left menu const hasJustCreatedSchema = @@ -401,11 +365,7 @@ const DataManagerProvider = ({ allIcons, children }) => { const submitData = async additionalContentTypeData => { try { - const isCreating = get( - modifiedData, - [firstKeyToMainSchema, 'isTemporary'], - false - ); + const isCreating = get(modifiedData, [firstKeyToMainSchema, 'isTemporary'], false); const body = { components: getComponentsToPost( modifiedData.components, @@ -505,14 +465,11 @@ const DataManagerProvider = ({ allIcons, children }) => { value={{ addAttribute, addCreatedComponentToDynamicZone, - allComponentsCategories: retrieveSpecificInfoFromComponents( - components, - ['category'] - ), - allComponentsIconAlreadyTaken: retrieveSpecificInfoFromComponents( - components, - ['schema', 'icon'] - ), + allComponentsCategories: retrieveSpecificInfoFromComponents(components, ['category']), + allComponentsIconAlreadyTaken: retrieveSpecificInfoFromComponents(components, [ + 'schema', + 'icon', + ]), allIcons, changeDynamicZoneComponents, components,