yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-09-21 14:31:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove useless drag event is component relation select

Browse Source 
Signed-off-by: soupette <cyril.lpz@gmail.com>
This commit is contained in:
soupette 2020-10-22 18:21:10 +02:00
parent 27eb21e406
commit 2c466f02b4
9 changed files with 35 additions and 252 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/DraggedItem/index.js
View File

@ -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();
},

5
packages/strapi-plugin-content-manager/admin/src/components/SelectWrapper/index.js
View File

@ -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,7 +85,6 @@ function SelectWrapper({
return;
}
if (!isDraggingComponent) {
try {
const requestUrl = `/${pluginId}/explorer/${slug}/relation-list/${fieldName}`;
@ -129,7 +125,6 @@ function SelectWrapper({
strapi.notification.error('notification.error');
}
}
}
};
useEffect(() => {

21
packages/strapi-plugin-content-manager/admin/src/containers/EditView/index.js
View File

@ -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}
>
<EditViewDataManagerProvider
allLayoutData={allLayoutData}

5
packages/strapi-plugin-content-manager/admin/src/containers/EditView/init.js
View File

@ -1,5 +0,0 @@
function init(initialState) {
return initialState;
}
export default init;

26
packages/strapi-plugin-content-manager/admin/src/containers/EditView/reducer.js
View File

@ -1,26 +0,0 @@
import produce from 'immer';
const initialState = {
isDraggingComponent: false,
};
const reducer = (state, action) =>
// 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 };

50
packages/strapi-plugin-content-manager/admin/src/containers/EditView/tests/reducer.test.js
View File

@ -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);
});
});
});

17
packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/index.js
View File

@ -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',
});
}}
>
<EditViewDataManagerProvider
allLayoutData={allLayoutData}

11
packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/reducer.js
View File

@ -2,28 +2,19 @@ import produce from 'immer';
const initialState = {
formattedContentTypeLayout: [],
isDraggingComponent: false,
};
const reducer = (state, action) =>
// 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;
}

84
packages/strapi-plugin-content-manager/admin/src/containers/SingleTypeEditView/tests/reducer.test.js
View File

@ -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);
});
});
});