(airflow) branch main updated: feat: persist Dag search query across navigation (#54059)

[jscheffl]

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

jscheffl pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/airflow.git


The following commit(s) were added to refs/heads/main by this push:
     new 32c2d7ad240 feat: persist Dag search query across navigation (#54059)
32c2d7ad240 is described below

commit 32c2d7ad2400998e42d740570a7377bf1de09c2d
Author: Yeonguk Choo <choo121...@gmail.com>
AuthorDate: Mon Aug 4 05:55:14 2025 +0900

    feat: persist Dag search query across navigation (#54059)
    
    * feat: persist Dag search query across navigation
    
    * switch from localStorage to sessionStorage for Dag search pattern
---
 airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx 
b/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx
index 7874008f6ad..f3f785218a5 100644
--- a/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx
@@ -31,7 +31,7 @@ import type { ColumnDef } from "@tanstack/react-table";
 import { useCallback, useState, useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { Link as RouterLink, useSearchParams } from "react-router-dom";
-import { useLocalStorage } from "usehooks-ts";
+import { useLocalStorage, useSessionStorage } from "usehooks-ts";
 
 import type { DagRunState, DAGWithLatestDagRunsResponse } from 
"openapi/requests/types.gen";
 import DeleteDagButton from "src/components/DagActions/DeleteDagButton";
@@ -203,8 +203,9 @@ export const DagsList = () => {
   const { setTableURLState, tableURLState } = useTableURLState();
 
   const { pagination, sorting } = tableURLState;
+  const [savedSearchPattern, setSavedSearchPattern] = 
useSessionStorage("dags_search_temp", "");
   const [dagDisplayNamePattern, setDagDisplayNamePattern] = useState(
-    searchParams.get(NAME_PATTERN) ?? undefined,
+    searchParams.get(NAME_PATTERN) ?? savedSearchPattern,
   );
 
   const [sort] = sorting;
@@ -213,6 +214,7 @@ export const DagsList = () => {
   const columns = useMemo(() => createColumns(translate), [translate]);
 
   const handleSearchChange = (value: string) => {
+    setSavedSearchPattern(value);
     if (value) {
       searchParams.set(NAME_PATTERN, value);
     } else {
@@ -244,7 +246,7 @@ export const DagsList = () => {
   }
 
   const { data, error, isLoading } = useDags({
-    dagDisplayNamePattern: Boolean(dagDisplayNamePattern) ? 
`${dagDisplayNamePattern}` : undefined,
+    dagDisplayNamePattern: Boolean(dagDisplayNamePattern) ? 
dagDisplayNamePattern : undefined,
     dagRunsLimit,
     isFavorite,
     lastDagRunState,
@@ -275,7 +277,7 @@ export const DagsList = () => {
       <VStack alignItems="none">
         <SearchBar
           buttonProps={{ disabled: true }}
-          defaultValue={dagDisplayNamePattern ?? ""}
+          defaultValue={dagDisplayNamePattern}
           onChange={handleSearchChange}
           placeHolder={translate("dags:search.dags")}
         />