Fixes #39311 - Allow selection clearance for AutocompleteInput

[ofedoren]

Fixes: 47dca75

Before:
before.webm
After:
after.webm

For context please see the attachments or the ticket.

I believe this is a regression caused by #10777, but since the only consumer outside is webhooks plugin, the issue was missed and caught by CI runs of the plugin. We could fix that in the plugin, but since that commit changed behavior by essentially breaking functionality, I'd rather return back what was changed.

I'm not sure about the approach of the fix much, I've tried to make it in a way that it leaves what EditorHostSelect needs, but at the same time the same behavior might be re-used by other consumers via allowClear prop if needed.

I doubt we'll manage to get this before branching, so I treat it as a separate issue that follows the previous PR, thus Fixes instead of Refs. If we won't manage to get this before branching, we'll need to cherry-pick it into 3.19-stable.

cc @adamlazik1, @Lukshio, @MariaAga

UPD: The CI with this patch is green: theforeman/foreman_webhooks#101

[ogajduse]

I'm setting Needs cherrypick label as https://projects.theforeman.org/issues/39311 targets 3.19.0 that was branched today.

[Lukshio]

Using arrows to navigate between the options is little bit weird because it jumps on first click, I will try to find solution how to deal with that.

[Lukshio]

After the discussion we found that the onKeyDown prop can be deleted and also the helper functions. Probably due to package update with fixed issue.

[Copilot]

Pull request overview

This PR restores the ability to clear an AutocompleteInput selection (regression after the PF5 migration) by introducing an allowClear prop and opting the editor’s host selector out to preserve its existing behavior.

Changes:

• Add allowClear prop to AutocompleteInput (defaulting to enabled) to clear selection when the input is emptied.
• Refactor close/blur behavior in AutocompleteInput to support the new clearing flow.
• Disable clearing for the editor preview host selector via allowClear={false}.

Reviewed changes

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

File	Description
webpack/assets/javascripts/react_app/components/Editor/components/EditorNavbar.js	Opts the editor host selector out of the new clear-on-empty behavior.
webpack/assets/javascripts/react_app/components/common/AutocompleteInput/AutocompleteInput.js	Adds allowClear and implements clear-on-empty logic plus related close handling.

Comments suppressed due to low confidence (1)

webpack/assets/javascripts/react_app/components/common/AutocompleteInput/AutocompleteInput.js:147

• In onTextInputChange, the allowClear path uses selected in a boolean context (... && selected), so clearing won’t fire for valid falsy selections (like 0/false). Switch to an explicit “selection present” check to ensure clearing works for all supported selected types.

  const onTextInputChange = (_event, value) => {
    onChange(value);
    setInputValue(value);
    inputValueRef.current = value;
    setFilterValue(value);
    resetActiveAndFocusedItem();
    if (allowClear && !value && selected) {
      onSelect('');
    }

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[ofedoren]

Thanks, @Lukshio, I've dropped the custom onKeyDown logic, the component should now rely on what Patternfly does.

Just for reference, before 57ae709:
before.webm
After 57ae709:
after.webm

[Lukshio]

Changes looks good, ack.

[ofedoren]

Re: https://github.com/theforeman/foreman/pull/10983/changes#r3279737043

But wouldn't the onBlur get called with possibly stale displayValue?

Yeap, that's true. It is not an issue with current consumers since Editor won't trigger true branch and webhooks don't use custom onBlur (uses noop from the defaults). But just in case for future consumers it should be fixed now.

[adamruzicka]

@ofedoren could you please squash?

[adamruzicka]

I took the liberty of squashing it myself to squeeze it in time to get into 3.19.0rc2

[adamruzicka]

Download action repository 're-actors/alls-green@release/v1' (SHA:05ac9388f0aebcb5727afa17fcccfecd6f8ec5fe)
Error: An action could not be found at the URI 'https://codeload.github.com/re-actors/alls-green/tar.gz/05ac9388f0aebcb5727afa17fcccfecd6f8ec5fe' (2440:163F83:19DADA:209FBA:6A157D9B)
Error: Failed to download archive 'https://codeload.github.com/re-actors/alls-green/tar.gz/05ac9388f0aebcb5727afa17fcccfecd6f8ec5fe' after 1 attempts.

Definitely not caused by the changes here

[adamruzicka]

Thank you @ofedoren !

[adamruzicka]

CPs:

• 3.19 Fixes #39311 - Allow selection clearance for AutocompleteInput #11000