disable facets while the results are loading

eea · Dec 13, 2023 · 6529042 · 6529042
1 parent 3994c03
commit 6529042
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 1 deletion.
diff --git a/searchlib/components/Facets/Wrappers/AccordionFacetWrapper.jsx b/searchlib/components/Facets/Wrappers/AccordionFacetWrapper.jsx
@@ -5,9 +5,10 @@ import { openFacetsAtom } from '../state';
 import { useSetAtom } from 'jotai';
 import { useAppConfig, useSearchContext } from '@eeacms/search/lib/hocs';
 import Facet from '../Facet';
+import { Dimmer } from 'semantic-ui-react';
 
 const AccordionFacetWrapper = (props) => {
-  const { collapsable = true, field, label } = props;
+  const { collapsable = true, field, label, isLoading } = props;
   const searchContext = useSearchContext();
   const { filters } = searchContext;
 
@@ -79,6 +80,7 @@ const AccordionFacetWrapper = (props) => {
         <Icon className="ri-arrow-down-s-line" />
       </Accordion.Title>
       <Accordion.Content active={isOpened}>
+        {isLoading && <Dimmer active></Dimmer>}
         <Facet
           {...props}
           active={isOpened}

diff --git a/searchlib/components/Facets/Wrappers/DropdownFacetWrapper.jsx b/searchlib/components/Facets/Wrappers/DropdownFacetWrapper.jsx
@@ -30,6 +30,7 @@ const DropdownFacetWrapper = (props) => {
     removeFilter,
     sortedOptions,
     filterType,
+    isLoading,
   } = props;
   const rawSearchContext = useSearchContext();
   const {
@@ -94,6 +95,7 @@ const DropdownFacetWrapper = (props) => {
             </Modal.Header>
             <Modal.Content>
               <SearchContext.Provider value={facetSearchContext}>
+                {isLoading && <Dimmer active></Dimmer>}
                 <SUIFacet
                   {...props}
                   active={isOpen}
@@ -169,6 +171,7 @@ const DropdownFacetWrapper = (props) => {
                   }
                 }}
               >
+                {isLoading && <Dimmer active></Dimmer>}
                 <SUIFacet
                   {...props}
                   active={isOpen}

diff --git a/src/SearchBlock/less/dropdown-filterlist.less b/src/SearchBlock/less/dropdown-filterlist.less
@@ -1,3 +1,4 @@
+
 .searchlib-block {
   .ui.dimmer.facet-dimmer {
     position: fixed;
@@ -147,6 +148,9 @@
           .title i:before {
             font-size: 2rem;
           }
+          .content.active {
+            position:relative !important;
+          }
         }
       }
     }