fix(ratingMenu): update lifecycle state (#3987)

Author: francoischalifour

src/connectors/rating-menu/__tests__/connectRatingMenu-test.js

@@ -58,10 +58,15 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/rating-menu
       attribute,
     });
 
-    const config = widget.getConfiguration({});
-    expect(config).toEqual({
-      disjunctiveFacets: [attribute],
-    });
+    const config = widget.getConfiguration(new SearchParameters({}));
+    expect(config).toEqual(
+      new SearchParameters({
+        disjunctiveFacets: [attribute],
+        disjunctiveFacetsRefinements: {
+          grade: [],
+        },
+      })
+    );
 
     const helper = jsHelper({}, '', config);
     helper.search = jest.fn();
@@ -167,7 +172,7 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/rating-menu
       attribute,
     });
 
-    const config = widget.getConfiguration({});
+    const config = widget.getConfiguration(new SearchParameters({}));
 
     const helper = jsHelper({}, '', config);
     helper.search = jest.fn();
@@ -261,6 +266,110 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/rating-menu
     }
   });
 
+  describe('getConfiguration', () => {
+    test('returns initial search parameters', () => {
+      const rendering = jest.fn();
+      const makeWidget = connectRatingMenu(rendering);
+
+      const attribute = 'grade';
+      const widget = makeWidget({
+        attribute,
+      });
+
+      expect(widget.getConfiguration(new SearchParameters({}))).toEqual(
+        new SearchParameters({
+          disjunctiveFacets: [attribute],
+          disjunctiveFacetsRefinements: {
+            grade: [],
+          },
+        })
+      );
+    });
+
+    test('supports previous disjunctive facets refinements', () => {
+      const rendering = jest.fn();
+      const makeWidget = connectRatingMenu(rendering);
+
+      const attribute = 'grade';
+      const widget = makeWidget({
+        attribute,
+      });
+
+      expect(
+        widget.getConfiguration(
+          new SearchParameters({
+            disjunctiveFacets: [attribute],
+            disjunctiveFacetsRefinements: {
+              grade: [4],
+            },
+          })
+        )
+      ).toEqual(
+        new SearchParameters({
+          disjunctiveFacets: [attribute],
+          disjunctiveFacetsRefinements: {
+            grade: [4],
+          },
+        })
+      );
+    });
+  });
+
+  describe('dispose', () => {
+    test('calls the unmount function', () => {
+      const render = jest.fn();
+      const unmount = jest.fn();
+      const makeWidget = connectRatingMenu(render, unmount);
+      const helper = jsHelper({}, '', {});
+      helper.search = jest.fn();
+
+      const attribute = 'grade';
+      const widget = makeWidget({
+        attribute,
+      });
+
+      widget.dispose({ state: helper.state });
+
+      expect(unmount).toHaveBeenCalledTimes(1);
+    });
+
+    test('resets the state', () => {
+      const render = jest.fn();
+      const makeWidget = connectRatingMenu(render);
+      const indexName = 'indexName';
+      const attribute = 'grade';
+      const helper = jsHelper({}, indexName, {
+        disjunctiveFacets: [attribute],
+        disjunctiveFacetsRefinements: {
+          [attribute]: [4, 5],
+        },
+      });
+      helper.search = jest.fn();
+
+      const widget = makeWidget({
+        attribute,
+      });
+
+      expect(helper.state).toEqual(
+        new SearchParameters({
+          index: indexName,
+          disjunctiveFacets: [attribute],
+          disjunctiveFacetsRefinements: {
+            grade: [4, 5],
+          },
+        })
+      );
+
+      const nextState = widget.dispose({ state: helper.state });
+
+      expect(nextState).toEqual(
+        new SearchParameters({
+          index: indexName,
+        })
+      );
+    });
+  });
+
   describe('routing', () => {
     const getInitializedWidget = (config = {}) => {
       const rendering = jest.fn();
@@ -272,7 +381,7 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/rating-menu
         ...config,
       });
 
-      const initialConfig = widget.getConfiguration({});
+      const initialConfig = widget.getConfiguration(new SearchParameters({}));
       const helper = jsHelper({}, '', initialConfig);
       helper.search = jest.fn();
 

src/connectors/rating-menu/connectRatingMenu.js

@@ -106,8 +106,13 @@ export default function connectRatingMenu(renderFn, unmountFn = noop) {
     return {
       $$type: 'ais.ratingMenu',
 
-      getConfiguration() {
-        return { disjunctiveFacets: [attribute] };
+      getConfiguration(state) {
+        return state.setQueryParameters({
+          disjunctiveFacets: [attribute],
+          disjunctiveFacetsRefinements: {
+            [attribute]: state.disjunctiveFacetsRefinements[attribute] || [],
+          },
+        });
       },
 
       init({ helper, createURL, instantSearchInstance }) {
@@ -134,7 +139,7 @@ export default function connectRatingMenu(renderFn, unmountFn = noop) {
         for (let v = max; v >= 0; --v) {
           allValues[v] = 0;
         }
-        results.getFacetValues(attribute).forEach(facet => {
+        (results.getFacetValues(attribute) || []).forEach(facet => {
           const val = Math.round(facet.name);
           if (!val || val > max) {
             return;
@@ -180,11 +185,7 @@ export default function connectRatingMenu(renderFn, unmountFn = noop) {
       dispose({ state }) {
         unmountFn();
 
-        const nextState = state
-          .removeDisjunctiveFacetRefinement(attribute)
-          .removeDisjunctiveFacet(attribute);
-
-        return nextState;
+        return state.removeDisjunctiveFacet(attribute);
       },
 
       getWidgetState(uiState, { searchParameters }) {

src/widgets/rating-menu/__tests__/rating-menu-test.js

@@ -1,5 +1,8 @@
 import { render } from 'preact-compat';
-import jsHelper, { SearchResults } from 'algoliasearch-helper';
+import jsHelper, {
+  SearchResults,
+  SearchParameters,
+} from 'algoliasearch-helper';
 import ratingMenu from '../rating-menu';
 
 jest.mock('preact-compat', () => {
@@ -40,7 +43,11 @@ describe('ratingMenu()', () => {
       attribute,
       cssClasses: { body: ['body', 'cx'] },
     });
-    helper = jsHelper({}, '', widget.getConfiguration({}));
+    helper = jsHelper(
+      {},
+      '',
+      widget.getConfiguration(new SearchParameters({}))
+    );
     jest.spyOn(helper, 'clearRefinements');
     jest.spyOn(helper, 'addDisjunctiveFacetRefinement');
     jest.spyOn(helper, 'getRefinements');
@@ -61,9 +68,14 @@ describe('ratingMenu()', () => {
   });
 
   it('configures the underlying disjunctive facet', () => {
-    expect(widget.getConfiguration()).toEqual({
-      disjunctiveFacets: ['anAttrName'],
-    });
+    expect(widget.getConfiguration(new SearchParameters())).toEqual(
+      new SearchParameters({
+        disjunctiveFacets: ['anAttrName'],
+        disjunctiveFacetsRefinements: {
+          anAttrName: [],
+        },
+      })
+    );
   });
 
   it('calls twice render(<RefinementList props />, container)', () => {
@@ -140,7 +152,11 @@ describe('ratingMenu()', () => {
       attribute,
       cssClasses: { body: ['body', 'cx'] },
     });
-    const _helper = jsHelper({}, '', _widget.getConfiguration({}));
+    const _helper = jsHelper(
+      {},
+      '',
+      _widget.getConfiguration(new SearchParameters({}))
+    );
     _helper.search = jest.fn();
 
     _widget.init({