Skip to content

Commit ad53a4c

Browse files
committed
fix(dashboard): disable drag on input fields during tab reorder
Prevents drag activation when clicking on input/textarea elements, allowing users to edit tab titles without accidentally triggering drag-and-drop reordering
1 parent c31224c commit ad53a4c

File tree

1 file changed

+30
-1
lines changed
  • superset-frontend/src/dashboard/components/gridComponents/TabsRenderer

1 file changed

+30
-1
lines changed

superset-frontend/src/dashboard/components/gridComponents/TabsRenderer/TabsRenderer.tsx

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,36 @@ import {
3737
useSensor,
3838
closestCenter,
3939
} from '@dnd-kit/core';
40+
41+
const isInteractiveElement = (element: HTMLElement | null): boolean => {
42+
if (!element) return false;
43+
const tagName = element.tagName.toUpperCase();
44+
if (
45+
tagName === 'INPUT' ||
46+
tagName === 'TEXTAREA' ||
47+
element.isContentEditable
48+
) {
49+
return true;
50+
}
51+
return isInteractiveElement(element.parentElement);
52+
};
53+
54+
PointerSensor.activators = [
55+
{
56+
eventName: 'onPointerDown' as const,
57+
handler: ({ nativeEvent: event }, { onActivation }) => {
58+
if (
59+
event.button !== 0 ||
60+
isInteractiveElement(event.target as HTMLElement)
61+
) {
62+
return false;
63+
}
64+
onActivation?.({ event });
65+
return true;
66+
},
67+
},
68+
];
69+
4070
import {
4171
horizontalListSortingStrategy,
4272
SortableContext,
@@ -235,7 +265,6 @@ const TabsRenderer = memo<TabsRendererProps>(
235265
type={editMode ? 'editable-card' : 'card'}
236266
items={tabItems}
237267
tabBarStyle={{ paddingLeft: tabBarPaddingLeft }}
238-
fullHeight
239268
{...(editMode && {
240269
renderTabBar: (tabBarProps, DefaultTabBar) => (
241270
<DndContext

0 commit comments

Comments
 (0)