From 4e658d52497ea26ddd4228d7fe88b579509a22cb Mon Sep 17 00:00:00 2001
From: Andreea-Lupu <andreealupu1470@yahoo.com>
Date: Mon, 11 Dec 2023 10:24:24 +0200
Subject: [PATCH] fix: show a loading message while waiting for a response

Signed-off-by: Andreea-Lupu <andreealupu1470@yahoo.com>
---
 src/components/Header/SearchSuggestion.jsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/components/Header/SearchSuggestion.jsx b/src/components/Header/SearchSuggestion.jsx
index 88abac5b..0bf2f97f 100644
--- a/src/components/Header/SearchSuggestion.jsx
+++ b/src/components/Header/SearchSuggestion.jsx
@@ -295,12 +295,26 @@ function SearchSuggestion({ setSearchCurrentValue = () => {} }) {
       <List
         {...getMenuProps()}
         className={
-          isOpen && !isLoading && !isFailedSearch
+          isOpen && !isFailedSearch
             ? `${classes.resultsWrapper} ${isComponentFocused && classes.resultsWrapperFocused}`
             : classes.resultsWrapperHidden
         }
       >
         {isOpen && suggestionData?.length > 0 && renderSuggestions()}
+        {isOpen && isLoading && !isEmpty(searchQuery) && isEmpty(suggestionData) && (
+          <>
+            <ListItem
+              className={classes.searchItem}
+              style={{ color: '#52637A', fontSize: '1rem', textOverflow: 'ellipsis' }}
+              {...getItemProps({ item: '', index: 0 })}
+              spacing={2}
+            >
+              <Stack direction="row" spacing={2}>
+                <Typography>Loading...</Typography>
+              </Stack>
+            </ListItem>
+          </>
+        )}
         {isOpen && isEmpty(searchQuery) && isEmpty(suggestionData) && (
           <>
             <ListItem