From 292490b1f94ea8bfe8283dfe11714dcfa8bfb8b8 Mon Sep 17 00:00:00 2001 From: soupette Date: Mon, 23 Dec 2019 12:20:16 +0100 Subject: [PATCH 01/18] Created helper to create headers array --- .../admin/src/components/ModalHeader/index.js | 5 +- .../admin/src/containers/FormModal/index.js | 27 +++- .../FormModal/utils/createHeadersArray.js | 37 +++++ .../containers/FormModal/utils/staticData.js | 16 ++ .../utils/tests/createHeadersArray.test.js | 152 ++++++++++++++++++ .../admin/src/containers/LeftMenu/index.js | 11 +- 6 files changed, 236 insertions(+), 12 deletions(-) create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/createHeadersArray.js create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 5014d5b29a..7fb67ab7b2 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -6,7 +6,6 @@ import { AttributeIcon } from '@buffetjs/core'; import { FormattedMessage } from 'react-intl'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import useDataManager from '../../hooks/useDataManager'; -import pluginId from '../../pluginId'; import ComponentIcon from './ComponentIcon'; import Header from './Header'; @@ -46,9 +45,7 @@ const ModalHeader = ({ style={{ margin: 'auto 20px auto 0' }} /> )} - {headerId && ( - - )} + {headerId && } {!headerId && (
{ const targetUid = query.get('targetUid'); const settingType = query.get('settingType'); const subTargetUid = query.get('subTargetUid'); + const headerId = query.get('headerId'); + const header_label_1 = query.get('header_label_1'); + const header_icon_name_1 = query.get('header_icon_name_1'); + const header_icon_isCustom_1 = query.get('header_icon_isCustom_1'); + const header_info_category_1 = query.get('header_info_category_1'); + const header_info_name_1 = query.get('header_info_name_1'); const step = query.get('step'); const pathToSchema = forTarget === 'contentType' || forTarget === 'component' @@ -108,6 +114,12 @@ const FormModal = () => { subTargetUid, step, targetUid, + header_label_1, + header_icon_name_1, + header_icon_isCustom_1, + header_info_name_1, + header_info_category_1, + headerId, }); // Reset all the modification when opening the edit category modal @@ -310,13 +322,13 @@ const FormModal = () => { const isPickingAttribute = state.modalType === 'chooseAttribute'; const uid = createUid(modifiedData.name || ''); - let headerId = isCreating - ? `modalForm.${state.modalType}.header-create` - : 'modalForm.header-edit'; + // let headerId = isCreating + // ? `modalForm.${state.modalType}.header-create` + // : 'modalForm.header-edit'; - if (!['contentType', 'component'].includes(state.modalType)) { - headerId = null; - } + // if (!['contentType', 'component'].includes(state.modalType)) { + // headerId = null; + // } const checkFormValidity = async () => { let schema; @@ -977,6 +989,7 @@ const FormModal = () => { ? { paddingTop: '0.5rem', paddingBottom: '3rem' } : {}; + console.log(state.headerId); return ( { { + const array = Object.keys(obj).reduce((acc, current) => { + const splitted = current.split('_'); + const currentKeys = splitted.filter((_, i) => i !== splitted.length - 1); + + if (ALLOWED_KEYS.includes(currentKeys.join('_'))) { + const currentKeysIndex = parseInt(splitted[splitted.length - 1] - 1, 10); + const path = [ + currentKeysIndex, + ...currentKeys.filter(key => key !== 'header'), + ]; + + let value = obj[current]; + + if (current.includes('isCustom')) { + value = obj[current] === 'true'; + } + + set(acc, path, value); + } + + return acc; + }, []); + + return array.filter(obj => obj.label !== null); +}; + +export default createHeadersArray; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js index e168a52a9c..02004e2548 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js @@ -15,6 +15,22 @@ const INITIAL_STATE_DATA = { step: null, subTargetUid: null, targetUid: null, + headerId: null, + header_label_1: null, + header_icon_name_1: null, + header_icon_isCustom_1: null, + header_info_category_1: null, + header_info_name_1: null, + header_label_2: null, + header_icon_name_2: null, + header_icon_isCustom_2: null, + header_info_category_2: null, + header_info_name_2: null, + header_label_3: null, + header_icon_name_3: null, + header_icon_isCustom_3: null, + header_info_category_3: null, + header_info_name_3: null, }; export { NAVLINKS, INITIAL_STATE_DATA }; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js new file mode 100644 index 0000000000..2ed613647c --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js @@ -0,0 +1,152 @@ +import createHeadersArray from '../createHeadersArray'; + +describe('FormModal | utils | createHeadersArray', () => { + it('should return an empty array if no header key is set', () => { + const data = { + actionType: null, + attributeName: null, + attributeType: null, + dynamicZoneTarget: null, + forTarget: null, + headerDisplayCategory: null, + headerDisplayName: null, + headerDisplaySubCategory: null, + modalType: null, + pathToSchema: [], + settingType: null, + step: null, + subTargetUid: null, + targetUid: null, + headerId: null, + header_label_1: null, + header_icon_name_1: null, + header_icon_isCustom_1: null, + header_info_category_1: null, + header_info_name_1: null, + header_label_2: null, + header_icon_name_2: null, + header_icon_isCustom_2: null, + header_info_category_2: null, + header_info_name_2: null, + header_label_3: null, + header_icon_name_3: null, + header_icon_isCustom_3: null, + header_info_category_3: null, + header_info_name_3: null, + }; + + expect(createHeadersArray(data)).toEqual([]); + }); + + it('should return an array containing an header object', () => { + const data = { + actionType: 'something', + attributeName: null, + attributeType: null, + dynamicZoneTarget: null, + forTarget: null, + headerDisplayCategory: null, + headerDisplayName: null, + headerDisplaySubCategory: null, + modalType: null, + pathToSchema: [], + settingType: null, + step: null, + subTargetUid: null, + targetUid: null, + headerId: null, + header_label_1: 'restaurant', + header_icon_name_1: 'contentType', + header_icon_isCustom_1: 'false', + header_info_category_1: null, + header_info_name_1: null, + header_label_2: null, + header_icon_name_2: null, + header_icon_isCustom_2: null, + header_info_category_2: null, + header_info_name_2: null, + header_label_3: null, + header_icon_name_3: null, + header_icon_isCustom_3: null, + header_info_category_3: null, + header_info_name_3: null, + }; + const expected = [ + { + label: 'restaurant', + icon: { + name: 'contentType', + isCustom: false, + }, + info: { + name: null, + category: null, + }, + }, + ]; + + expect(createHeadersArray(data)).toEqual(expected); + }); + + it('should handle multiple headers correctly', () => { + const data = { + actionType: 'something', + attributeName: null, + attributeType: null, + dynamicZoneTarget: null, + forTarget: null, + headerDisplayCategory: null, + headerDisplayName: null, + headerDisplaySubCategory: null, + modalType: null, + pathToSchema: [], + settingType: null, + step: null, + subTargetUid: null, + targetUid: null, + headerId: null, + header_label_1: 'restaurant', + header_icon_name_1: 'bool', + header_icon_isCustom_1: 'true', + header_info_category_1: null, + header_info_name_1: null, + header_label_2: 'closing period', + header_icon_name_2: null, + header_icon_isCustom_2: null, + header_info_category_2: 'default', + header_info_name_2: 'closingperiod', + header_label_3: null, + header_icon_name_3: null, + header_icon_isCustom_3: null, + header_info_category_3: null, + header_info_name_3: null, + }; + + const expected = [ + { + label: 'restaurant', + icon: { + name: 'bool', + isCustom: true, + }, + info: { + name: null, + category: null, + }, + }, + { + label: 'closing period', + icon: { + name: null, + isCustom: false, + }, + info: { + name: 'closingperiod', + category: 'default', + }, + }, + ]; + + expect(createHeadersArray(data)).toEqual(expected); + }); +}); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js index eb0fd9c3d5..2da36521bc 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js @@ -83,10 +83,19 @@ function LeftMenu({ wait }) { : 'willCreateComponent'; emitEvent(eventName); + console.log(type); + + // header_label_1: null, + // header_icon_name_1: null, + // header_icon_isCustom_1: null, + // header_info_category_1: null, + // header_info_name_1: null, await wait(); push({ - search: `modalType=${type}&actionType=create&settingType=base&forTarget=${type}`, + search: `modalType=${type}&actionType=create&settingType=base&forTarget=${type}&headerId=${getTrad( + `modalForm.${type}.header-create` + )}&header_icon_name_1:${type}&header_icon_isCustom_1=false`, }); } else { displayNotificationCTNotSaved(); From 50f8a324718fc9d8d72106753f1aa494c19f788e Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 08:11:12 +0100 Subject: [PATCH 02/18] Change search for enabling new stepper in add main field and dz --- .../src/components/AttributeOption/index.js | 11 +++ .../admin/src/components/ModalHeader/index.js | 99 ++++++++++++++----- .../admin/src/containers/FormModal/index.js | 13 ++- .../containers/FormModal/utils/staticData.js | 10 ++ .../admin/src/containers/LeftMenu/index.js | 9 +- .../admin/src/containers/ListView/index.js | 44 ++++++++- 6 files changed, 150 insertions(+), 36 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js index 6819788e1a..ac2d87a7c2 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js @@ -45,6 +45,10 @@ const AttributeOption = forwardRef(({ tabIndex, type }, ref) => { const forTarget = query.get('forTarget'); const targetUid = query.get('targetUid'); const headerDisplayName = query.get('headerDisplayName'); + const header_label_1 = query.get('header_label_1'); + + const header_info_category_1 = query.get('header_info_category_1'); + const header_info_name_1 = query.get('header_info_name_1'); const search = makeSearch({ modalType: 'attribute', @@ -55,9 +59,16 @@ const AttributeOption = forwardRef(({ tabIndex, type }, ref) => { attributeType: type, headerDisplayName, step: type === 'component' ? '1' : null, + // TODO to remove headerDisplayCategory: query.get('headerDisplayCategory'), + // TODO to remove headerDisplaySubCategory: query.get('headerDisplaySubCategory'), subTargetUid: query.get('subTargetUid'), + header_label_1, + header_icon_isCustom_1: false, + header_info_category_1, + header_info_name_1, + header_icon_name_1: type, }); if (forTarget === 'contentType') { diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 7fb67ab7b2..c831366f5e 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -1,41 +1,44 @@ -import React from 'react'; +import React, { Fragment } from 'react'; import PropTypes from 'prop-types'; import { HeaderModalTitle } from 'strapi-helper-plugin'; import { get } from 'lodash'; import { AttributeIcon } from '@buffetjs/core'; import { FormattedMessage } from 'react-intl'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import useDataManager from '../../hooks/useDataManager'; -import ComponentIcon from './ComponentIcon'; -import Header from './Header'; +// import useDataManager from '../../hooks/useDataManager'; +// import ComponentIcon from './ComponentIcon'; +// import Header from './Header'; +import IconWrapper from './IconWrapper'; +import UpperFirst from '../UpperFirst'; const ModalHeader = ({ - category, + // category, headerId, - iconType, - name, - target, - targetUid, - subCategory, - subTargetUid, + headers, + // iconType, + // name, + // target, + // targetUid, + // subCategory, + // subTargetUid, }) => { - const { modifiedData } = useDataManager(); - const currentComponent = get(modifiedData, ['components', targetUid], {}); - const shouldDisplayComponentCatInfos = target === 'components'; - const currentComponentIcon = get(currentComponent, ['schema', 'icon'], ''); + // const { modifiedData } = useDataManager(); + // const currentComponent = get(modifiedData, ['components', targetUid], {}); + // const shouldDisplayComponentCatInfos = target === 'components'; + // const currentComponentIcon = get(currentComponent, ['schema', 'icon'], ''); + console.log({ headers }); + // let iconName; - let iconName; - - if (iconType === 'components') { - iconName = 'component'; - } else { - iconName = iconType; - } + // if (iconType === 'components') { + // iconName = 'component'; + // } else { + // iconName = iconType; + // } return (
- {shouldDisplayComponentCatInfos ? ( + {/* {shouldDisplayComponentCatInfos ? ( @@ -44,9 +47,51 @@ const ModalHeader = ({ type={iconName} style={{ margin: 'auto 20px auto 0' }} /> + )} */} + {headerId && ( + <> + + + )} - {headerId && } - {!headerId && ( + {!headerId && + headers.map((header, index) => { + if (index === 0) { + return ( + + + + + + + ); + } + + return ( + + + + + + + + + + ); + })} + {/* {!headerId && (
- )} + )} */}
); @@ -64,6 +109,7 @@ const ModalHeader = ({ ModalHeader.defaultProps = { category: null, headerId: '', + headers: [], iconType: 'contentType', name: '', target: null, @@ -75,6 +121,7 @@ ModalHeader.defaultProps = { ModalHeader.propTypes = { category: PropTypes.string, headerId: PropTypes.string, + headers: PropTypes.array, iconType: PropTypes.string, name: PropTypes.string, target: PropTypes.string, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js index 5db3e196bb..0ad05cac09 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js @@ -31,6 +31,7 @@ import getTrad from '../../utils/getTrad'; import makeSearch from '../../utils/makeSearch'; import getAttributes from './utils/attributes'; import forms from './utils/forms'; +import createHeadersArray from './utils/createHeadersArray'; import { createComponentUid, createUid } from './utils/createUid'; import getModalTitleSubHeader from './utils/getModalTitleSubHeader'; import getNextSearch from './utils/getNextSearch'; @@ -93,6 +94,11 @@ const FormModal = () => { const header_icon_isCustom_1 = query.get('header_icon_isCustom_1'); const header_info_category_1 = query.get('header_info_category_1'); const header_info_name_1 = query.get('header_info_name_1'); + const header_label_2 = query.get('header_label_2'); + const header_icon_name_2 = query.get('header_icon_name_2'); + const header_icon_isCustom_2 = query.get('header_icon_isCustom_2'); + const header_info_category_2 = query.get('header_info_category_2'); + const header_info_name_2 = query.get('header_info_name_2'); const step = query.get('step'); const pathToSchema = forTarget === 'contentType' || forTarget === 'component' @@ -119,6 +125,11 @@ const FormModal = () => { header_icon_isCustom_1, header_info_name_1, header_info_category_1, + header_label_2, + header_icon_name_2, + header_icon_isCustom_2, + header_info_name_2, + header_info_category_2, headerId, }); @@ -989,7 +1000,6 @@ const FormModal = () => { ? { paddingTop: '0.5rem', paddingBottom: '3rem' } : {}; - console.log(state.headerId); return ( { subTargetUid={state.subTargetUid} target={state.forTarget} targetUid={state.targetUid} + headers={createHeadersArray(state)} />
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js index 02004e2548..ca48a636c1 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js @@ -31,6 +31,16 @@ const INITIAL_STATE_DATA = { header_icon_isCustom_3: null, header_info_category_3: null, header_info_name_3: null, + header_label_4: null, + header_icon_name_4: null, + header_icon_isCustom_4: null, + header_info_category_4: null, + header_info_name_4: null, + header_label_5: null, + header_icon_name_5: null, + header_icon_isCustom_5: null, + header_info_category_5: null, + header_info_name_5: null, }; export { NAVLINKS, INITIAL_STATE_DATA }; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js index 2da36521bc..17836de4a6 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js @@ -83,19 +83,12 @@ function LeftMenu({ wait }) { : 'willCreateComponent'; emitEvent(eventName); - console.log(type); - - // header_label_1: null, - // header_icon_name_1: null, - // header_icon_isCustom_1: null, - // header_info_category_1: null, - // header_info_name_1: null, await wait(); push({ search: `modalType=${type}&actionType=create&settingType=base&forTarget=${type}&headerId=${getTrad( `modalForm.${type}.header-create` - )}&header_icon_name_1:${type}&header_icon_isCustom_1=false`, + )}&header_icon_name_1=${type}&header_icon_isCustom_1=false&header_label_1=null`, }); } else { displayNotificationCTNotSaved(); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js index 5c89907d61..181276ec93 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js @@ -71,6 +71,27 @@ const ListView = () => { const hasModelBeenModified = !isEqual(modifiedData, initialData); const forTarget = isInContentTypeView ? 'contentType' : 'component'; + const handleClickAddField = async ( + forTarget, + targetUid, + firstHeaderObj + // secondHeaderObj, + // thirdHeaderObj, + // subTargetUid + ) => { + // disable the prompt + await wait(); + + const searchObj = { + modalType: 'chooseAttribute', + forTarget, + targetUid, + ...firstHeaderObj, + }; + + push({ search: makeSearch(searchObj) }); + }; + const handleClickOpenModalAddField = async ( forTarget, targetUid, @@ -96,6 +117,14 @@ const ListView = () => { }; const handleClickAddComponentToDZ = async dzName => { + const firstHeaderObject = { + header_label_1: currentDataName, + header_icon_name_1: 'dynamiczone', + header_icon_isCustom_1: false, + }; + const secondHeaderObj = { + header_label_2: dzName, + }; const search = { modalType: 'addComponentToDynamicZone', forTarget: 'contentType', @@ -105,7 +134,10 @@ const ListView = () => { settingType: 'base', step: '1', actionType: 'edit', + // TODO to remove headerDisplayName: dzName, + ...firstHeaderObject, + ...secondHeaderObj, }; await wait(); @@ -181,6 +213,7 @@ const ListView = () => { const wait = async () => { togglePrompt(false); + return new Promise(resolve => setTimeout(resolve, 100)); }; const label = get(modifiedData, [firstMainDataPath, 'schema', 'name'], ''); @@ -232,6 +265,10 @@ const ListView = () => { forTarget: firstMainDataPath, targetUid, headerDisplayName: label, + header_label_1: label, + header_icon_isCustom_1: false, + header_icon_name_1: firstMainDataPath, + headerId: getTrad('modalForm.header-edit'), }), }); }, @@ -258,7 +295,12 @@ const ListView = () => { color: 'primary', label: formatMessage({ id: `${pluginId}.button.attributes.add.another` }), onClick: () => { - handleClickOpenModalAddField(forTarget, targetUid, currentDataName); + const headerDisplayObject = { + header_label_1: currentDataName, + header_icon_name_1: forTarget, + header_icon_isCustom_1: false, + }; + handleClickAddField(forTarget, targetUid, headerDisplayObject); }, }; const goToCMSettingsPage = () => { From 4afb65ee46cd69472fc4d95e325af0dcbed37483 Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 09:31:01 +0100 Subject: [PATCH 03/18] Handle stepper for adding to dz --- .../getstarted/api/custom/config/routes.json | 52 +++++++++++ .../api/custom/controllers/custom.js | 8 ++ .../getstarted/api/custom/models/custom.js | 44 +++++++++ .../api/custom/models/custom.settings.json | 19 ++++ .../getstarted/api/custom/services/custom.js | 8 ++ .../src/components/ComponentList/index.js | 8 ++ .../src/components/DynamicZoneList/index.js | 1 + .../admin/src/components/List/index.js | 92 +++++++++++++++++-- .../admin/src/components/ModalHeader/index.js | 60 ++++-------- .../admin/src/containers/FormModal/index.js | 32 +++++++ .../admin/src/containers/ListView/index.js | 55 ++++++----- 11 files changed, 302 insertions(+), 77 deletions(-) create mode 100644 examples/getstarted/api/custom/config/routes.json create mode 100644 examples/getstarted/api/custom/controllers/custom.js create mode 100644 examples/getstarted/api/custom/models/custom.js create mode 100644 examples/getstarted/api/custom/models/custom.settings.json create mode 100644 examples/getstarted/api/custom/services/custom.js diff --git a/examples/getstarted/api/custom/config/routes.json b/examples/getstarted/api/custom/config/routes.json new file mode 100644 index 0000000000..a0e9852637 --- /dev/null +++ b/examples/getstarted/api/custom/config/routes.json @@ -0,0 +1,52 @@ +{ + "routes": [ + { + "method": "GET", + "path": "/customs", + "handler": "custom.find", + "config": { + "policies": [] + } + }, + { + "method": "GET", + "path": "/customs/count", + "handler": "custom.count", + "config": { + "policies": [] + } + }, + { + "method": "GET", + "path": "/customs/:id", + "handler": "custom.findOne", + "config": { + "policies": [] + } + }, + { + "method": "POST", + "path": "/customs", + "handler": "custom.create", + "config": { + "policies": [] + } + }, + { + "method": "PUT", + "path": "/customs/:id", + "handler": "custom.update", + "config": { + "policies": [] + } + }, + { + "method": "DELETE", + "path": "/customs/:id", + "handler": "custom.delete", + "config": { + "policies": [] + } + } + ] +} diff --git a/examples/getstarted/api/custom/controllers/custom.js b/examples/getstarted/api/custom/controllers/custom.js new file mode 100644 index 0000000000..f94f22736f --- /dev/null +++ b/examples/getstarted/api/custom/controllers/custom.js @@ -0,0 +1,8 @@ +'use strict'; + +/** + * Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/concepts/controllers.html#core-controllers) + * to customize this controller + */ + +module.exports = {}; diff --git a/examples/getstarted/api/custom/models/custom.js b/examples/getstarted/api/custom/models/custom.js new file mode 100644 index 0000000000..3875172e5c --- /dev/null +++ b/examples/getstarted/api/custom/models/custom.js @@ -0,0 +1,44 @@ +'use strict'; + +/** + * Lifecycle callbacks for the `custom` model. + */ + +module.exports = { + // Before saving a value. + // Fired before an `insert` or `update` query. + // beforeSave: async (model, attrs, options) => {}, + // After saving a value. + // Fired after an `insert` or `update` query. + // afterSave: async (model, response, options) => {}, + // Before fetching a value. + // Fired before a `fetch` operation. + // beforeFetch: async (model, columns, options) => {}, + // After fetching a value. + // Fired after a `fetch` operation. + // afterFetch: async (model, response, options) => {}, + // Before fetching all values. + // Fired before a `fetchAll` operation. + // beforeFetchAll: async (model, columns, options) => {}, + // After fetching all values. + // Fired after a `fetchAll` operation. + // afterFetchAll: async (model, response, options) => {}, + // Before creating a value. + // Fired before an `insert` query. + // beforeCreate: async (model, attrs, options) => {}, + // After creating a value. + // Fired after an `insert` query. + // afterCreate: async (model, attrs, options) => {}, + // Before updating a value. + // Fired before an `update` query. + // beforeUpdate: async (model, attrs, options) => {}, + // After updating a value. + // Fired after an `update` query. + // afterUpdate: async (model, attrs, options) => {}, + // Before destroying a value. + // Fired before a `delete` query. + // beforeDestroy: async (model, attrs, options) => {}, + // After destroying a value. + // Fired after a `delete` query. + // afterDestroy: async (model, attrs, options) => {} +}; diff --git a/examples/getstarted/api/custom/models/custom.settings.json b/examples/getstarted/api/custom/models/custom.settings.json new file mode 100644 index 0000000000..05c259c68f --- /dev/null +++ b/examples/getstarted/api/custom/models/custom.settings.json @@ -0,0 +1,19 @@ +{ + "info": { + "name": "custom" + }, + "options": { + "increments": true, + "timestamps": true + }, + "attributes": { + "dz": { + "type": "dynamiczone", + "components": [ + "default.closingperiod" + ] + } + }, + "connection": "default", + "collectionName": "customs" +} diff --git a/examples/getstarted/api/custom/services/custom.js b/examples/getstarted/api/custom/services/custom.js new file mode 100644 index 0000000000..d0dcc88381 --- /dev/null +++ b/examples/getstarted/api/custom/services/custom.js @@ -0,0 +1,8 @@ +'use strict'; + +/** + * Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/concepts/services.html#core-services) + * to customize this service + */ + +module.exports = {}; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentList/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentList/index.js index 9c9380412e..9ffdedae3c 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentList/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentList/index.js @@ -15,8 +15,10 @@ import Td from '../Td'; function ComponentList({ customRowComponent, component, + dzName, mainTypeName, isFromDynamicZone, + isNestedInDZComponent, firstLoopComponentName, firstLoopComponentUid, }) { @@ -32,6 +34,7 @@ function ComponentList({ { - let headerDisplayName = mainTypeName; + let firstHeaderObject = { + header_label_1: mainTypeName, + header_icon_name_1: 'contentType', + header_icon_isCustom_1: false, + header_info_category_1: null, + header_info_name_1: null, + }; + let secondHeaderObject = { + header_label_2: firstLoopComponentName, + header_icon_name_2: 'component', + header_icon_isCustom_2: false, + header_info_category_2: null, + header_info_name_2: null, + }; + let thirdHeaderObject = { + header_icon_name_3: 'component', + header_icon_isCustom_3: false, + header_info_category_3: null, + header_info_name_3: null, + }; + let fourthHeaderObject = { + header_icon_name_4: null, + header_icon_isCustom_4: false, + header_info_category_4: null, + header_info_name_4: null, + }; + + const firstComponentIcon = get( + modifiedData, + ['components', firstLoopComponentUid, 'schema', 'icon'], + '' + ); + const secondComponentIcon = get( + modifiedData, + ['components', secondLoopComponentUid, 'schema', 'icon'], + '' + ); if (firstLoopComponentName) { - headerDisplayName = firstLoopComponentName; + firstHeaderObject = { + ...firstHeaderObject, + header_icon_name_1: firstComponentIcon, + header_icon_isCustom_1: true, + }; } if (secondLoopComponentUid) { - headerDisplayName = secondLoopComponentName; + firstHeaderObject = { + ...firstHeaderObject, + header_icon_name_1: secondComponentIcon, + header_icon_isCustom_1: true, + }; + thirdHeaderObject = { + ...thirdHeaderObject, + header_label_3: secondLoopComponentName, + }; + } + + if (isFromDynamicZone || isNestedInDZComponent) { + secondHeaderObject = { + ...secondHeaderObject, + header_label_2: dzName, + header_icon_name_2: 'dynamiczone', + header_icon_isCustom_2: false, + }; + thirdHeaderObject = { + ...thirdHeaderObject, + header_label_3: firstLoopComponentName, + }; + fourthHeaderObject = { + ...fourthHeaderObject, + header_label_4: secondLoopComponentName, + }; } openModalAddField( editTarget, targetUid, - headerDisplayName, - firstLoopComponentUid ? mainTypeName : null, - secondLoopComponentName ? firstLoopComponentName : null, - secondLoopComponentUid ? firstLoopComponentUid : null + firstHeaderObject, + secondHeaderObject, + thirdHeaderObject, + fourthHeaderObject ); }; @@ -104,7 +173,8 @@ function List({ customRowComponent={customRowComponent} targetUid={targetUid} // NEW PROPS - + dzName={dzName} + isNestedInDZComponent={isFromDynamicZone} mainTypeName={mainTypeName} editTarget={editTarget} firstLoopComponentName={firstLoopComponentName} @@ -147,9 +217,11 @@ List.defaultProps = { addComponentToDZ: () => {}, className: null, customRowComponent: null, + dzName: null, firstLoopComponentName: null, firstLoopComponentUid: null, isFromDynamicZone: false, + isNestedInDZComponent: false, isMain: false, isSub: false, items: [], @@ -162,10 +234,12 @@ List.propTypes = { addComponentToDZ: PropTypes.func, className: PropTypes.string, customRowComponent: PropTypes.func, + dzName: PropTypes.string, editTarget: PropTypes.string.isRequired, firstLoopComponentName: PropTypes.string, firstLoopComponentUid: PropTypes.string, isFromDynamicZone: PropTypes.bool, + isNestedInDZComponent: PropTypes.bool, isMain: PropTypes.bool, items: PropTypes.instanceOf(Array), mainTypeName: PropTypes.string.isRequired, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index c831366f5e..54a9bb701c 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -6,48 +6,15 @@ import { AttributeIcon } from '@buffetjs/core'; import { FormattedMessage } from 'react-intl'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; // import useDataManager from '../../hooks/useDataManager'; -// import ComponentIcon from './ComponentIcon'; +import ComponentIcon from './ComponentIcon'; // import Header from './Header'; import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; -const ModalHeader = ({ - // category, - headerId, - headers, - // iconType, - // name, - // target, - // targetUid, - // subCategory, - // subTargetUid, -}) => { - // const { modifiedData } = useDataManager(); - // const currentComponent = get(modifiedData, ['components', targetUid], {}); - // const shouldDisplayComponentCatInfos = target === 'components'; - // const currentComponentIcon = get(currentComponent, ['schema', 'icon'], ''); - console.log({ headers }); - // let iconName; - - // if (iconType === 'components') { - // iconName = 'component'; - // } else { - // iconName = iconType; - // } - +const ModalHeader = ({ headerId, headers }) => { return (
- {/* {shouldDisplayComponentCatInfos ? ( - - - - ) : ( - - )} */} {headerId && ( <> { + const iconName = get(header, ['icon', 'name'], ''); + const iconType = iconName === null ? '' : iconName; + const icon = get(header, ['icon', 'isCustom'], false) ? ( + + + + ) : ( + + ); + if (index === 0) { return ( - + {icon} @@ -81,10 +58,7 @@ const ModalHeader = ({ - + {icon} diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js index 0ad05cac09..ce8d6e57a8 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js @@ -99,6 +99,21 @@ const FormModal = () => { const header_icon_isCustom_2 = query.get('header_icon_isCustom_2'); const header_info_category_2 = query.get('header_info_category_2'); const header_info_name_2 = query.get('header_info_name_2'); + const header_label_3 = query.get('header_label_3'); + const header_icon_name_3 = query.get('header_icon_name_3'); + const header_icon_isCustom_3 = query.get('header_icon_isCustom_3'); + const header_info_category_3 = query.get('header_info_category_3'); + const header_info_name_3 = query.get('header_info_name_3'); + const header_label_4 = query.get('header_label_4'); + const header_icon_name_4 = query.get('header_icon_name_4'); + const header_icon_isCustom_4 = query.get('header_icon_isCustom_4'); + const header_info_category_4 = query.get('header_info_category_4'); + const header_info_name_4 = query.get('header_info_name_4'); + const header_label_5 = query.get('header_label_5'); + const header_icon_name_5 = query.get('header_icon_name_5'); + const header_icon_isCustom_5 = query.get('header_icon_isCustom_5'); + const header_info_category_5 = query.get('header_info_category_5'); + const header_info_name_5 = query.get('header_info_name_5'); const step = query.get('step'); const pathToSchema = forTarget === 'contentType' || forTarget === 'component' @@ -130,6 +145,21 @@ const FormModal = () => { header_icon_isCustom_2, header_info_name_2, header_info_category_2, + header_label_3, + header_icon_name_3, + header_icon_isCustom_3, + header_info_name_3, + header_info_category_3, + header_label_4, + header_icon_name_4, + header_icon_isCustom_4, + header_info_name_4, + header_info_category_4, + header_label_5, + header_icon_name_5, + header_icon_isCustom_5, + header_info_name_5, + header_info_category_5, headerId, }); @@ -995,6 +1025,8 @@ const FormModal = () => { nestedComponents ); + // console.log({ state }); + // Styles const modalBodyStyle = isPickingAttribute ? { paddingTop: '0.5rem', paddingBottom: '3rem' } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js index 181276ec93..91b9465e6a 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js @@ -74,9 +74,10 @@ const ListView = () => { const handleClickAddField = async ( forTarget, targetUid, - firstHeaderObj - // secondHeaderObj, - // thirdHeaderObj, + firstHeaderObj, + secondHeaderObj, + thirdHeaderObj, + fourthHeaderObj // subTargetUid ) => { // disable the prompt @@ -87,34 +88,37 @@ const ListView = () => { forTarget, targetUid, ...firstHeaderObj, + ...secondHeaderObj, + ...thirdHeaderObj, + ...fourthHeaderObj, }; push({ search: makeSearch(searchObj) }); }; - const handleClickOpenModalAddField = async ( - forTarget, - targetUid, - headerDisplayName, - headerDisplayCategory = null, - headerDisplaySubCategory = null, - subTargetUid = null - ) => { - const searchObj = { - modalType: 'chooseAttribute', - forTarget, - targetUid, - headerDisplayName, - headerDisplayCategory, - headerDisplaySubCategory, - subTargetUid, - }; + // const handleClickOpenModalAddField = async ( + // forTarget, + // targetUid, + // headerDisplayName, + // headerDisplayCategory = null, + // headerDisplaySubCategory = null, + // subTargetUid = null + // ) => { + // const searchObj = { + // modalType: 'chooseAttribute', + // forTarget, + // targetUid, + // headerDisplayName, + // headerDisplayCategory, + // headerDisplaySubCategory, + // subTargetUid, + // }; - // Disable the prompt - await wait(); + // // Disable the prompt + // await wait(); - push({ search: makeSearch(searchObj, true) }); - }; + // push({ search: makeSearch(searchObj, true) }); + // }; const handleClickAddComponentToDZ = async dzName => { const firstHeaderObject = { @@ -349,7 +353,8 @@ const ListView = () => { return ( From 10c963a8c32d7355940003a86cc6de0887779cb8 Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 09:36:18 +0100 Subject: [PATCH 04/18] Keep modal header stepper when selecting a field --- .../src/components/AttributeOption/index.js | 36 +++++++++++++++++-- .../admin/src/containers/ListView/index.js | 1 + 2 files changed, 34 insertions(+), 3 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js index ac2d87a7c2..1b58d44f80 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js @@ -44,11 +44,26 @@ const AttributeOption = forwardRef(({ tabIndex, type }, ref) => { const handleClick = () => { const forTarget = query.get('forTarget'); const targetUid = query.get('targetUid'); + // TODO to remove const headerDisplayName = query.get('headerDisplayName'); const header_label_1 = query.get('header_label_1'); - const header_info_category_1 = query.get('header_info_category_1'); const header_info_name_1 = query.get('header_info_name_1'); + const header_label_2 = query.get('header_label_2'); + const header_icon_name_2 = query.get('header_icon_name_2'); + const header_icon_isCustom_2 = query.get('header_icon_isCustom_2'); + const header_info_category_2 = query.get('header_info_category_2'); + const header_info_name_2 = query.get('header_info_name_2'); + const header_label_3 = query.get('header_label_3'); + const header_icon_name_3 = query.get('header_icon_name_3'); + const header_icon_isCustom_3 = query.get('header_icon_isCustom_3'); + const header_info_category_3 = query.get('header_info_category_3'); + const header_info_name_3 = query.get('header_info_name_3'); + const header_label_4 = query.get('header_label_4'); + const header_icon_name_4 = query.get('header_icon_name_4'); + const header_icon_isCustom_4 = query.get('header_icon_isCustom_4'); + const header_info_category_4 = query.get('header_info_category_4'); + const header_info_name_4 = query.get('header_info_name_4'); const search = makeSearch({ modalType: 'attribute', @@ -65,9 +80,24 @@ const AttributeOption = forwardRef(({ tabIndex, type }, ref) => { headerDisplaySubCategory: query.get('headerDisplaySubCategory'), subTargetUid: query.get('subTargetUid'), header_label_1, - header_icon_isCustom_1: false, - header_info_category_1, header_info_name_1, + header_info_category_1, + header_label_2, + header_icon_name_2, + header_icon_isCustom_2, + header_info_name_2, + header_info_category_2, + header_label_3, + header_icon_name_3, + header_icon_isCustom_3, + header_info_name_3, + header_info_category_3, + header_label_4, + header_icon_name_4, + header_icon_isCustom_4, + header_info_name_4, + header_info_category_4, + header_icon_isCustom_1: false, header_icon_name_1: type, }); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js index 91b9465e6a..4665983736 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js @@ -78,6 +78,7 @@ const ListView = () => { secondHeaderObj, thirdHeaderObj, fourthHeaderObj + // TODO remove // subTargetUid ) => { // disable the prompt From ed3e5765c2c3c9074d45393369ff5a25d84d6392 Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 11:04:22 +0100 Subject: [PATCH 05/18] Display component infos in stepper --- .../admin/src/components/List/index.js | 61 +++++++++++++------ .../components/ModalHeader/ComponentInfos.js | 25 ++------ .../admin/src/components/ModalHeader/index.js | 19 +++--- 3 files changed, 55 insertions(+), 50 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js index d671641840..a6bfe81bb5 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js @@ -39,11 +39,40 @@ function List({ const { formatMessage } = useGlobalContext(); const { isInDevelopmentMode, modifiedData } = useDataManager(); const { openModalAddField } = useListView(); - // console.log({ modifiedData }); const onClickAddField = () => { + const firstComponentIcon = get( + modifiedData, + ['components', firstLoopComponentUid, 'schema', 'icon'], + '' + ); + const firstComponentCategory = get( + modifiedData, + ['components', firstLoopComponentUid, 'category'], + null + ); + const firstComponentFriendlyName = get( + modifiedData, + ['components', firstLoopComponentUid, 'schema', 'name'], + null + ); + const secondComponentCategory = get( + modifiedData, + ['components', secondLoopComponentUid, 'category'], + null + ); + const secondComponentFriendlyName = get( + modifiedData, + ['components', secondLoopComponentUid, 'schema', 'name'], + null + ); + const secondComponentIcon = get( + modifiedData, + ['components', secondLoopComponentUid, 'schema', 'icon'], + '' + ); let firstHeaderObject = { header_label_1: mainTypeName, - header_icon_name_1: 'contentType', + header_icon_name_1: editTarget, header_icon_isCustom_1: false, header_info_category_1: null, header_info_name_1: null, @@ -52,33 +81,22 @@ function List({ header_label_2: firstLoopComponentName, header_icon_name_2: 'component', header_icon_isCustom_2: false, - header_info_category_2: null, - header_info_name_2: null, + header_info_category_2: firstComponentCategory, + header_info_name_2: firstComponentFriendlyName, }; let thirdHeaderObject = { header_icon_name_3: 'component', header_icon_isCustom_3: false, - header_info_category_3: null, - header_info_name_3: null, + header_info_category_3: secondComponentCategory, + header_info_name_3: secondComponentFriendlyName, }; let fourthHeaderObject = { header_icon_name_4: null, header_icon_isCustom_4: false, - header_info_category_4: null, - header_info_name_4: null, + header_info_category_4: secondComponentCategory, + header_info_name_4: secondComponentFriendlyName, }; - const firstComponentIcon = get( - modifiedData, - ['components', firstLoopComponentUid, 'schema', 'icon'], - '' - ); - const secondComponentIcon = get( - modifiedData, - ['components', secondLoopComponentUid, 'schema', 'icon'], - '' - ); - if (firstLoopComponentName) { firstHeaderObject = { ...firstHeaderObject, @@ -105,10 +123,15 @@ function List({ header_label_2: dzName, header_icon_name_2: 'dynamiczone', header_icon_isCustom_2: false, + header_info_category_2: null, + header_info_name_2: null, }; thirdHeaderObject = { ...thirdHeaderObject, + header_icon_name_3: isNestedInDZComponent ? 'component' : null, header_label_3: firstLoopComponentName, + header_info_category_3: firstComponentCategory, + header_info_name_3: firstComponentFriendlyName, }; fourthHeaderObject = { ...fourthHeaderObject, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js index c48c48fe24..311079331c 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js @@ -1,33 +1,20 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { get, upperFirst } from 'lodash'; -import ComponentInfosWrapper from './ComponentInfosWrapper'; -import useDataManager from '../../hooks/useDataManager'; import UpperFirst from '../UpperFirst'; +import ComponentInfosWrapper from './ComponentInfosWrapper'; -const ComponentInfos = ({ uid }) => { - // We might want to change to initialData... - // @Aurelsicoko - const { modifiedData } = useDataManager(); - const currentComponent = get(modifiedData, ['components', uid], {}); - const currentComponentCategory = get(currentComponent, 'category', ''); - const currentComponentFriendlyName = get( - currentComponent, - ['schema', 'name'], - '' - ); - +const ComponentInfos = ({ category, name }) => { return ( -   ({upperFirst(currentComponentCategory)} -  —  - ) +   ()  —  + ) ); }; ComponentInfos.propTypes = { - uid: PropTypes.string.isRequired, + category: PropTypes.string.isRequired, + name: PropTypes.string.isRequired, }; export default ComponentInfos; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 54a9bb701c..1bd5389433 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -5,9 +5,8 @@ import { get } from 'lodash'; import { AttributeIcon } from '@buffetjs/core'; import { FormattedMessage } from 'react-intl'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -// import useDataManager from '../../hooks/useDataManager'; import ComponentIcon from './ComponentIcon'; -// import Header from './Header'; +import ComponentInfos from './ComponentInfos'; import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; @@ -62,19 +61,15 @@ const ModalHeader = ({ headerId, headers }) => { + {header.info.category && ( + + )} ); })} - {/* {!headerId && ( -
- )} */}
); From 7fade376d8aec8c46599cb23d4388d17fe7b6ba1 Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 12:06:45 +0100 Subject: [PATCH 06/18] Handle stepper for editing field --- .../admin/src/components/List/index.js | 2 + .../admin/src/components/ListRow/index.js | 146 +++++++++++++++++- .../admin/src/components/ModalHeader/index.js | 1 + .../admin/src/containers/ListView/index.js | 46 ++---- 4 files changed, 152 insertions(+), 43 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js index a6bfe81bb5..679995ba15 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js @@ -179,6 +179,8 @@ function List({ { if (configurable !== false) { + const firstComponentCategory = get( + modifiedData, + ['components', firstLoopComponentUid, 'category'], + null + ); + const secondComponentCategory = get( + modifiedData, + ['components', secondLoopComponentUid, 'category'], + null + ); + const attrType = nature ? 'relation' : type; - let headerDisplayName = mainTypeName; + let icoType; + + switch (attrType) { + case 'integer': + case 'biginteger': + case 'decimal': + case 'float': + icoType = 'number'; + break; + case 'string': + case 'text': + icoType = 'text'; + break; + case '': + icoType = 'relation'; + break; + default: + icoType = type; + } + + let firstHeaderObject = { + header_label_1: mainTypeName, + header_icon_name_1: icoType, + header_icon_isCustom_1: false, + header_info_category_1: null, + header_info_name_1: null, + }; + let secondHeaderObject = { + header_label_2: name, + header_icon_name_2: null, + header_icon_isCustom_2: false, + header_info_category_2: null, + header_info_name_2: null, + }; + let thirdHeaderObject = { + header_icon_name_3: 'component', + header_icon_isCustom_3: false, + header_info_category_3: null, + header_info_name_3: null, + }; + let fourthHeaderObject = { + header_icon_name_4: null, + header_icon_isCustom_4: false, + header_info_category_4: null, + header_info_name_4: null, + }; + let fifthHeaderObject = { + header_icon_name_5: null, + header_icon_isCustom_5: false, + header_info_category_5: null, + header_info_name_5: null, + }; if (firstLoopComponentName) { - headerDisplayName = firstLoopComponentName; + secondHeaderObject = { + header_label_2: firstLoopComponentName, + header_icon_name_2: 'component', + header_icon_isCustom_2: false, + header_info_category_2: firstComponentCategory, + header_info_name_2: firstLoopComponentName, + }; + + thirdHeaderObject = { + ...thirdHeaderObject, + header_label_3: name, + header_icon_name_3: null, + }; } if (secondLoopComponentUid) { - headerDisplayName = secondLoopComponentName; + thirdHeaderObject = { + ...thirdHeaderObject, + header_label_3: secondLoopComponentName, + header_icon_name_3: 'component', + header_info_category_3: secondComponentCategory, + header_info_name_3: secondLoopComponentName, + }; + fourthHeaderObject = { + ...fourthHeaderObject, + header_label_4: name, + header_icon_name_4: null, + }; + } + + if (isFromDynamicZone || isNestedInDZComponent) { + secondHeaderObject = { + header_label_2: dzName, + header_icon_name_2: 'dynamiczone', + header_icon_isCustom_2: false, + header_info_name_2: null, + header_info_category_2: null, + }; + thirdHeaderObject = { + header_icon_name_3: 'component', + header_label_3: firstLoopComponentName, + header_info_name_3: firstComponentCategory, + header_info_category_3: firstComponentCategory, + }; + + if (!isNestedInDZComponent) { + fourthHeaderObject = { + header_icon_name_4: null, + header_icon_isCustom_4: false, + header_info_category_4: null, + header_label_4: name, + }; + } else { + fourthHeaderObject = { + header_icon_name_4: 'components', + header_icon_isCustom_4: false, + header_info_category_4: secondComponentCategory, + header_info_name_4: secondLoopComponentName, + header_label_4: secondLoopComponentName, + }; + + fifthHeaderObject = { + ...fifthHeaderObject, + header_label_5: name, + }; + } } onClick( @@ -74,10 +201,11 @@ function ListRow({ name, // Type of the attribute attrType, - headerDisplayName, - firstLoopComponentUid ? mainTypeName : null, - secondLoopComponentName ? firstLoopComponentName : null, - secondLoopComponentUid ? firstLoopComponentUid : null + firstHeaderObject, + secondHeaderObject, + thirdHeaderObject, + fourthHeaderObject, + fifthHeaderObject ); } }; @@ -171,9 +299,11 @@ function ListRow({ ListRow.defaultProps = { configurable: true, + dzName: null, firstLoopComponentName: null, firstLoopComponentUid: null, isFromDynamicZone: false, + isNestedInDZComponent: false, nature: null, onClick: () => {}, onClickDelete: () => {}, @@ -188,10 +318,12 @@ ListRow.defaultProps = { ListRow.propTypes = { configurable: PropTypes.bool, + dzName: PropTypes.string, editTarget: PropTypes.string.isRequired, firstLoopComponentName: PropTypes.string, firstLoopComponentUid: PropTypes.string, isFromDynamicZone: PropTypes.bool, + isNestedInDZComponent: PropTypes.bool, mainTypeName: PropTypes.string.isRequired, name: PropTypes.string.isRequired, nature: PropTypes.string, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 1bd5389433..180fd59c19 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -11,6 +11,7 @@ import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; const ModalHeader = ({ headerId, headers }) => { + console.log({ headers }); return (
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js index 4665983736..a764361df8 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js @@ -97,30 +97,6 @@ const ListView = () => { push({ search: makeSearch(searchObj) }); }; - // const handleClickOpenModalAddField = async ( - // forTarget, - // targetUid, - // headerDisplayName, - // headerDisplayCategory = null, - // headerDisplaySubCategory = null, - // subTargetUid = null - // ) => { - // const searchObj = { - // modalType: 'chooseAttribute', - // forTarget, - // targetUid, - // headerDisplayName, - // headerDisplayCategory, - // headerDisplaySubCategory, - // subTargetUid, - // }; - - // // Disable the prompt - // await wait(); - - // push({ search: makeSearch(searchObj, true) }); - // }; - const handleClickAddComponentToDZ = async dzName => { const firstHeaderObject = { header_label_1: currentDataName, @@ -155,10 +131,11 @@ const ListView = () => { targetUid, attributeName, type, - headerDisplayName, - headerDisplayCategory = null, - headerDisplaySubCategory = null, - subTargetUid = null + firstHeaderObj, + secondHeaderObj, + thirdHeaderObj, + fourthHeaderObj, + fifthHeaderObj ) => { let attributeType; @@ -190,11 +167,12 @@ const ListView = () => { targetUid, attributeName, attributeType, - headerDisplayName, - headerDisplayCategory, - headerDisplaySubCategory, step: type === 'component' ? '2' : null, - subTargetUid, + ...firstHeaderObj, + ...secondHeaderObj, + ...thirdHeaderObj, + ...fourthHeaderObj, + ...fifthHeaderObj, }; await wait(); @@ -328,8 +306,6 @@ const ListView = () => { ? [{ ...configureButtonProps }, { ...addButtonProps }] : [configureButtonProps]; - const handleClickOnTrashIcon = () => {}; - const CustomRow = props => { const { name } = props; @@ -339,7 +315,6 @@ const ListView = () => { attributeName={name} name={name} onClick={handleClickEditField} - onClickDelete={handleClickOnTrashIcon} /> ); }; @@ -354,7 +329,6 @@ const ListView = () => { return ( From 7a282895e77af62d4ee95e8b661e65e171e64396 Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 12:32:46 +0100 Subject: [PATCH 07/18] Add util to retrieve attribute displayed type --- .../admin/src/components/ListRow/index.js | 21 ++-------------- .../admin/src/components/ModalHeader/index.js | 1 - .../admin/src/containers/FormModal/index.js | 2 +- .../admin/src/containers/ListView/index.js | 23 ++--------------- .../src/utils/getAttributeDisplayedType.js | 25 +++++++++++++++++++ 5 files changed, 30 insertions(+), 42 deletions(-) create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/utils/getAttributeDisplayedType.js diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/index.js index b8448e26e4..c0057d0fb3 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/index.js @@ -6,6 +6,7 @@ import { AttributeIcon } from '@buffetjs/core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import pluginId from '../../pluginId'; import useDataManager from '../../hooks/useDataManager'; +import getAttributeDisplayedType from '../../utils/getAttributeDisplayedType'; import getTrad from '../../utils/getTrad'; import Curve from '../../icons/Curve'; import UpperFist from '../UpperFirst'; @@ -70,25 +71,7 @@ function ListRow({ ); const attrType = nature ? 'relation' : type; - let icoType; - - switch (attrType) { - case 'integer': - case 'biginteger': - case 'decimal': - case 'float': - icoType = 'number'; - break; - case 'string': - case 'text': - icoType = 'text'; - break; - case '': - icoType = 'relation'; - break; - default: - icoType = type; - } + const icoType = getAttributeDisplayedType(attrType); let firstHeaderObject = { header_label_1: mainTypeName, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 180fd59c19..1bd5389433 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -11,7 +11,6 @@ import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; const ModalHeader = ({ headerId, headers }) => { - console.log({ headers }); return (
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js index ce8d6e57a8..8dd64f95a1 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js @@ -76,7 +76,7 @@ const FormModal = () => { useEffect(() => { if (!isEmpty(search)) { const actionType = query.get('actionType'); - // Return 'null' if there isn't any attributeType search params + // Returns 'null' if there isn't any attributeType search params const attributeName = query.get('attributeName'); const attributeType = query.get('attributeType'); const dynamicZoneTarget = query.get('dynamicZoneTarget'); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js index a764361df8..e6c0acec09 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js @@ -11,6 +11,7 @@ import { import { Header } from '@buffetjs/custom'; import ListViewContext from '../../contexts/ListViewContext'; import convertAttrObjToArray from '../../utils/convertAttrObjToArray'; +import getAttributeDisplayedType from '../../utils/getAttributeDisplayedType'; import getTrad from '../../utils/getTrad'; import makeSearch from '../../utils/makeSearch'; import ListRow from '../../components/ListRow'; @@ -78,8 +79,6 @@ const ListView = () => { secondHeaderObj, thirdHeaderObj, fourthHeaderObj - // TODO remove - // subTargetUid ) => { // disable the prompt await wait(); @@ -137,25 +136,7 @@ const ListView = () => { fourthHeaderObj, fifthHeaderObj ) => { - let attributeType; - - switch (type) { - case 'integer': - case 'biginteger': - case 'decimal': - case 'float': - attributeType = 'number'; - break; - case 'string': - case 'text': - attributeType = 'text'; - break; - case '': - attributeType = 'relation'; - break; - default: - attributeType = type; - } + const attributeType = getAttributeDisplayedType(type); await wait(); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/utils/getAttributeDisplayedType.js b/packages/strapi-plugin-content-type-builder/admin/src/utils/getAttributeDisplayedType.js new file mode 100644 index 0000000000..cb088b225b --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/utils/getAttributeDisplayedType.js @@ -0,0 +1,25 @@ +const getAttributeDisplayedType = type => { + let displayedType; + + switch (type) { + case 'integer': + case 'biginteger': + case 'decimal': + case 'float': + displayedType = 'number'; + break; + case 'string': + case 'text': + displayedType = 'text'; + break; + case '': + displayedType = 'relation'; + break; + default: + displayedType = type; + } + + return displayedType; +}; + +export default getAttributeDisplayedType; From 7131187c5e00212403751b1fb3e85559e9c42ccf Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 12:36:45 +0100 Subject: [PATCH 08/18] Remove useless query parameters --- .../ContentManager/EditSettingViewButton.js | 1 - .../src/components/AttributeOption/index.js | 7 ----- .../admin/src/components/ModalHeader/index.js | 14 ---------- .../admin/src/containers/FormModal/index.js | 28 ------------------- .../admin/src/containers/ListView/index.js | 2 -- 5 files changed, 52 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/InjectedComponents/ContentManager/EditSettingViewButton.js b/packages/strapi-plugin-content-type-builder/admin/src/InjectedComponents/ContentManager/EditSettingViewButton.js index 7d938074cd..8ab1f46879 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/InjectedComponents/ContentManager/EditSettingViewButton.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/InjectedComponents/ContentManager/EditSettingViewButton.js @@ -36,7 +36,6 @@ function EditViewButton(props) { : `${category}/${componentSlug}`; const handleClick = () => { - // TODO emitEvent('willEditEditLayout'); props.push(`${baseUrl}/${suffixUrl}`); }; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js index 1b58d44f80..02f16ea53e 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js @@ -44,8 +44,6 @@ const AttributeOption = forwardRef(({ tabIndex, type }, ref) => { const handleClick = () => { const forTarget = query.get('forTarget'); const targetUid = query.get('targetUid'); - // TODO to remove - const headerDisplayName = query.get('headerDisplayName'); const header_label_1 = query.get('header_label_1'); const header_info_category_1 = query.get('header_info_category_1'); const header_info_name_1 = query.get('header_info_name_1'); @@ -72,12 +70,7 @@ const AttributeOption = forwardRef(({ tabIndex, type }, ref) => { forTarget, targetUid, attributeType: type, - headerDisplayName, step: type === 'component' ? '1' : null, - // TODO to remove - headerDisplayCategory: query.get('headerDisplayCategory'), - // TODO to remove - headerDisplaySubCategory: query.get('headerDisplaySubCategory'), subTargetUid: query.get('subTargetUid'), header_label_1, header_info_name_1, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 1bd5389433..c3aaae4325 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -76,27 +76,13 @@ const ModalHeader = ({ headerId, headers }) => { }; ModalHeader.defaultProps = { - category: null, headerId: '', headers: [], - iconType: 'contentType', - name: '', - target: null, - targetUid: null, - subCategory: null, - subTargetUid: null, }; ModalHeader.propTypes = { - category: PropTypes.string, headerId: PropTypes.string, headers: PropTypes.array, - iconType: PropTypes.string, - name: PropTypes.string, - target: PropTypes.string, - targetUid: PropTypes.string, - subCategory: PropTypes.string, - subTargetUid: PropTypes.string, }; export default ModalHeader; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js index 8dd64f95a1..6029b265ec 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js @@ -334,19 +334,6 @@ const FormModal = () => { items: [], })); - // TODO improve icon logic - let iconType = ['component', 'contentType'].includes(state.modalType) - ? state.modalType - : state.forTarget; - - if (state.modalType === 'addComponentToDynamicZone') { - iconType = 'dynamiczone'; - } - - if (state.modalType === 'editCategory') { - iconType = 'component'; - } - const isCreatingContentType = state.modalType === 'contentType'; const isCreatingComponent = state.modalType === 'component'; const isCreatingAttribute = state.modalType === 'attribute'; @@ -363,14 +350,6 @@ const FormModal = () => { const isPickingAttribute = state.modalType === 'chooseAttribute'; const uid = createUid(modifiedData.name || ''); - // let headerId = isCreating - // ? `modalForm.${state.modalType}.header-create` - // : 'modalForm.header-edit'; - - // if (!['contentType', 'component'].includes(state.modalType)) { - // headerId = null; - // } - const checkFormValidity = async () => { let schema; const dataToValidate = @@ -1042,14 +1021,7 @@ const FormModal = () => { >
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js index e6c0acec09..b14772849e 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js @@ -114,8 +114,6 @@ const ListView = () => { settingType: 'base', step: '1', actionType: 'edit', - // TODO to remove - headerDisplayName: dzName, ...firstHeaderObject, ...secondHeaderObj, }; From 6be5bfaa8bd4fb24e6d7e05fb69e159413da0904 Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 24 Dec 2019 15:07:27 +0100 Subject: [PATCH 09/18] Created util that creates an header object from an array --- .../admin/src/components/List/index.js | 2 - .../admin/src/components/ModalHeader/index.js | 1 + .../admin/src/containers/FormModal/index.js | 10 ++++- .../utils/createHeadersObjectFromArray.js | 27 +++++++++++ .../createHeadersObjectFromArray.test.js | 45 +++++++++++++++++++ 5 files changed, 81 insertions(+), 4 deletions(-) create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/createHeadersObjectFromArray.js create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js index 679995ba15..2f69aaf644 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/List/index.js @@ -182,7 +182,6 @@ function List({ dzName={dzName} isNestedInDZComponent={isNestedInDZComponent} targetUid={targetUid} - // NEW props mainTypeName={mainTypeName} editTarget={editTarget} firstLoopComponentName={firstLoopComponentName} @@ -197,7 +196,6 @@ function List({ {...item} customRowComponent={customRowComponent} targetUid={targetUid} - // NEW PROPS dzName={dzName} isNestedInDZComponent={isFromDynamicZone} mainTypeName={mainTypeName} diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index c3aaae4325..f9288124ba 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -11,6 +11,7 @@ import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; const ModalHeader = ({ headerId, headers }) => { + console.log({ headers }); return (
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js index 6029b265ec..e8d045c87e 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js @@ -564,6 +564,7 @@ const FormModal = () => { ...rest, }); }; + const handleSubmit = async (e, shouldContinue = isCreating) => { e.preventDefault(); @@ -603,7 +604,9 @@ const FormModal = () => { modalType: 'chooseAttribute', forTarget: state.forTarget, targetUid, - headerDisplayName: modifiedData.name, + header_label_1: modifiedData.name, + header_icon_name_1: 'contentType', + header_icon_isCustom_1: null, }), }); } else if (isCreatingComponent) { @@ -622,7 +625,9 @@ const FormModal = () => { modalType: 'chooseAttribute', forTarget: state.forTarget, targetUid: componentUid, - headerDisplayName: modifiedData.name, + header_label_1: modifiedData.name, + header_icon_name_1: 'contentType', + header_icon_isCustom_1: null, }), pathname: `/plugins/${pluginId}/component-categories/${category}/${componentUid}`, }); @@ -636,6 +641,7 @@ const FormModal = () => { } } else if (isEditingCategory) { if (toLower(initialData.name) === toLower(modifiedData.name)) { + // Close the modal push({ search: '' }); return; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/createHeadersObjectFromArray.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/createHeadersObjectFromArray.js new file mode 100644 index 0000000000..9712d9e0c8 --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/createHeadersObjectFromArray.js @@ -0,0 +1,27 @@ +import { isObject } from 'lodash'; + +const createHeadersObjectFromArray = array => { + return array.reduce((acc, current, index) => { + const createHeaderObject = (obj, i, middle = '') => + Object.keys(obj).reduce((acc1, current1) => { + if (isObject(obj[current1])) { + return { + ...acc1, + ...createHeaderObject(obj[current1], i, `_${current1}`), + }; + } + + const name = `header${middle}_${current1}_${i}`; + + acc1[name] = obj[current1]; + + return acc1; + }, {}); + + const headerObject = createHeaderObject(current, index + 1); + + return { ...acc, ...headerObject }; + }, {}); +}; + +export default createHeadersObjectFromArray; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js new file mode 100644 index 0000000000..e24cd927d0 --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js @@ -0,0 +1,45 @@ +import createHeadersObjectFromArray from '../createHeadersObjectFromArray'; + +describe('FormModal | utils | createHeadersArray', () => { + it('should return an headers object', () => { + const data = [ + { + label: 'test', + icon: { + name: 'contentType', + isCustom: false, + }, + info: { + name: null, + category: null, + }, + }, + { + label: 'test2', + icon: { + name: 'book', + isCustom: true, + }, + info: { + name: 'something', + category: 'default', + }, + }, + ]; + + const expected = { + header_label_1: 'test', + header_icon_name_1: 'contentType', + header_icon_isCustom_1: false, + header_info_name_1: null, + header_info_category_1: null, + header_label_2: 'test2', + header_icon_name_2: 'book', + header_icon_isCustom_2: true, + header_info_name_2: 'something', + header_info_category_2: 'default', + }; + + expect(createHeadersObjectFromArray(data)).toEqual(expected); + }); +}); From a5883a0523a694a3c5ab33345fe552092eae37c0 Mon Sep 17 00:00:00 2001 From: soupette Date: Thu, 26 Dec 2019 10:00:34 +0100 Subject: [PATCH 10/18] Handle stepper for adding field and edit --- .../admin/src/components/ModalHeader/index.js | 1 - .../admin/src/containers/FormModal/index.js | 130 +++++++++--------- .../containers/FormModal/utils/staticData.js | 3 - .../utils/tests/createHeadersArray.test.js | 11 +- .../admin/src/containers/LeftMenu/index.js | 2 +- .../admin/src/containers/ListView/index.js | 2 - 6 files changed, 68 insertions(+), 81 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index f9288124ba..c3aaae4325 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -11,7 +11,6 @@ import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; const ModalHeader = ({ headerId, headers }) => { - console.log({ headers }); return (
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js index e8d045c87e..387bf7ea58 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js @@ -32,6 +32,7 @@ import makeSearch from '../../utils/makeSearch'; import getAttributes from './utils/attributes'; import forms from './utils/forms'; import createHeadersArray from './utils/createHeadersArray'; +import createHeadersObjectFromArray from './utils/createHeadersObjectFromArray'; import { createComponentUid, createUid } from './utils/createUid'; import getModalTitleSubHeader from './utils/getModalTitleSubHeader'; import getNextSearch from './utils/getNextSearch'; @@ -81,9 +82,6 @@ const FormModal = () => { const attributeType = query.get('attributeType'); const dynamicZoneTarget = query.get('dynamicZoneTarget'); const forTarget = query.get('forTarget'); - const headerDisplayCategory = query.get('headerDisplayCategory'); - const headerDisplayName = query.get('headerDisplayName'); - const headerDisplaySubCategory = query.get('headerDisplaySubCategory'); const modalType = query.get('modalType'); const targetUid = query.get('targetUid'); const settingType = query.get('settingType'); @@ -125,9 +123,6 @@ const FormModal = () => { attributeName, attributeType, dynamicZoneTarget, - headerDisplayName, - headerDisplayCategory, - headerDisplaySubCategory, forTarget, modalType, pathToSchema, @@ -333,6 +328,7 @@ const FormModal = () => { const form = get(forms, [state.modalType, 'form', state.settingType], () => ({ items: [], })); + const headers = createHeadersArray(state); const isCreatingContentType = state.modalType === 'contentType'; const isCreatingComponent = state.modalType === 'component'; @@ -574,17 +570,21 @@ const FormModal = () => { const targetUid = state.forTarget === 'components' ? state.targetUid : uid; - // TODO REMOVE and use makeSearch - const createNextSearch = searchUid => { - if (!shouldContinue) { - return ''; - } + const headerIcon = ['contentType', 'component'].includes(state.forTarget) + ? state.forTarget + : get( + allDataSchema, + ['components', state.targetUid, 'schema', 'icon'], + '' + ); - return `modalType=chooseAttribute&forTarget=${ - state.forTarget - }&targetUid=${searchUid}&headerDisplayName=${state.headerDisplayName || - modifiedData.name}`; - }; + // Remove the last header when editing + if (state.actionType === 'edit') { + headers.pop(); + } + + const headersObject = createHeadersObjectFromArray(headers); + const nextHeaderIndex = headers.length + 1; if (isCreatingContentType) { // Create the content type schema @@ -667,20 +667,19 @@ const FormModal = () => { // Adding a component to a dynamiczone is not the same logic as creating a simple field // so the search is different - // For the modal header - const displayCategory = state.headerDisplayName; - const displayName = modifiedData.name; - const dzSearch = makeNextSearch({ modalType: 'addComponentToDynamicZone', forTarget: 'contentType', targetUid: state.targetUid, - headerDisplayName: displayName, - headerDisplayCategory: displayCategory, + dynamicZoneTarget: modifiedData.name, settingType: 'base', step: '1', actionType: 'create', + ...headersObject, + header_label_2: modifiedData.name, + header_icon_name_2: null, + header_icon_isCustom_2: false, }); const nextSearch = isDynamicZoneAttribute ? dzSearch @@ -689,11 +688,12 @@ const FormModal = () => { modalType: 'chooseAttribute', forTarget: state.forTarget, targetUid, - headerDisplayName: state.headerDisplayName, - headerDisplayCategory: state.headerDisplayCategory, - // keep the old state - headerDisplaySubCategory: state.headerDisplaySubCategory, - subTargetUid: state.subTargetUid, + ...headersObject, + header_icon_isCustom_1: ![ + 'contentType', + 'component', + ].includes(state.forTarget), + header_icon_name_1: headerIcon, }, shouldContinue ); @@ -718,7 +718,6 @@ const FormModal = () => { } else { if (isInFirstComponentStep) { // Navigate the user to step 2 - // TODO refacto const nextSearchObj = { modalType: 'attribute', actionType: state.actionType, @@ -726,8 +725,12 @@ const FormModal = () => { forTarget: state.forTarget, targetUid: state.targetUid, attributeType: 'component', - headerDisplayName: state.headerDisplayName, step: '2', + ...headersObject, + header_icon_isCustom_1: !['contentType', 'component'].includes( + state.forTarget + ), + header_icon_name_1: headerIcon, }; push({ @@ -761,9 +764,18 @@ const FormModal = () => { // This way we can add fields to the added component (if it wasn't there already) true ); + const nextSearch = { + modalType: 'chooseAttribute', + forTarget: state.forTarget, + targetUid: state.targetUid, + ...headersObject, + header_icon_isCustom_1: !['contentType', 'component'].includes( + state.forTarget + ), + header_icon_name_1: headerIcon, + }; - // TODO change the search so the modal header is kept - push({ search: shouldContinue ? createNextSearch(targetUid) : '' }); + push({ search: makeSearch(nextSearch, shouldContinue) }); // We don't need to end the loop here we want the reducer to be reinitialised } @@ -774,7 +786,6 @@ const FormModal = () => { // even though the user didn't set any field // We need to prevent the component from being created if the user closes the modal at step 2 without any submission } else if (isCreatingAttribute && isCreatingComponentFromAView) { - const { headerDisplayCategory } = state; // Step 1 if (isInFirstComponentStep) { // Here the search could be refactored since it is the same as the case from above @@ -787,18 +798,12 @@ const FormModal = () => { forTarget: state.forTarget, targetUid: state.targetUid, attributeType: 'component', - headerDisplayName: state.headerDisplayName, step: '2', + ...headersObject, + header_icon_isCustom_1: false, + header_icon_name_1: 'component', }; - // Modify the searchObj for the modal header - // This case is happening when creating a nestedComponent after creating a component - if (headerDisplayCategory) { - searchObj.headerDisplayCategory = state.headerDisplayCategory; - searchObj.headerDisplayName = state.headerDisplayName; - searchObj.targetUid = state.targetUid; - } - emitEvent('willCreateComponentFromAttributesModal'); push({ @@ -850,21 +855,16 @@ const FormModal = () => { modalType: 'chooseAttribute', forTarget: 'components', targetUid: componentUid, - headerDisplayName: modifiedData.name, - headerDisplayCategory: - state.headerDisplayCategory || state.headerDisplayName, + ...headersObject, + header_icon_isCustom_1: true, + header_icon_name_1: componentToCreate.icon, + [`header_label_${nextHeaderIndex}`]: modifiedData.name, + [`header_icon_name_${nextHeaderIndex}`]: 'component', + [`header_icon_isCustom_${nextHeaderIndex}`]: false, + [`header_info_category_${nextHeaderIndex}`]: category, + [`header_info_name_${nextHeaderIndex}`]: componentToCreate.name, }; - // Then we inverse the headerDisplayName because it becomes the last one displayed - // The case is created a component then created a nested one - if (headerDisplayCategory) { - // This is allows to modify the modal header - searchToOpenModalAttributeToAddAttributesToAComponent.headerDisplaySubCategory = - state.headerDisplayName; - searchToOpenModalAttributeToAddAttributesToAComponent.subTargetUid = - state.targetUid; - } - push({ search: makeNextSearch( searchToOpenModalAttributeToAddAttributesToAComponent, @@ -907,13 +907,19 @@ const FormModal = () => { // The Dynamic Zone and the component is created created // Open the modal to add fields to the created component - // TODO search for modal header const searchToOpenAddField = { modalType: 'chooseAttribute', forTarget: 'components', targetUid: componentUid, - headerDisplayName: modifiedData.componentToCreate.name, - headerDisplayCategory: state.headerDisplayCategory, + ...headersObject, + header_icon_isCustom_1: true, + header_icon_name_1: modifiedData.componentToCreate.icon, + [`header_label_${nextHeaderIndex}`]: modifiedData.name, + [`header_icon_name_${nextHeaderIndex}`]: 'component', + [`header_icon_isCustom_${nextHeaderIndex}`]: false, + [`header_info_category_${nextHeaderIndex}`]: category, + [`header_info_name_${nextHeaderIndex}`]: modifiedData + .componentToCreate.name, }; push({ search: makeSearch(searchToOpenAddField, true) }); @@ -939,7 +945,6 @@ const FormModal = () => { type: 'RESET_PROPS', }); } catch (err) { - console.log({ err }); const errors = getYupInnerErrors(err); dispatch({ @@ -1010,8 +1015,6 @@ const FormModal = () => { nestedComponents ); - // console.log({ state }); - // Styles const modalBodyStyle = isPickingAttribute ? { paddingTop: '0.5rem', paddingBottom: '3rem' } @@ -1026,10 +1029,7 @@ const FormModal = () => { withoverflow={toString(state.modalType === 'addComponentToDynamicZone')} > - +
{ return ( { attributeType: null, dynamicZoneTarget: null, forTarget: null, - headerDisplayCategory: null, - headerDisplayName: null, - headerDisplaySubCategory: null, modalType: null, pathToSchema: [], settingType: null, @@ -45,9 +42,7 @@ describe('FormModal | utils | createHeadersArray', () => { attributeType: null, dynamicZoneTarget: null, forTarget: null, - headerDisplayCategory: null, - headerDisplayName: null, - headerDisplaySubCategory: null, + modalType: null, pathToSchema: [], settingType: null, @@ -95,9 +90,7 @@ describe('FormModal | utils | createHeadersArray', () => { attributeType: null, dynamicZoneTarget: null, forTarget: null, - headerDisplayCategory: null, - headerDisplayName: null, - headerDisplaySubCategory: null, + modalType: null, pathToSchema: [], settingType: null, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js index 17836de4a6..23b1c93fa5 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js @@ -43,7 +43,7 @@ function LeftMenu({ wait }) { actionType: 'edit', modalType: 'editCategory', categoryName: data.name, - headerDisplayName: data.name, + headerDisplayCategory: formatMessage({ id: getTrad('modalForm.header.categories'), }), diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js index b14772849e..1c6072d54d 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ListView/index.js @@ -109,7 +109,6 @@ const ListView = () => { modalType: 'addComponentToDynamicZone', forTarget: 'contentType', targetUid, - headerDisplayCategory: currentDataName, dynamicZoneTarget: dzName, settingType: 'base', step: '1', @@ -226,7 +225,6 @@ const ListView = () => { settingType: 'base', forTarget: firstMainDataPath, targetUid, - headerDisplayName: label, header_label_1: label, header_icon_isCustom_1: false, header_icon_name_1: firstMainDataPath, From 3eebcf6c2f4633abaf0a09a35d7f5add7130bfcd Mon Sep 17 00:00:00 2001 From: soupette Date: Thu, 26 Dec 2019 10:04:31 +0100 Subject: [PATCH 11/18] Fix stepper for editing category --- .../api/custom/models/custom.settings.json | 6 +++--- .../admin/src/containers/LeftMenu/index.js | 13 +++++++++++-- 2 files changed, 14 insertions(+), 5 deletions(-) diff --git a/examples/getstarted/api/custom/models/custom.settings.json b/examples/getstarted/api/custom/models/custom.settings.json index 05c259c68f..3edd34c891 100644 --- a/examples/getstarted/api/custom/models/custom.settings.json +++ b/examples/getstarted/api/custom/models/custom.settings.json @@ -1,4 +1,6 @@ { + "connection": "default", + "collectionName": "customs", "info": { "name": "custom" }, @@ -13,7 +15,5 @@ "default.closingperiod" ] } - }, - "connection": "default", - "collectionName": "customs" + } } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js index 23b1c93fa5..9a8bcc4016 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js @@ -43,10 +43,19 @@ function LeftMenu({ wait }) { actionType: 'edit', modalType: 'editCategory', categoryName: data.name, - - headerDisplayCategory: formatMessage({ + header_label_1: formatMessage({ id: getTrad('modalForm.header.categories'), }), + header_icon_name_1: 'component', + header_icon_isCustom_1: false, + header_info_category_1: null, + header_info_name_1: null, + header_label_2: data.name, + header_icon_name_2: null, + header_icon_isCustom_2: false, + header_info_category_2: null, + header_info_name_2: null, + settingType: 'base', }); From b076cc43ec31dae9db5e62c315882fed420a9f3e Mon Sep 17 00:00:00 2001 From: soupette Date: Thu, 26 Dec 2019 10:39:02 +0100 Subject: [PATCH 12/18] Fix bug when adding a compo that has a nested one into a dz --- .../getstarted/api/custom/config/routes.json | 52 ------------------- .../api/custom/controllers/custom.js | 8 --- .../getstarted/api/custom/models/custom.js | 44 ---------------- .../api/custom/models/custom.settings.json | 19 ------- .../getstarted/api/custom/services/custom.js | 8 --- .../containers/DataManagerProvider/reducer.js | 37 ++++++++++++- 6 files changed, 35 insertions(+), 133 deletions(-) delete mode 100644 examples/getstarted/api/custom/config/routes.json delete mode 100644 examples/getstarted/api/custom/controllers/custom.js delete mode 100644 examples/getstarted/api/custom/models/custom.js delete mode 100644 examples/getstarted/api/custom/models/custom.settings.json delete mode 100644 examples/getstarted/api/custom/services/custom.js diff --git a/examples/getstarted/api/custom/config/routes.json b/examples/getstarted/api/custom/config/routes.json deleted file mode 100644 index a0e9852637..0000000000 --- a/examples/getstarted/api/custom/config/routes.json +++ /dev/null @@ -1,52 +0,0 @@ -{ - "routes": [ - { - "method": "GET", - "path": "/customs", - "handler": "custom.find", - "config": { - "policies": [] - } - }, - { - "method": "GET", - "path": "/customs/count", - "handler": "custom.count", - "config": { - "policies": [] - } - }, - { - "method": "GET", - "path": "/customs/:id", - "handler": "custom.findOne", - "config": { - "policies": [] - } - }, - { - "method": "POST", - "path": "/customs", - "handler": "custom.create", - "config": { - "policies": [] - } - }, - { - "method": "PUT", - "path": "/customs/:id", - "handler": "custom.update", - "config": { - "policies": [] - } - }, - { - "method": "DELETE", - "path": "/customs/:id", - "handler": "custom.delete", - "config": { - "policies": [] - } - } - ] -} diff --git a/examples/getstarted/api/custom/controllers/custom.js b/examples/getstarted/api/custom/controllers/custom.js deleted file mode 100644 index f94f22736f..0000000000 --- a/examples/getstarted/api/custom/controllers/custom.js +++ /dev/null @@ -1,8 +0,0 @@ -'use strict'; - -/** - * Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/concepts/controllers.html#core-controllers) - * to customize this controller - */ - -module.exports = {}; diff --git a/examples/getstarted/api/custom/models/custom.js b/examples/getstarted/api/custom/models/custom.js deleted file mode 100644 index 3875172e5c..0000000000 --- a/examples/getstarted/api/custom/models/custom.js +++ /dev/null @@ -1,44 +0,0 @@ -'use strict'; - -/** - * Lifecycle callbacks for the `custom` model. - */ - -module.exports = { - // Before saving a value. - // Fired before an `insert` or `update` query. - // beforeSave: async (model, attrs, options) => {}, - // After saving a value. - // Fired after an `insert` or `update` query. - // afterSave: async (model, response, options) => {}, - // Before fetching a value. - // Fired before a `fetch` operation. - // beforeFetch: async (model, columns, options) => {}, - // After fetching a value. - // Fired after a `fetch` operation. - // afterFetch: async (model, response, options) => {}, - // Before fetching all values. - // Fired before a `fetchAll` operation. - // beforeFetchAll: async (model, columns, options) => {}, - // After fetching all values. - // Fired after a `fetchAll` operation. - // afterFetchAll: async (model, response, options) => {}, - // Before creating a value. - // Fired before an `insert` query. - // beforeCreate: async (model, attrs, options) => {}, - // After creating a value. - // Fired after an `insert` query. - // afterCreate: async (model, attrs, options) => {}, - // Before updating a value. - // Fired before an `update` query. - // beforeUpdate: async (model, attrs, options) => {}, - // After updating a value. - // Fired after an `update` query. - // afterUpdate: async (model, attrs, options) => {}, - // Before destroying a value. - // Fired before a `delete` query. - // beforeDestroy: async (model, attrs, options) => {}, - // After destroying a value. - // Fired after a `delete` query. - // afterDestroy: async (model, attrs, options) => {} -}; diff --git a/examples/getstarted/api/custom/models/custom.settings.json b/examples/getstarted/api/custom/models/custom.settings.json deleted file mode 100644 index 3edd34c891..0000000000 --- a/examples/getstarted/api/custom/models/custom.settings.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "connection": "default", - "collectionName": "customs", - "info": { - "name": "custom" - }, - "options": { - "increments": true, - "timestamps": true - }, - "attributes": { - "dz": { - "type": "dynamiczone", - "components": [ - "default.closingperiod" - ] - } - } -} diff --git a/examples/getstarted/api/custom/services/custom.js b/examples/getstarted/api/custom/services/custom.js deleted file mode 100644 index d0dcc88381..0000000000 --- a/examples/getstarted/api/custom/services/custom.js +++ /dev/null @@ -1,8 +0,0 @@ -'use strict'; - -/** - * Read the documentation (https://strapi.io/documentation/3.0.0-beta.x/concepts/services.html#core-services) - * to customize this service - */ - -module.exports = {}; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js index 634056bc7e..cc3bafd1be 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js @@ -1,5 +1,6 @@ import { fromJS, OrderedMap } from 'immutable'; import { get, has } from 'lodash'; +import retrieveComponentsFromSchema from './utils/retrieveComponentsFromSchema'; import makeUnique from '../../utils/makeUnique'; const initialState = fromJS({ @@ -140,13 +141,45 @@ const reducer = (state, action) => { const componentsSchema = newComponents.reduce((acc, current) => { const addedCompoSchema = state.getIn(['components', current]); const isTemporaryComponent = addedCompoSchema.get('isTemporary'); + const currentComponentSchema = addedCompoSchema.getIn([ + 'schema', + 'attributes', + ]); + const hasComponentAlreadyBeenAdded = + state.getIn(['modifiedData', 'components', current]) !== + undefined; // created components are already in the modifiedData.components - if (isTemporaryComponent) { + // We don't add them because all modifications will be lost + if (isTemporaryComponent || hasComponentAlreadyBeenAdded) { return acc; } + // Add the added components to the modifiedData.compontnes + let newAcc = acc.set(current, addedCompoSchema); + const nestedComponents = retrieveComponentsFromSchema( + currentComponentSchema.toJS(), + state.get('components').toJS() + ); - return acc.set(current, addedCompoSchema); + // We need to add the nested components to the modifiedData.components as well + nestedComponents.forEach(componentUid => { + const isTemporary = + state.getIn(['components', componentUid, 'isTemporary']) || + false; + const hasNestedComponentAlreadyBeenAdded = + state.getIn(['modifiedData', 'components', componentUid]) !== + undefined; + + // Same logic here otherwise we will lose the modifications added to the components + if (!isTemporary && !hasNestedComponentAlreadyBeenAdded) { + newAcc = newAcc.set( + componentUid, + state.getIn(['components', componentUid]) + ); + } + }); + + return newAcc; }, old); return componentsSchema; From 3ba4e9695758a51a2c8961c60435f833c9bb00ab Mon Sep 17 00:00:00 2001 From: soupette Date: Thu, 26 Dec 2019 10:41:24 +0100 Subject: [PATCH 13/18] Remove subTargetUid query string --- .../src/components/AttributeOption/index.js | 2 +- .../src/components/ModalHeader/Header.js | 69 ------------------- .../admin/src/containers/FormModal/index.js | 2 - .../containers/FormModal/utils/staticData.js | 1 - .../utils/tests/createHeadersArray.test.js | 4 +- 5 files changed, 2 insertions(+), 76 deletions(-) delete mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Header.js diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js index 02f16ea53e..9efae86ff7 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/AttributeOption/index.js @@ -71,7 +71,7 @@ const AttributeOption = forwardRef(({ tabIndex, type }, ref) => { targetUid, attributeType: type, step: type === 'component' ? '1' : null, - subTargetUid: query.get('subTargetUid'), + header_label_1, header_info_name_1, header_info_category_1, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Header.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Header.js deleted file mode 100644 index 0603b5393e..0000000000 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Header.js +++ /dev/null @@ -1,69 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import UpperFirst from '../UpperFirst'; -import ComponentInfos from './ComponentInfos'; -import IconWrapper from './IconWrapper'; - -const Header = ({ - category, - name, - subCategory, - target, - targetUid, - subTargetUid, -}) => { - const shouldDisplayComponentCatInfos = target === 'components'; - - const content = ( - <> - - - - - - - {subCategory && ( - <> - - - - - - - - - )} - - ); - - return ( - <> - {category && content} - - - - {shouldDisplayComponentCatInfos && } - - ); -}; - -Header.defaultProps = { - category: null, - name: null, - subCategory: null, - subTargetUid: null, - target: null, - targetUid: null, -}; - -Header.propTypes = { - category: PropTypes.string, - name: PropTypes.string, - subCategory: PropTypes.string, - subTargetUid: PropTypes.string, - target: PropTypes.string, - targetUid: PropTypes.string, -}; - -export default Header; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js index 387bf7ea58..3daf815e4d 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/index.js @@ -85,7 +85,6 @@ const FormModal = () => { const modalType = query.get('modalType'); const targetUid = query.get('targetUid'); const settingType = query.get('settingType'); - const subTargetUid = query.get('subTargetUid'); const headerId = query.get('headerId'); const header_label_1 = query.get('header_label_1'); const header_icon_name_1 = query.get('header_icon_name_1'); @@ -127,7 +126,6 @@ const FormModal = () => { modalType, pathToSchema, settingType, - subTargetUid, step, targetUid, header_label_1, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js index 9fe552c069..a782f34dfd 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/staticData.js @@ -10,7 +10,6 @@ const INITIAL_STATE_DATA = { pathToSchema: [], settingType: null, step: null, - subTargetUid: null, targetUid: null, headerId: null, header_label_1: null, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js index 379e31c98f..342298fc92 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js @@ -12,7 +12,6 @@ describe('FormModal | utils | createHeadersArray', () => { pathToSchema: [], settingType: null, step: null, - subTargetUid: null, targetUid: null, headerId: null, header_label_1: null, @@ -47,7 +46,6 @@ describe('FormModal | utils | createHeadersArray', () => { pathToSchema: [], settingType: null, step: null, - subTargetUid: null, targetUid: null, headerId: null, header_label_1: 'restaurant', @@ -95,7 +93,7 @@ describe('FormModal | utils | createHeadersArray', () => { pathToSchema: [], settingType: null, step: null, - subTargetUid: null, + targetUid: null, headerId: null, header_label_1: 'restaurant', From 628c76ccfc6de1075b40d3b71af953d58c9ef509 Mon Sep 17 00:00:00 2001 From: soupette Date: Thu, 26 Dec 2019 11:30:04 +0100 Subject: [PATCH 14/18] Design stepper dropdown --- .../components/ModalHeader/DropdownInfos.js | 54 +++++++++++++++++++ .../admin/src/components/ModalHeader/Item.js | 19 +++++++ .../admin/src/components/ModalHeader/Menu.js | 8 +++ .../src/components/ModalHeader/Toggle.js | 14 +++++ .../src/components/ModalHeader/Wrapper.js | 12 +++++ .../admin/src/components/ModalHeader/index.js | 23 +++++++- 6 files changed, 129 insertions(+), 1 deletion(-) create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Item.js create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Menu.js create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Toggle.js create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Wrapper.js diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js new file mode 100644 index 0000000000..902c5227d2 --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js @@ -0,0 +1,54 @@ +import React, { useState } from 'react'; +import PropTypes from 'prop-types'; +import { AttributeIcon } from '@buffetjs/core'; +import UpperFirst from '../UpperFirst'; +import Item from './Item'; +import Menu from './Menu'; +import Toggle from './Toggle'; +import Wrapper from './Wrapper'; + +const DropdownInfos = ({ headers, shouldDisplaySecondHeader }) => { + const [dropdownOpen, setDropdownOpen] = useState(false); + + const toggle = () => setDropdownOpen(prevState => !prevState); + return ( + + ... + + {headers.map((header, index) => { + if (!shouldDisplaySecondHeader && index === 1) { + return null; + } + + return ( + + + + + + + ); + })} + + + ); +}; + +DropdownInfos.defaultProps = { + headers: [], + shouldDisplaySecondHeader: false, +}; + +DropdownInfos.propTypes = { + headers: PropTypes.array, + shouldDisplaySecondHeader: PropTypes.bool, +}; + +export default DropdownInfos; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Item.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Item.js new file mode 100644 index 0000000000..cc74645fa9 --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Item.js @@ -0,0 +1,19 @@ +import styled from 'styled-components'; +import { DropdownItem } from 'reactstrap'; + +const Item = styled(DropdownItem)` + display: flex; + padding-left: 10px; + padding-right: 10px; + color: #3b3b3b; + font-weight: 600; + font-size: 14px; + &:active, + &:focus, + &:hover { + background-color: transparent; + outline: 0; + } +`; + +export default Item; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Menu.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Menu.js new file mode 100644 index 0000000000..798a681a39 --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Menu.js @@ -0,0 +1,8 @@ +import styled from 'styled-components'; +import { DropdownMenu } from 'reactstrap'; + +const Menu = styled(DropdownMenu)` + top: 8px; +`; + +export default Menu; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Toggle.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Toggle.js new file mode 100644 index 0000000000..a032de0504 --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Toggle.js @@ -0,0 +1,14 @@ +import styled from 'styled-components'; +import { DropdownToggle } from 'reactstrap'; + +const Toggle = styled(DropdownToggle)` + height: 12px; + background: transparent; + border: 0; + margin-top: -14px; + color: #3b3b3b; + font-weight: 600; + font-size: 14px; +`; + +export default Toggle; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Wrapper.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Wrapper.js new file mode 100644 index 0000000000..26d85e9cef --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Wrapper.js @@ -0,0 +1,12 @@ +import styled from 'styled-components'; +import { Dropdown } from 'reactstrap'; + +const Wrapper = styled(Dropdown)` + .dropdown-menu { + top: 8px !important; + box-shadow: 0 2px 4px #e3e9f3; + border: 0; + } +`; + +export default Wrapper; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index c3aaae4325..0bdbabe5bd 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -9,8 +9,11 @@ import ComponentIcon from './ComponentIcon'; import ComponentInfos from './ComponentInfos'; import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; +import DropdownInfos from './DropdownInfos'; const ModalHeader = ({ headerId, headers }) => { + const shouldDisplayDrodDrown = headers.length > 3; + return (
@@ -41,6 +44,24 @@ const ModalHeader = ({ headerId, headers }) => { /> ); + if (shouldDisplayDrodDrown && index === 1) { + return ( + + + + + 4} + /> + + ); + } + + if (shouldDisplayDrodDrown && index === 2 && headers.length > 4) { + return null; + } + if (index === 0) { return ( @@ -57,7 +78,7 @@ const ModalHeader = ({ headerId, headers }) => { - {icon} + From 7b5da505f673aff58978c8159389a2f1ec06c3a7 Mon Sep 17 00:00:00 2001 From: soupette Date: Fri, 3 Jan 2020 15:52:03 +0100 Subject: [PATCH 15/18] Fix adding components with nested compos --- .../containers/DataManagerProvider/reducer.js | 39 ++++++++++++++++++- 1 file changed, 38 insertions(+), 1 deletion(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js index cc3bafd1be..39fc590521 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js @@ -87,12 +87,49 @@ const reducer = (state, action) => { ) .updateIn(['modifiedData', 'components'], existingCompos => { if (action.shouldAddComponentToData) { + const componentToAddUid = rest.component; const componentToAdd = state.getIn(['components', rest.component]); + const isTemporary = componentToAdd.get('isTemporary'); + const currentComponentSchema = componentToAdd.getIn([ + 'schema', + 'attributes', + ]); + const hasComponentAlreadyBeenAdded = + state.getIn(['modifiedData', 'components', componentToAddUid]) !== + undefined; - return existingCompos.update( + if (isTemporary || hasComponentAlreadyBeenAdded) { + return existingCompos; + } + + let updatedCompos = existingCompos.update( componentToAdd.get('uid'), () => componentToAdd ); + const nestedComponents = retrieveComponentsFromSchema( + currentComponentSchema.toJS(), + state.get('components').toJS() + ); + + // We need to add the nested components to the modifiedData.components as well + nestedComponents.forEach(componentUid => { + const isTemporary = + state.getIn(['components', componentUid, 'isTemporary']) || + false; + const hasNestedComponentAlreadyBeenAdded = + state.getIn(['modifiedData', 'components', componentUid]) !== + undefined; + + // Same logic here otherwise we will lose the modifications added to the components + if (!isTemporary && !hasNestedComponentAlreadyBeenAdded) { + updatedCompos = updatedCompos.set( + componentUid, + state.getIn(['components', componentUid]) + ); + } + }); + + return updatedCompos; } return existingCompos; From 98560758e376a3adda3945f2e63914f69eec1bb5 Mon Sep 17 00:00:00 2001 From: soupette Date: Mon, 6 Jan 2020 10:19:00 +0100 Subject: [PATCH 16/18] Refacto code --- .../containers/DataManagerProvider/reducer.js | 125 ++++++------------ 1 file changed, 43 insertions(+), 82 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js index 39fc590521..bf81900500 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js @@ -25,6 +25,47 @@ const getOppositeNature = originalNature => { } }; +const addComponentsToState = (state, componentToAddUid, objToUpdate) => { + let newObj = objToUpdate; + const componentToAdd = state.getIn(['components', componentToAddUid]); + const isTemporaryComponent = componentToAdd.get('isTemporary'); + const componentToAddSchema = componentToAdd.getIn(['schema', 'attributes']); + const hasComponentAlreadyBeenAdded = + state.getIn(['modifiedData', 'components', componentToAddUid]) !== + undefined; + + // created components are already in the modifiedData.components + // We don't add them because all modifications will be lost + if (isTemporaryComponent || hasComponentAlreadyBeenAdded) { + return newObj; + } + + // Add the added components to the modifiedData.compontnes + newObj = newObj.set(componentToAddUid, componentToAdd); + const nestedComponents = retrieveComponentsFromSchema( + componentToAddSchema.toJS(), + state.get('components').toJS() + ); + + // We need to add the nested components to the modifiedData.components as well + nestedComponents.forEach(componentUid => { + const isTemporary = + state.getIn(['components', componentUid, 'isTemporary']) || false; + const hasNestedComponentAlreadyBeenAdded = + state.getIn(['modifiedData', 'components', componentUid]) !== undefined; + + // Same logic here otherwise we will lose the modifications added to the components + if (!isTemporary && !hasNestedComponentAlreadyBeenAdded) { + newObj = newObj.set( + componentUid, + state.getIn(['components', componentUid]) + ); + } + }); + + return newObj; +}; + const reducer = (state, action) => { switch (action.type) { case 'ADD_ATTRIBUTE': { @@ -87,49 +128,7 @@ const reducer = (state, action) => { ) .updateIn(['modifiedData', 'components'], existingCompos => { if (action.shouldAddComponentToData) { - const componentToAddUid = rest.component; - const componentToAdd = state.getIn(['components', rest.component]); - const isTemporary = componentToAdd.get('isTemporary'); - const currentComponentSchema = componentToAdd.getIn([ - 'schema', - 'attributes', - ]); - const hasComponentAlreadyBeenAdded = - state.getIn(['modifiedData', 'components', componentToAddUid]) !== - undefined; - - if (isTemporary || hasComponentAlreadyBeenAdded) { - return existingCompos; - } - - let updatedCompos = existingCompos.update( - componentToAdd.get('uid'), - () => componentToAdd - ); - const nestedComponents = retrieveComponentsFromSchema( - currentComponentSchema.toJS(), - state.get('components').toJS() - ); - - // We need to add the nested components to the modifiedData.components as well - nestedComponents.forEach(componentUid => { - const isTemporary = - state.getIn(['components', componentUid, 'isTemporary']) || - false; - const hasNestedComponentAlreadyBeenAdded = - state.getIn(['modifiedData', 'components', componentUid]) !== - undefined; - - // Same logic here otherwise we will lose the modifications added to the components - if (!isTemporary && !hasNestedComponentAlreadyBeenAdded) { - updatedCompos = updatedCompos.set( - componentUid, - state.getIn(['components', componentUid]) - ); - } - }); - - return updatedCompos; + return addComponentsToState(state, rest.component, existingCompos); } return existingCompos; @@ -176,45 +175,7 @@ const reducer = (state, action) => { ) .updateIn(['modifiedData', 'components'], old => { const componentsSchema = newComponents.reduce((acc, current) => { - const addedCompoSchema = state.getIn(['components', current]); - const isTemporaryComponent = addedCompoSchema.get('isTemporary'); - const currentComponentSchema = addedCompoSchema.getIn([ - 'schema', - 'attributes', - ]); - const hasComponentAlreadyBeenAdded = - state.getIn(['modifiedData', 'components', current]) !== - undefined; - - // created components are already in the modifiedData.components - // We don't add them because all modifications will be lost - if (isTemporaryComponent || hasComponentAlreadyBeenAdded) { - return acc; - } - // Add the added components to the modifiedData.compontnes - let newAcc = acc.set(current, addedCompoSchema); - const nestedComponents = retrieveComponentsFromSchema( - currentComponentSchema.toJS(), - state.get('components').toJS() - ); - - // We need to add the nested components to the modifiedData.components as well - nestedComponents.forEach(componentUid => { - const isTemporary = - state.getIn(['components', componentUid, 'isTemporary']) || - false; - const hasNestedComponentAlreadyBeenAdded = - state.getIn(['modifiedData', 'components', componentUid]) !== - undefined; - - // Same logic here otherwise we will lose the modifications added to the components - if (!isTemporary && !hasNestedComponentAlreadyBeenAdded) { - newAcc = newAcc.set( - componentUid, - state.getIn(['components', componentUid]) - ); - } - }); + let newAcc = addComponentsToState(state, current, acc); return newAcc; }, old); From 15f3a83f34c2a86e74daf27eb2c8fc1bc4c8dc7e Mon Sep 17 00:00:00 2001 From: soupette Date: Tue, 7 Jan 2020 18:03:19 +0100 Subject: [PATCH 17/18] Fix PR feedback --- .../components/ModalHeader/ComponentInfos.js | 2 +- .../components/ModalHeader/DropdownInfos.js | 13 +++---------- .../admin/src/components/ModalHeader/Icon.js | 13 +++++++++++++ .../admin/src/components/ModalHeader/index.js | 18 ++++++------------ .../containers/DataManagerProvider/reducer.js | 4 +--- .../utils/tests/createHeadersArray.test.js | 2 +- .../tests/createHeadersObjectFromArray.test.js | 2 +- 7 files changed, 26 insertions(+), 28 deletions(-) create mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Icon.js diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js index 311079331c..6f6cf23877 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/ComponentInfos.js @@ -6,7 +6,7 @@ import ComponentInfosWrapper from './ComponentInfosWrapper'; const ComponentInfos = ({ category, name }) => { return ( -   ()  —  +   (  —  ) ); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js index 902c5227d2..e6af105937 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/DropdownInfos.js @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import PropTypes from 'prop-types'; -import { AttributeIcon } from '@buffetjs/core'; import UpperFirst from '../UpperFirst'; +import Icon from './Icon'; import Item from './Item'; import Menu from './Menu'; import Toggle from './Toggle'; @@ -12,11 +12,7 @@ const DropdownInfos = ({ headers, shouldDisplaySecondHeader }) => { const toggle = () => setDropdownOpen(prevState => !prevState); return ( - + ... {headers.map((header, index) => { @@ -26,10 +22,7 @@ const DropdownInfos = ({ headers, shouldDisplaySecondHeader }) => { return ( - + diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Icon.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Icon.js new file mode 100644 index 0000000000..e3b43e8c3a --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/Icon.js @@ -0,0 +1,13 @@ +import React from 'react'; +import { AttributeIcon } from '@buffetjs/core'; +import PropTypes from 'prop-types'; + +const Icon = ({ type }) => ( + +); + +Icon.propTypes = { + type: PropTypes.string.isRequired, +}; + +export default Icon; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 0bdbabe5bd..26389c8b51 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -2,27 +2,24 @@ import React, { Fragment } from 'react'; import PropTypes from 'prop-types'; import { HeaderModalTitle } from 'strapi-helper-plugin'; import { get } from 'lodash'; -import { AttributeIcon } from '@buffetjs/core'; import { FormattedMessage } from 'react-intl'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import ComponentIcon from './ComponentIcon'; import ComponentInfos from './ComponentInfos'; +import Icon from './Icon'; import IconWrapper from './IconWrapper'; import UpperFirst from '../UpperFirst'; import DropdownInfos from './DropdownInfos'; const ModalHeader = ({ headerId, headers }) => { - const shouldDisplayDrodDrown = headers.length > 3; + const shouldDisplayDrodDown = headers.length > 3; return (
{headerId && ( <> - + { ) : ( - + ); - if (shouldDisplayDrodDrown && index === 1) { + if (shouldDisplayDrodDown && index === 1) { return ( @@ -58,7 +52,7 @@ const ModalHeader = ({ headerId, headers }) => { ); } - if (shouldDisplayDrodDrown && index === 2 && headers.length > 4) { + if (shouldDisplayDrodDown && index === 2 && headers.length > 4) { return null; } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js index bf81900500..d1d8ef40ac 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/reducer.js @@ -175,9 +175,7 @@ const reducer = (state, action) => { ) .updateIn(['modifiedData', 'components'], old => { const componentsSchema = newComponents.reduce((acc, current) => { - let newAcc = addComponentsToState(state, current, acc); - - return newAcc; + return addComponentsToState(state, current, acc); }, old); return componentsSchema; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js index 342298fc92..1cbe4a9638 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersArray.test.js @@ -34,7 +34,7 @@ describe('FormModal | utils | createHeadersArray', () => { expect(createHeadersArray(data)).toEqual([]); }); - it('should return an array containing an header object', () => { + it('should return an array containing a header object', () => { const data = { actionType: 'something', attributeName: null, diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js index e24cd927d0..8acf3a881c 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/FormModal/utils/tests/createHeadersObjectFromArray.test.js @@ -1,7 +1,7 @@ import createHeadersObjectFromArray from '../createHeadersObjectFromArray'; describe('FormModal | utils | createHeadersArray', () => { - it('should return an headers object', () => { + it('should return a header object', () => { const data = [ { label: 'test', From d9a81c70114224892cbf25ebb9f2bc25faae05df Mon Sep 17 00:00:00 2001 From: soupette Date: Wed, 8 Jan 2020 11:38:23 +0100 Subject: [PATCH 18/18] Fix naming --- .../admin/src/components/ModalHeader/index.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js index 26389c8b51..8646d1ea9b 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ModalHeader/index.js @@ -12,7 +12,7 @@ import UpperFirst from '../UpperFirst'; import DropdownInfos from './DropdownInfos'; const ModalHeader = ({ headerId, headers }) => { - const shouldDisplayDrodDown = headers.length > 3; + const shouldDisplayDropDown = headers.length > 3; return (
@@ -38,7 +38,7 @@ const ModalHeader = ({ headerId, headers }) => { ); - if (shouldDisplayDrodDown && index === 1) { + if (shouldDisplayDropDown && index === 1) { return ( @@ -52,7 +52,7 @@ const ModalHeader = ({ headerId, headers }) => { ); } - if (shouldDisplayDrodDown && index === 2 && headers.length > 4) { + if (shouldDisplayDropDown && index === 2 && headers.length > 4) { return null; }