mirror of
https://github.com/apache/superset.git
synced 2024-09-11 16:19:43 -04:00
fix: Switch tab on drag hover (#21648)
This commit is contained in:
parent
6af35a7d98
commit
b2a360fa14
@ -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,
|
||||
|
@ -40,6 +40,8 @@ function handleHover(props, monitor, Component) {
|
||||
return;
|
||||
}
|
||||
|
||||
Component?.props?.onHover();
|
||||
|
||||
Component.setState(() => ({
|
||||
dropIndicator: dropPosition,
|
||||
}));
|
||||
|
@ -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 }) => (
|
||||
|
@ -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)
|
||||
|
Loading…
Reference in New Issue
Block a user