From a2c5a48434a95432ef369a1ffcd69a1dac435ed7 Mon Sep 17 00:00:00 2001
From: Linh <62679553+dauinh@users.noreply.github.com>
Date: Fri, 3 Jan 2025 12:00:53 -0600
Subject: [PATCH] Redo task instance details (#45382) (#45383)
* redo add task instance details (#45382)
* fix static checks
* fix type error for try instance pid
---
airflow/ui/src/pages/Run/Details.tsx | 193 +++++++++++++++++++++++++++
airflow/ui/src/router.tsx | 3 +-
2 files changed, 195 insertions(+), 1 deletion(-)
create mode 100644 airflow/ui/src/pages/Run/Details.tsx
diff --git a/airflow/ui/src/pages/Run/Details.tsx b/airflow/ui/src/pages/Run/Details.tsx
new file mode 100644
index 0000000000000..bb526041a26a4
--- /dev/null
+++ b/airflow/ui/src/pages/Run/Details.tsx
@@ -0,0 +1,193 @@
+/*!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { Box, Flex, HStack, Table } from "@chakra-ui/react";
+import { useParams, useSearchParams } from "react-router-dom";
+
+import {
+ useTaskInstanceServiceGetMappedTaskInstance,
+ useTaskInstanceServiceGetTaskInstanceTryDetails,
+} from "openapi/queries";
+import { TaskTrySelect } from "src/components/TaskTrySelect";
+import Time from "src/components/Time";
+import { ClipboardRoot, ClipboardIconButton, Status } from "src/components/ui";
+import { getDuration } from "src/utils";
+
+export const Details = () => {
+ const { dagId = "", runId = "", taskId = "" } = useParams();
+ const [searchParams, setSearchParams] = useSearchParams();
+
+ const mapIndexParam = searchParams.get("map_index");
+ const tryNumberParam = searchParams.get("try_number");
+ const mapIndex = parseInt(mapIndexParam ?? "-1", 10);
+
+ const { data: taskInstance } = useTaskInstanceServiceGetMappedTaskInstance({
+ dagId,
+ dagRunId: runId,
+ mapIndex,
+ taskId,
+ });
+
+ const onSelectTryNumber = (newTryNumber: number) => {
+ if (newTryNumber === taskInstance?.try_number) {
+ searchParams.delete("try_number");
+ } else {
+ searchParams.set("try_number", newTryNumber.toString());
+ }
+ setSearchParams(searchParams);
+ };
+
+ const tryNumber = tryNumberParam === null ? taskInstance?.try_number : parseInt(tryNumberParam, 10);
+
+ const { data: tryInstance } = useTaskInstanceServiceGetTaskInstanceTryDetails({
+ dagId,
+ dagRunId: runId,
+ mapIndex,
+ taskId,
+ taskTryNumber: tryNumber ?? 1,
+ });
+
+ return (
+
+ {taskInstance === undefined || tryNumber === undefined || taskInstance.try_number <= 1 ? (
+
+ ) : (
+
+ )}
+
+
+
+ Status
+
+
+
+ {tryInstance?.state ?? "no status"}
+
+
+
+
+ Task ID
+
+
+ {tryInstance?.task_id}
+
+
+
+
+
+
+
+ Run ID
+
+
+ {tryInstance?.dag_run_id}
+
+
+
+
+
+
+
+ Map Index
+ {tryInstance?.map_index}
+
+
+ Operator
+ {tryInstance?.operator}
+
+
+ Duration
+
+ {getDuration(tryInstance?.start_date ?? null, tryInstance?.end_date ?? null)}s
+
+
+
+ Started
+
+
+
+
+
+ Ended
+
+
+
+
+
+ Process ID (PID)
+
+
+ {tryInstance?.pid}
+
+
+
+
+
+
+
+ Hostname
+
+
+ {tryInstance?.hostname}
+
+
+
+
+
+
+
+ Pool
+ {tryInstance?.pool}
+
+
+ Pool Slots
+ {tryInstance?.pool_slots}
+
+
+ Executor
+ {tryInstance?.executor}
+
+
+ Executor Config
+ {tryInstance?.executor_config}
+
+
+ Unix Name
+ {tryInstance?.unixname}
+
+
+ Max Tries
+ {tryInstance?.max_tries}
+
+
+ Queue
+ {tryInstance?.queue}
+
+
+ Priority Weight
+ {tryInstance?.priority_weight}
+
+
+
+
+ );
+};
diff --git a/airflow/ui/src/router.tsx b/airflow/ui/src/router.tsx
index a32337317bd50..7b2f22c2807c7 100644
--- a/airflow/ui/src/router.tsx
+++ b/airflow/ui/src/router.tsx
@@ -32,6 +32,7 @@ import { Dashboard } from "src/pages/Dashboard";
import { ErrorPage } from "src/pages/Error";
import { Events } from "src/pages/Events";
import { Run } from "src/pages/Run";
+import { Details } from "src/pages/Run/Details";
import { TaskInstances } from "src/pages/Run/TaskInstances";
import { Task, Instances } from "src/pages/Task";
import { TaskInstance, Logs } from "src/pages/TaskInstance";
@@ -90,7 +91,7 @@ export const router = createBrowserRouter(
{ element: , path: "events" },
{ element: , path: "xcom" },
{ element: Details
, path: "details" },
+ { element: