diff --git a/packages/web/src/views/Calendar/components/Draft/hooks/actions/drag-duration.util.ts b/packages/web/src/views/Calendar/components/Draft/hooks/actions/drag-duration.util.ts new file mode 100644 index 000000000..bbb8fcf93 --- /dev/null +++ b/packages/web/src/views/Calendar/components/Draft/hooks/actions/drag-duration.util.ts @@ -0,0 +1,13 @@ +import dayjs from "@core/util/date/dayjs"; +import { type Schema_GridEvent } from "@web/common/types/web.event.types"; +import { type Status_Drag } from "@web/views/Calendar/components/Draft/hooks/state/useDraftState"; + +export const getDragDurationMinutes = ( + draft: Schema_GridEvent, + dragStatus: Status_Drag | null, +) => { + return ( + dragStatus?.durationMin ?? + dayjs(draft.endDate).diff(draft.startDate, "minutes") + ); +}; diff --git a/packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.test.ts b/packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.test.ts new file mode 100644 index 000000000..64c981c56 --- /dev/null +++ b/packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.test.ts @@ -0,0 +1,41 @@ +import { Origin, Priorities } from "@core/constants/core.constants"; +import { type Schema_GridEvent } from "@web/common/types/web.event.types"; +import { getDragDurationMinutes } from "./drag-duration.util"; +import { describe, expect, it } from "bun:test"; + +const createDraft = ( + overrides: Partial = {}, +): Schema_GridEvent => ({ + _id: "event-1", + title: "Seed event", + startDate: "2024-01-15T10:00:00.000Z", + endDate: "2024-01-15T11:30:00.000Z", + isAllDay: false, + isSomeday: false, + origin: Origin.COMPASS, + priority: Priorities.UNASSIGNED, + user: "user-1", + position: { + isOverlapping: false, + widthMultiplier: 1, + horizontalOrder: 1, + dragOffset: { y: 0 }, + initialX: null, + initialY: null, + }, + ...overrides, +}); + +describe("getDragDurationMinutes", () => { + it("uses the draft duration before drag status is ready", () => { + expect(getDragDurationMinutes(createDraft(), null)).toBe(90); + }); + + it("uses the tracked duration once available", () => { + expect( + getDragDurationMinutes(createDraft(), { + durationMin: 45, + }), + ).toBe(45); + }); +}); diff --git a/packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.ts b/packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.ts index 2078cd35f..cf0e90720 100644 --- a/packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.ts +++ b/packages/web/src/views/Calendar/components/Draft/hooks/actions/useDraftActions.ts @@ -56,6 +56,7 @@ import { import { type DateCalcs } from "@web/views/Calendar/hooks/grid/useDateCalcs"; import { type WeekProps } from "@web/views/Calendar/hooks/useWeek"; import { GRID_TIME_STEP } from "@web/views/Calendar/layout.constants"; +import { getDragDurationMinutes } from "./drag-duration.util"; export const useDraftActions = ( draftState: State_Draft_Local, @@ -389,7 +390,7 @@ export const useDraftActions = ( const rawX = getX(e as MouseEvent, isSidebarOpen); const x = draft.isAllDay ? rawX - draft.position.dragOffset.x : rawX; - const startEndDurationMin = dragStatus?.durationMin || 0; + const startEndDurationMin = getDragDurationMinutes(draft, dragStatus); const y = e.clientY - draft.position.dragOffset.y; @@ -453,8 +454,7 @@ export const useDraftActions = ( dateCalcs, weekProps.component.startOfView, draft, - dragStatus?.hasMoved, - dragStatus?.durationMin, + dragStatus, setDraft, setDragStatus, ],