fix(ui): improve ComboBox search query state management by ArtieReus · Pull Request #2030 · cloudoperators/juno

ArtieReus · 2026-09-30T14:38:58Z

Summary

Fix ComboBox controlled value clearing and search query state management. This is a focused subset of the changes from PR #2010, excluding the forwardRef and onKeyDown features to simplify the implementation.

Changes Made

Clear internal search query after option selection to prevent stale search terms
Clear query and close dropdown when controlled value prop is explicitly set to ""
Use strict equality (value === "") to distinguish intentional reset from prop removal (undefined)
Compute isControlled inline instead of using state to avoid one-way ratchet behavior
Use inputRef instead of document.getElementById for blur (works in shadow DOM)
Fire onInputChange with a proper event object when query is programmatically cleared, keeping internal and external search state in sync
Add comprehensive tests for controlled and uncontrolled scenarios

Related Issues

Related to [Bug](supernova): Filter input loses focus when clearing text with backspace #1947 (full fix requires additional work in follow-up)
Related to fix(ui): improve ComboBox search query state management and focus handling #2010 (subset of changes)

Screenshots (if applicable)

N/A - No visual changes

Testing Instructions

pnpm i
pnpm test - verify ComboBox tests pass
Manual test in supernova app: select a filter value, verify the search query resets

Known Limitations

The following items are lower priority and can be addressed in follow-up issues:

blur() side effect: The programmatic blur() call fires onBlur and moves keyboard focus. Consumers should not rely on onBlur for user-driven-only logic.
Breaking behavior change: When both value="" and defaultValue are provided, the ComboBox now shows empty instead of falling back to defaultValue. This is correct since defaultValue is documented as uncontrolled-mode only.

Checklist

I have performed a self-review of my code.
I have commented my code, particularly in hard-to-understand areas.
I have added tests that prove my fix is effective or that my feature works.
New and existing unit tests pass locally with my changes.
I have made corresponding changes to the documentation (if applicable).
My changes generate no new warnings or errors.
I have created a changeset for my changes.

PR Manifesto

Review the PR Manifesto for best practises.

changeset-bot · 2026-09-30T14:39:05Z

🦋 Changeset detected

Latest commit: 86dcdb4

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 7 packages

Name	Type
@cloudoperators/juno-ui-components	Patch
@cloudoperators/juno-app-doop	Patch
@cloudoperators/juno-app-greenhouse	Patch
@cloudoperators/juno-app-heureka	Patch
@cloudoperators/juno-app-supernova	Patch
@cloudoperators/juno-app-template	Patch
@cloudoperators/juno-messages-provider	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

github-actions · 2026-09-30T14:42:37Z

PR Preview Action v1.8.1
Preview removed because the pull request was closed.
2026-10-09 13:50 UTC

Copilot

Copilot review overview

🟡 Changes recommended

A controlled reset can still display a default value or leave the input reporting an open menu, and the new tests do not exercise query clearing.

Review effort: Balanced
Findings: 2 · 2

Open (4)

Honor explicitly cleared controlled values over defaultValue · New
Close Headless UI Combobox when controlled value is cleared · New
Test query and menu reset when clearing the controlled value · New
Test query reset after selecting a filtered option · New

What changed in this PR

This PR updates the shared ComboBox to clear stale search queries after selection and when a controlled value is cleared.

Changes:

Clear the internal query after selection or a controlled-value reset.
Add controlled and uncontrolled ComboBox tests.
Add a patch changeset.

File	Description
`packages/ui-components/src/components/ComboBox/ComboBox.test.tsx`	Adds state-management tests.
`packages/ui-components/src/components/ComboBox/ComboBox.component.tsx`	Adds query and dropdown reset logic.
`.changeset/fix-combobox-query-clearing.md`	Records the patch release.

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

Copilot

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

Copilot

🟡 Changes recommended

Initially empty controlled values can display defaults, and external resets do not close an open dropdown.

2 open findings

Empty controlled value is mistaken for uncontrolled mode · New
External clear leaves the open dropdown visible · New

🧠 Review effort: Balanced

Give feedback about Copilot approvals in this survey to enter a drawing for a $150 gift card.

Clear search query after option selection and when controlled value becomes empty to prevent stale search terms from persisting. This ensures proper synchronization between internal query state and parent component filter state, improving the user experience when working with controlled ComboBox components. Changes: - Clear search query after option selection - Clear query and close dropdown when value prop becomes empty - Add comprehensive tests for controlled/uncontrolled scenarios Signed-off-by: Arturo Reuschenbach Puncernau <artie.reuschenbach-puncernau@sap.com> Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

…e handling - Honor explicitly cleared controlled values over defaultValue by tracking controlled mode and using effectiveValue calculation - Remove problematic setIsOpen(false) that caused aria-expanded desync with Headless UI internal state - Only clear query when value transitions from truthy to falsy (not on init) - Add comprehensive tests for controlled/uncontrolled query reset behavior Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

- Change isControlled detection from `value !== ""` to `value !== undefined` - Remove default value for `value` prop to preserve undefined vs empty distinction - This ensures `<ComboBox value="" defaultValue="x">` shows empty, not default - Add test for initially empty controlled value scenario Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

…s open - Blur the input element to properly close Headless UI's Combobox - This ensures aria-expanded syncs correctly with actual open state - Add test verifying dropdown closes on external value clear Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

…h a proper event object Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

franzheidl

lgtm

Copilot AI balanced review requested due to automatic review settings September 30, 2026 14:38

ArtieReus requested review from a team and franzheidl as code owners September 30, 2026 14:38

ArtieReus self-assigned this Sep 30, 2026

ArtieReus marked this pull request as draft September 30, 2026 14:39

Copilot started reviewing on behalf of ArtieReus September 30, 2026 14:40 View session

Copilot AI reviewed Sep 30, 2026

View reviewed changes

ArtieReus force-pushed the artie-fix-combobox-query-clearing branch from f9848dc to 1af4a4f Compare October 8, 2026 12:06

ArtieReus requested a balanced review from Copilot October 8, 2026 12:07

Copilot AI reviewed Oct 8, 2026

ArtieReus added the greenhouse-pr-build Set this label to create a preview image which will automatically set the `greenhouse-pr-preview` label Oct 8, 2026

github-actions Bot added the greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. label Oct 8, 2026

franzheidl requested a balanced review from Copilot October 8, 2026 12:10

Copilot started reviewing on behalf of franzheidl October 8, 2026 12:11 View session

Copilot AI reviewed Oct 8, 2026

View reviewed changes

Comment thread packages/ui-components/src/components/ComboBox/ComboBox.component.tsx Outdated

Comment thread packages/ui-components/src/components/ComboBox/ComboBox.component.tsx Outdated

github-actions Bot added greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. and removed greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. labels Oct 8, 2026

ArtieReus marked this pull request as ready for review October 8, 2026 12:30

github-actions Bot added the greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. label Oct 8, 2026

andypf previously approved these changes Oct 8, 2026

View reviewed changes

github-actions Bot removed the greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. label Oct 8, 2026

edda previously approved these changes Oct 8, 2026

View reviewed changes

github-actions Bot added the greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. label Oct 8, 2026

franzheidl mentioned this pull request Oct 8, 2026

feat(ui): uxdocs - add rendering empty and unknown values guidelines #2071

Merged

1 of 7 tasks

ArtieReus added this pull request to stack #2073 October 8, 2026 13:08

ArtieReus force-pushed the artie-fix-combobox-query-clearing branch from 2b2f1bb to d28b947 Compare October 8, 2026 13:09

github-actions Bot removed the greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. label Oct 8, 2026

github-actions Bot added greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. and removed greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. labels Oct 9, 2026

ArtieReus force-pushed the artie-fix-combobox-query-clearing branch from 249ace9 to ed73126 Compare October 9, 2026 07:12

github-actions Bot added greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. and removed greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. labels Oct 9, 2026

ArtieReus force-pushed the artie-fix-combobox-query-clearing branch from ed73126 to 462fd0f Compare October 9, 2026 08:31

github-actions Bot added greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. and removed greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. labels Oct 9, 2026

ArtieReus force-pushed the artie-fix-combobox-query-clearing branch from 462fd0f to b001d40 Compare October 9, 2026 09:15

github-actions Bot added greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. and removed greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. labels Oct 9, 2026

ArtieReus added 9 commits October 9, 2026 15:40

fix(ui): use ref instead document.getElementById

95bc5db

Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

fix(ui): change changeset

9ecdb0d

Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

chore(ui): combobox clearQueryWithEvent() now calls onInputChange wit…

d5ef6d3

…h a proper event object Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

fix(ui): use strict equality check for ComboBox controlled value reset

a8a9685

Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

fix(ui): compute isControlled inline instead of using state

86dcdb4

Signed-off-by: Arturo Reuschenbach Puncernau <reuschenbach@gmail.com>

ArtieReus force-pushed the artie-fix-combobox-query-clearing branch from b001d40 to 86dcdb4 Compare October 9, 2026 13:40

github-actions Bot added greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. and removed greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. labels Oct 9, 2026

franzheidl approved these changes Oct 9, 2026

View reviewed changes

edda approved these changes Oct 9, 2026

View reviewed changes

ArtieReus merged commit b7ef8b8 into main Oct 9, 2026
24 checks passed

ArtieReus deleted the artie-fix-combobox-query-clearing branch October 9, 2026 13:50

github-actions Bot removed the greenhouse-pr-preview THIS LABEL IS SET AUTOMATICALLY. label Oct 9, 2026

Navigation Menu

Repository navigation

fix(ui): improve ComboBox search query state management - #2030

fix(ui): improve ComboBox search query state management#2030
ArtieReus merged 9 commits into
mainfrom
artie-fix-combobox-query-clearing

ArtieReus commented Sep 30, 2026 •

edited

Loading

Uh oh!

changeset-bot Bot commented Sep 30, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Sep 30, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

franzheidl left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Conversation

ArtieReus commented Sep 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Changes Made

Related Issues

Screenshots (if applicable)

Testing Instructions

Known Limitations

Checklist

PR Manifesto

Uh oh!

changeset-bot Bot commented Sep 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

github-actions Bot commented Sep 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Copilot review overview

🟡 Changes recommended

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Uh oh!

Uh oh!

Uh oh!

franzheidl left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

ArtieReus commented Sep 30, 2026 •

edited

Loading

changeset-bot Bot commented Sep 30, 2026 •

edited

Loading

github-actions Bot commented Sep 30, 2026 •

edited

Loading