You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by mi...@apache.org on 2022/09/30 11:09:17 UTC
[superset] branch master updated: fix: Switch tab on drag hover (#21648)
This is an automated email from the ASF dual-hosted git repository.
michaelsmolina pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new b2a360fa14 fix: Switch tab on drag hover (#21648)
b2a360fa14 is described below
commit b2a360fa14046e384e48ed6273f42eef394ad005
Author: Michael S. Molina <70...@users.noreply.github.com>
AuthorDate: Fri Sep 30 08:09:05 2022 -0300
fix: Switch tab on drag hover (#21648)
---
.../src/dashboard/components/dnd/DragDroppable.jsx | 2 ++
superset-frontend/src/dashboard/components/dnd/handleHover.js | 2 ++
.../src/dashboard/components/gridComponents/Tab.jsx | 10 ++++++++++
.../src/dashboard/components/gridComponents/Tabs.jsx | 1 +
4 files changed, 15 insertions(+)
diff --git a/superset-frontend/src/dashboard/components/dnd/DragDroppable.jsx b/superset-frontend/src/dashboard/components/dnd/DragDroppable.jsx
index b9c287c225..8556c9ecab 100644
--- a/superset-frontend/src/dashboard/components/dnd/DragDroppable.jsx
+++ b/superset-frontend/src/dashboard/components/dnd/DragDroppable.jsx
@@ -42,6 +42,7 @@ const propTypes = {
index: PropTypes.number.isRequired,
style: PropTypes.object,
onDrop: PropTypes.func,
+ onHover: PropTypes.func,
editMode: PropTypes.bool.isRequired,
useEmptyDragPreview: PropTypes.bool,
@@ -61,6 +62,7 @@ const defaultProps = {
disableDragDrop: false,
children() {},
onDrop() {},
+ onHover() {},
orientation: 'row',
useEmptyDragPreview: false,
isDragging: false,
diff --git a/superset-frontend/src/dashboard/components/dnd/handleHover.js b/superset-frontend/src/dashboard/components/dnd/handleHover.js
index 71862a66c5..e709b6e3e5 100644
--- a/superset-frontend/src/dashboard/components/dnd/handleHover.js
+++ b/superset-frontend/src/dashboard/components/dnd/handleHover.js
@@ -40,6 +40,8 @@ function handleHover(props, monitor, Component) {
return;
}
+ Component?.props?.onHover();
+
Component.setState(() => ({
dropIndicator: dropPosition,
}));
diff --git a/superset-frontend/src/dashboard/components/gridComponents/Tab.jsx b/superset-frontend/src/dashboard/components/gridComponents/Tab.jsx
index d8312cd60a..32ac77936c 100644
--- a/superset-frontend/src/dashboard/components/gridComponents/Tab.jsx
+++ b/superset-frontend/src/dashboard/components/gridComponents/Tab.jsx
@@ -43,6 +43,7 @@ const propTypes = {
depth: PropTypes.number.isRequired,
renderType: PropTypes.oneOf([RENDER_TAB, RENDER_TAB_CONTENT]).isRequired,
onDropOnTab: PropTypes.func,
+ onHoverTab: PropTypes.func,
editMode: PropTypes.bool.isRequired,
canEdit: PropTypes.bool.isRequired,
@@ -64,6 +65,7 @@ const defaultProps = {
availableColumnCount: 0,
columnWidth: 0,
onDropOnTab() {},
+ onHoverTab() {},
onResizeStart() {},
onResize() {},
onResizeStop() {},
@@ -95,6 +97,7 @@ class Tab extends React.PureComponent {
super(props);
this.handleChangeText = this.handleChangeText.bind(this);
this.handleDrop = this.handleDrop.bind(this);
+ this.handleOnHover = this.handleOnHover.bind(this);
this.handleTopDropTargetDrop = this.handleTopDropTargetDrop.bind(this);
this.handleChangeTab = this.handleChangeTab.bind(this);
}
@@ -123,6 +126,10 @@ class Tab extends React.PureComponent {
this.props.onDropOnTab(dropResult);
}
+ handleOnHover() {
+ this.props.onHoverTab();
+ }
+
handleTopDropTargetDrop(dropResult) {
if (dropResult) {
this.props.handleComponentDrop({
@@ -216,6 +223,7 @@ class Tab extends React.PureComponent {
depth={depth} // see isValidChild.js for why tabs don't increment child depth
index={componentIndex}
onDrop={this.handleDrop}
+ onHover={this.handleOnHover}
availableColumnCount={availableColumnCount}
columnWidth={columnWidth}
onResizeStart={onResizeStart}
@@ -234,6 +242,7 @@ class Tab extends React.PureComponent {
index={tabComponent.children.length}
depth={depth}
onDrop={this.handleDrop}
+ onHover={this.handleOnHover}
editMode
className="empty-droptarget"
>
@@ -263,6 +272,7 @@ class Tab extends React.PureComponent {
index={index}
depth={depth}
onDrop={this.handleDrop}
+ onHover={this.handleOnHover}
editMode={editMode}
>
{({ dropIndicatorProps, dragSourceRef }) => (
diff --git a/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx b/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx
index edb922a397..bfbaf94bda 100644
--- a/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx
+++ b/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx
@@ -388,6 +388,7 @@ export class Tabs extends React.PureComponent {
availableColumnCount={availableColumnCount}
columnWidth={columnWidth}
onDropOnTab={this.handleDropOnTab}
+ onHoverTab={() => this.handleClickTab(tabIndex)}
isFocused={activeKey === tabId}
isHighlighted={
activeKey !== tabId && tabsToHighlight?.includes(tabId)