654 lines
22 KiB
TypeScript
654 lines
22 KiB
TypeScript
"use client";
|
|
|
|
import { useCallback, useRef, useState } from "react";
|
|
import { trpc } from "~/lib/trpc/client.js";
|
|
|
|
// ─── Project-shift drag state ───────────────────────────────────────────────
|
|
|
|
export interface DragState {
|
|
isDragging: boolean;
|
|
projectId: string | null;
|
|
projectName: string | null;
|
|
allocationId: string | null;
|
|
originalStartDate: Date | null;
|
|
originalEndDate: Date | null;
|
|
currentStartDate: Date | null;
|
|
currentEndDate: Date | null;
|
|
startMouseX: number;
|
|
originalLeft: number;
|
|
blockWidth: number;
|
|
daysDelta: number;
|
|
}
|
|
|
|
export interface BlockClickInfo {
|
|
allocationId: string;
|
|
projectId: string;
|
|
projectName: string;
|
|
startDate: Date;
|
|
endDate: Date;
|
|
}
|
|
|
|
export interface ShiftPreviewData {
|
|
valid: boolean;
|
|
deltaCents: number;
|
|
wouldExceedBudget: boolean;
|
|
budgetUtilizationAfter: number;
|
|
conflictCount: number;
|
|
errors: string[];
|
|
warnings: string[];
|
|
}
|
|
|
|
const INITIAL_DRAG_STATE: DragState = {
|
|
isDragging: false,
|
|
projectId: null,
|
|
projectName: null,
|
|
allocationId: null,
|
|
originalStartDate: null,
|
|
originalEndDate: null,
|
|
currentStartDate: null,
|
|
currentEndDate: null,
|
|
startMouseX: 0,
|
|
originalLeft: 0,
|
|
blockWidth: 0,
|
|
daysDelta: 0,
|
|
};
|
|
|
|
// ─── Per-allocation drag state ──────────────────────────────────────────────
|
|
|
|
export type AllocDragMode = "move" | "resize-start" | "resize-end";
|
|
|
|
export interface AllocDragState {
|
|
isActive: boolean;
|
|
mode: AllocDragMode;
|
|
allocationId: string | null;
|
|
mutationAllocationId: string | null;
|
|
projectId: string | null;
|
|
projectName: string | null;
|
|
resourceId: string | null;
|
|
originalStartDate: Date | null;
|
|
originalEndDate: Date | null;
|
|
currentStartDate: Date | null;
|
|
currentEndDate: Date | null;
|
|
startMouseX: number;
|
|
daysDelta: number;
|
|
}
|
|
|
|
const INITIAL_ALLOC_DRAG: AllocDragState = {
|
|
isActive: false,
|
|
mode: "move",
|
|
allocationId: null,
|
|
mutationAllocationId: null,
|
|
projectId: null,
|
|
projectName: null,
|
|
resourceId: null,
|
|
originalStartDate: null,
|
|
originalEndDate: null,
|
|
currentStartDate: null,
|
|
currentEndDate: null,
|
|
startMouseX: 0,
|
|
daysDelta: 0,
|
|
};
|
|
|
|
// ─── Range-select state ─────────────────────────────────────────────────────
|
|
|
|
export interface RangeState {
|
|
isSelecting: boolean;
|
|
resourceId: string | null;
|
|
startDate: Date | null;
|
|
currentDate: Date | null;
|
|
suggestedProjectId: string | null;
|
|
startClientX: number;
|
|
}
|
|
|
|
export interface RangeSelectedInfo {
|
|
resourceId: string;
|
|
startDate: Date;
|
|
endDate: Date;
|
|
suggestedProjectId: string | null;
|
|
anchorX: number;
|
|
anchorY: number;
|
|
}
|
|
|
|
const INITIAL_RANGE_STATE: RangeState = {
|
|
isSelecting: false,
|
|
resourceId: null,
|
|
startDate: null,
|
|
currentDate: null,
|
|
suggestedProjectId: null,
|
|
startClientX: 0,
|
|
};
|
|
|
|
// ─── Hook ───────────────────────────────────────────────────────────────────
|
|
|
|
export interface AllocationMovedSnapshot {
|
|
allocationId: string;
|
|
mutationAllocationId: string;
|
|
projectName: string;
|
|
before: { startDate: Date; endDate: Date };
|
|
after: { startDate: Date; endDate: Date };
|
|
}
|
|
|
|
export function useTimelineDrag({
|
|
cellWidth,
|
|
onShiftApplied,
|
|
onBlockClick,
|
|
onRangeSelected,
|
|
onAllocationMoved,
|
|
}: {
|
|
cellWidth: number;
|
|
onShiftApplied?: (projectId: string) => void;
|
|
onBlockClick?: (info: BlockClickInfo) => void;
|
|
onRangeSelected?: (info: RangeSelectedInfo) => void;
|
|
onAllocationMoved?: (snapshot: AllocationMovedSnapshot) => void;
|
|
}) {
|
|
const [dragState, setDragState] = useState<DragState>(INITIAL_DRAG_STATE);
|
|
const [allocDragState, setAllocDragState] = useState<AllocDragState>(INITIAL_ALLOC_DRAG);
|
|
const [rangeState, setRangeState] = useState<RangeState>(INITIAL_RANGE_STATE);
|
|
|
|
const dragStateRef = useRef<DragState>(INITIAL_DRAG_STATE);
|
|
const allocDragRef = useRef<AllocDragState>(INITIAL_ALLOC_DRAG);
|
|
const rangeStateRef = useRef<RangeState>(INITIAL_RANGE_STATE);
|
|
|
|
// Keep always-current refs for values used inside document event handlers
|
|
const cellWidthRef = useRef(cellWidth);
|
|
cellWidthRef.current = cellWidth;
|
|
|
|
// Touch disambiguation: track initial touch position to distinguish horizontal drag from vertical scroll
|
|
const touchStartRef = useRef<{ x: number; y: number; decided: boolean }>({ x: 0, y: 0, decided: false });
|
|
|
|
const onBlockClickRef = useRef(onBlockClick);
|
|
onBlockClickRef.current = onBlockClick;
|
|
|
|
const onAllocationMovedRef = useRef(onAllocationMoved);
|
|
onAllocationMovedRef.current = onAllocationMoved;
|
|
|
|
const utils = trpc.useUtils();
|
|
|
|
// Project-shift preview
|
|
const { data: previewData, isFetching: isPreviewLoading } = trpc.timeline.previewShift.useQuery(
|
|
{
|
|
projectId: dragState.projectId ?? "",
|
|
newStartDate: dragState.currentStartDate ?? new Date(),
|
|
newEndDate: dragState.currentEndDate ?? new Date(),
|
|
},
|
|
{
|
|
enabled:
|
|
dragState.isDragging &&
|
|
dragState.projectId !== null &&
|
|
dragState.daysDelta !== 0 &&
|
|
dragState.currentStartDate !== null,
|
|
staleTime: 0,
|
|
},
|
|
);
|
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
const applyShiftMutation = (trpc.timeline.applyShift.useMutation as any)({
|
|
onSuccess: (data: { project: { id: string } }) => {
|
|
void utils.timeline.getEntries.invalidate();
|
|
void utils.timeline.getEntriesView.invalidate();
|
|
void utils.timeline.getBudgetStatus.invalidate();
|
|
void utils.project.list.invalidate();
|
|
onShiftApplied?.(data.project.id);
|
|
},
|
|
}) as { isPending: boolean; mutate: (...args: unknown[]) => void; mutateAsync: (...args: unknown[]) => Promise<unknown> };
|
|
|
|
const pendingSnapshotRef = useRef<AllocationMovedSnapshot | null>(null);
|
|
|
|
const updateAllocMutation = trpc.timeline.updateAllocationInline.useMutation({
|
|
onSuccess: () => {
|
|
void utils.timeline.getEntries.invalidate();
|
|
void utils.timeline.getEntriesView.invalidate();
|
|
void utils.timeline.getProjectContext.invalidate();
|
|
void utils.timeline.getBudgetStatus.invalidate();
|
|
const snap = pendingSnapshotRef.current;
|
|
if (snap) {
|
|
onAllocationMovedRef.current?.(snap);
|
|
pendingSnapshotRef.current = null;
|
|
}
|
|
},
|
|
});
|
|
|
|
// ── Project-bar drag (shifts all allocations) ──────────────────────────────
|
|
|
|
const onProjectBarMouseDown = useCallback(
|
|
(e: React.MouseEvent, opts: {
|
|
projectId: string;
|
|
projectName: string;
|
|
startDate: Date;
|
|
endDate: Date;
|
|
}) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
const state: DragState = {
|
|
isDragging: true,
|
|
projectId: opts.projectId,
|
|
projectName: opts.projectName,
|
|
allocationId: null,
|
|
originalStartDate: opts.startDate,
|
|
originalEndDate: opts.endDate,
|
|
currentStartDate: opts.startDate,
|
|
currentEndDate: opts.endDate,
|
|
startMouseX: e.clientX,
|
|
originalLeft: 0,
|
|
blockWidth: 0,
|
|
daysDelta: 0,
|
|
};
|
|
dragStateRef.current = state;
|
|
setDragState(state);
|
|
},
|
|
[],
|
|
);
|
|
|
|
// Legacy — kept for backward compat (triggers project shift from allocation block)
|
|
const onBlockMouseDown = useCallback(
|
|
(e: React.MouseEvent, opts: {
|
|
projectId: string;
|
|
projectName: string;
|
|
allocationId?: string;
|
|
startDate: Date;
|
|
endDate: Date;
|
|
blockLeft: number;
|
|
blockWidth: number;
|
|
}) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
const state: DragState = {
|
|
isDragging: true,
|
|
projectId: opts.projectId,
|
|
projectName: opts.projectName,
|
|
allocationId: opts.allocationId ?? null,
|
|
originalStartDate: opts.startDate,
|
|
originalEndDate: opts.endDate,
|
|
currentStartDate: opts.startDate,
|
|
currentEndDate: opts.endDate,
|
|
startMouseX: e.clientX,
|
|
originalLeft: opts.blockLeft,
|
|
blockWidth: opts.blockWidth,
|
|
daysDelta: 0,
|
|
};
|
|
dragStateRef.current = state;
|
|
setDragState(state);
|
|
},
|
|
[],
|
|
);
|
|
|
|
// ── Per-allocation drag — document-level listeners ─────────────────────────
|
|
//
|
|
// Uses document.addEventListener instead of React canvas events so the drag
|
|
// works reliably even when the cursor leaves the canvas boundary (e.g. while
|
|
// moving quickly or scrolling into the sticky header area).
|
|
|
|
const onAllocMouseDown = useCallback(
|
|
(e: React.MouseEvent, opts: {
|
|
mode: AllocDragMode;
|
|
allocationId: string;
|
|
mutationAllocationId?: string;
|
|
projectId: string;
|
|
projectName: string;
|
|
resourceId: string | null;
|
|
startDate: Date;
|
|
endDate: Date;
|
|
}) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
|
|
const initial: AllocDragState = {
|
|
isActive: true,
|
|
mode: opts.mode,
|
|
allocationId: opts.allocationId,
|
|
mutationAllocationId: opts.mutationAllocationId ?? opts.allocationId,
|
|
projectId: opts.projectId,
|
|
projectName: opts.projectName,
|
|
resourceId: opts.resourceId,
|
|
originalStartDate: opts.startDate,
|
|
originalEndDate: opts.endDate,
|
|
currentStartDate: opts.startDate,
|
|
currentEndDate: opts.endDate,
|
|
startMouseX: e.clientX,
|
|
daysDelta: 0,
|
|
};
|
|
allocDragRef.current = initial;
|
|
setAllocDragState(initial);
|
|
|
|
// ── document handlers ────────────────────────────────────────────────
|
|
|
|
function handleMove(ev: MouseEvent) {
|
|
const alloc = allocDragRef.current;
|
|
if (!alloc.isActive || !alloc.originalStartDate || !alloc.originalEndDate) return;
|
|
|
|
const deltaX = ev.clientX - alloc.startMouseX;
|
|
const daysDelta = Math.round(deltaX / cellWidthRef.current);
|
|
if (daysDelta === alloc.daysDelta) return;
|
|
|
|
const newStart = new Date(alloc.originalStartDate);
|
|
const newEnd = new Date(alloc.originalEndDate);
|
|
|
|
if (alloc.mode === "move") {
|
|
newStart.setDate(newStart.getDate() + daysDelta);
|
|
newEnd.setDate(newEnd.getDate() + daysDelta);
|
|
} else if (alloc.mode === "resize-start") {
|
|
newStart.setDate(newStart.getDate() + daysDelta);
|
|
if (newStart >= newEnd) newStart.setTime(newEnd.getTime() - 86400000);
|
|
} else {
|
|
// resize-end
|
|
newEnd.setDate(newEnd.getDate() + daysDelta);
|
|
if (newEnd <= newStart) newEnd.setTime(newStart.getTime() + 86400000);
|
|
}
|
|
|
|
const updated: AllocDragState = {
|
|
...alloc,
|
|
currentStartDate: newStart,
|
|
currentEndDate: newEnd,
|
|
daysDelta,
|
|
};
|
|
allocDragRef.current = updated;
|
|
setAllocDragState(updated);
|
|
}
|
|
|
|
function handleUp() {
|
|
document.removeEventListener("mousemove", handleMove);
|
|
document.removeEventListener("mouseup", handleUp);
|
|
|
|
const alloc = allocDragRef.current;
|
|
if (!alloc.isActive) return;
|
|
|
|
if (alloc.daysDelta === 0 && alloc.allocationId) {
|
|
// No movement → treat as click, open alloc popover
|
|
onBlockClickRef.current?.({
|
|
allocationId: alloc.allocationId,
|
|
projectId: alloc.projectId ?? "",
|
|
projectName: alloc.projectName ?? "",
|
|
startDate: alloc.originalStartDate!,
|
|
endDate: alloc.originalEndDate!,
|
|
});
|
|
} else if (alloc.allocationId && alloc.currentStartDate && alloc.currentEndDate) {
|
|
pendingSnapshotRef.current = {
|
|
allocationId: alloc.allocationId,
|
|
mutationAllocationId: alloc.mutationAllocationId ?? alloc.allocationId,
|
|
projectName: alloc.projectName ?? "",
|
|
before: { startDate: alloc.originalStartDate!, endDate: alloc.originalEndDate! },
|
|
after: { startDate: alloc.currentStartDate, endDate: alloc.currentEndDate },
|
|
};
|
|
updateAllocMutation.mutate({
|
|
allocationId: alloc.mutationAllocationId ?? alloc.allocationId,
|
|
startDate: alloc.currentStartDate,
|
|
endDate: alloc.currentEndDate,
|
|
});
|
|
}
|
|
|
|
allocDragRef.current = INITIAL_ALLOC_DRAG;
|
|
setAllocDragState(INITIAL_ALLOC_DRAG);
|
|
}
|
|
|
|
document.addEventListener("mousemove", handleMove);
|
|
document.addEventListener("mouseup", handleUp);
|
|
},
|
|
[updateAllocMutation.mutate], // mutate is stable across renders (React Query guarantee)
|
|
);
|
|
|
|
// ── Range-select ────────────────────────────────────────────────────────────
|
|
|
|
const onRowMouseDown = useCallback(
|
|
(e: React.MouseEvent, opts: {
|
|
resourceId: string;
|
|
startDate: Date;
|
|
suggestedProjectId?: string;
|
|
}) => {
|
|
if (dragStateRef.current.isDragging || allocDragRef.current.isActive) return;
|
|
e.preventDefault();
|
|
const state: RangeState = {
|
|
isSelecting: true,
|
|
resourceId: opts.resourceId,
|
|
startDate: opts.startDate,
|
|
currentDate: opts.startDate,
|
|
suggestedProjectId: opts.suggestedProjectId ?? null,
|
|
startClientX: e.clientX,
|
|
};
|
|
rangeStateRef.current = state;
|
|
setRangeState(state);
|
|
},
|
|
[],
|
|
);
|
|
|
|
// ── Canvas-level handlers (project shift + range select only) ──────────────
|
|
|
|
const onCanvasMouseMove = useCallback(
|
|
(e: React.MouseEvent) => {
|
|
// Project shift
|
|
const drag = dragStateRef.current;
|
|
if (drag.isDragging && drag.originalStartDate && drag.originalEndDate) {
|
|
const deltaX = e.clientX - drag.startMouseX;
|
|
const daysDelta = Math.round(deltaX / cellWidth);
|
|
if (daysDelta !== drag.daysDelta) {
|
|
const newStart = new Date(drag.originalStartDate);
|
|
newStart.setDate(newStart.getDate() + daysDelta);
|
|
const newEnd = new Date(drag.originalEndDate);
|
|
newEnd.setDate(newEnd.getDate() + daysDelta);
|
|
const updated: DragState = { ...drag, currentStartDate: newStart, currentEndDate: newEnd, daysDelta };
|
|
dragStateRef.current = updated;
|
|
setDragState(updated);
|
|
}
|
|
return;
|
|
}
|
|
|
|
// Range select
|
|
const range = rangeStateRef.current;
|
|
if (range.isSelecting && range.startDate) {
|
|
const deltaX = e.clientX - range.startClientX;
|
|
const daysDelta = Math.round(deltaX / cellWidth);
|
|
const currentDate = new Date(range.startDate);
|
|
currentDate.setDate(currentDate.getDate() + daysDelta);
|
|
|
|
const prevDelta = range.currentDate
|
|
? Math.round((range.currentDate.getTime() - range.startDate.getTime()) / 86400000)
|
|
: 0;
|
|
if (daysDelta === prevDelta) return;
|
|
|
|
const updated: RangeState = { ...range, currentDate };
|
|
rangeStateRef.current = updated;
|
|
setRangeState(updated);
|
|
}
|
|
},
|
|
[cellWidth],
|
|
);
|
|
|
|
const onCanvasMouseUp = useCallback(
|
|
async (e: React.MouseEvent) => {
|
|
// Project shift
|
|
const drag = dragStateRef.current;
|
|
if (drag.isDragging) {
|
|
if (drag.daysDelta === 0) {
|
|
if (drag.projectId && drag.originalStartDate && drag.originalEndDate) {
|
|
onBlockClick?.({
|
|
allocationId: drag.allocationId ?? "",
|
|
projectId: drag.projectId,
|
|
projectName: drag.projectName ?? "",
|
|
startDate: drag.originalStartDate,
|
|
endDate: drag.originalEndDate,
|
|
});
|
|
}
|
|
} else if (drag.projectId && drag.currentStartDate && drag.currentEndDate) {
|
|
try {
|
|
await applyShiftMutation.mutateAsync({
|
|
projectId: drag.projectId,
|
|
newStartDate: drag.currentStartDate,
|
|
newEndDate: drag.currentEndDate,
|
|
});
|
|
} catch {
|
|
// Validation error — revert visually
|
|
}
|
|
}
|
|
dragStateRef.current = INITIAL_DRAG_STATE;
|
|
setDragState(INITIAL_DRAG_STATE);
|
|
return;
|
|
}
|
|
|
|
// Range select
|
|
const range = rangeStateRef.current;
|
|
if (range.isSelecting && range.resourceId && range.startDate) {
|
|
const endDate = range.currentDate ?? range.startDate;
|
|
const [startDate, finalEnd] =
|
|
range.startDate <= endDate
|
|
? [range.startDate, endDate]
|
|
: [endDate, range.startDate];
|
|
|
|
onRangeSelected?.({
|
|
resourceId: range.resourceId,
|
|
startDate,
|
|
endDate: finalEnd,
|
|
suggestedProjectId: range.suggestedProjectId,
|
|
anchorX: e.clientX,
|
|
anchorY: e.clientY,
|
|
});
|
|
|
|
rangeStateRef.current = INITIAL_RANGE_STATE;
|
|
setRangeState(INITIAL_RANGE_STATE);
|
|
}
|
|
},
|
|
[applyShiftMutation, onBlockClick, onRangeSelected],
|
|
);
|
|
|
|
const onCanvasMouseLeave = useCallback(() => {
|
|
// Only cancel project-shift and range-select on canvas leave.
|
|
// Alloc drag is managed by document-level listeners and must NOT be cancelled here.
|
|
if (dragStateRef.current.isDragging) {
|
|
dragStateRef.current = INITIAL_DRAG_STATE;
|
|
setDragState(INITIAL_DRAG_STATE);
|
|
}
|
|
if (rangeStateRef.current.isSelecting) {
|
|
rangeStateRef.current = INITIAL_RANGE_STATE;
|
|
setRangeState(INITIAL_RANGE_STATE);
|
|
}
|
|
}, []);
|
|
|
|
// ── Touch support ───────────────────────────────────────────────────────────
|
|
|
|
// Helper: extract clientX from a touch event (first active touch, then changedTouches as fallback)
|
|
function toClientX(e: React.TouchEvent): number {
|
|
return e.touches[0]?.clientX ?? e.changedTouches[0]?.clientX ?? 0;
|
|
}
|
|
|
|
const onProjectBarTouchStart = useCallback(
|
|
(e: React.TouchEvent, opts: {
|
|
projectId: string;
|
|
projectName: string;
|
|
startDate: Date;
|
|
endDate: Date;
|
|
}) => {
|
|
e.preventDefault();
|
|
touchStartRef.current = { x: toClientX(e), y: e.touches[0]?.clientY ?? 0, decided: true };
|
|
onProjectBarMouseDown(
|
|
{ clientX: toClientX(e), preventDefault: () => {}, stopPropagation: () => {} } as unknown as React.MouseEvent,
|
|
opts,
|
|
);
|
|
},
|
|
[onProjectBarMouseDown],
|
|
);
|
|
|
|
const onAllocTouchStart = useCallback(
|
|
(e: React.TouchEvent, opts: {
|
|
mode: AllocDragMode;
|
|
allocationId: string;
|
|
mutationAllocationId?: string;
|
|
projectId: string;
|
|
projectName: string;
|
|
resourceId: string | null;
|
|
startDate: Date;
|
|
endDate: Date;
|
|
}) => {
|
|
e.preventDefault();
|
|
touchStartRef.current = { x: toClientX(e), y: e.touches[0]?.clientY ?? 0, decided: true };
|
|
onAllocMouseDown(
|
|
{ clientX: toClientX(e), preventDefault: () => {}, stopPropagation: () => {} } as unknown as React.MouseEvent,
|
|
opts,
|
|
);
|
|
},
|
|
[onAllocMouseDown],
|
|
);
|
|
|
|
const onRowTouchStart = useCallback(
|
|
(e: React.TouchEvent, opts: {
|
|
resourceId: string;
|
|
startDate: Date;
|
|
suggestedProjectId?: string;
|
|
}) => {
|
|
e.preventDefault();
|
|
touchStartRef.current = { x: toClientX(e), y: e.touches[0]?.clientY ?? 0, decided: false };
|
|
onRowMouseDown(
|
|
{ clientX: toClientX(e), preventDefault: () => {}, stopPropagation: () => {} } as unknown as React.MouseEvent,
|
|
opts,
|
|
);
|
|
},
|
|
[onRowMouseDown],
|
|
);
|
|
|
|
const onCanvasTouchMove = useCallback(
|
|
(e: React.TouchEvent) => {
|
|
const touch = e.touches[0];
|
|
if (!touch) return;
|
|
|
|
// Scroll vs drag disambiguation: once decided, stick with the decision
|
|
if (!touchStartRef.current.decided) {
|
|
const dx = Math.abs(touch.clientX - touchStartRef.current.x);
|
|
const dy = Math.abs(touch.clientY - touchStartRef.current.y);
|
|
if (dx > 8 || dy > 8) {
|
|
touchStartRef.current.decided = true;
|
|
if (dy > dx) return; // vertical scroll wins — don't intercept
|
|
} else {
|
|
return; // haven't moved enough to decide yet
|
|
}
|
|
}
|
|
|
|
onCanvasMouseMove({ clientX: touch.clientX } as React.MouseEvent);
|
|
},
|
|
[onCanvasMouseMove],
|
|
);
|
|
|
|
const onCanvasTouchEnd = useCallback(
|
|
async (e: React.TouchEvent) => {
|
|
const clientX = e.changedTouches[0]?.clientX ?? 0;
|
|
const clientY = e.changedTouches[0]?.clientY ?? 0;
|
|
await onCanvasMouseUp({ clientX, clientY } as React.MouseEvent);
|
|
},
|
|
[onCanvasMouseUp],
|
|
);
|
|
|
|
// ── Derived ─────────────────────────────────────────────────────────────────
|
|
|
|
const shiftPreview: ShiftPreviewData | null =
|
|
dragState.isDragging && dragState.daysDelta !== 0 && previewData
|
|
? {
|
|
valid: previewData.valid,
|
|
deltaCents: previewData.costImpact.deltaCents,
|
|
wouldExceedBudget: previewData.costImpact.wouldExceedBudget,
|
|
budgetUtilizationAfter: previewData.costImpact.budgetUtilizationAfter,
|
|
conflictCount: previewData.conflictDetails.length,
|
|
errors: previewData.errors.map((e) => e.message),
|
|
warnings: previewData.warnings.map((w) => w.message),
|
|
}
|
|
: null;
|
|
|
|
return {
|
|
dragState,
|
|
allocDragState,
|
|
rangeState,
|
|
shiftPreview,
|
|
isPreviewLoading,
|
|
isApplying: applyShiftMutation.isPending,
|
|
isAllocSaving: updateAllocMutation.isPending,
|
|
onProjectBarMouseDown,
|
|
onBlockMouseDown,
|
|
onAllocMouseDown,
|
|
onRowMouseDown,
|
|
onCanvasMouseMove,
|
|
onCanvasMouseUp,
|
|
onCanvasMouseLeave,
|
|
// Touch equivalents
|
|
onProjectBarTouchStart,
|
|
onAllocTouchStart,
|
|
onRowTouchStart,
|
|
onCanvasTouchMove,
|
|
onCanvasTouchEnd,
|
|
};
|
|
}
|