@strapi/content-type-builder 5.49.0 → 5.50.1

package/dist/admin/components/FormModal/FormModal.js

@@ -7,7 +7,6 @@ var designSystem = require('@strapi/design-system');
 var get = require('lodash/get');
 var has = require('lodash/has');
 var isEqual = require('lodash/isEqual');
-var pick = require('lodash/pick');
 var set = require('lodash/set');
 var reactIntl = require('react-intl');
 var reactRedux = require('react-redux');
@@ -17,6 +16,7 @@ var yup = require('yup');
 var pluginId = require('../../pluginId.js');
 var getTrad = require('../../utils/getTrad.js');
 var isAllowedContentTypesForRelations = require('../../utils/isAllowedContentTypesForRelations.js');
+var conditions = require('../../utils/conditions.js');
 var findAttribute = require('../../utils/findAttribute.js');
 var getYupInnerErrors = require('../../utils/getYupInnerErrors.js');
 var AllowedTypesSelect = require('../AllowedTypesSelect.js');
@@ -77,7 +77,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var get__default = /*#__PURE__*/_interopDefault(get);
 var has__default = /*#__PURE__*/_interopDefault(has);
 var isEqual__default = /*#__PURE__*/_interopDefault(isEqual);
-var pick__default = /*#__PURE__*/_interopDefault(pick);
 var set__default = /*#__PURE__*/_interopDefault(set);
 var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
 
@@ -85,6 +84,21 @@ const FormComponent = styledComponents.styled.form`
   overflow: auto;
 `;
 const selectState = (state)=>state['content-type-builder_formModal'] || reducer.initialState;
+const toStringValue = (value)=>typeof value === 'string' ? value : '';
+const toOptionalStringValue = (value)=>{
+    if (typeof value !== 'string' || value === '') {
+        return undefined;
+    }
+    return value;
+};
+const toBooleanValue = (value)=>typeof value === 'boolean' ? value : false;
+const toContentTypeKind = (value)=>value === 'singleType' ? 'singleType' : 'collectionType';
+const toRecordValue = (value)=>typeof value === 'object' && value !== null ? value : {};
+const toComponentDraft = (value)=>({
+        category: toStringValue(value?.category),
+        displayName: toStringValue(value?.displayName),
+        icon: toOptionalStringValue(value?.icon)
+    });
 const FormModal = ()=>{
     const { onCloseModal, onNavigateToChooseAttributeModal, onNavigateToAddCompoToDZModal, onNavigateToCreateComponentStep2, actionType, attributeName, attributeType, customFieldUid, dynamicZoneTarget, forTarget, modalType, isOpen, kind, step, targetUid, showBackLink, activeTab, setActiveTab } = useFormModalNavigation.useFormModalNavigation();
     const getPlugin = strapiAdmin.useStrapiApp('FormModal', (state)=>state.getPlugin);
@@ -114,20 +128,22 @@ const FormModal = ()=>{
         const oldEnum = initialData.enum;
         const newEnum = modifiedData.enum;
         // Get all attributes from the content type schema
-        const contentTypeAttributes = type?.attributes || [];
+        const contentTypeAttributes = type?.attributes ?? [];
         // Find all fields that reference this field in their conditions
         const referencedFields = contentTypeAttributes.filter((attr)=>{
-            if (!attr.conditions) return false;
-            const condition = attr.conditions.visible;
-            if (!condition) return false;
-            const [[, conditions]] = Object.entries(condition);
-            const [fieldVar, value] = conditions;
+            const conditionEntry = conditions.getFirstVisibleConditionEntry(attr.conditions);
+            if (conditionEntry === null) {
+                return false;
+            }
+            const { fieldVar, value } = conditionEntry;
             // Check if this condition references our field
-            if (fieldVar.var !== oldName) return false;
+            if (fieldVar.var !== oldName) {
+                return false;
+            }
             // If it's an enum field, also check if the value is being deleted/changed
-            if (oldEnum && newEnum) {
+            if (oldEnum !== undefined && newEnum !== undefined) {
                 const deletedOrChangedValues = oldEnum.filter((oldValue)=>!newEnum.includes(oldValue));
-                return deletedOrChangedValues.includes(value);
+                return typeof value === 'string' && deletedOrChangedValues.includes(value);
             }
             return true;
         });
@@ -163,10 +179,10 @@ const FormModal = ()=>{
                     data: {
                         displayName: type.info.displayName,
                         draftAndPublish: type.options?.draftAndPublish,
-                        kind: 'kind' in type && type.kind,
+                        kind: type.modelType === 'contentType' ? type.kind : 'collectionType',
                         pluginOptions: type.pluginOptions,
-                        pluralName: 'pluralName' in type.info && type.info.pluralName,
-                        singularName: 'singularName' in type.info && type.info.singularName
+                        pluralName: type.modelType === 'contentType' ? type.info.pluralName : '',
+                        singularName: type.modelType === 'contentType' ? type.info.singularName : ''
                     }
                 }));
             }
@@ -175,7 +191,7 @@ const FormModal = ()=>{
                 dispatch(reducer.actions.setDataToEdit({
                     data: {
                         displayName: type.info.displayName,
-                        category: 'category' in type && type.category,
+                        category: type.modelType === 'component' ? type.category : '',
                         icon: type.info.icon
                     }
                 }));
@@ -222,10 +238,10 @@ const FormModal = ()=>{
                         }));
                     } else {
                         dispatch(reducer.actions.setCustomFieldDataSchema({
-                            customField: pick__default.default(customField, [
-                                'type',
-                                'options'
-                            ]),
+                            customField: {
+                                type: customField?.type ?? '',
+                                options: customField?.options
+                            },
                             isEditing: false,
                             modifiedDataToSetForEditing: attributeToEdit,
                             uid: type.uid
@@ -285,7 +301,7 @@ const FormModal = ()=>{
         // Check form validity for component
         // This is happening when the user click on the link from the left menu
         } else if (isCreatingComponent) {
-            schema = forms.forms.component.schema(Object.keys(components), modifiedData.category || '', reservedNames, actionType === 'edit', components, modifiedData.displayName || '', type?.uid ?? null);
+            schema = forms.forms.component.schema(Object.keys(components), toStringValue(modifiedData.category), reservedNames, actionType === 'edit', components, toStringValue(modifiedData.displayName), type?.uid ?? null);
         } else if (isCreatingCustomFieldAttribute) {
             schema = forms.forms.customField.schema({
                 schemaAttributes: get__default.default(type, [
@@ -305,16 +321,16 @@ const FormModal = ()=>{
         // Since we temporarily store the component info in another object
         // The data is set in the componentToCreate key
         } else if (isComponentAttribute && isCreatingComponentFromAView && isInFirstComponentStep) {
-            schema = forms.forms.component.schema(Object.keys(components), get__default.default(modifiedData, 'componentToCreate.category', ''), reservedNames, actionType === 'edit', components, modifiedData.componentToCreate.displayName || '');
+            schema = forms.forms.component.schema(Object.keys(components), toStringValue(get__default.default(modifiedData, 'componentToCreate.category', '')), reservedNames, actionType === 'edit', components, toStringValue(modifiedData.componentToCreate?.displayName));
         // Check form validity for creating a 'common attribute'
         // We need to make sure that it is independent from the step
         } else if (isCreatingAttribute && !isInFirstComponentStep) {
-            const computedAttrbiuteType = attributeType === 'relation' ? 'relation' : modifiedData.type;
+            const computedAttributeType = attributeType === 'relation' ? 'relation' : modifiedData.type;
             let alreadyTakenTargetContentTypeAttributes = [];
-            if (computedAttrbiuteType === 'relation') {
-                const targetContentTypeUID = get__default.default(modifiedData, [
+            if (computedAttributeType === 'relation') {
+                const targetContentTypeUID = toStringValue(get__default.default(modifiedData, [
                     'target'
-                ], null);
+                ], ''));
                 const targetContentTypeAttributes = get__default.default(contentTypes, [
                     targetContentTypeUID,
                     'attributes'
@@ -331,7 +347,7 @@ const FormModal = ()=>{
                     return attrName !== initialData.targetAttribute;
                 });
             }
-            schema = forms.forms.attribute.schema(type, computedAttrbiuteType, reservedNames, alreadyTakenTargetContentTypeAttributes, {
+            schema = forms.forms.attribute.schema(type, computedAttributeType ?? 'string', reservedNames, alreadyTakenTargetContentTypeAttributes, {
                 modifiedData,
                 initialData
             }, ctbFormsAPI);
@@ -340,7 +356,7 @@ const FormModal = ()=>{
             // in step 1 of the add component (modalType=attribute&attributeType=component) but not creating a component
             // eslint-disable-next-line no-lonely-if
             if (isInFirstComponentStep && isCreatingComponentFromAView) {
-                schema = forms.forms.component.schema(Object.keys(components), get__default.default(modifiedData, 'componentToCreate.category', ''), reservedNames, actionType === 'edit', components, modifiedData.componentToCreate.displayName || '');
+                schema = forms.forms.component.schema(Object.keys(components), toStringValue(get__default.default(modifiedData, 'componentToCreate.category', '')), reservedNames, actionType === 'edit', components, toStringValue(modifiedData.componentToCreate?.displayName));
             } else {
                 // The form is valid
                 // The case here is being in the addComponentToDynamicZone modal and not creating a component
@@ -351,7 +367,7 @@ const FormModal = ()=>{
             abortEarly: false
         });
     };
-    const handleChange = React__namespace.useCallback(({ target: { name, value, type, ...rest } })=>{
+    const handleChange = React__namespace.useCallback(({ target: { name, value } })=>{
         const namesThatCanResetToNullValue = [
             'enumName',
             'max',
@@ -366,9 +382,9 @@ const FormModal = ()=>{
             val = null;
         } else if (name === 'enum') {
             // For enum values, ensure we're working with an array
-            val = Array.isArray(value) ? value : [
+            val = Array.isArray(value) ? value : typeof value === 'string' ? [
                 value
-            ];
+            ] : [];
         } else {
             val = value;
         }
@@ -408,11 +424,11 @@ const FormModal = ()=>{
                     createSchema({
                         data: {
                             kind,
-                            displayName: modifiedData.displayName,
-                            draftAndPublish: modifiedData.draftAndPublish,
-                            pluginOptions: modifiedData.pluginOptions,
-                            singularName: modifiedData.singularName,
-                            pluralName: modifiedData.pluralName
+                            displayName: toStringValue(modifiedData.displayName),
+                            draftAndPublish: toBooleanValue(modifiedData.draftAndPublish),
+                            pluginOptions: toRecordValue(modifiedData.pluginOptions),
+                            singularName: toStringValue(modifiedData.singularName),
+                            pluralName: toStringValue(modifiedData.pluralName)
                         },
                         uid
                     });
@@ -430,10 +446,10 @@ const FormModal = ()=>{
                         await updateSchema({
                             uid: contentType.uid,
                             data: {
-                                displayName: modifiedData.displayName,
-                                kind: modifiedData.kind,
-                                draftAndPublish: modifiedData.draftAndPublish,
-                                pluginOptions: modifiedData.pluginOptions
+                                displayName: toStringValue(modifiedData.displayName),
+                                kind: toContentTypeKind(modifiedData.kind),
+                                draftAndPublish: toBooleanValue(modifiedData.draftAndPublish),
+                                pluginOptions: toRecordValue(modifiedData.pluginOptions)
                             }
                         });
                     } else {
@@ -450,38 +466,39 @@ const FormModal = ()=>{
             } else if (modalType === 'component') {
                 if (isCreating) {
                     // Create the component schema
-                    const componentUid = createUid.createComponentUid(modifiedData.displayName, modifiedData.category);
-                    const { category, ...rest } = modifiedData;
+                    const componentCategory = toStringValue(modifiedData.category);
+                    const componentDisplayName = toStringValue(modifiedData.displayName);
+                    const componentUid = createUid.createComponentUid(componentDisplayName, componentCategory);
                     createComponentSchema({
                         data: {
-                            displayName: rest.displayName,
-                            icon: rest.icon
+                            displayName: componentDisplayName,
+                            icon: toOptionalStringValue(modifiedData.icon)
                         },
                         uid: componentUid,
-                        componentCategory: category
+                        componentCategory
                     });
                     // Redirect the user to the created component
                     navigate({
-                        pathname: `/plugins/${pluginId.pluginId}/component-categories/${category}/${componentUid}`
+                        pathname: `/plugins/${pluginId.pluginId}/component-categories/${componentCategory}/${componentUid}`
                     });
                     onCloseModal();
                     return;
                 } else {
                     updateComponentSchema({
                         data: {
-                            icon: modifiedData.icon,
-                            displayName: modifiedData.displayName
+                            icon: toOptionalStringValue(modifiedData.icon),
+                            displayName: toStringValue(modifiedData.displayName)
                         },
                         componentUID: targetUid
                     });
                     if (type.status === 'NEW') {
-                        const componentUid = createUid.createComponentUid(modifiedData.displayName, modifiedData.category);
+                        const componentUid = createUid.createComponentUid(toStringValue(modifiedData.displayName), toStringValue(modifiedData.category));
                         updateComponentUid({
                             componentUID: targetUid,
                             newComponentUID: componentUid
                         });
                         navigate({
-                            pathname: `/plugins/${pluginId.pluginId}/component-categories/${modifiedData.category}/${componentUid}`
+                            pathname: `/plugins/${pluginId.pluginId}/component-categories/${toStringValue(modifiedData.category)}/${componentUid}`
                         });
                     }
                     // Close the modal
@@ -496,7 +513,7 @@ const FormModal = ()=>{
                     },
                     forTarget,
                     targetUid,
-                    name: initialData.name
+                    name: toStringValue(initialData.name)
                 };
                 if (actionType === 'edit') {
                     editCustomFieldAttribute(customFieldAttributeUpdate);
@@ -527,7 +544,7 @@ const FormModal = ()=>{
                             attributeToSet: modifiedData,
                             forTarget,
                             targetUid,
-                            name: initialData.name
+                            name: toStringValue(initialData.name)
                         });
                     }
                     // Adding a component to a dynamiczone is not the same logic as creating a simple field
@@ -537,7 +554,7 @@ const FormModal = ()=>{
                         dispatch(reducer.actions.resetPropsAndSetTheFormForAddingACompoToADz());
                         setActiveTab('basic');
                         onNavigateToAddCompoToDZModal({
-                            dynamicZoneTarget: modifiedData.name
+                            dynamicZoneTarget: toStringValue(modifiedData.name)
                         });
                     } else {
                         onCloseModal();
@@ -557,7 +574,7 @@ const FormModal = ()=>{
                             attributeToSet: modifiedData,
                             forTarget,
                             targetUid,
-                            name: initialData.name
+                            name: toStringValue(initialData.name)
                         });
                     }
                     if (shouldContinue) {
@@ -613,7 +630,7 @@ const FormModal = ()=>{
                         attributeToSet: attributeData,
                         forTarget,
                         targetUid,
-                        name: initialData.name
+                        name: toStringValue(initialData.name)
                     });
                 }
                 if (shouldContinue) {
@@ -647,19 +664,19 @@ const FormModal = ()=>{
                 // Step 2 of creating a component (which is setting the attribute name in the parent's schema)
                 }
                 // We are destructuring because the modifiedData object doesn't have the appropriate format to create a field
-                const { category, ...rest } = componentToCreate;
+                const draftComponent = toComponentDraft(componentToCreate);
                 // Create a the component temp UID
                 // This could be refactored but I think it's more understandable to separate the logic
-                const componentUid = createUid.createComponentUid(componentToCreate.displayName, category);
+                const componentUid = createUid.createComponentUid(draftComponent.displayName, draftComponent.category);
                 // Create the component first and add it to the components data
                 createComponentSchema({
                     // Component data
                     data: {
-                        icon: rest.icon,
-                        displayName: rest.displayName
+                        icon: draftComponent.icon,
+                        displayName: draftComponent.displayName
                     },
                     uid: componentUid,
-                    componentCategory: category
+                    componentCategory: draftComponent.category
                 });
                 // Add the field to the schema
                 addAttribute({
@@ -682,13 +699,16 @@ const FormModal = ()=>{
                 // The modal is addComponentToDynamicZone
                 if (isInFirstComponentStep) {
                     if (isCreatingComponentFromAView) {
-                        const { category, type, ...rest } = modifiedData.componentToCreate;
-                        const componentUid = createUid.createComponentUid(modifiedData.componentToCreate.displayName, category);
+                        const draftComponent = toComponentDraft(modifiedData.componentToCreate);
+                        const componentUid = createUid.createComponentUid(draftComponent.displayName, draftComponent.category);
                         // Create the component first and add it to the components data
                         createComponentSchema({
-                            data: rest,
+                            data: {
+                                displayName: draftComponent.displayName,
+                                icon: draftComponent.icon
+                            },
                             uid: componentUid,
-                            componentCategory: category
+                            componentCategory: draftComponent.category
                         });
                         // Add the created component to the DZ
                         // We don't want to remove the old ones
@@ -712,7 +732,7 @@ const FormModal = ()=>{
                             forTarget,
                             targetUid,
                             dynamicZoneTarget,
-                            newComponents: modifiedData.components
+                            newComponents: modifiedData.components ?? []
                         });
                         onCloseModal();
                     }
@@ -902,7 +922,7 @@ const FormModal = ()=>{
                         /*#__PURE__*/ jsxRuntime.jsx(designSystem.Dialog.Trigger, {}),
                         /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.ConfirmDialog, {
                             onConfirm: ()=>{
-                                if (pendingSubmit) {
+                                if (pendingSubmit !== null) {
                                     const { e, shouldContinue } = pendingSubmit;
                                     setShowWarningDialog(false);
                                     setPendingSubmit(null);
@@ -915,12 +935,12 @@ const FormModal = ()=>{
                             },
                             children: (()=>{
                                 const referencedFields = checkFieldNameChanges();
-                                if (!referencedFields) return null;
+                                if (referencedFields === false) return null;
                                 const fieldNames = referencedFields.map((field)=>field.name).join(', ');
-                                const isEnum = initialData.enum && modifiedData.enum;
-                                if (isEnum) {
-                                    const oldEnum = initialData.enum;
-                                    const newEnum = modifiedData.enum;
+                                const oldEnum = initialData.enum;
+                                const newEnum = modifiedData.enum;
+                                const isEnum = Array.isArray(oldEnum) && Array.isArray(newEnum);
+                                if (isEnum === true) {
                                     const deletedOrChangedValues = oldEnum.filter((value)=>!newEnum.includes(value));
                                     return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
                                         children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Typography, {
@@ -1008,7 +1028,7 @@ const FormModal = ()=>{
                                                 actionType: actionType,
                                                 forTarget: forTarget,
                                                 kind: kind,
-                                                step: step,
+                                                step: step ?? undefined,
                                                 modalType: modalType,
                                                 attributeType: attributeType,
                                                 attributeName: attributeName,