Skip to content

refactor(ui5-list, ui5-tree): extract drag-and-drop logic into reusable mixin #11864

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 2 commits into from

Conversation

kgogov
Copy link
Member

@kgogov kgogov commented Jul 7, 2025

Refactor: Extract drag-and-drop logic into reusable mixin

Summary

Eliminates code duplication between List and Tree components by extracting common drag-and-drop functionality into a reusable mixin pattern.

Changes

  • Created DragAndDropMixin.ts with configurable callbacks
  • Unified initialization patterns in both List and Tree constructors
  • Added proper memory cleanup mechanisms
  • Reduced codebase of duplicated code

Benefits

  • Single source of truth for drag-and-drop logic
  • Easier maintenance and bug fixes
  • Consistent behavior across components
  • Simplified addition of drag-and-drop to future components

Testing

  • All existing functionality preserved
  • Both test pages (ListDragAndDrop.html, TreeDragAndDrop.html) work unchanged
  • Zero breaking changes to public APIs

Fixes #11120

@kgogov kgogov force-pushed the refactor-list-tree-drag-n-drop branch from 9fa1249 to 8f84cb7 Compare July 8, 2025 10:32
@kgogov kgogov requested a review from Copilot July 8, 2025 10:39
…le mixin

- Create DragAndDropMixin.ts with configurable callbacks for component-specific behavior
- Unify drag-and-drop initialization patterns between List and Tree components
- Add proper memory cleanup mechanisms in onExitDOM lifecycle hooks
- Eliminate duplicated drag-and-drop code
- Maintain 100% backward compatibility with existing APIs
- Preserve all existing functionality including event names and behavior

Benefits:
- Single source of truth for drag-and-drop logic
- Easier maintenance and bug fixes across components
- Consistent behavior between List and Tree
- Simplified addition of drag-and-drop to future components
- Better memory management with cleanup on component destruction

Fixes #11120
Copy link
Contributor

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

Extracts common drag-and-drop logic from the List and Tree components into a shared mixin for reuse and maintenance.

  • Adds DragAndDropMixin.ts in the base package to centralize drag-and-drop callbacks and handlers
  • Refactors Tree.ts and List.ts to use the new mixin, removing duplicate handler implementations
  • Ensures cleanup of bound methods on component teardown to prevent memory leaks

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.

File Description
packages/base/src/util/dragAndDrop/DragAndDropMixin.ts New mixin providing shared drag-and-drop logic
packages/main/src/Tree.ts Updated Tree to bind handlers from the mixin
packages/main/src/List.ts Updated List to bind handlers from the mixin

@kgogov kgogov force-pushed the refactor-list-tree-drag-n-drop branch from 8f84cb7 to 33387b9 Compare July 8, 2025 10:47
@kgogov kgogov force-pushed the refactor-list-tree-drag-n-drop branch from 33387b9 to cd8be54 Compare July 8, 2025 10:55
@kgogov kgogov marked this pull request as ready for review July 8, 2025 11:16
@kgogov kgogov marked this pull request as draft July 8, 2025 12:32
@kgogov
Copy link
Member Author

kgogov commented Jul 16, 2025

Abandoning this PR in favor of a newer and improved implementation available in #11928.

@kgogov kgogov closed this Jul 16, 2025
@kgogov kgogov deleted the refactor-list-tree-drag-n-drop branch July 16, 2025 12:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[ui5-list]: simplify DnD implementation
1 participant