From a84380b5a9b1244a13ef87793d246d55840a04fd Mon Sep 17 00:00:00 2001
From: Giulia Ghisini <giulia.ghisini@redturtle.it>
Date: Tue, 26 Nov 2024 11:47:20 +0100
Subject: [PATCH] fix: loading search results modal

---
 .../Header/HeaderSearch/SearchModal.jsx           | 15 +++++++++++----
 theme/extras/_modals.scss                         | 13 +++++++++++++
 2 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx b/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx
index 10acbf864..2e1ca4c0c 100644
--- a/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx
+++ b/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx
@@ -26,6 +26,7 @@ import {
   FormGroup,
   Input,
   Label,
+  Spinner,
   Toggle,
 } from 'design-react-kit/dist/design-react-kit';
 
@@ -167,7 +168,7 @@ const SearchModal = ({ closeModal, show }) => {
 
   const dispatch = useDispatch();
   const location = useLocation();
-
+  const [redirectingToResults, setRedirectingToResults] = useState(false);
   const [advancedSearch, setAdvancedSearch] = useState(false);
   const [advancedTab, setAdvancedTab] = useState(null);
   const [searchableText, setSearchableText] = useState(
@@ -291,10 +292,11 @@ const SearchModal = ({ closeModal, show }) => {
     setOptions((prevOptions) => ({ ...prevOptions, [optId]: value }));
 
   const submitSearch = () => {
+    setRedirectingToResults(true);
     setAdvancedSearch(false);
-    setTimeout(() => {
-      closeModal();
-    }, 500);
+    // setTimeout(() => {
+    //   closeModal();
+    // }, 500);
   };
 
   const handleEnterSearch = (e) => {
@@ -915,6 +917,11 @@ const SearchModal = ({ closeModal, show }) => {
             </div>
           )}
         </Container>
+        {redirectingToResults && (
+          <div className="overlay loading-results">
+            <Spinner active />
+          </div>
+        )}
       </ModalBody>
     </Modal>
   );
diff --git a/theme/extras/_modals.scss b/theme/extras/_modals.scss
index 3cee03aad..915029908 100644
--- a/theme/extras/_modals.scss
+++ b/theme/extras/_modals.scss
@@ -33,4 +33,17 @@
   .chip {
     cursor: pointer;
   }
+
+  .overlay.loading-results {
+    position: fixed;
+    z-index: 9999;
+    top: 0;
+    left: 0;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    align-items: center;
+    justify-content: center;
+    background-color: hsl(0deg 0% 100% / 64%);
+  }
 }