From e42036485fd7fe19c8536ba3fd59573ebf592349 Mon Sep 17 00:00:00 2001
From: Julius Marminge <julius0216@outlook.com>
Date: Mon, 9 Mar 2026 14:25:06 -0700
Subject: [PATCH] Improve project drag collision detection in sidebar

- Prefer pointer-based hit testing during project reordering
- Fall back to corner-based collision to make drop targeting more reliable
---
 apps/web/src/components/Sidebar.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/components/Sidebar.tsx b/apps/web/src/components/Sidebar.tsx
index dd7171e4aba9530e56633dd3a626c1648cf8a553..78173ae9c01dd52591fb9550bdbb1f92d7ce81fd 100644
--- a/apps/web/src/components/Sidebar.tsx
+++ b/apps/web/src/components/Sidebar.tsx
@@ -14,9 +14,11 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   DndContext,
   type DragCancelEvent,
+  type CollisionDetection,
   PointerSensor,
   type DragStartEvent,
-  closestCenter,
+  closestCorners,
+  pointerWithin,
   useSensor,
   useSensors,
   type DragEndEvent,
@@ -841,6 +843,14 @@ export default function Sidebar() {
       activationConstraint: { distance: 6 },
     }),
   );
+  const projectCollisionDetection = useCallback<CollisionDetection>((args) => {
+    const pointerCollisions = pointerWithin(args);
+    if (pointerCollisions.length > 0) {
+      return pointerCollisions;
+    }
+
+    return closestCorners(args);
+  }, []);
 
   const handleProjectDragEnd = useCallback(
     (event: DragEndEvent) => {
@@ -1241,7 +1251,7 @@ export default function Sidebar() {
 
           <DndContext
             sensors={projectDnDSensors}
-            collisionDetection={closestCenter}
+            collisionDetection={projectCollisionDetection}
             modifiers={[restrictToVerticalAxis, restrictToParentElement]}
             onDragStart={handleProjectDragStart}
             onDragEnd={handleProjectDragEnd}
-- 
2.54.0