front: Fix Dynamic Update of Autocomplete Dropdown in Search Component.

Fixed an issue where the autocomplete dropdown in the Search component was not
updating correctly with user input. The dropdown now dynamically updates with
search results as the user types, reflecting successful backend API responses.
This fix involved disabling the built-in filtering of the Autocomplete
component, as per MUI documentation guidelines, to allow for better handling of
dynamic search results.

Issue: #171

Signed-off-by: Nikolay Martyanov <[email protected]>

frontend/src/components/Search.jsx

@@ -117,6 +117,7 @@ function Search() {
     <Autocomplete
       id="search-autocomplete"
       options={searchResults.length > 0 ? formatNames(searchResults) : [inputValue]}
+      filterOptions={(x) => x}
       getOptionLabel={(option) => {
         if (option && typeof option === 'object' && option.name) {
           return option.segment ? `${option.name} (${option.segment})` : option.name;
@@ -159,11 +160,9 @@ function Search() {
           setIsDropdownOpen(false);
           return;
         }
-        // find the region with the matching name
-        const matchingRegion = searchResults.find((region) => region.name === newInputValue);
-        setInputValue(matchingRegion);
+        setInputValue(newInputValue);
         setSearchTerm({
-          name: matchingRegion ? matchingRegion.name : newInputValue,
+          name: newInputValue,
           force: false,
         });
       }}