fix(refboard): drag-drop opening in new tab — use ref for drop target
The drag/drop setup was searching for a <canvas> element to find its parent, which was fragile and could fail (returning null). When it failed, document-level dragover/drop prevention was never registered, so the browser's default behavior (open file in new tab) kicked in. Fix: pass a direct ref to the outer canvas container div from Editor to useCanvasSetup. No more DOM querying for the drop target.
This commit is contained in:
@@ -59,6 +59,7 @@ export default function Editor({ isPublicView }: EditorProps) {
|
||||
const toolCleanupRef = useRef<(() => void) | null>(null);
|
||||
const inboxZoneRef = useRef<InboxZone | null>(null);
|
||||
const clipboardRef = useRef<SceneItem[]>([]);
|
||||
const canvasContainerRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
// UI state
|
||||
const [activeTool, setActiveTool] = useState<ToolType>(ToolType.SELECT);
|
||||
@@ -136,7 +137,7 @@ export default function Editor({ isPublicView }: EditorProps) {
|
||||
// Canvas setup (selection, undo, sync, socket, drag/drop, paste, inbox)
|
||||
useCanvasSetup({
|
||||
boardData, resolvedBoardId, user, isPublicView,
|
||||
canvasRef, selectionRef, undoRef, syncRef, inboxZoneRef,
|
||||
canvasRef, selectionRef, undoRef, syncRef, inboxZoneRef, canvasContainerRef,
|
||||
onCanvasChange, showToast, setOnlineUsers, setSelectedLayerIds,
|
||||
});
|
||||
|
||||
@@ -473,7 +474,7 @@ export default function Editor({ isPublicView }: EditorProps) {
|
||||
/>}
|
||||
|
||||
{/* Canvas */}
|
||||
<div style={{ flex: 1, position: 'relative', overflow: 'hidden', background: '#1e1e1e' }} onContextMenu={handleContextMenu}>
|
||||
<div ref={canvasContainerRef} style={{ flex: 1, position: 'relative', overflow: 'hidden', background: '#1e1e1e' }} onContextMenu={handleContextMenu}>
|
||||
{/* Dot grid — behind transparent canvas */}
|
||||
{showGrid && (() => {
|
||||
const scale = canvasTransform[0] || 1;
|
||||
|
||||
Reference in New Issue
Block a user