(airflow) branch main updated: Persist TI tabs in dag view for Gantt bar click (#55191)

[bbovenzi]

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

bbovenzi 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 20691d55c49 Persist TI tabs in dag view for Gantt bar click (#55191)
20691d55c49 is described below

commit 20691d55c49731ea692d59171cd35e78caa71a92
Author: Guan Ming(Wesley) Chiu <105915352+guan404m...@users.noreply.github.com>
AuthorDate: Wed Sep 3 22:19:38 2025 +0800

    Persist TI tabs in dag view for Gantt bar click (#55191)
---
 .../src/airflow/ui/src/layouts/Details/Gantt/Gantt.tsx     | 10 +++++-----
 .../src/airflow/ui/src/layouts/Details/Gantt/utils.ts      | 14 ++++++++++++--
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/Gantt.tsx 
b/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/Gantt.tsx
index 0aca81bc7e2..deba7682f22 100644
--- a/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/Gantt.tsx
+++ b/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/Gantt.tsx
@@ -75,7 +75,7 @@ const CHART_ROW_HEIGHT = 20;
 const MIN_BAR_WIDTH = 10;
 
 export const Gantt = ({ limit }: Props) => {
-  const { dagId = "", groupId: selectedGroupId, runId, taskId: selectedTaskId 
} = useParams();
+  const { dagId = "", groupId: selectedGroupId, runId = "", taskId: 
selectedTaskId } = useParams();
   const { openGroupIds } = useOpenGroups();
   const { t: translate } = useTranslation("common");
   const { selectedTimezone } = useTimezone();
@@ -101,7 +101,7 @@ export const Gantt = ({ limit }: Props) => {
   // Get grid summaries for groups (which have min/max times)
   const { data: gridTiSummaries, isLoading: summariesLoading } = 
useGridTiSummaries({
     dagId,
-    runId: runId ?? "",
+    runId,
     state: selectedRun?.state,
   });
 
@@ -109,7 +109,7 @@ export const Gantt = ({ limit }: Props) => {
   const { data: taskInstancesData, isLoading: tiLoading } = 
useTaskInstanceServiceGetTaskInstances(
     {
       dagId,
-      dagRunId: runId ?? "~",
+      dagRunId: runId,
     },
     undefined,
     {
@@ -124,7 +124,7 @@ export const Gantt = ({ limit }: Props) => {
   const isLoading = runsLoading || structureLoading || summariesLoading || 
tiLoading;
 
   const data = useMemo(() => {
-    if (isLoading || runId === undefined) {
+    if (isLoading || runId === "") {
       return [];
     }
 
@@ -222,7 +222,7 @@ export const Gantt = ({ limit }: Props) => {
     ],
   );
 
-  if (runId === undefined) {
+  if (runId === "") {
     return undefined;
   }
 
diff --git a/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/utils.ts 
b/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/utils.ts
index 34d5a740e9d..882b31c85f5 100644
--- a/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/utils.ts
+++ b/airflow-core/src/airflow/ui/src/layouts/Details/Gantt/utils.ts
@@ -23,6 +23,7 @@ import type { NavigateFunction, Location } from 
"react-router-dom";
 import type { GridRunsResponse, TaskInstanceState } from "openapi/requests";
 import { getDuration } from "src/utils";
 import { formatDate } from "src/utils/datetimeUtils";
+import { buildTaskInstanceUrl } from "src/utils/links";
 
 export type GanttDataItem = {
   isGroup: boolean;
@@ -38,7 +39,7 @@ type HandleBarClickOptions = {
   data: Array<GanttDataItem>;
   location: Location;
   navigate: NavigateFunction;
-  runId: string | undefined;
+  runId: string;
 };
 
 type ChartOptionsParams = {
@@ -61,9 +62,18 @@ export const createHandleBarClick =
       if (clickedData) {
         const { isGroup, isMapped, taskId } = clickedData;
 
+        const taskUrl = buildTaskInstanceUrl({
+          currentPathname: location.pathname,
+          dagId,
+          isGroup,
+          isMapped: Boolean(isMapped),
+          runId,
+          taskId,
+        });
+
         navigate(
           {
-            pathname: `/dags/${dagId}/runs/${runId}/tasks/${isGroup ? "group/" 
: ""}${taskId}${isMapped ? "/mapped" : ""}`,
+            pathname: taskUrl,
             search: location.search,
           },
           { replace: true },