diff --git a/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/index.js b/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/index.js index 0cb49908fd..d15fa340a0 100644 --- a/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/index.js +++ b/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/index.js @@ -413,10 +413,11 @@ const EditViewDataManagerProvider = ({ }); }, []); - const onRemoveRelation = useCallback(keys => { + const removeRelation = useCallback(({ target: { name, value } }) => { dispatch({ type: 'REMOVE_RELATION', - keys, + keys: name.split('.'), + value, }); }, []); @@ -491,7 +492,7 @@ const EditViewDataManagerProvider = ({ onChange: handleChange, onPublish: handlePublish, onUnpublish, - onRemoveRelation, + removeRelation, readActionAllowedFields, redirectToPreviousPage, removeComponentFromDynamicZone, diff --git a/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/reducer.js b/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/reducer.js index 04a2155db7..9141c9874b 100644 --- a/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/reducer.js +++ b/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/reducer.js @@ -73,22 +73,16 @@ const reducer = (state, action) => break; } case 'ADD_RELATION': { - if (!Array.isArray(action.value) || !action.value.length) { - break; + const path = ['modifiedData', ...action.keys, 'add']; + const currentValue = get(state, path); + const { value } = action; + + if (Array.isArray(currentValue)) { + set(draftState, path, [...currentValue, value]); + } else { + set(draftState, path, [value]); } - const el = action.value[0].value; - - const currentValue = get(state, ['modifiedData', ...action.keys], null); - - if (!currentValue) { - set(draftState, ['modifiedData', ...action.keys], [el]); - - break; - } - - set(draftState, ['modifiedData', ...action.keys], [...currentValue, el]); - break; } case 'INIT_FORM': { @@ -214,15 +208,15 @@ const reducer = (state, action) => break; } case 'REMOVE_RELATION': { - const pathArray = action.keys.split('.'); - const pathArrayLength = pathArray.length - 1; - const pathToData = ['modifiedData', ...take(pathArray, pathArrayLength)]; - const currentValue = get(state, pathToData).slice(); - const indexToRemove = parseInt(pathArray[pathArrayLength], 10); + const path = ['modifiedData', ...action.keys, 'remove']; + const currentValue = get(state, path); + const { value } = action; - currentValue.splice(indexToRemove, 1); - - set(draftState, pathToData, currentValue); + if (Array.isArray(currentValue)) { + set(draftState, path, [...currentValue, value]); + } else { + set(draftState, path, [value]); + } break; } diff --git a/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/tests/reducer.test.js b/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/tests/reducer.test.js index 757731076b..e349c2c8c2 100644 --- a/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/tests/reducer.test.js +++ b/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/tests/reducer.test.js @@ -258,7 +258,7 @@ describe('CONTENT MANAGER | COMPONENTS | EditViewDataManagerProvider | reducer', }); describe('ADD_RELATION', () => { - it('should add a relation in the modifiedData when it is not defined', () => { + it('should add a relation in the modifiedData', () => { const state = { ...initialState, @@ -278,29 +278,32 @@ describe('CONTENT MANAGER | COMPONENTS | EditViewDataManagerProvider | reducer', }, modifiedData: { name: 'name', - relation: [{ id: 1 }], + relation: { + add: [{ id: 1 }], + }, }, }; const action = { type: 'ADD_RELATION', keys: ['relation'], - value: [{ label: 'ezrraez', value: { id: 1 } }], + value: { id: 1 }, }; expect(reducer(state, action)).toEqual(expected); }); + }); - it('should add a relation in the modifiedData when it is not an empty array', () => { + describe('REMOVE_RELATION', () => { + it('should remove a relation from modifiedData', () => { const state = { ...initialState, + initialData: { name: 'name', - relation: [{ id: 1 }], }, modifiedData: { name: 'name', - relation: [{ id: 1 }], }, }; @@ -309,53 +312,19 @@ describe('CONTENT MANAGER | COMPONENTS | EditViewDataManagerProvider | reducer', componentsDataStructure: {}, initialData: { name: 'name', - relation: [{ id: 1 }], }, modifiedData: { name: 'name', - relation: [{ id: 1 }, { id: 3 }], + relation: { + remove: [{ id: 1 }], + }, }, }; const action = { - type: 'ADD_RELATION', + type: 'REMOVE_RELATION', keys: ['relation'], - value: [{ value: { id: 3 } }], - }; - - expect(reducer(state, action)).toEqual(expected); - }); - - it('should not add a relation in the modifiedData when the value is empty', () => { - const state = { - ...initialState, - initialData: { - name: 'name', - relation: [{ id: 1 }], - }, - modifiedData: { - name: 'name', - relation: [{ id: 1 }], - }, - }; - - const expected = { - ...initialState, - componentsDataStructure: {}, - initialData: { - name: 'name', - relation: [{ id: 1 }], - }, - modifiedData: { - name: 'name', - relation: [{ id: 1 }], - }, - }; - - const action = { - type: 'ADD_RELATION', - keys: ['relation'], - value: [], + value: { id: 1 }, }; expect(reducer(state, action)).toEqual(expected); @@ -822,31 +791,6 @@ describe('CONTENT MANAGER | COMPONENTS | EditViewDataManagerProvider | reducer', }); }); - describe('REMOVE_RELATION', () => { - it('should remove a relation correctly', () => { - const state = { - ...initialState, - modifiedData: { - relation: ['one', 'two', 'three'], - }, - }; - - const action = { - type: 'REMOVE_RELATION', - keys: 'relation.1', - }; - - const expected = { - ...initialState, - modifiedData: { - relation: ['one', 'three'], - }, - }; - - expect(reducer(state, action)).toEqual(expected); - }); - }); - describe('SET_DEFAULT_DATA_STRUCTURES', () => { it('should set the componentsDataStructure and the contentTypeDataStructure correctly', () => { const state = { diff --git a/packages/core/admin/admin/src/content-manager/components/SelectWrapper/index.js b/packages/core/admin/admin/src/content-manager/components/SelectWrapper/index.js index 1c1870212d..9bcccbd13d 100644 --- a/packages/core/admin/admin/src/content-manager/components/SelectWrapper/index.js +++ b/packages/core/admin/admin/src/content-manager/components/SelectWrapper/index.js @@ -69,7 +69,7 @@ function SelectWrapper({ modifiedData, moveRelation, onChange, - onRemoveRelation, + removeRelation, } = useCMEditViewDataManager(); const { pathname } = useLocation(); @@ -226,9 +226,11 @@ function SelectWrapper({ }; const handleAddRelation = value => { - if (!isEmpty(value)) { - addRelation({ target: { name, value } }); - } + addRelation({ target: { name, value } }); + }; + + const handleRemoveRelation = value => { + removeRelation({ target: { name, value } }); }; const handleMenuOpen = () => { @@ -301,7 +303,7 @@ function SelectWrapper({ onMenuClose={handleMenuClose} onMenuOpen={handleMenuOpen} onMenuScrollToBottom={handleMenuScrollToBottom} - onRemove={onRemoveRelation} + onRemove={handleRemoveRelation} placeholder={placeholder} searchToPersist={searchToPersist} targetModel={targetModel} diff --git a/packages/core/admin/admin/src/content-manager/components/SelectWrapper/utils/connect.js b/packages/core/admin/admin/src/content-manager/components/SelectWrapper/utils/connect.js index 648a3d30e4..563d58b445 100644 --- a/packages/core/admin/admin/src/content-manager/components/SelectWrapper/utils/connect.js +++ b/packages/core/admin/admin/src/content-manager/components/SelectWrapper/utils/connect.js @@ -2,7 +2,6 @@ import React from 'react'; function connect(WrappedComponent, select) { return function(props) { - // eslint-disable-next-line react/prop-types const selectors = select(props); return ;