Checkpoint

eea · Dec 20, 2022 · 187559c · 187559c
1 parent 85ae545
commit 187559c
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 44 deletions.
diff --git a/searchlib/components/Facets/Facet.jsx b/searchlib/components/Facets/Facet.jsx
@@ -30,7 +30,7 @@ const FacetContainer = (props) => {
 
   const facetsForField = facets[field];
 
-  console.log('view', facets, field, props);
+  // console.log('view', facets, field, props);
 
   if (!facetsForField) return null;
 

diff --git a/searchlib/components/SearchApp/FacetApp.jsx b/searchlib/components/SearchApp/FacetApp.jsx
@@ -1,22 +1,20 @@
 import React from 'react';
 import { Facet as SUIFacet } from '@eeacms/search/components';
-import {
-  useSearchContext,
-  SearchContext,
-  useProxiedSearchContext,
-} from '@eeacms/search/lib/hocs';
+import { useSearchContext, SearchContext } from '@eeacms/search/lib/hocs';
 import BasicSearchApp from './BasicSearchApp';
+import { atom, useAtom } from 'jotai';
+import { atomFamily } from 'jotai/utils';
+import { isEqual } from 'lodash';
 
-const timeoutRef = {};
+const filterFamily = atomFamily(
+  ({ field }) => atom(),
+  (a, b) => a.field === b.field,
+);
 
 function BoostrapFacetView(props) {
   const { field, onChange } = props;
   const { appConfig, registry } = props;
-  const searchContext = useSearchContext();
-  const {
-    searchContext: facetSearchContext,
-    // applySearch,
-  } = useProxiedSearchContext(searchContext);
+  const facetSearchContext = useSearchContext();
   const { filters } = facetSearchContext;
 
   const facet = appConfig.facets?.find((f) => f.field === field);
@@ -33,18 +31,15 @@ function BoostrapFacetView(props) {
   );
   const FacetComponent = registry.resolve[facet.factory].component;
 
+  const filterAtom = filterFamily(field);
+  const [savedFilters, setSavedFilters] = useAtom(filterAtom);
+
   React.useEffect(() => {
-    const { current } = timeoutRef;
-    if (current) {
-      clearTimeout(current);
-    } else {
-      timeoutRef.current = setTimeout(() => onChange(filters), 400);
+    if (!isEqual(filters, savedFilters)) {
+      setSavedFilters(filters);
+      onChange(filters);
     }
-
-    return () => {
-      if (current) clearTimeout(current);
-    };
-  }, [filters, onChange]);
+  }, [filters, onChange, savedFilters, setSavedFilters]);
 
   return (
     <SearchContext.Provider value={facetSearchContext}>
@@ -62,24 +57,3 @@ function BoostrapFacetView(props) {
 export default function FacetApp(props) {
   return <BasicSearchApp {...props} searchViewComponent={BoostrapFacetView} />;
 }
-
-// console.log('props', props);
-// const rawSearchContext = useSearchContext();
-// const {
-//   searchContext: facetSearchContext,
-//   applySearch,
-// } = useProxiedSearchContext(rawSearchContext);
-// const { appConfig } = useAppConfig();
-// console.log('facet', facet);
-// import useWhyDidYouUpdate from '@eeacms/search/lib/hocs/useWhyDidYouUpdate';
-// import useDeepCompareEffect from 'use-deep-compare-effect';
-// console.log('outside');
-// console.log('triggered change on filters');
-
-// useWhyDidYouUpdate('Bootstrap', { filters, onChange });
-// React.useEffect(
-//   () => () => {
-//     console.log('unmount BootstrapFacetView');
-//   },
-//   [],
-// );
diff --git a/src/SearchBlock/FacetValueWidget.jsx b/src/SearchBlock/FacetValueWidget.jsx
@@ -4,7 +4,10 @@ import { FacetApp } from '@eeacms/search';
 export default function FacetValueWidget(props) {
   const { facetName, onChange, id } = props;
   const onChangeHandler = React.useCallback(
-    (filters) => onChange(id, filters),
+    (filters) => {
+      console.log('onchange', filters);
+      onChange(id, filters);
+    },
     [id, onChange],
   );
   return facetName ? (