Skip to content

feat: Add filtering to button dropdown#4637

Draft
avinashbot wants to merge 2 commits into
mainfrom
feat/actions-search
Draft

feat: Add filtering to button dropdown#4637
avinashbot wants to merge 2 commits into
mainfrom
feat/actions-search

Conversation

@avinashbot

@avinashbot avinashbot commented Jun 16, 2026

Copy link
Copy Markdown
Member

Description

Button dropdown action filtering implemented a similar way to select/multiselect filtering. The big underlying change is that filtering requires the use of aria-activedescendant rather than simply moving focus from item to item. So most of the internal changes are about disabling focusing logic when filtering is active, so that the real focus can stay on the input (and "accessibility" focus can move around using aria-activedescendant).

Rel: AWSUI-61960 (Chorus: qodG8KXdJXXk)

How has this been tested?

Updated unit tests, a bit of manual accessibility testing, but more validation with other screen readers is needed.

Review checklist

The following items are to be evaluated by the author(s) and the reviewer(s).

Correctness

  • Changes include appropriate documentation updates.
  • Changes are backward-compatible if not indicated, see CONTRIBUTING.md.
  • Changes do not include unsupported browser features, see CONTRIBUTING.md.
  • Changes were manually tested for accessibility, see accessibility guidelines.

Security

Testing

  • Changes are covered with new/existing unit tests?
  • Changes are covered with new/existing integration tests?

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

@codecov

codecov Bot commented Jun 16, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 97.60%. Comparing base (902b5ad) to head (f0e34d7).
⚠️ Report is 15 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #4637      +/-   ##
==========================================
+ Coverage   97.57%   97.60%   +0.02%     
==========================================
  Files         948      950       +2     
  Lines       30489    30612     +123     
  Branches    11148    11216      +68     
==========================================
+ Hits        29749    29878     +129     
+ Misses        733      688      -45     
- Partials        7       46      +39     

☔ View full report in Codecov by Harness.
📢 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.

@avinashbot avinashbot force-pushed the feat/actions-search branch from 0d5d891 to 14e5718 Compare June 18, 2026 23:10
@avinashbot avinashbot force-pushed the feat/actions-search branch from 14e5718 to b0fd947 Compare June 18, 2026 23:29
@avinashbot avinashbot force-pushed the feat/actions-search branch 2 times, most recently from 042705d to 50e2c55 Compare June 23, 2026 16:07
@avinashbot avinashbot force-pushed the feat/actions-search branch from 50e2c55 to d5f7211 Compare June 24, 2026 10:57
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
// SPDX-License-Identifier: Apache-2.0
import { ButtonDropdownProps } from '../interfaces';
import { filterItems } from '../utils/filter-items';

@pan-kot pan-kot Jun 25, 2026

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.

All these tests are technically possible to run from the component level: render button dropdown with certain items, set filtering - check the actual rendered items. Should we do this instead of testing the helper directly? This can give us better real coverage, as it not only ensures that the helper works, but also that it is used correctly by the component.

expect(elementWrapper).toHaveTextContent('Custom');
});

test('renders custom item content for link items', () => {

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.

Why did we add this test? Is that also the expected behaviour? I find it strange that we still render a link when the item renderer is overridden.

@SpyZzey SpyZzey requested a review from amanabiy June 25, 2026 09:33
};

const actOnParentDropdown = (event: React.KeyboardEvent) => {
// if there is no highlighted item we act on the trigger by opening or closing dropdown

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.

Did the behavior change here? or we don't need the comment?

const activate = (event: React.KeyboardEvent, isEnter?: boolean) => {
setIsUsingMouse(false);

// if item is a link we rely on default behavior of an anchor, no need to prevent

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.

Same, Did the behavior change here? or we don't need the comment?

});

const { isOpen, closeDropdown, ...openStateProps } = useOpenState({ onClose: reset });
const prevFilteringValue = useRef(filteringValue);

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.

Should we use usePrevious here?

const prevFilteringValue = usePrevious(filteringValue);

@avinashbot avinashbot force-pushed the feat/actions-search branch from e553244 to 9fb88b8 Compare June 26, 2026 14:55
@avinashbot avinashbot force-pushed the feat/actions-search branch from 9fb88b8 to 71b731a Compare June 26, 2026 15:02
@avinashbot avinashbot force-pushed the feat/actions-search branch from 71b731a to 3371c37 Compare June 26, 2026 15:19
@avinashbot avinashbot force-pushed the feat/actions-search branch from 3371c37 to 7fe6f1d Compare June 29, 2026 09:17
@avinashbot avinashbot force-pushed the feat/actions-search branch from 7fe6f1d to 41d00ba Compare July 2, 2026 09:21
@avinashbot avinashbot force-pushed the feat/actions-search branch from 41d00ba to 17f2654 Compare July 2, 2026 13:56
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.

3 participants