updated code

Author: omotoshoayomikun

src/app/[locale]/page.tsx

@@ -126,32 +126,6 @@ export default function Page({ params }: { params: { locale: string } }) {
     }
   };
 
-  // const handleSearchBarChange = (event: ChangeEvent<HTMLInputElement>) => {
-    // const newValue = event.target.value;
-    // logger.debug(`Search bar value changed: ${newValue}`);
-
-    // console.log(newValue)
-    // setSearchBarValue(newValue);
-    // console.log(searchBarValue)
-
-    // if (isSearchClicked && newValue.trim() === '') {
-    //   setSearchClicked(false);
-    //   setSearchResults([]); // Reset results
-    //   setSearchQuery(''); // Reset query
-    // }
-
-  // };
-
-
-  // CHECK WHEN THE SEARCH BUTTON IS PREVIOUSLY CLICKED BUT NOW THE SEARCH TEXT INPUT IS EMPTY
-  // useEffect(() => {
-  //   if (isSearchClicked && searchBarValue === '') {
-  //     setSearchClicked(false);
-  //     setSearchResults([]); // 
-  //     setSearchQuery(''); // Reset search query
-  //   }
-  // }, [searchBarValue]);
-
   // Handle search query update from SearchBar and associated results
   const handleSearch = async (query: string) => {
     if (query) {

src/components/shared/SearchBar/SearchBar.tsx

@@ -12,15 +12,20 @@ import { AppContext } from '../../../../context/AppContextProvider';
 interface SearchBarProps {
   onSearch?: (query: string) => void;
   page: 'map_center' | 'default';
-  setSearchResults: (value: any[]) => void;
-  setSearchQuery: (value: string) => void;
-  setSearchClicked: (value: boolean) => void;
-  isSearchClicked: boolean;
+  setSearchResults?: (value: any[]) => void;
+  setSearchQuery?: (value: string) => void;
+  setSearchClicked?: (value: boolean) => void;
+  isSearchClicked?: boolean;
   // handleSearchBarChange: (event: ChangeEvent<HTMLInputElement>) => void;
   // searchBarValue: string;
 }
 
-const SearchBar: React.FC<SearchBarProps> = ({ onSearch, page, setSearchResults, setSearchQuery, isSearchClicked, setSearchClicked }) => {
+const SearchBar: React.FC<SearchBarProps> = ({ onSearch, page, 
+  setSearchResults = () => {}, 
+  setSearchQuery = () => {}, 
+  setSearchClicked = () => {},
+  isSearchClicked
+ }) => {
   const t = useTranslations();
 
   const [searchBarValue, setSearchBarValue] = useState('');
@@ -39,7 +44,7 @@ const SearchBar: React.FC<SearchBarProps> = ({ onSearch, page, setSearchResults,
     logger.debug(`Search bar value changed: ${event.target.value}`);
     setSearchBarValue(event.target.value);
 
-    if (isSearchClicked && newValue.trim() === '') {
+    if (isSearchClicked !== undefined && isSearchClicked && newValue.trim() === '') {
       setSearchClicked(false);
       setSearchResults([]); // Reset results
       setSearchQuery(''); // Reset query