web: core/ListSearch fixes

agama-project · May 16, 2024 · 18dc8a6 · 18dc8a6
1 parent 53d2d1c
commit 18dc8a6
Showing 1 changed file with 13 additions and 4 deletions.
diff --git a/web/src/components/core/ListSearch.jsx b/web/src/components/core/ListSearch.jsx
@@ -38,7 +38,7 @@ const search = (elements, term) => {
 };
 
 /**
- * TODO: Rename
+ * TODO: Rename and/or refactor?
  * Input field for searching in a given list of elements.
  * @component
  *
@@ -54,23 +54,32 @@ export default function ListSearch({
 }) {
   const [value, setValue] = useState("");
   const [resultSize, setResultSize] = useState(elements.length);
-  const searchHandler = useDebounce(term => {
-    const result = search(elements, term);
+
+  const updateResult = (result) => {
     setResultSize(result.length);
     onChangeProp(result);
+  };
+
+  const searchHandler = useDebounce(term => {
+    updateResult(search(elements, term));
   }, 500);
 
   const onChange = (value) => {
     setValue(value);
     searchHandler(value);
   };
 
+  const onClear = () => {
+    setValue("");
+    updateResult(elements);
+  };
+
   return (
     <SearchInput
       placeholder={placeholder}
       value={value}
       onChange={(_, value) => onChange(value)}
-      onClear={() => onChangeProp(elements)}
+      onClear={onClear}
       resultsCount={resultSize}
     />
   );