mirror of
https://github.com/apache/superset.git
synced 2026-04-07 18:35:15 +00:00
chore: Upgrade react-dnd to 11.1.3 (#12815)
This commit is contained in:
committed by
GitHub
parent
34549cb5b7
commit
fcaa0acad5
95
superset-frontend/package-lock.json
generated
95
superset-frontend/package-lock.json
generated
@@ -8847,6 +8847,21 @@
|
||||
"react-lifecycles-compat": "^3.0.4"
|
||||
}
|
||||
},
|
||||
"@react-dnd/asap": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@react-dnd/asap/-/asap-4.0.0.tgz",
|
||||
"integrity": "sha512-0XhqJSc6pPoNnf8DhdsPHtUhRzZALVzYMTzRwV4VI6DJNJ/5xxfL9OQUwb8IH5/2x7lSf7nAZrnzUD+16VyOVQ=="
|
||||
},
|
||||
"@react-dnd/invariant": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@react-dnd/invariant/-/invariant-2.0.0.tgz",
|
||||
"integrity": "sha512-xL4RCQBCBDJ+GRwKTFhGUW8GXa4yoDfJrPbLblc3U09ciS+9ZJXJ3Qrcs/x2IODOdIE5kQxvMmE2UKyqUictUw=="
|
||||
},
|
||||
"@react-dnd/shallowequal": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-2.0.0.tgz",
|
||||
"integrity": "sha512-Pc/AFTdwZwEKJxFJvlxrSmGe/di+aAOBn60sremrpLo6VI/6cmiUYNNwlI5KNYttg7uypzA3ILPMPgxB2GYZEg=="
|
||||
},
|
||||
"@scarf/scarf": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@scarf/scarf/-/scarf-1.0.6.tgz",
|
||||
@@ -28253,11 +28268,6 @@
|
||||
"integrity": "sha1-44Mx8IRLukm5qctxx3FYWqsbxlo=",
|
||||
"dev": true
|
||||
},
|
||||
"disposables": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/disposables/-/disposables-1.0.2.tgz",
|
||||
"integrity": "sha1-NsamdEdfVaLWkTVnpgFETkh7S24="
|
||||
},
|
||||
"distributions": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/distributions/-/distributions-1.1.0.tgz",
|
||||
@@ -28266,30 +28276,6 @@
|
||||
"mathfn": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"dnd-core": {
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-2.6.0.tgz",
|
||||
"integrity": "sha1-ErrWbVh0LG5ffPKUP7aFlED4CcQ=",
|
||||
"requires": {
|
||||
"asap": "^2.0.6",
|
||||
"invariant": "^2.0.0",
|
||||
"lodash": "^4.2.0",
|
||||
"redux": "^3.7.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"redux": {
|
||||
"version": "3.7.2",
|
||||
"resolved": "https://registry.npmjs.org/redux/-/redux-3.7.2.tgz",
|
||||
"integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A==",
|
||||
"requires": {
|
||||
"lodash": "^4.2.1",
|
||||
"lodash-es": "^4.2.1",
|
||||
"loose-envify": "^1.1.0",
|
||||
"symbol-observable": "^1.0.3"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"dns-equal": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
|
||||
@@ -31264,7 +31250,7 @@
|
||||
"dependencies": {
|
||||
"core-js": {
|
||||
"version": "1.2.7",
|
||||
"resolved": "http://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
|
||||
"resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
|
||||
"integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
|
||||
}
|
||||
}
|
||||
@@ -45859,31 +45845,46 @@
|
||||
}
|
||||
},
|
||||
"react-dnd": {
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/react-dnd/-/react-dnd-2.6.0.tgz",
|
||||
"integrity": "sha1-f6JWds+CfViokSk+PBq1naACVFo=",
|
||||
"version": "11.1.3",
|
||||
"resolved": "https://registry.npmjs.org/react-dnd/-/react-dnd-11.1.3.tgz",
|
||||
"integrity": "sha512-8rtzzT8iwHgdSC89VktwhqdKKtfXaAyC4wiqp0SywpHG12TTLvfOoL6xNEIUWXwIEWu+CFfDn4GZJyynCEuHIQ==",
|
||||
"requires": {
|
||||
"disposables": "^1.0.1",
|
||||
"dnd-core": "^2.6.0",
|
||||
"hoist-non-react-statics": "^2.1.0",
|
||||
"invariant": "^2.1.0",
|
||||
"lodash": "^4.2.0",
|
||||
"prop-types": "^15.5.10"
|
||||
"@react-dnd/shallowequal": "^2.0.0",
|
||||
"@types/hoist-non-react-statics": "^3.3.1",
|
||||
"dnd-core": "^11.1.3",
|
||||
"hoist-non-react-statics": "^3.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"hoist-non-react-statics": {
|
||||
"version": "2.5.5",
|
||||
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
|
||||
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
|
||||
"dnd-core": {
|
||||
"version": "11.1.3",
|
||||
"resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-11.1.3.tgz",
|
||||
"integrity": "sha512-QugF55dNW+h+vzxVJ/LSJeTeUw9MCJ2cllhmVThVPEtF16ooBkxj0WBE5RB+AceFxMFo1rO6bJKXtqKl+JNnyA==",
|
||||
"requires": {
|
||||
"@react-dnd/asap": "^4.0.0",
|
||||
"@react-dnd/invariant": "^2.0.0",
|
||||
"redux": "^4.0.4"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"react-dnd-html5-backend": {
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/react-dnd-html5-backend/-/react-dnd-html5-backend-2.6.0.tgz",
|
||||
"integrity": "sha1-WQzRzKeEQbsnTt1XH+9MCxbdz44=",
|
||||
"version": "11.1.3",
|
||||
"resolved": "https://registry.npmjs.org/react-dnd-html5-backend/-/react-dnd-html5-backend-11.1.3.tgz",
|
||||
"integrity": "sha512-/1FjNlJbW/ivkUxlxQd7o3trA5DE33QiRZgxent3zKme8DwF4Nbw3OFVhTRFGaYhHFNL1rZt6Rdj1D78BjnNLw==",
|
||||
"requires": {
|
||||
"lodash": "^4.2.0"
|
||||
"dnd-core": "^11.1.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"dnd-core": {
|
||||
"version": "11.1.3",
|
||||
"resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-11.1.3.tgz",
|
||||
"integrity": "sha512-QugF55dNW+h+vzxVJ/LSJeTeUw9MCJ2cllhmVThVPEtF16ooBkxj0WBE5RB+AceFxMFo1rO6bJKXtqKl+JNnyA==",
|
||||
"requires": {
|
||||
"@react-dnd/asap": "^4.0.0",
|
||||
"@react-dnd/invariant": "^2.0.0",
|
||||
"redux": "^4.0.4"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"react-docgen": {
|
||||
|
||||
@@ -106,7 +106,6 @@
|
||||
"d3-array": "^1.2.4",
|
||||
"d3-color": "^1.2.0",
|
||||
"d3-scale": "^2.1.2",
|
||||
"dnd-core": "^2.6.0",
|
||||
"dom-to-image": "^2.6.0",
|
||||
"fontsource-fira-code": "^3.0.5",
|
||||
"fontsource-inter": "^3.0.5",
|
||||
@@ -138,8 +137,8 @@
|
||||
"react-checkbox-tree": "^1.5.1",
|
||||
"react-color": "^2.13.8",
|
||||
"react-datetime": "^3.0.4",
|
||||
"react-dnd": "^2.5.4",
|
||||
"react-dnd-html5-backend": "^2.5.4",
|
||||
"react-dnd": "^11.1.3",
|
||||
"react-dnd-html5-backend": "^11.1.3",
|
||||
"react-dom": "^16.13.0",
|
||||
"react-gravatar": "^2.6.1",
|
||||
"react-hot-loader": "^4.12.20",
|
||||
|
||||
@@ -1,45 +0,0 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import getDragDropManager from 'src/dashboard/util/getDragDropManager';
|
||||
|
||||
// A helper component that provides a DragDropContext for components that require it
|
||||
class WithDragDropContext extends React.Component {
|
||||
getChildContext() {
|
||||
return {
|
||||
dragDropManager: this.context.dragDropManager || getDragDropManager(),
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return this.props.children;
|
||||
}
|
||||
}
|
||||
|
||||
WithDragDropContext.propTypes = {
|
||||
children: PropTypes.node.isRequired,
|
||||
};
|
||||
|
||||
WithDragDropContext.childContextTypes = {
|
||||
dragDropManager: PropTypes.object.isRequired,
|
||||
};
|
||||
|
||||
export default WithDragDropContext;
|
||||
@@ -25,6 +25,8 @@ import { ParentSize } from '@vx/responsive';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
import { Sticky, StickyContainer } from 'react-sticky';
|
||||
import { TabContainer, TabContent, TabPane } from 'react-bootstrap';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import BuilderComponentPane from 'src/dashboard/components/BuilderComponentPane';
|
||||
import DashboardBuilder from 'src/dashboard/components/DashboardBuilder';
|
||||
@@ -39,7 +41,6 @@ import {
|
||||
} from 'spec/fixtures/mockDashboardLayout';
|
||||
|
||||
import { mockStore, mockStoreWithTabs } from 'spec/fixtures/mockStore';
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
|
||||
const dashboardLayout = undoableDashboardLayout.present;
|
||||
const layoutWithTabs = undoableDashboardLayoutWithTabs.present;
|
||||
@@ -77,7 +78,7 @@ describe('DashboardBuilder', () => {
|
||||
return useProvider
|
||||
? mount(
|
||||
<Provider store={store}>
|
||||
<WithDragDropContext>{builder}</WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>{builder}</DndProvider>
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
|
||||
@@ -21,6 +21,8 @@ import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import sinon from 'sinon';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import Chart from 'src/dashboard/containers/Chart';
|
||||
import ChartHolder from 'src/dashboard/components/gridComponents/ChartHolder';
|
||||
@@ -33,7 +35,6 @@ import { getMockStore } from 'spec/fixtures/mockStore';
|
||||
import { sliceId } from 'spec/fixtures/mockChartQueries';
|
||||
import dashboardInfo from 'spec/fixtures/mockDashboardInfo';
|
||||
import { dashboardLayout as mockLayout } from 'spec/fixtures/mockDashboardLayout';
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
import { sliceEntitiesForChart } from 'spec/fixtures/mockSliceEntities';
|
||||
|
||||
describe('ChartHolder', () => {
|
||||
@@ -65,9 +66,9 @@ describe('ChartHolder', () => {
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<Provider store={mockStore}>
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<ChartHolder {...props} {...overrideProps} />
|
||||
</WithDragDropContext>
|
||||
</DndProvider>
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
|
||||
@@ -21,6 +21,8 @@ import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import sinon from 'sinon';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import BackgroundStyleDropdown from 'src/dashboard/components/menu/BackgroundStyleDropdown';
|
||||
import Column from 'src/dashboard/components/gridComponents/Column';
|
||||
@@ -32,7 +34,6 @@ import IconButton from 'src/dashboard/components/IconButton';
|
||||
import ResizableContainer from 'src/dashboard/components/resizable/ResizableContainer';
|
||||
import WithPopoverMenu from 'src/dashboard/components/menu/WithPopoverMenu';
|
||||
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
import { mockStore } from 'spec/fixtures/mockStore';
|
||||
import { dashboardLayout as mockLayout } from 'spec/fixtures/mockDashboardLayout';
|
||||
|
||||
@@ -66,9 +67,9 @@ describe('Column', () => {
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<Provider store={mockStore}>
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<Column {...props} {...overrideProps} />
|
||||
</WithDragDropContext>
|
||||
</DndProvider>
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
|
||||
@@ -19,6 +19,8 @@
|
||||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import sinon from 'sinon';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import DeleteComponentButton from 'src/dashboard/components/DeleteComponentButton';
|
||||
import HoverMenu from 'src/dashboard/components/menu/HoverMenu';
|
||||
@@ -30,8 +32,6 @@ import {
|
||||
DASHBOARD_GRID_TYPE,
|
||||
} from 'src/dashboard/util/componentTypes';
|
||||
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
|
||||
describe('Divider', () => {
|
||||
const props = {
|
||||
id: 'id',
|
||||
@@ -49,9 +49,9 @@ describe('Divider', () => {
|
||||
// We have to wrap provide DragDropContext for the underlying DragDroppable
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<Divider {...props} {...overrideProps} />
|
||||
</WithDragDropContext>,
|
||||
</DndProvider>,
|
||||
);
|
||||
return wrapper;
|
||||
}
|
||||
|
||||
@@ -20,6 +20,8 @@ import React from 'react';
|
||||
import { Provider } from 'react-redux';
|
||||
import { styledMount as mount } from 'spec/helpers/theming';
|
||||
import sinon from 'sinon';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import DeleteComponentButton from 'src/dashboard/components/DeleteComponentButton';
|
||||
import EditableTitle from 'src/components/EditableTitle';
|
||||
@@ -33,7 +35,6 @@ import {
|
||||
DASHBOARD_GRID_TYPE,
|
||||
} from 'src/dashboard/util/componentTypes';
|
||||
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
import { mockStoreWithTabs } from 'spec/fixtures/mockStore';
|
||||
|
||||
describe('Header', () => {
|
||||
@@ -56,9 +57,9 @@ describe('Header', () => {
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<Provider store={mockStoreWithTabs}>
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<Header {...props} {...overrideProps} />
|
||||
</WithDragDropContext>
|
||||
</DndProvider>
|
||||
</Provider>,
|
||||
);
|
||||
return wrapper;
|
||||
|
||||
@@ -21,6 +21,9 @@ import React from 'react';
|
||||
import { styledMount as mount } from 'spec/helpers/theming';
|
||||
import sinon from 'sinon';
|
||||
import ReactMarkdown from 'react-markdown';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import { act } from 'react-dom/test-utils';
|
||||
import { MarkdownEditor } from 'src/components/AsyncAceEditor';
|
||||
import Markdown from 'src/dashboard/components/gridComponents/Markdown';
|
||||
@@ -31,7 +34,6 @@ import DragDroppable from 'src/dashboard/components/dnd/DragDroppable';
|
||||
import WithPopoverMenu from 'src/dashboard/components/menu/WithPopoverMenu';
|
||||
import ResizableContainer from 'src/dashboard/components/resizable/ResizableContainer';
|
||||
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
import { mockStore } from 'spec/fixtures/mockStore';
|
||||
import { dashboardLayout as mockLayout } from 'spec/fixtures/mockDashboardLayout';
|
||||
|
||||
@@ -63,9 +65,9 @@ describe('Markdown', () => {
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<Provider store={mockStore}>
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<Markdown {...props} {...overrideProps} />
|
||||
</WithDragDropContext>
|
||||
</DndProvider>
|
||||
</Provider>,
|
||||
);
|
||||
return wrapper;
|
||||
|
||||
@@ -20,6 +20,8 @@ import { Provider } from 'react-redux';
|
||||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import sinon from 'sinon';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import BackgroundStyleDropdown from 'src/dashboard/components/menu/BackgroundStyleDropdown';
|
||||
import DashboardComponent from 'src/dashboard/containers/DashboardComponent';
|
||||
@@ -32,7 +34,6 @@ import WithPopoverMenu from 'src/dashboard/components/menu/WithPopoverMenu';
|
||||
import { DASHBOARD_GRID_ID } from 'src/dashboard/util/constants';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
import { mockStore } from 'spec/fixtures/mockStore';
|
||||
import { dashboardLayout as mockLayout } from 'spec/fixtures/mockDashboardLayout';
|
||||
|
||||
@@ -62,9 +63,9 @@ describe('Row', () => {
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<Provider store={mockStore}>
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<Row {...props} {...overrideProps} />
|
||||
</WithDragDropContext>
|
||||
</DndProvider>
|
||||
</Provider>,
|
||||
{
|
||||
wrappingComponent: ThemeProvider,
|
||||
|
||||
@@ -20,6 +20,8 @@ import { Provider } from 'react-redux';
|
||||
import React from 'react';
|
||||
import { styledMount as mount } from 'spec/helpers/theming';
|
||||
import sinon from 'sinon';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import DashboardComponent from 'src/dashboard/containers/DashboardComponent';
|
||||
import DragDroppable from 'src/dashboard/components/dnd/DragDroppable';
|
||||
@@ -28,7 +30,6 @@ import Tab, {
|
||||
RENDER_TAB,
|
||||
RENDER_TAB_CONTENT,
|
||||
} from 'src/dashboard/components/gridComponents/Tab';
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
import { dashboardLayoutWithTabs } from 'spec/fixtures/mockDashboardLayout';
|
||||
import { mockStoreWithTabs } from 'spec/fixtures/mockStore';
|
||||
|
||||
@@ -63,9 +64,9 @@ describe('Tabs', () => {
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<Provider store={mockStoreWithTabs}>
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<Tab {...props} {...overrideProps} />
|
||||
</WithDragDropContext>
|
||||
</DndProvider>
|
||||
</Provider>,
|
||||
);
|
||||
return wrapper;
|
||||
|
||||
@@ -20,6 +20,9 @@ import { Provider } from 'react-redux';
|
||||
import React from 'react';
|
||||
import { shallow } from 'enzyme';
|
||||
import sinon from 'sinon';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import { LineEditableTabs } from 'src/common/components/Tabs';
|
||||
import { Modal } from 'src/common/components';
|
||||
import fetchMock from 'fetch-mock';
|
||||
@@ -30,7 +33,6 @@ import HoverMenu from 'src/dashboard/components/menu/HoverMenu';
|
||||
import DragDroppable from 'src/dashboard/components/dnd/DragDroppable';
|
||||
import Tabs from 'src/dashboard/components/gridComponents/Tabs';
|
||||
import { DASHBOARD_ROOT_ID } from 'src/dashboard/util/constants';
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
import { dashboardLayoutWithTabs } from 'spec/fixtures/mockDashboardLayout';
|
||||
import { mockStoreWithTabs } from 'spec/fixtures/mockStore';
|
||||
|
||||
@@ -64,9 +66,9 @@ describe('Tabs', () => {
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<Provider store={mockStoreWithTabs}>
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<Tabs {...props} {...overrideProps} />
|
||||
</WithDragDropContext>
|
||||
</DndProvider>
|
||||
</Provider>,
|
||||
);
|
||||
return wrapper;
|
||||
|
||||
@@ -18,6 +18,8 @@
|
||||
*/
|
||||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
|
||||
import DragDroppable from 'src/dashboard/components/dnd/DragDroppable';
|
||||
import DraggableNewComponent from 'src/dashboard/components/gridComponents/new/DraggableNewComponent';
|
||||
@@ -26,7 +28,6 @@ import {
|
||||
NEW_COMPONENT_SOURCE_TYPE,
|
||||
CHART_TYPE,
|
||||
} from 'src/dashboard/util/componentTypes';
|
||||
import WithDragDropContext from 'spec/helpers/WithDragDropContext';
|
||||
|
||||
describe('DraggableNewComponent', () => {
|
||||
const props = {
|
||||
@@ -40,9 +41,9 @@ describe('DraggableNewComponent', () => {
|
||||
// We have to wrap provide DragDropContext for the underlying DragDroppable
|
||||
// otherwise we cannot assert on DragDroppable children
|
||||
const wrapper = mount(
|
||||
<WithDragDropContext>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<DraggableNewComponent {...props} {...overrideProps} />
|
||||
</WithDragDropContext>,
|
||||
</DndProvider>,
|
||||
);
|
||||
return wrapper;
|
||||
}
|
||||
|
||||
@@ -71,7 +71,7 @@ function setup(overrides) {
|
||||
...overrides,
|
||||
};
|
||||
const wrapper = shallow(<AdhocFilterControl {...props} />);
|
||||
const component = wrapper.dive().dive().shallow();
|
||||
const component = wrapper.dive().shallow();
|
||||
return { wrapper, component, onChange };
|
||||
}
|
||||
|
||||
|
||||
@@ -56,6 +56,6 @@ describe('AdhocFilterOption', () => {
|
||||
const popover = overlay.find(Popover);
|
||||
expect(popover).toHaveLength(1);
|
||||
expect(popover.props().defaultVisible).toBe(false);
|
||||
expect(overlay.find('DraggableOptionControlLabel')).toExist();
|
||||
expect(overlay.find('OptionControlLabel')).toExist();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -60,7 +60,7 @@ describe('AdhocMetricOption', () => {
|
||||
it('renders an overlay trigger wrapper for the label', () => {
|
||||
const { wrapper } = setup();
|
||||
expect(wrapper.find(Popover)).toExist();
|
||||
expect(wrapper.find('DraggableOptionControlLabel')).toExist();
|
||||
expect(wrapper.find('OptionControlLabel')).toExist();
|
||||
});
|
||||
|
||||
it('overwrites the adhocMetric in state with onLabelChange', () => {
|
||||
|
||||
@@ -55,7 +55,7 @@ function setup(overrides) {
|
||||
...overrides,
|
||||
};
|
||||
const wrapper = shallow(<MetricsControl {...props} />);
|
||||
const component = wrapper.dive().dive().shallow();
|
||||
const component = wrapper.dive().shallow();
|
||||
return { wrapper, component, onChange };
|
||||
}
|
||||
|
||||
|
||||
@@ -120,9 +120,7 @@ describe('VerifiedMetricsControl', () => {
|
||||
onChange: mockOnChange,
|
||||
});
|
||||
|
||||
const child = wrapper.find(MetricsControl) as ReactWrapper<{
|
||||
onChange: (str: string[]) => void;
|
||||
}>;
|
||||
const child = wrapper.find(MetricsControl);
|
||||
child.props().onChange(['abc']);
|
||||
|
||||
expect(child.length).toBe(1);
|
||||
|
||||
@@ -20,7 +20,8 @@ import { hot } from 'react-hot-loader/root';
|
||||
import React from 'react';
|
||||
import { Provider } from 'react-redux';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
import { DynamicPluginProvider } from 'src/components/DynamicPlugins';
|
||||
import setupApp from '../setup/setupApp';
|
||||
import setupPlugins from '../setup/setupPlugins';
|
||||
@@ -31,11 +32,13 @@ setupPlugins();
|
||||
|
||||
const App = ({ store }) => (
|
||||
<Provider store={store}>
|
||||
<ThemeProvider theme={supersetTheme}>
|
||||
<DynamicPluginProvider>
|
||||
<DashboardContainer />
|
||||
</DynamicPluginProvider>
|
||||
</ThemeProvider>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<ThemeProvider theme={supersetTheme}>
|
||||
<DynamicPluginProvider>
|
||||
<DashboardContainer />
|
||||
</DynamicPluginProvider>
|
||||
</ThemeProvider>
|
||||
</DndProvider>
|
||||
</Provider>
|
||||
);
|
||||
|
||||
|
||||
@@ -37,7 +37,6 @@ import DashboardComponent from 'src/dashboard/containers/DashboardComponent';
|
||||
import ToastPresenter from 'src/messageToasts/containers/ToastPresenter';
|
||||
import WithPopoverMenu from 'src/dashboard/components/menu/WithPopoverMenu';
|
||||
|
||||
import getDragDropManager from 'src/dashboard/util/getDragDropManager';
|
||||
import findTabIndexByComponentId from 'src/dashboard/util/findTabIndexByComponentId';
|
||||
|
||||
import getDirectPathToTabIndex from 'src/dashboard/util/getDirectPathToTabIndex';
|
||||
@@ -161,12 +160,6 @@ class DashboardBuilder extends React.Component {
|
||||
);
|
||||
}
|
||||
|
||||
getChildContext() {
|
||||
return {
|
||||
dragDropManager: this.context.dragDropManager || getDragDropManager(),
|
||||
};
|
||||
}
|
||||
|
||||
UNSAFE_componentWillReceiveProps(nextProps) {
|
||||
const nextFocusComponent = getLeafComponentIdFromPath(
|
||||
nextProps.directPathToChild,
|
||||
|
||||
@@ -155,6 +155,6 @@ UnwrappedDragDroppable.defaultProps = defaultProps;
|
||||
|
||||
// note that the composition order here determines using
|
||||
// component.method() vs decoratedComponentInstance.method() in the drag/drop config
|
||||
export default DropTarget(...dropConfig)(
|
||||
DragSource(...dragConfig)(UnwrappedDragDroppable),
|
||||
export default DragSource(...dragConfig)(
|
||||
DropTarget(...dropConfig)(UnwrappedDragDroppable),
|
||||
);
|
||||
|
||||
@@ -55,22 +55,17 @@ export const dropConfig = [
|
||||
TYPE,
|
||||
{
|
||||
hover(props, monitor, component) {
|
||||
if (
|
||||
component &&
|
||||
component.decoratedComponentInstance &&
|
||||
component.decoratedComponentInstance.mounted
|
||||
) {
|
||||
handleHover(props, monitor, component.decoratedComponentInstance);
|
||||
if (component && component.mounted) {
|
||||
handleHover(props, monitor, component);
|
||||
}
|
||||
},
|
||||
// note:
|
||||
// the react-dnd api requires that the drop() method return a result or undefined
|
||||
// monitor.didDrop() cannot be used because it returns true only for the most-nested target
|
||||
drop(props, monitor, component) {
|
||||
const Component = component.decoratedComponentInstance;
|
||||
const dropResult = monitor.getDropResult();
|
||||
if ((!dropResult || !dropResult.destination) && Component.mounted) {
|
||||
return handleDrop(props, monitor, Component);
|
||||
if ((!dropResult || !dropResult.destination) && component.mounted) {
|
||||
return handleDrop(props, monitor, component);
|
||||
}
|
||||
return undefined;
|
||||
},
|
||||
|
||||
@@ -1,35 +0,0 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import { DragDropManager } from 'dnd-core';
|
||||
import HTML5Backend from 'react-dnd-html5-backend';
|
||||
|
||||
let defaultManager;
|
||||
|
||||
// we use this method to ensure that there is a singleton of the DragDropManager
|
||||
// within the app this seems to work fine, but in tests multiple are initialized
|
||||
// see this issue for more details https://github.com/react-dnd/react-dnd/issues/186
|
||||
// @TODO re-evaluate whether this is required when we move to jest
|
||||
// the alternative is simply using an HOC like:
|
||||
// DragDropContext(HTML5Backend)(DashboardBuilder);
|
||||
export default function getDragDropManager() {
|
||||
if (!defaultManager) {
|
||||
defaultManager = new DragDropManager(HTML5Backend);
|
||||
}
|
||||
return defaultManager;
|
||||
}
|
||||
@@ -19,6 +19,8 @@
|
||||
import React from 'react';
|
||||
import { hot } from 'react-hot-loader/root';
|
||||
import { Provider } from 'react-redux';
|
||||
import { DndProvider } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
import { supersetTheme, ThemeProvider } from '@superset-ui/core';
|
||||
import { DynamicPluginProvider } from 'src/components/DynamicPlugins';
|
||||
import ToastPresenter from '../messageToasts/containers/ToastPresenter';
|
||||
@@ -33,12 +35,14 @@ setupPlugins();
|
||||
|
||||
const App = ({ store }) => (
|
||||
<Provider store={store}>
|
||||
<ThemeProvider theme={supersetTheme}>
|
||||
<DynamicPluginProvider>
|
||||
<ExploreViewContainer />
|
||||
<ToastPresenter />
|
||||
</DynamicPluginProvider>
|
||||
</ThemeProvider>
|
||||
<DndProvider backend={HTML5Backend}>
|
||||
<ThemeProvider theme={supersetTheme}>
|
||||
<DynamicPluginProvider>
|
||||
<ExploreViewContainer />
|
||||
<ToastPresenter />
|
||||
</DynamicPluginProvider>
|
||||
</ThemeProvider>
|
||||
</DndProvider>
|
||||
</Provider>
|
||||
);
|
||||
|
||||
|
||||
@@ -1,23 +0,0 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
// TODO: convert to .ts after we upgrade react-dnd
|
||||
import { DragDropContext } from 'react-dnd';
|
||||
import HTML5Backend from 'react-dnd-html5-backend';
|
||||
|
||||
export default DragDropContext(HTML5Backend);
|
||||
@@ -16,19 +16,13 @@
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { findDOMNode } from 'react-dom';
|
||||
// Current version of react-dnd (2.5.4) doesn't work well with typescript
|
||||
// TODO: remove ts-ignore after we upgrade react-dnd
|
||||
// @ts-ignore
|
||||
import { DragSource, DropTarget } from 'react-dnd';
|
||||
import React, { useRef } from 'react';
|
||||
import { useDrag, useDrop, DropTargetMonitor } from 'react-dnd';
|
||||
import { styled, useTheme } from '@superset-ui/core';
|
||||
import { ColumnOption } from '@superset-ui/chart-controls';
|
||||
import Icon from 'src/components/Icon';
|
||||
import { savedMetricType } from 'src/explore/components/controls/MetricControl/types';
|
||||
|
||||
const TYPE = 'label-dnd';
|
||||
|
||||
const DragContainer = styled.div`
|
||||
margin-bottom: ${({ theme }) => theme.gridUnit}px;
|
||||
:last-child {
|
||||
@@ -128,93 +122,90 @@ export const AddIconButton = styled.button`
|
||||
}
|
||||
`;
|
||||
|
||||
const labelSource = {
|
||||
beginDrag({ index, type }: { index: number; type: string }) {
|
||||
return {
|
||||
index,
|
||||
type,
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
const labelTarget = {
|
||||
hover(props: Record<string, any>, monitor: any, component: any) {
|
||||
const { index: dragIndex, type: dragType } = monitor.getItem();
|
||||
const { index: hoverIndex, type: hoverType } = props;
|
||||
|
||||
// Don't replace items with themselves
|
||||
// Don't allow to drag items between filters and metrics boxes
|
||||
if (dragIndex === hoverIndex || dragType !== hoverType) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Determine rectangle on screen
|
||||
// TODO: refactor with references when we upgrade react-dnd
|
||||
// For now we disable warnings about findDOMNode, but we should refactor after we upgrade react-dnd
|
||||
// Current version (2.5.4) doesn't work well with refs
|
||||
// @ts-ignore
|
||||
// eslint-disable-next-line react/no-find-dom-node
|
||||
const hoverBoundingRect = findDOMNode(component)?.getBoundingClientRect();
|
||||
|
||||
// Get vertical middle
|
||||
const hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;
|
||||
|
||||
// Determine mouse position
|
||||
const clientOffset = monitor.getClientOffset();
|
||||
|
||||
// Get pixels to the top
|
||||
const hoverClientY = clientOffset.y - hoverBoundingRect.top;
|
||||
|
||||
// Only perform the move when the mouse has crossed half of the items height
|
||||
// When dragging downwards, only move when the cursor is below 50%
|
||||
// When dragging upwards, only move when the cursor is above 50%
|
||||
|
||||
// Dragging downwards
|
||||
if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Dragging upwards
|
||||
if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Time to actually perform the action
|
||||
props.onMoveLabel?.(dragIndex, hoverIndex);
|
||||
|
||||
// Note: we're mutating the monitor item here!
|
||||
// Generally it's better to avoid mutations,
|
||||
// but it's good here for the sake of performance
|
||||
// to avoid expensive index searches.
|
||||
// eslint-disable-next-line no-param-reassign
|
||||
monitor.getItem().index = hoverIndex;
|
||||
},
|
||||
drop(props: Record<string, any>) {
|
||||
return props.onDropLabel?.();
|
||||
},
|
||||
};
|
||||
interface DragItem {
|
||||
index: number;
|
||||
type: string;
|
||||
}
|
||||
|
||||
export const OptionControlLabel = ({
|
||||
label,
|
||||
savedMetric,
|
||||
onRemove,
|
||||
onMoveLabel,
|
||||
onDropLabel,
|
||||
isAdhoc,
|
||||
isFunction,
|
||||
isDraggable,
|
||||
connectDragSource,
|
||||
connectDropTarget,
|
||||
type,
|
||||
index,
|
||||
...props
|
||||
}: {
|
||||
label: string | React.ReactNode;
|
||||
savedMetric?: savedMetricType;
|
||||
onRemove: () => void;
|
||||
onMoveLabel: (dragIndex: number, hoverIndex: number) => void;
|
||||
onDropLabel: () => void;
|
||||
isAdhoc?: boolean;
|
||||
isFunction?: boolean;
|
||||
isDraggable?: boolean;
|
||||
connectDragSource?: any;
|
||||
connectDropTarget?: any;
|
||||
type: string;
|
||||
index: number;
|
||||
}) => {
|
||||
const theme = useTheme();
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
const [, drop] = useDrop({
|
||||
accept: type,
|
||||
drop() {
|
||||
onDropLabel?.();
|
||||
},
|
||||
hover(item: DragItem, monitor: DropTargetMonitor) {
|
||||
if (!ref.current) {
|
||||
return;
|
||||
}
|
||||
const dragIndex = item.index;
|
||||
const hoverIndex = index;
|
||||
// Don't replace items with themselves
|
||||
if (dragIndex === hoverIndex) {
|
||||
return;
|
||||
}
|
||||
// Determine rectangle on screen
|
||||
const hoverBoundingRect = ref.current?.getBoundingClientRect();
|
||||
// Get vertical middle
|
||||
const hoverMiddleY =
|
||||
(hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;
|
||||
// Determine mouse position
|
||||
const clientOffset = monitor.getClientOffset();
|
||||
// Get pixels to the top
|
||||
const hoverClientY = clientOffset?.y
|
||||
? clientOffset?.y - hoverBoundingRect.top
|
||||
: 0;
|
||||
// Only perform the move when the mouse has crossed half of the items height
|
||||
// When dragging downwards, only move when the cursor is below 50%
|
||||
// When dragging upwards, only move when the cursor is above 50%
|
||||
// Dragging downwards
|
||||
if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {
|
||||
return;
|
||||
}
|
||||
// Dragging upwards
|
||||
if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {
|
||||
return;
|
||||
}
|
||||
// Time to actually perform the action
|
||||
onMoveLabel?.(dragIndex, hoverIndex);
|
||||
// Note: we're mutating the monitor item here!
|
||||
// Generally it's better to avoid mutations,
|
||||
// but it's good here for the sake of performance
|
||||
// to avoid expensive index searches.
|
||||
// eslint-disable-next-line no-param-reassign
|
||||
item.index = hoverIndex;
|
||||
},
|
||||
});
|
||||
const [, drag] = useDrag({
|
||||
item: { type, index },
|
||||
collect: monitor => ({
|
||||
isDragging: monitor.isDragging(),
|
||||
}),
|
||||
});
|
||||
|
||||
const getLabelContent = () => {
|
||||
if (savedMetric?.metric_name) {
|
||||
// add column_name to fix typescript error
|
||||
@@ -252,28 +243,6 @@ export const OptionControlLabel = ({
|
||||
</OptionControlContainer>
|
||||
);
|
||||
|
||||
return (
|
||||
<DragContainer>
|
||||
{isDraggable
|
||||
? connectDragSource(
|
||||
connectDropTarget(<div>{getOptionControlContent()}</div>),
|
||||
)
|
||||
: getOptionControlContent()}
|
||||
</DragContainer>
|
||||
);
|
||||
drag(drop(ref));
|
||||
return <DragContainer ref={ref}>{getOptionControlContent()}</DragContainer>;
|
||||
};
|
||||
|
||||
export const DraggableOptionControlLabel = DropTarget(
|
||||
TYPE,
|
||||
labelTarget,
|
||||
(connect: any) => ({
|
||||
connectDropTarget: connect.dropTarget(),
|
||||
}),
|
||||
)(
|
||||
DragSource(TYPE, labelSource, (connect: any) => ({
|
||||
connectDragSource: connect.dragSource(),
|
||||
isDraggable: true,
|
||||
}))(OptionControlLabel),
|
||||
);
|
||||
|
||||
DraggableOptionControlLabel.displayName = 'DraggableOptionControlLabel';
|
||||
|
||||
@@ -34,7 +34,6 @@ import {
|
||||
LabelsContainer,
|
||||
} from 'src/explore/components/OptionControls';
|
||||
import Icon from 'src/components/Icon';
|
||||
import DndWithHTML5Backend from 'src/explore/DndContextProvider';
|
||||
import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
|
||||
import AdhocFilterOption from './AdhocFilterOption';
|
||||
import AdhocFilter, { CLAUSES, EXPRESSION_TYPES } from './AdhocFilter';
|
||||
@@ -362,4 +361,4 @@ class AdhocFilterControl extends React.Component {
|
||||
AdhocFilterControl.propTypes = propTypes;
|
||||
AdhocFilterControl.defaultProps = defaultProps;
|
||||
|
||||
export default DndWithHTML5Backend(withTheme(AdhocFilterControl));
|
||||
export default withTheme(AdhocFilterControl);
|
||||
|
||||
@@ -20,7 +20,7 @@ import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import columnType from 'src/explore/propTypes/columnType';
|
||||
import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
|
||||
import { DraggableOptionControlLabel } from 'src/explore/components/OptionControls';
|
||||
import { OptionControlLabel } from 'src/explore/components/OptionControls';
|
||||
import { OPTION_TYPES } from 'src/explore/components/optionTypes';
|
||||
import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
|
||||
import AdhocFilter from './AdhocFilter';
|
||||
@@ -61,7 +61,7 @@ const AdhocFilterOption = ({
|
||||
onFilterEdit={onFilterEdit}
|
||||
partitionColumn={partitionColumn}
|
||||
>
|
||||
<DraggableOptionControlLabel
|
||||
<OptionControlLabel
|
||||
label={adhocFilter.getDefaultLabel()}
|
||||
onRemove={onRemoveFilter}
|
||||
onMoveLabel={onMoveLabel}
|
||||
|
||||
@@ -20,7 +20,7 @@ import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Tooltip } from 'src/common/components/Tooltip';
|
||||
import columnType from 'src/explore/propTypes/columnType';
|
||||
import { DraggableOptionControlLabel } from 'src/explore/components/OptionControls';
|
||||
import { OptionControlLabel } from 'src/explore/components/OptionControls';
|
||||
import { OPTION_TYPES } from 'src/explore/components/optionTypes';
|
||||
import AdhocMetric from './AdhocMetric';
|
||||
import savedMetricType from './savedMetricType';
|
||||
@@ -75,7 +75,7 @@ class AdhocMetricOption extends React.PureComponent {
|
||||
placement="top"
|
||||
title={savedMetric.expression || adhocMetric.label}
|
||||
>
|
||||
<DraggableOptionControlLabel
|
||||
<OptionControlLabel
|
||||
savedMetric={savedMetric}
|
||||
label={adhocMetric.label}
|
||||
onRemove={this.onRemoveMetric}
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import columnType from 'src/explore/propTypes/columnType';
|
||||
import { DraggableOptionControlLabel } from 'src/explore/components/OptionControls';
|
||||
import { OptionControlLabel } from 'src/explore/components/OptionControls';
|
||||
import { OPTION_TYPES } from 'src/explore/components/optionTypes';
|
||||
import AdhocMetricOption from './AdhocMetricOption';
|
||||
import AdhocMetric from './AdhocMetric';
|
||||
@@ -83,7 +83,7 @@ export default function MetricDefinitionValue({
|
||||
}
|
||||
if (typeof option === 'string') {
|
||||
return (
|
||||
<DraggableOptionControlLabel
|
||||
<OptionControlLabel
|
||||
label={option}
|
||||
onRemove={onRemoveMetric}
|
||||
onMoveLabel={onMoveLabel}
|
||||
|
||||
@@ -34,7 +34,6 @@ import {
|
||||
HeaderContainer,
|
||||
LabelsContainer,
|
||||
} from 'src/explore/components/OptionControls';
|
||||
import DndWithHTML5Backend from 'src/explore/DndContextProvider';
|
||||
import MetricDefinitionOption from './MetricDefinitionOption';
|
||||
import MetricDefinitionValue from './MetricDefinitionValue';
|
||||
import AdhocMetric from './AdhocMetric';
|
||||
@@ -411,4 +410,4 @@ class MetricsControl extends React.PureComponent {
|
||||
MetricsControl.propTypes = propTypes;
|
||||
MetricsControl.defaultProps = defaultProps;
|
||||
|
||||
export default DndWithHTML5Backend(withTheme(MetricsControl));
|
||||
export default withTheme(MetricsControl);
|
||||
|
||||
Reference in New Issue
Block a user