yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-12-29 08:04:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into created-by

Browse Source
This commit is contained in:
Abdón Rodríguez Davila 2021-12-15 17:29:13 +01:00 committed by GitHub
commit 7accd9908f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
packages/core/admin/admin/src/content-manager/components/DynamicZone/index.js
View File

@ -1,4 +1,4 @@
import React, { memo, useCallback, useMemo, useState } from 'react';
import React, { memo, useCallback, useMemo, useState, useEffect } from 'react';
import get from 'lodash/get';
import isEqual from 'react-fast-compare';
import PropTypes from 'prop-types';
@ -37,11 +37,33 @@ const DynamicZone = ({
}) => {
const toggleNotification = useNotification();
const [isOpen, setIsOpen] = useState(false);
const [shouldOpenAddedComponent, setShouldOpenAddedComponent] = useState(false);
const dynamicDisplayedComponentsLength = dynamicDisplayedComponents.length;
const [componentCollapses, setComponentsCollapses] = useState(
createCollapses(dynamicDisplayedComponentsLength)
);
useEffect(() => {
setComponentsCollapses(createCollapses(dynamicDisplayedComponentsLength));
}, [dynamicDisplayedComponentsLength]);
useEffect(() => {
if (shouldOpenAddedComponent) {
setComponentsCollapses(prev =>
prev.map((collapse, index) => {
if (index === prev.length - 1) {
return { ...collapse, isOpen: true };
}
return collapse;
})
);
setShouldOpenAddedComponent(false);
}
}, [shouldOpenAddedComponent]);
// We cannot use the default props here
const { max = Infinity, min = -Infinity } = fieldSchema;
const dynamicZoneErrors = useMemo(() => {
@ -68,7 +90,7 @@ const DynamicZone = ({
setIsOpen(false);
addComponentToDynamicZone(name, componentUid, hasError);
setComponentsCollapses(prev => [...prev, { isOpen: true }]);
setShouldOpenAddedComponent(true);
},
[addComponentToDynamicZone, hasError, name]
);
@ -132,8 +154,6 @@ const DynamicZone = ({
const handleRemoveComponent = (name, currentIndex) => {
removeComponentFromDynamicZone(name, currentIndex);
setComponentsCollapses(prev => prev.filter((_, index) => index !== currentIndex));
};
if (!isFieldAllowed && isCreatingEntry) {
@ -183,7 +203,7 @@ const DynamicZone = ({
dynamicDisplayedComponentsLength > 0 &&
index < dynamicDisplayedComponentsLength - 1;
const showUpIcon = isFieldAllowed && dynamicDisplayedComponentsLength > 0 && index > 0;
const isOpen = componentCollapses[index].isOpen;
const isOpen = componentCollapses[index]?.isOpen || false;
return (
<Component