From 146826f2362bbed13c387b030af1b6136a4c1126 Mon Sep 17 00:00:00 2001
From: MariaAga <mariaaga@redhat.com>
Date: Mon, 27 Nov 2023 14:39:28 +0100
Subject: [PATCH] Fixes #36949 - Clear nav search doesn't clear results

---
 .../components/Layout/NavigationSearch.js     | 28 ++++++++-----------
 1 file changed, 12 insertions(+), 16 deletions(-)

diff --git a/webpack/assets/javascripts/react_app/components/Layout/NavigationSearch.js b/webpack/assets/javascripts/react_app/components/Layout/NavigationSearch.js
index bddacb15891..322f7fb0a64 100644
--- a/webpack/assets/javascripts/react_app/components/Layout/NavigationSearch.js
+++ b/webpack/assets/javascripts/react_app/components/Layout/NavigationSearch.js
@@ -51,31 +51,27 @@ export const NavigationSearch = ({ items, clickAndNavigate }) => {
 
   const onClear = () => {
     setValue('');
+    setAutocompleteOptions(navLinksArray.slice(0, 10).map(menuNav));
   };
 
   const onChange = newValue => {
+    // When the value of the search input changes, build a list of no more than 10 autocomplete options.
+    let options = navLinksArray
+      .filter(({ title }) =>
+        title.toLowerCase().includes(newValue.toLowerCase())
+      )
+      .map(menuNav);
+    if (options.length > 10) {
+      options = options.slice(0, 10);
+    }
+
+    setAutocompleteOptions(options);
     if (
       newValue !== '' &&
       searchInputRef?.current?.contains(document.activeElement)
     ) {
-      setIsAutocompleteOpen(true);
-
-      // When the value of the search input changes, build a list of no more than 10 autocomplete options.
-      // Options which start with the search input value are listed first, followed by options which contain
-      // the search input value.
-      let options = navLinksArray
-        .filter(({ title }) =>
-          title.toLowerCase().includes(newValue.toLowerCase())
-        )
-        .map(menuNav);
-      if (options.length > 10) {
-        options = options.slice(0, 10);
-      }
-
       // The menu is hidden if there are no options
       setIsAutocompleteOpen(options.length > 0);
-
-      setAutocompleteOptions(options);
     } else {
       setIsAutocompleteOpen(false);
     }