From 78f8562457d86feb2efb389790e57bf8ebb2c300 Mon Sep 17 00:00:00 2001
From: nitin <142569587+ehconitin@users.noreply.github.com>
Date: Tue, 27 May 2025 18:21:48 +0530
Subject: [PATCH] fix: prevent drag selection from blocking input focus
 (#12322)

closes #12309
Fixes input elements becoming unusable due to drag selection preventing
default browser behavior.

**Problem:**
- Input elements couldn't receive focus because `event.preventDefault()`
was called unconditionally
- Removing `preventDefault()` broke click-outside-to-deselect
functionality

**Solution:**
- Only call `preventDefault()` when actually starting drag selection
- Preserves input focus while maintaining drag selection and deselection
behavior

**Changes:**
- Move `event.preventDefault()` inside the `shouldStartSelecting`
condition
- Update test to reflect correct behavior for disabled elements
---
 .../drag-select/components/DragSelect.tsx     |  2 +-
 .../components/__tests__/DragSelect.test.tsx  | 22 +++++++++++++++++++
 2 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx b/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx
index 4b899b954..656e937b3 100644
--- a/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx
+++ b/packages/twenty-front/src/modules/ui/utilities/drag-select/components/DragSelect.tsx
@@ -101,8 +101,8 @@ export const DragSelect = ({
           width: 0,
           height: 0,
         });
+        event.preventDefault();
       }
-      event.preventDefault();
     },
     onMouseMove: ({ x, y, event }) => {
       if (isDragging) {
diff --git a/packages/twenty-front/src/modules/ui/utilities/drag-select/components/__tests__/DragSelect.test.tsx b/packages/twenty-front/src/modules/ui/utilities/drag-select/components/__tests__/DragSelect.test.tsx
index 579dc1750..593904605 100644
--- a/packages/twenty-front/src/modules/ui/utilities/drag-select/components/__tests__/DragSelect.test.tsx
+++ b/packages/twenty-front/src/modules/ui/utilities/drag-select/components/__tests__/DragSelect.test.tsx
@@ -76,6 +76,28 @@ describe('DragSelect', () => {
       event: mockEvent,
     });
 
+    expect(mockEvent.preventDefault).not.toHaveBeenCalled();
+  });
+
+  it('should start selection and call preventDefault on regular elements', () => {
+    renderDragSelect();
+
+    const callbacks = (window as any).trackPointerCallbacks;
+    const mockTarget = document.createElement('div');
+    mockSelectableContainer.appendChild(mockTarget);
+    mockSelectableContainer.contains = jest.fn().mockReturnValue(true);
+
+    const mockEvent = {
+      target: mockTarget,
+      preventDefault: jest.fn(),
+    };
+
+    callbacks.onMouseDown({
+      x: 150,
+      y: 150,
+      event: mockEvent,
+    });
+
     expect(mockEvent.preventDefault).toHaveBeenCalled();
   });