refactor(web): extract project drag session

apps/web/src/hooks/useTimelineDrag.ts

@@ -23,6 +23,7 @@ import { createAllocationDragState } from "./timelineAllocationDragState.js";
 import { cleanupTimelineDragState } from "./timelineDragCleanup.js";
 import { attachDocumentMouseDrag } from "./timelineDocumentDrag.js";
 import { buildProjectShiftMutationInput, createProjectDragState } from "./timelineProjectDrag.js";
+import { beginProjectDragSession } from "./timelineProjectDragSession.js";
 import {
   completeMultiSelectDraft,
   createMultiSelectState,
@@ -550,24 +551,19 @@ export function useTimelineDrag({
         endDate: opts.endDate,
         startMouseX: e.clientX,
       });
-      dragStateRef.current = state;
-      setDragState(state);
-
       setProjectPreviewTargets(opts.projectId, e.currentTarget);
-      projectDragCleanupRef.current?.();
-
-      function handleMove(ev: MouseEvent) {
-        updateProjectDragPosition(ev.clientX);
-      }
-
-      function handleUp(ev: MouseEvent) {
-        projectDragCleanupRef.current?.();
-        projectDragCleanupRef.current = null;
-        void finalizeProjectDrag(ev.clientX);
-        ev.preventDefault();
-      }
-
-      projectDragCleanupRef.current = attachDocumentMouseDrag(document, handleMove, handleUp);
+      beginProjectDragSession({
+        state,
+        cleanupRef: projectDragCleanupRef,
+        stateRef: dragStateRef,
+        setState: setDragState,
+        documentTarget: document,
+        attachDrag: attachDocumentMouseDrag,
+        updatePosition: updateProjectDragPosition,
+        finalize: (clientX) => {
+          void finalizeProjectDrag(clientX);
+        },
+      });
     },
     [finalizeProjectDrag, setProjectPreviewTargets, updateProjectDragPosition],
   );