WEBDIENSTE/openswarm
1
0
Fork 0
mirror of https://github.com/openswarm-ai/openswarm.git synced 2026-09-08 02:37:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: stop dashboard select-mode from leaking onto other pages

Browse Source 
Dashboard stays mounted (visibility-hidden) behind every other route, so its ElementSelectionProvider and portal-rendered SelectionOverlay kept firing on top of the App Builder. Gate both the overlay render and the global mouse listeners in useDomElementSelector on useDashboardActive, leaving selection state untouched so it restores on return.
This commit is contained in:
Aidan
2026-06-10 17:14:37 -07:00
committed by GitHub
parent ee0cf13b71
commit ea2f1c36c5
2 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/components/editor/useDomElementSelector.ts
+4 -2
View File
@@ -1,5 +1,6 @@
import { useEffect, useRef, useState, useCallback } from 'react';
import { SelectedElement, useElementSelection } from './ElementSelectionContext';
import { useDashboardActive } from '@/shared/hooks/useDashboardActive';
const SELECT_ATTR = 'data-select-type';
const SELECT_ID_ATTR = 'data-select-id';
@@ -110,6 +111,7 @@ export interface DomSelectorState {
export function useDomElementSelector(): DomSelectorState {
const ctx = useElementSelection();
const active = useDashboardActive();
const [overlay, setOverlay] = useState<OverlayState>(EMPTY_OVERLAY);
const [dragRect, setDragRect] = useState<DragRect>(EMPTY_DRAG);
const [dragPreview, setDragPreview] = useState<DragPreviewElement[]>([]);
@@ -330,7 +332,7 @@ export function useDomElementSelector(): DomSelectorState {
}, [ctx]);
useEffect(() => {
if (!ctx?.selectMode) {
if (!ctx?.selectMode || !active) {
setOverlay(EMPTY_OVERLAY);
setDragRect(EMPTY_DRAG);
setDragPreview([]);
@@ -369,7 +371,7 @@ export function useDomElementSelector(): DomSelectorState {
// Defensive: if select mode flips off mid-drag, drop the class so webviews regain interactivity.
document.body.classList.remove('dashboard-marquee-active');
};
}, [ctx?.selectMode, handleMouseMove, handleMouseDown, handleMouseUp, handleClick]);
}, [ctx?.selectMode, active, handleMouseMove, handleMouseDown, handleMouseUp, handleClick]);
return { overlay, dragRect, dragPreview };
}
frontend/src/app/pages/Dashboard/Dashboard.tsx
+3
View File
@@ -2,11 +2,14 @@ import React from 'react';
import SelectionOverlay from '@/app/components/editor/SelectionOverlay';
import { ElementSelectionProvider } from '@/app/components/editor/ElementSelectionContext';
import { useDomElementSelector } from '@/app/components/editor/useDomElementSelector';
import { useDashboardActive } from '@/shared/hooks/useDashboardActive';
import { useDashboardController } from './hooks/state/useDashboardController';
import DashboardCanvas from './canvas/DashboardCanvas';
const DashboardSelectionOverlay: React.FC = () => {
const active = useDashboardActive();
const { overlay, dragRect, dragPreview } = useDomElementSelector();
if (!active) return null;
return <SelectionOverlay overlay={overlay} dragRect={dragRect} dragPreview={dragPreview} />;
};