Hartmut/CapaKraken
1
0
Fork 0
Code Issues 10 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

refactor(web): extract drag position helpers

Browse Source
This commit is contained in:
Hartmut Nörenberg
2026-04-01 11:18:31 +02:00
parent 3fe3a5fb2a
commit 5402189158
5 changed files with 250 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/hooks/useTimelineDrag.ts
+14 -56
View File
@@ -3,7 +3,7 @@
import { useCallback, useEffect, useRef, useState, type MutableRefObject } from "react";
import { trpc } from "~/lib/trpc/client.js";
import { useInvalidateTimeline } from "./useInvalidatePlanningViews.js";
import { pixelsToDays, computeDragDates } from "~/components/timeline/dragMath.js";
import { pixelsToDays } from "~/components/timeline/dragMath.js";
import {
captureLivePreviewTargets,
clearLivePreview,
@@ -21,6 +21,7 @@ import {
import { resolveAllocationRelease } from "./timelineAllocationRelease.js";
import { createAllocationDragState } from "./timelineAllocationDragState.js";
import { cleanupTimelineDragState } from "./timelineDragCleanup.js";
import { resolveAllocationDragPosition, resolveProjectDragPosition } from "./timelineDragPosition.js";
import { attachDocumentMouseDrag } from "./timelineDocumentDrag.js";
import { buildProjectShiftMutationInput, createProjectDragState } from "./timelineProjectDrag.js";
import { beginProjectDragSession } from "./timelineProjectDragSession.js";
@@ -343,35 +344,14 @@ export function useTimelineDrag({
const updateProjectDragPosition = useCallback(
(clientX: number) => {
const drag = dragStateRef.current;
if (!drag.isDragging || !drag.originalStartDate || !drag.originalEndDate) return false;
const result = resolveProjectDragPosition(dragStateRef.current, clientX, cellWidthRef.current);
if (!result.handled) return false;
const deltaX = clientX - drag.startMouseX;
const daysDelta = pixelsToDays(deltaX, cellWidthRef.current);
updateLivePreview(projectPreviewRef, deltaX, daysDelta);
if (daysDelta === drag.daysDelta) {
if (deltaX !== drag.pointerDeltaX) {
dragStateRef.current = { ...drag, pointerDeltaX: deltaX };
}
return true;
updateLivePreview(projectPreviewRef, result.pointerDeltaX, result.daysDelta);
dragStateRef.current = result.nextState;
if (result.shouldSyncState) {
setDragState(result.nextState);
}
const { start: newStart, end: newEnd } = computeDragDates(
"move",
drag.originalStartDate,
drag.originalEndDate,
daysDelta,
);
const updated: DragState = {
...drag,
currentStartDate: newStart,
currentEndDate: newEnd,
pointerDeltaX: deltaX,
daysDelta,
};
dragStateRef.current = updated;
setDragState(updated);
return true;
},
[updateLivePreview],
@@ -379,36 +359,14 @@ export function useTimelineDrag({
const updateAllocationDragPosition = useCallback(
(clientX: number) => {
const alloc = allocDragRef.current;
if (!alloc.isActive || !alloc.originalStartDate || !alloc.originalEndDate) return false;
const result = resolveAllocationDragPosition(allocDragRef.current, clientX, cellWidthRef.current);
if (!result.handled) return false;
const pointerDeltaX = clientX - alloc.startMouseX;
const daysDelta = pixelsToDays(pointerDeltaX, cellWidthRef.current);
updateLivePreview(allocPreviewRef, pointerDeltaX, daysDelta);
if (daysDelta === alloc.daysDelta) {
if (pointerDeltaX !== alloc.pointerDeltaX) {
allocDragRef.current = { ...alloc, pointerDeltaX };
}
return true;
updateLivePreview(allocPreviewRef, result.pointerDeltaX, result.daysDelta);
allocDragRef.current = result.nextState;
if (result.shouldSyncState) {
setAllocDragState(result.nextState);
}
const { start: newStart, end: newEnd } = computeDragDates(
alloc.mode,
alloc.originalStartDate,
alloc.originalEndDate,
daysDelta,
);
const updated: AllocDragState = {
...alloc,
currentStartDate: newStart,
currentEndDate: newEnd,
pointerDeltaX,
daysDelta,
};
allocDragRef.current = updated;
setAllocDragState(updated);
return true;
},
[updateLivePreview],