From 0a4f648ab573c09f516f2d90f038d130f8277cd0 Mon Sep 17 00:00:00 2001
From: rgomez <rgomez@irontec.com>
Date: Wed, 4 Sep 2024 16:23:23 +0200
Subject: [PATCH] filter correctly when we are in a list with pagination

---
 library/package.json                               |  2 +-
 .../components/List/Content/FastSearchField.tsx    | 14 ++++++++++----
 .../List/Content/hook/useFirstColumnCriteria.ts    |  6 +++---
 .../ContentFilterSelector.tsx                      |  5 ++++-
 4 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/library/package.json b/library/package.json
index b6c6437..c6f6201 100644
--- a/library/package.json
+++ b/library/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@irontec/ivoz-ui",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "UI library used in ivozprovider",
   "license": "GPL-3.0",
   "main": "index.js",
diff --git a/library/src/components/List/Content/FastSearchField.tsx b/library/src/components/List/Content/FastSearchField.tsx
index eac0fee..194eb5f 100644
--- a/library/src/components/List/Content/FastSearchField.tsx
+++ b/library/src/components/List/Content/FastSearchField.tsx
@@ -23,9 +23,9 @@ const FastSearchField = (
 ): JSX.Element => {
   const { className, path, entityService, ignoreColumn } = props;
 
-  const queryStringCriteria = useStoreState((state) => [
-    ...state.route.queryStringCriteria,
-  ]);
+  const storeQueryStringCriteria = useStoreState(
+    (state) => state.route.queryStringCriteria
+  );
   const setQueryStringCriteria = useStoreActions((actions) => {
     return actions.route.setQueryStringCriteria;
   });
@@ -69,6 +69,8 @@ const FastSearchField = (
 
     let match = false;
     let matchIdx: string | undefined;
+
+    const queryStringCriteria = [...storeQueryStringCriteria];
     for (const idx in queryStringCriteria) {
       if (queryStringCriteria[idx].name !== firstColumnCriteria.name) {
         continue;
@@ -90,7 +92,11 @@ const FastSearchField = (
       queryStringCriteria.splice(parseInt(matchIdx, 10), 1);
     }
 
-    setQueryStringCriteria(queryStringCriteria);
+    const queryStringCriteriaWithoutPagination = queryStringCriteria.filter(
+      (criteria) => criteria.name !== '_page'
+    );
+
+    setQueryStringCriteria(queryStringCriteriaWithoutPagination);
   };
 
   const changeHandler: React.ChangeEventHandler<HTMLInputElement> = ({
diff --git a/library/src/components/List/Content/hook/useFirstColumnCriteria.ts b/library/src/components/List/Content/hook/useFirstColumnCriteria.ts
index 36f33be..d23c334 100644
--- a/library/src/components/List/Content/hook/useFirstColumnCriteria.ts
+++ b/library/src/components/List/Content/hook/useFirstColumnCriteria.ts
@@ -19,9 +19,9 @@ const useFirstColumnCriteria = (
     undefined | CriteriaFilterValue
   >(undefined);
 
-  const queryStringCriteria = useStoreState((state) => [
-    ...state.route.queryStringCriteria,
-  ]);
+  const queryStringCriteria = useStoreState(
+    (state) => state.route.queryStringCriteria
+  );
 
   const storeState = useStoreState(
     (state) => state,
diff --git a/library/src/components/List/Filter/ContentFilterSelector/ContentFilterSelector.tsx b/library/src/components/List/Filter/ContentFilterSelector/ContentFilterSelector.tsx
index 9a94865..5a6cd13 100644
--- a/library/src/components/List/Filter/ContentFilterSelector/ContentFilterSelector.tsx
+++ b/library/src/components/List/Filter/ContentFilterSelector/ContentFilterSelector.tsx
@@ -175,7 +175,10 @@ export default function ContentFilterSelector(
             variant='contained'
             disabled={criteria.length < 1}
             onClick={() => {
-              commitCriteria(criteria);
+              const queryStringCriteriaWithoutPagination = criteria.filter(
+                (criteria) => criteria.name !== '_page'
+              );
+              commitCriteria(queryStringCriteriaWithoutPagination);
             }}
           >
             {_('Apply')}