Skip to content

feat(module:transfer): support multiple row selection with Shift key #9092

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

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

F-JJTH
Copy link
Contributor

@F-JJTH F-JJTH commented Apr 12, 2025

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • [ x] Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Application (the showcase website) / infrastructure changes
  • Other... Please describe:

What is the current behavior?

It is not possible to select multiple row by using keyboard key SHIFT

Issue Number: N/A

What is the new behavior?

The new behavior allow to select multiple row by using the keyboard key SHIFT

Does this PR introduce a breaking change?

  • Yes
  • [ x] No

Other information

transfer_multiple_selection_demo

ANT DESIGN support this feature in their React component: https://ant.design/components/transfer

@F-JJTH F-JJTH requested a review from Ricbet as a code owner April 12, 2025 17:46
Copy link

zorro-bot bot commented Apr 12, 2025

This preview will be available after the AzureCI is passed.

Copy link

codecov bot commented Apr 12, 2025

Codecov Report

Attention: Patch coverage is 86.95652% with 3 lines in your changes missing coverage. Please review.

Project coverage is 91.99%. Comparing base (c91767c) to head (9044236).
Report is 4 commits behind head on master.

Files with missing lines Patch % Lines
components/transfer/transfer.component.ts 86.95% 3 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##           master    #9092      +/-   ##
==========================================
- Coverage   92.01%   91.99%   -0.02%     
==========================================
  Files         564      564              
  Lines       20025    20047      +22     
  Branches     3106     3113       +7     
==========================================
+ Hits        18426    18443      +17     
- Misses       1261     1265       +4     
- Partials      338      339       +1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link

@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

This PR introduces a feature that enables multiple row selection via the Shift key in the transfer component. Key changes include:

  • Addition of a new test verifying multi-select behavior when holding the Shift key.
  • Integration of HostListener decorators to track Shift key state and update selection logic in the transfer component.
  • Minor formatting improvements in test and component code for consistency.

Reviewed Changes

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

File Description
components/transfer/transfer.spec.ts Added test case for Shift key multi-selection and updated test configuration formatting
components/transfer/transfer.component.ts Integrated Shift key event handling via HostListeners and updated selection logic using dynamic indexing
Comments suppressed due to low confidence (2)

components/transfer/transfer.spec.ts:211

  • [nitpick] Consider renaming the test description to 'should toggle checkbox selection via shift key' for improved clarity.
it('should be checkboxes are toggle select via shift key', () => {

components/transfer/transfer.component.ts:278

  • [nitpick] Consider assigning the property key to a separate variable (e.g. 'const lastIndexKey = direction === 'left' ? 'lastLeftCheckedIndex' : 'lastRightCheckedIndex';') to improve readability.
const lastCheckedIndex = this[direction === 'left' ? 'lastLeftCheckedIndex' : 'lastRightCheckedIndex'] ?? -1;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants