This is an automated email from the ASF dual-hosted git repository.

kaxilnaik pushed a commit to branch v3-1-test
in repository https://gitbox.apache.org/repos/asf/airflow.git

commit 7beaa10538005f32535712b84c8c735fffc24511
Author: LI,JHE-CHEN <[email protected]>
AuthorDate: Tue Sep 23 15:01:36 2025 -0400

    fix(ui): Reset pagination on filter change (#55999)
    
    * fix(ui): Reset pagination on filter change
    
    * Update airflow-core/src/airflow/ui/src/utils/useFiltersHandler.ts
    
    * fix(ui): Change SearchParamsKeys from type import to value import
    
    ---------
    
    Co-authored-by: Brent Bovenzi <[email protected]>
    (cherry picked from commit 6441467220dc4e57d54b66aa24877b6848b6ed80)
---
 .../src/airflow/ui/src/utils/useFiltersHandler.ts  | 34 +++++++++++++---------
 1 file changed, 20 insertions(+), 14 deletions(-)

diff --git a/airflow-core/src/airflow/ui/src/utils/useFiltersHandler.ts 
b/airflow-core/src/airflow/ui/src/utils/useFiltersHandler.ts
index ec1bcf710f2..d3543228d94 100644
--- a/airflow-core/src/airflow/ui/src/utils/useFiltersHandler.ts
+++ b/airflow-core/src/airflow/ui/src/utils/useFiltersHandler.ts
@@ -22,7 +22,7 @@ import { useSearchParams } from "react-router-dom";
 import { useTableURLState } from "src/components/DataTable/useTableUrlState";
 import type { FilterValue } from "src/components/FilterBar";
 import { useFilterConfigs } from "src/constants/filterConfigs";
-import type { SearchParamsKeys } from "src/constants/searchParams";
+import { SearchParamsKeys } from "src/constants/searchParams";
 
 export type FilterableSearchParamsKeys =
   | SearchParamsKeys.AFTER
@@ -56,26 +56,32 @@ export const useFiltersHandler = (searchParamKeys: 
Array<FilterableSearchParamsK
   const [searchParams, setSearchParams] = useSearchParams();
   const { setTableURLState, tableURLState } = useTableURLState();
   const { pagination, sorting } = tableURLState;
-
   const handleFiltersChange = useCallback(
     (filters: Record<string, FilterValue>) => {
-      filterConfigs.forEach((config) => {
-        const value = filters[config.key];
-
-        if (value === null || value === undefined || value === "") {
-          searchParams.delete(config.key);
-        } else {
-          searchParams.set(config.key, String(value));
-        }
-      });
-
       setTableURLState({
         pagination: { ...pagination, pageIndex: 0 },
         sorting,
       });
-      setSearchParams(searchParams);
+
+      setSearchParams((prevParams) => {
+        const newParams = new URLSearchParams(prevParams);
+
+        filterConfigs.forEach((config) => {
+          const value = filters[config.key];
+
+          if (value === null || value === undefined || value === "") {
+            newParams.delete(config.key);
+          } else {
+            newParams.set(config.key, String(value));
+          }
+        });
+
+        newParams.delete(SearchParamsKeys.OFFSET);
+
+        return newParams;
+      });
     },
-    [filterConfigs, pagination, searchParams, setSearchParams, 
setTableURLState, sorting],
+    [filterConfigs, pagination, setSearchParams, setTableURLState, sorting],
   );
 
   return {

Reply via email to