Skip to content
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

fix selectAll showing when limit #7245

Open
wants to merge 5 commits into
base: master
Choose a base branch
from

Conversation

britt6612
Copy link
Collaborator

What does this PR do?

This PR fixes selectAll being shown when there is a limit.

Where should the reviewer start?

SelectionSummary

What testing has been done on this PR?

storybook & jest test

How should this be manually tested?

Create a SelectMultiple component where limit property is provided
Don't select anything. Search something that exists, the Select All does not get displayed.
Clear the search and select any option from dropdown.
Search with a keyword that does not match the selected value but matches other values in the list.
Select All option gets displayed.

Do Jest tests follow these best practices?

  • screen is used for querying.
  • The correct query is used. (Refer to this list of queries)
  • asFragment() is used for snapshot testing.

Any background context you want to provide?

What are the relevant issues?

closes #7219

Screenshots (if appropriate)

Do the grommet docs need to be updated?

no

Should this PR be mentioned in the release notes?

yes

Is this change backwards compatible or is it a breaking change?

backwards compatible

@britt6612 britt6612 requested a review from jcfilben May 29, 2024 20:36
Copy link
Collaborator

@jcfilben jcfilben left a comment

Choose a reason for hiding this comment

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

In SelectedValuesDisabled can we change the if statement on line 54 to

if (
  value.length === disabledSelected ||
  selectedInSearch().length === disabledSelected
)

This prevents an issue where the values selected after searching are disabled and the button shows 'clear all' even though nothing can be cleared because they are all disabled

@@ -68,7 68,7 @@ const SelectionSummary = ({
value?.length === 0 ||
selectedValuesDisabled() ||
!value ||
selectedInSearch().length === 0
(!limit && selectedInSearch().length === 0)
Copy link
Collaborator

Choose a reason for hiding this comment

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

Do we still need this change? I didn't see a difference in behavior with vs without it

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

good catch yes we dont need

Copy link
Collaborator

@jcfilben jcfilben left a comment

Choose a reason for hiding this comment

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

Looks good!

@jcfilben jcfilben requested a review from taysea May 31, 2024 17:19
Copy link
Collaborator

@taysea taysea left a comment

Choose a reason for hiding this comment

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

Behavior looks good, but to summarize from Slack discussion I'll wait to review further until be refactor the select all/clear all logic to be separate and more readable.

@britt6612 britt6612 requested review from taysea and jcfilben and removed request for taysea June 3, 2024 22:01
@britt6612 britt6612 requested a review from taysea June 10, 2024 19:59
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.

Display of Select All button on search in the SelectMultiple component when limit is provided
3 participants