Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Fix multiple dnd backends error

Browse Source 
[MAILPOET-2592]
This commit is contained in:
Rostislav Wolny
2020-01-08 13:35:54 +01:00
committed by Rostislav Wolný
parent d402c5e8e5
commit a445a602dc
3 changed files with 28 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
assets/js/src/form_editor/blocks/custom_radio/settings_preview.jsx
View File

@@ -7,8 +7,8 @@ import React, {
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Dashicon } from '@wordpress/components'; import { Dashicon } from '@wordpress/components';
import { partial } from 'lodash'; import { partial } from 'lodash';
import { DndProvider, useDrag, useDrop } from 'react-dnd'; import { useDrag, useDrop } from 'react-dnd';
import Backend from 'react-dnd-html5-backend'; import DndProvider from '../dnd_provider.jsx';
const PreviewItem = ({ const PreviewItem = ({
value, value,
@@ -153,7 +153,7 @@ const Preview = ({
}; };
return ( return (
<DndProvider backend={Backend}> <DndProvider>
{valuesWhileMoved.map((value, index) => ( {valuesWhileMoved.map((value, index) => (
<PreviewItem <PreviewItem
key={value.id} key={value.id}

22
assets/js/src/form_editor/blocks/dnd_provider.jsx Normal file
View File

@@ -0,0 +1,22 @@
import React, { useRef } from 'react';
import { DndProvider as ReactDndProvider, createDndContext } from 'react-dnd';
import Backend from 'react-dnd-html5-backend';
import PropTypes from 'prop-types';
const DndProvider = ({ children }) => {
const manager = useRef(createDndContext(Backend));
return (
<ReactDndProvider manager={manager.current.dragDropManager}>
{children}
</ReactDndProvider>
);
};
DndProvider.propTypes = {
children: PropTypes.oneOfType([
PropTypes.arrayOf(PropTypes.node),
PropTypes.node,
]).isRequired,
};
export default DndProvider;

6
assets/js/src/form_editor/blocks/segment_select/settings_preview.jsx
View File

@@ -7,8 +7,8 @@ import React, {
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { CheckboxControl, Dashicon } from '@wordpress/components'; import { CheckboxControl, Dashicon } from '@wordpress/components';
import { partial } from 'lodash'; import { partial } from 'lodash';
import { DndProvider, useDrag, useDrop } from 'react-dnd'; import { useDrag, useDrop } from 'react-dnd';
import Backend from 'react-dnd-html5-backend'; import DndProvider from '../dnd_provider.jsx';
const PreviewItem = ({ const PreviewItem = ({
segment, segment,
@@ -140,7 +140,7 @@ const Preview = ({
}; };
return ( return (
<DndProvider backend={Backend}> <DndProvider>
{segmentsWhileMoved.map((segment, index) => ( {segmentsWhileMoved.map((segment, index) => (
<PreviewItem <PreviewItem
key={segment.id} key={segment.id}