STSMACOM-820 Fix incorrect state calculation in <SearchAndSortQuery> (#…

…1458) * STSMACOM-820 Fix incorrect state calculation in <SearchAndSortQuery> * STSMACOM-820 added tests for SearchAndSortQuery initial value set case
folio-org · Mar 15, 2024 · d3acab3 · d3acab3
1 parent 12cb7ef
commit d3acab3
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 ## 9.2.0 IN PROGRESS
 
+## [9.1.1] (IN PROGRESS)
+
+* Fix incorrect state calculation in `<SearchAndSortQuery>`. Fixes STSMACOM-820.
+
 ## [9.1.0](https://github.com/folio-org/stripes-smart-components/tree/v9.1.0) (2024-03-13)
 [Full Changelog](https://github.com/folio-org/stripes-smart-components/compare/v9.0.1...v9.1.0)
 

diff --git a/lib/SearchAndSort/SearchAndSortQuery.js b/lib/SearchAndSort/SearchAndSortQuery.js
@@ -326,15 +326,28 @@ class SearchAndSortQuery extends React.Component {
     this.setState(curState => {
       const nextState = Object.assign({}, curState, stateToSet);
       nextState.changeType = changeType;
+
+      // calculate full next state, leave calculation of `searchChanged`, `filterChanged` etc flags until we actually have the full next state
+      return queryStateReducer(curState, nextState);
+    });
+    /* React will batch these two setState calls and only one re-render will happen.
+      this second call will have the result of first one as curState so now we can actually compare current state and initial values to determine
+      if current values match initial values
+    */
+    this.setState(curState => {
+      const nextState = {};
       nextState.searchChanged = !isEqual(
-        nextState.searchFields,
+        curState.searchFields,
         curState.default.searchFields
       );
       nextState.filterChanged = !isEqual(
-        nextState.filterFields,
+        curState.filterFields,
         curState.default.filterFields
       );
-      nextState.sortChanged = !isEqual(nextState.sortFields, curState.default.sortFields);
+      nextState.sortChanged = !isEqual(
+        curState.sortFields,
+        curState.default.sortFields,
+      );
       return queryStateReducer(curState, nextState);
     },
     () => {

diff --git a/lib/SearchAndSort/tests/SearchAndSortQueryTests/SASQTestHarness.js b/lib/SearchAndSort/tests/SearchAndSortQueryTests/SASQTestHarness.js
@@ -50,6 +50,19 @@ const SASQTestHarness = ({
         displayName: 'inactive',
       }
       ],
+    },
+    {
+      label: 'Patron group',
+      name:'patronGroup',
+      values:[{
+        name: 'faculty',
+        displayName: 'faculty',
+      },
+      {
+        name: 'staff',
+        displayName: 'staff',
+      }
+      ],
     }
   ];
 

diff --git a/lib/SearchAndSort/tests/SearchAndSortQueryTests/SearchAndSortQuery-test.js b/lib/SearchAndSort/tests/SearchAndSortQueryTests/SearchAndSortQuery-test.js
@@ -57,7 +57,6 @@ describe('SearchAndSortQuery Navigation', () => {
     });
   });
 
-
   describe('navigating to a qindex parameter', () => {
     beforeEach(async () => {
       await Button('test-qindex-nav').click();
@@ -108,5 +107,16 @@ describe('SearchAndSortQuery Navigation', () => {
         return HTML(including('?qindex=title&query=testSearch')).exists();
       });
     });
+
+    describe('when unselecting default filter, selecting another one and selecting default filter again', () => {
+      beforeEach(async () => {
+        await Checkbox('active').click();
+        await Checkbox('staff').click();
+        await Checkbox('active').click();
+      });
+      it('should have both filters selected', () => {
+        return HTML(including('?filters=patronGroup.staff%2Cstatus.active&qindex=title&query=testSearch')).exists();
+      });
+    });
   });
 });