diff --git a/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/DraggedItem/index.js b/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/DraggedItem/index.js index 812018ab2a..2f70f4d616 100644 --- a/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/DraggedItem/index.js +++ b/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/DraggedItem/index.js @@ -5,7 +5,6 @@ import { get } from 'lodash'; import { Collapse } from 'reactstrap'; import { useDrag, useDrop } from 'react-dnd'; import { getEmptyImage } from 'react-dnd-html5-backend'; -import useEditView from '../../../hooks/useEditView'; import ItemTypes from '../../../utils/ItemTypes'; import Inputs from '../../Inputs'; import FieldComponent from '../../FieldComponent'; @@ -42,7 +41,6 @@ const DraggedItem = ({ checkFormErrors, displayedValue, }) => { - const { setIsDraggingComponent, unsetIsDraggingComponent } = useEditView(); const dragRef = useRef(null); const dropRef = useRef(null); const [showForm, setShowForm] = useState(false); @@ -126,12 +124,8 @@ const DraggedItem = ({ begin: () => { // Close all collapses toggleCollapses(-1); - // Prevent the relations select from firing requests - setIsDraggingComponent(); }, end: () => { - // Enable the relations select to fire requests - unsetIsDraggingComponent(); // Update the errors triggerFormValidation(); }, diff --git a/packages/strapi-plugin-content-manager/admin/src/components/SelectWrapper/index.js b/packages/strapi-plugin-content-manager/admin/src/components/SelectWrapper/index.js index 69c7adbe96..c7b9946766 100644 --- a/packages/strapi-plugin-content-manager/admin/src/components/SelectWrapper/index.js +++ b/packages/strapi-plugin-content-manager/admin/src/components/SelectWrapper/index.js @@ -7,7 +7,6 @@ import { request } from 'strapi-helper-plugin'; import { Flex, Text, Padded } from '@buffetjs/core'; import pluginId from '../../pluginId'; import useDataManager from '../../hooks/useDataManager'; -import useEditView from '../../hooks/useEditView'; import { getFieldName } from '../../utils'; import NotAllowedInput from '../NotAllowedInput'; import SelectOne from '../SelectOne'; @@ -39,8 +38,6 @@ function SelectWrapper({ const isMorph = relationType.toLowerCase().includes('morph'); const { addRelation, modifiedData, moveRelation, onChange, onRemoveRelation } = useDataManager(); - const { isDraggingComponent } = useEditView(); - // This is needed for making requests when used in a component const fieldName = useMemo(() => { const fieldNameArray = getFieldName(name); @@ -88,46 +85,44 @@ function SelectWrapper({ return; } - if (!isDraggingComponent) { - try { - const requestUrl = `/${pluginId}/explorer/${slug}/relation-list/${fieldName}`; + try { + const requestUrl = `/${pluginId}/explorer/${slug}/relation-list/${fieldName}`; - const containsKey = `${mainField}_contains`; - const { _contains, ...restState } = cloneDeep(state); - const params = isEmpty(state._contains) - ? restState - : { [containsKey]: _contains, ...restState }; + const containsKey = `${mainField}_contains`; + const { _contains, ...restState } = cloneDeep(state); + const params = isEmpty(state._contains) + ? restState + : { [containsKey]: _contains, ...restState }; - if (componentUid) { - set(params, '_component', componentUid); - } + if (componentUid) { + set(params, '_component', componentUid); + } - const data = await request(requestUrl, { - method: 'GET', - params, - signal, - }); + const data = await request(requestUrl, { + method: 'GET', + params, + signal, + }); - const formattedData = data.map(obj => { - return { value: obj, label: obj[mainField] }; - }); + const formattedData = data.map(obj => { + return { value: obj, label: obj[mainField] }; + }); - setOptions(prevState => - prevState.concat(formattedData).filter((obj, index) => { - const objIndex = prevState.findIndex(el => el.value.id === obj.value.id); + setOptions(prevState => + prevState.concat(formattedData).filter((obj, index) => { + const objIndex = prevState.findIndex(el => el.value.id === obj.value.id); - if (objIndex === -1) { - return true; - } + if (objIndex === -1) { + return true; + } - return prevState.findIndex(el => el.value.id === obj.value.id) === index; - }) - ); - setIsLoading(false); - } catch (err) { - if (err.code !== 20) { - strapi.notification.error('notification.error'); - } + return prevState.findIndex(el => el.value.id === obj.value.id) === index; + }) + ); + setIsLoading(false); + } catch (err) { + if (err.code !== 20) { + strapi.notification.error('notification.error'); } } }; diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/EditView/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/EditView/index.js index ca058976d1..a05f5f44d6 100644 --- a/packages/strapi-plugin-content-manager/admin/src/containers/EditView/index.js +++ b/packages/strapi-plugin-content-manager/admin/src/containers/EditView/index.js @@ -1,4 +1,4 @@ -import React, { memo, useCallback, useMemo, useEffect, useReducer } from 'react'; +import React, { memo, useCallback, useMemo, useEffect } from 'react'; import PropTypes from 'prop-types'; import { get } from 'lodash'; import { useHistory } from 'react-router-dom'; @@ -20,8 +20,6 @@ import EditViewProvider from '../EditViewProvider'; import Header from './Header'; import { createAttributesLayout, formatLayoutWithMetas } from './utils'; import { LinkWrapper, SubWrapper } from './components'; - -import reducer, { initialState } from './reducer'; import DeleteLink from './DeleteLink'; import InformationCard from './InformationCard'; @@ -41,8 +39,6 @@ const EditView = ({ const viewPermissions = useMemo(() => generatePermissionsObject(slug), [slug]); const { allowedActions } = useUserPermissions(viewPermissions); - const [{ isDraggingComponent }, dispatch] = useReducer(reducer, initialState); - const allLayoutData = useMemo(() => get(layouts, [slug], {}), [layouts, slug]); const currentContentTypeLayoutData = useMemo(() => get(allLayoutData, ['contentType'], {}), [ @@ -65,18 +61,6 @@ const EditView = ({ }); }, []); - const handleDragComponent = useCallback(() => { - dispatch({ - type: 'SET_IS_DRAGGING_COMPONENT', - }); - }, []); - - const handleDropComponent = useCallback(() => { - dispatch({ - type: 'UNSET_IS_DRAGGING_COMPONENT', - }); - }, []); - useEffect(() => { return () => deleteLayout(slug); }, [deleteLayout, slug]); @@ -92,12 +76,9 @@ const EditView = ({ allowedActions={allowedActions} allLayoutData={allLayoutData} components={components} - isDraggingComponent={isDraggingComponent} isSingleType={false} layout={currentContentTypeLayoutData} models={models} - setIsDraggingComponent={handleDragComponent} - unsetIsDraggingComponent={handleDropComponent} > - // eslint-disable-next-line consistent-return - produce(state, drafState => { - switch (action.type) { - case 'SET_IS_DRAGGING_COMPONENT': { - drafState.isDraggingComponent = true; - break; - } - case 'UNSET_IS_DRAGGING_COMPONENT': { - drafState.isDraggingComponent = false; - break; - } - default: { - return drafState; - } - } - }); - -export default reducer; -export { initialState }; diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/EditView/tests/reducer.test.js b/packages/strapi-plugin-content-manager/admin/src/containers/EditView/tests/reducer.test.js deleted file mode 100644 index f172883699..0000000000 --- a/packages/strapi-plugin-content-manager/admin/src/containers/EditView/tests/reducer.test.js +++ /dev/null @@ -1,50 +0,0 @@ -import produce from 'immer'; -import reducer from '../reducer'; - -describe('CONTENT MANAGER | CONTAINERS | EditView | reducer', () => { - let state; - - beforeEach(() => { - state = { - isDraggingComponent: false, - }; - }); - - describe('DEFAULT_ACTION', () => { - it('should return the state', () => { - const expected = state; - - expect(reducer(state, {})).toEqual(expected); - }); - }); - - describe('SET_IS_DRAGGING_COMPONENT', () => { - it('should set the isDraggingComponent to true', () => { - const action = { - type: 'SET_IS_DRAGGING_COMPONENT', - }; - - const expected = produce(state, draft => { - draft.isDraggingComponent = true; - }); - - expect(reducer(state, action)).toEqual(expected); - }); - }); - - describe('UNSET_IS_DRAGGING_COMPONENT', () => { - it('should set the isDraggingComponent to false', () => { - state.isDraggingComponent = true; - - const action = { - type: 'UNSET_IS_DRAGGING_COMPONENT', - }; - - const expected = produce(state, draft => { - draft.isDraggingComponent = false; - }); - - expect(reducer(state, action)).toEqual(expected); - }); - }); -}); diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/index.js index 29c33cc905..d4c5f9df46 100644 --- a/packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/index.js +++ b/packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/index.js @@ -49,10 +49,8 @@ const EditView = ({ const { allowedActions } = useUserPermissions(viewPermissions); const isSingleType = useMemo(() => contentType === 'singleType', [contentType]); - const [{ formattedContentTypeLayout, isDraggingComponent }, dispatch] = useReducer( - reducer, - initialState, - () => init(initialState) + const [{ formattedContentTypeLayout }, dispatch] = useReducer(reducer, initialState, () => + init(initialState) ); const allLayoutData = useMemo(() => get(layouts, [slug], {}), [layouts, slug]); const currentContentTypeLayoutData = useMemo(() => get(allLayoutData, ['contentType'], {}), [ @@ -126,20 +124,9 @@ const EditView = ({ allowedActions={allowedActions} allLayoutData={allLayoutData} components={components} - isDraggingComponent={isDraggingComponent} isSingleType={isSingleType} layout={currentContentTypeLayoutData} models={models} - setIsDraggingComponent={() => { - dispatch({ - type: 'SET_IS_DRAGGING_COMPONENT', - }); - }} - unsetIsDraggingComponent={() => { - dispatch({ - type: 'UNSET_IS_DRAGGING_COMPONENT', - }); - }} > // eslint-disable-next-line consistent-return produce(state, drafState => { switch (action.type) { - case 'SET_IS_DRAGGING_COMPONENT': { - drafState.isDraggingComponent = true; - break; - } - case 'SET_LAYOUT_DATA': { drafState.formattedContentTypeLayout = action.formattedContentTypeLayout; break; } case 'RESET_PROPS': return initialState; - case 'UNSET_IS_DRAGGING_COMPONENT': { - drafState.isDraggingComponent = false; - break; - } + default: { return drafState; } diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/tests/reducer.test.js b/packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/tests/reducer.test.js deleted file mode 100644 index b093d179ba..0000000000 --- a/packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/tests/reducer.test.js +++ /dev/null @@ -1,84 +0,0 @@ -import produce from 'immer'; -import reducer from '../reducer'; - -describe('CONTENT MANAGER | CONTAINERS | EditView | reducer', () => { - let state; - - beforeEach(() => { - state = { - formattedContentTypeLayout: [], - isDraggingComponent: false, - }; - }); - - describe('DEFAULT_ACTION', () => { - it('should return the state', () => { - const expected = state; - - expect(reducer(state, {})).toEqual(expected); - }); - }); - - describe('SET_IS_DRAGGING_COMPONENT', () => { - it('should set the isDraggingComponent to true', () => { - const action = { - type: 'SET_IS_DRAGGING_COMPONENT', - }; - - const expected = produce(state, draft => { - draft.isDraggingComponent = true; - }); - - expect(reducer(state, action)).toEqual(expected); - }); - }); - - describe('SET_LAYOUT_DATA', () => { - it('should set the isDraggingComponent to true', () => { - const action = { - type: 'SET_LAYOUT_DATA', - formattedContentTypeLayout: ['test', 'test1'], - }; - - const expected = produce(state, draft => { - draft.formattedContentTypeLayout = ['test', 'test1']; - }); - - expect(reducer(state, action)).toEqual(expected); - }); - }); - - describe('RESET_PROPS', () => { - it('should set the isDraggingComponent to true', () => { - const action = { - type: 'RESET_PROPS', - }; - - state.isDraggingComponent = true; - state.formattedContentTypeLayout = ['test', 'test1']; - - const expected = produce(state, draft => { - draft.isDraggingComponent = false; - draft.formattedContentTypeLayout = []; - }); - - expect(reducer(state, action)).toEqual(expected); - }); - }); - - describe('UNSET_IS_DRAGGING_COMPONENT', () => { - it('should set the isDraggingComponent to false', () => { - state.isDraggingComponent = true; - - const action = { - type: 'UNSET_IS_DRAGGING_COMPONENT', - }; - - const expected = produce(state, draft => { - draft.isDraggingComponent = false; - }); - - expect(reducer(state, action)).toEqual(expected); - }); - }); -});