SONAR-19709 Fixing input search debounce related issue

diff --git a/server/sonar-web/design-system/src/components/input/InputSearch.tsx b/server/sonar-web/design-system/src/components/input/InputSearch.tsx
index beb1ef1ca182a5f55a02872bab6c3fc70e4c5f7f..c6d14f4639cd103f3042c06e279994121c3e4864 100644 (file)
--- a/server/sonar-web/design-system/src/components/input/InputSearch.tsx
+++ b/server/sonar-web/design-system/src/components/input/InputSearch.tsx
@@ -87,11 +87,16 @@ export function InputSearch({
     'sw-pr-10': value.length > 0,
   });
 
+  /*
+   * ParentValue is useful as an initial value for a page load
+   * And when the parent component wants to empty the search (facet search)
+   * After that the input value is controlled by this component
+   */
   useEffect(() => {
-    if (parentValue !== undefined) {
+    if (parentValue === '' || (parentValue !== undefined && value === '')) {
       setValue(parentValue);
     }
-  }, [parentValue]);
+  }, [parentValue]); // eslint-disable-line
 
   useEffect(() => {
     if (autoFocus && input.current) {
@@ -121,9 +126,7 @@ export function InputSearch({
 
   const handleClearClick = () => {
     onChange('');
-    if (parentValue === undefined || parentValue === '') {
-      setValue('');
-    }
+    setValue('');
     input.current?.focus();
   };
   const ref = (node: HTMLInputElement | null) => {