Skip to content

fix(header): handle drag end without movement - #819

Merged
fh1ch merged 1 commit into
release/26.xfrom
backport/26.x-header-drag-end
Aug 25, 2026
Merged

fix(header): handle drag end without movement#819
fh1ch merged 1 commit into
release/26.xfrom
backport/26.x-header-drag-end

Conversation

@spike-rabbit

@spike-rabbit spike-rabbit commented Aug 21, 2026

Copy link
Copy Markdown
Member

What kind of change does this PR introduce? (check one with "x")

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Other... Please describe:

What is the current behavior? (You can also link to an open issue here)

Holding a reorderable column header until dragging starts and releasing it without moving leaves no drag-move event for the orderable directive. Drag end then attempts to destructure an undefined event and breaks subsequent column dragging.

Closes #790

What is the new behavior?

Every drag lifecycle event carries the latest pointer position, including drag end when the pointer never moved. The header handles drag events through normal template bindings and owns reorder target state directly, removing the descendant output subscriptions and the orderable directive. Column movement uses a direct translateX transform and is cleared when dragging ends.

Does this PR introduce a breaking change? (check one with "x")

  • Yes
  • No

If this PR contains a breaking change, please describe the impact and migration path for existing applications: N/A

Other information:

Note: This is a backport of the original PR #797.

Bind drag events directly in the header and include the latest pointer
position in every drag event. This avoids relying on a drag-move event
before drag end and simplifies column reorder state handling.

Closes #790

(cherry picked from commit 87e4531)
@spike-rabbit
spike-rabbit requested a review from a team as a code owner August 21, 2026 11:35
@fh1ch
fh1ch requested a lite review from Copilot August 25, 2026 18:30
@fh1ch fh1ch added the bug Something isn't working label Aug 25, 2026

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR fixes a column-reorder drag edge case where releasing after the long-press delay but without any pointer movement could leave downstream drag handlers without a usable event payload, breaking subsequent drags. It does this by ensuring drag lifecycle events always include the latest pointer position and by moving reorder target tracking into the header component (removing the orderable directive).

Changes:

  • Extend DatatableDraggableDirective so dragStart/dragEnd emit a DragEvent (including the last known pointer position).
  • Remove OrderableDirective and shift reorder target detection + drag translation (translateX) into DataTableHeaderComponent.
  • Add/adjust unit tests to cover “drag end without movement” and prevent reorder in that scenario.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
projects/ngx-datatable/src/lib/types/internal.types.ts Removes internal reorder-target-related types/fields that are no longer used after dropping OrderableDirective.
projects/ngx-datatable/src/lib/directives/orderable.directive.ts Removes the directive previously responsible for header reorder targeting and drag subscriptions.
projects/ngx-datatable/src/lib/directives/orderable.directive.spec.ts Removes tests tied specifically to the deleted OrderableDirective.
projects/ngx-datatable/src/lib/directives/draggable.directive.spec.ts Updates dragEnd typing and adds coverage for drag end without movement including initial pointer position.
projects/ngx-datatable/src/lib/directives/datatable-draggable.directive.ts Ensures drag lifecycle events emit a consistent DragEvent payload (including on drag end without movement).
projects/ngx-datatable/src/lib/components/header/header.component.ts Handles drag start/move/end directly via template bindings; computes reorder target via elementsFromPoint; uses translateX for visual movement and resets at end.
projects/ngx-datatable/src/lib/components/header/header.component.spec.ts Adds coverage to ensure no reorder occurs when drag ends without pointer movement and transform is cleared.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

@fh1ch fh1ch left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@spike-rabbit all good, thanks a lot 🙇

LGTM 👍

@fh1ch
fh1ch merged commit 4292290 into release/26.x Aug 25, 2026
4 checks passed
@fh1ch
fh1ch deleted the backport/26.x-header-drag-end branch August 25, 2026 20:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants