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 ac0501db66d Wait for config API to avoid NaN passed to offset.
(#44989)
ac0501db66d is described below
commit ac0501db66dac363cf7046682d46cbc03b056693
Author: Karthikeyan Singaravelan <[email protected]>
AuthorDate: Thu Dec 19 23:10:10 2024 +0530
Wait for config API to avoid NaN passed to offset. (#44989)
* Fix NaNs when end_date is not defined.
Fix NaN passed to limit param in API by waiting for config API.
Fix recent task instances sort order.
* Fix NaN offset in XCom page.
* Add getDuration util function.
---
airflow/ui/src/pages/Dag/Runs/Runs.tsx | 23 ++++++++++++----------
airflow/ui/src/pages/Dag/Tasks/TaskRecentRuns.tsx | 4 +++-
airflow/ui/src/pages/Dag/Tasks/Tasks.tsx | 6 ++----
airflow/ui/src/pages/Events/Events.tsx | 20 +++++++++++--------
airflow/ui/src/pages/Run/Header.tsx | 8 ++------
airflow/ui/src/pages/Run/TaskInstances.tsx | 22 ++++++++++++---------
airflow/ui/src/pages/TaskInstance/Header.tsx | 8 ++------
airflow/ui/src/pages/XCom/XCom.tsx | 20 +++++++++++--------
airflow/ui/src/queries/useDags.tsx | 6 ++++--
.../ui/src/utils/{index.ts => datetime_utils.ts} | 8 ++++++--
airflow/ui/src/utils/index.ts | 1 +
11 files changed, 70 insertions(+), 56 deletions(-)
diff --git a/airflow/ui/src/pages/Dag/Runs/Runs.tsx
b/airflow/ui/src/pages/Dag/Runs/Runs.tsx
index 3d8be5adf68..843316e606b 100644
--- a/airflow/ui/src/pages/Dag/Runs/Runs.tsx
+++ b/airflow/ui/src/pages/Dag/Runs/Runs.tsx
@@ -26,7 +26,6 @@ import {
Text,
} from "@chakra-ui/react";
import type { ColumnDef } from "@tanstack/react-table";
-import dayjs from "dayjs";
import { useCallback } from "react";
import {
useParams,
@@ -43,7 +42,7 @@ import { ErrorAlert } from "src/components/ErrorAlert";
import { RunTypeIcon } from "src/components/RunTypeIcon";
import Time from "src/components/Time";
import { Select, Status } from "src/components/ui";
-import { capitalize } from "src/utils";
+import { capitalize, getDuration } from "src/utils";
const columns: Array<ColumnDef<DAGRunResponse>> = [
{
@@ -90,7 +89,7 @@ const columns: Array<ColumnDef<DAGRunResponse>> = [
},
{
cell: ({ row: { original } }) =>
-
`${dayjs.duration(dayjs(original.end_date).diff(original.start_date)).asSeconds().toFixed(2)}s`,
+ getDuration(original.start_date, original.end_date),
header: "Duration",
},
{
@@ -133,13 +132,17 @@ export const Runs = () => {
const filteredState = searchParams.get(STATE_PARAM);
- const { data, error, isFetching, isLoading } = useDagRunServiceGetDagRuns({
- dagId: dagId ?? "~",
- limit: pagination.pageSize,
- offset: pagination.pageIndex * pagination.pageSize,
- orderBy,
- state: filteredState === null ? undefined : [filteredState],
- });
+ const { data, error, isFetching, isLoading } = useDagRunServiceGetDagRuns(
+ {
+ dagId: dagId ?? "~",
+ limit: pagination.pageSize,
+ offset: pagination.pageIndex * pagination.pageSize,
+ orderBy,
+ state: filteredState === null ? undefined : [filteredState],
+ },
+ undefined,
+ { enabled: !isNaN(pagination.pageSize) },
+ );
const handleStateChange = useCallback(
({ value }: SelectValueChangeDetails<string>) => {
diff --git a/airflow/ui/src/pages/Dag/Tasks/TaskRecentRuns.tsx
b/airflow/ui/src/pages/Dag/Tasks/TaskRecentRuns.tsx
index 02f34f89679..86c125db639 100644
--- a/airflow/ui/src/pages/Dag/Tasks/TaskRecentRuns.tsx
+++ b/airflow/ui/src/pages/Dag/Tasks/TaskRecentRuns.tsx
@@ -42,7 +42,9 @@ export const TaskRecentRuns = ({
...taskInstance,
duration:
dayjs
- .duration(dayjs(taskInstance.end_date).diff(taskInstance.start_date))
+ .duration(
+ dayjs(taskInstance.end_date ??
dayjs()).diff(taskInstance.start_date),
+ )
.asSeconds() || 0,
}));
diff --git a/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx
b/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx
index cfc4eb3f2fb..6701a8a1f4e 100644
--- a/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx
+++ b/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx
@@ -89,6 +89,7 @@ export const Tasks = () => {
dagId,
dagRunId: "~",
logicalDateGte: runs.at(-1)?.logical_date ?? "",
+ orderBy: "-start_date",
},
undefined,
{ enabled: Boolean(runs[0]?.dag_run_id) },
@@ -101,10 +102,7 @@ export const Tasks = () => {
{pluralize("Task", data ? data.total_entries : 0)}
</Heading>
<DataTable
- cardDef={cardDef(
- dagId,
- taskInstancesResponse?.task_instances.reverse(),
- )}
+ cardDef={cardDef(dagId, taskInstancesResponse?.task_instances)}
columns={[]}
data={data ? data.tasks : []}
displayMode="card"
diff --git a/airflow/ui/src/pages/Events/Events.tsx
b/airflow/ui/src/pages/Events/Events.tsx
index 95c7b888a81..f93d8a07526 100644
--- a/airflow/ui/src/pages/Events/Events.tsx
+++ b/airflow/ui/src/pages/Events/Events.tsx
@@ -124,14 +124,18 @@ export const Events = () => {
error: EventsError,
isFetching,
isLoading,
- } = useEventLogServiceGetEventLogs({
- dagId,
- limit: pagination.pageSize,
- offset: pagination.pageIndex * pagination.pageSize,
- orderBy,
- runId,
- taskId,
- });
+ } = useEventLogServiceGetEventLogs(
+ {
+ dagId,
+ limit: pagination.pageSize,
+ offset: pagination.pageIndex * pagination.pageSize,
+ orderBy,
+ runId,
+ taskId,
+ },
+ undefined,
+ { enabled: !isNaN(pagination.pageSize) },
+ );
return (
<Box>
diff --git a/airflow/ui/src/pages/Run/Header.tsx
b/airflow/ui/src/pages/Run/Header.tsx
index 6d439d2f8fc..47c0b252a9b 100644
--- a/airflow/ui/src/pages/Run/Header.tsx
+++ b/airflow/ui/src/pages/Run/Header.tsx
@@ -17,7 +17,6 @@
* under the License.
*/
import { Box, Flex, Heading, HStack, SimpleGrid, Text } from
"@chakra-ui/react";
-import dayjs from "dayjs";
import { FiBarChart } from "react-icons/fi";
import { MdOutlineModeComment } from "react-icons/md";
@@ -27,6 +26,7 @@ import { RunTypeIcon } from "src/components/RunTypeIcon";
import { Stat } from "src/components/Stat";
import Time from "src/components/Time";
import { Status } from "src/components/ui";
+import { getDuration } from "src/utils";
export const Header = ({ dagRun }: { readonly dagRun: DAGRunResponse }) => (
<Box borderColor="border" borderRadius={8} borderWidth={1} p={2}>
@@ -68,11 +68,7 @@ export const Header = ({ dagRun }: { readonly dagRun:
DAGRunResponse }) => (
<Time datetime={dagRun.end_date} />
</Stat>
<Stat label="Duration">
- {dayjs
- .duration(dayjs(dagRun.end_date).diff(dagRun.start_date))
- .asSeconds()
- .toFixed(2)}
- s
+ {getDuration(dagRun.start_date, dagRun.end_date)}s
</Stat>
</SimpleGrid>
</Box>
diff --git a/airflow/ui/src/pages/Run/TaskInstances.tsx
b/airflow/ui/src/pages/Run/TaskInstances.tsx
index 3cb9ceb5283..c6cef5cf653 100644
--- a/airflow/ui/src/pages/Run/TaskInstances.tsx
+++ b/airflow/ui/src/pages/Run/TaskInstances.tsx
@@ -18,7 +18,6 @@
*/
import { Box, Link } from "@chakra-ui/react";
import type { ColumnDef } from "@tanstack/react-table";
-import dayjs from "dayjs";
import { Link as RouterLink, useParams } from "react-router-dom";
import { useTaskInstanceServiceGetTaskInstances } from "openapi/queries";
@@ -28,6 +27,7 @@ import { useTableURLState } from
"src/components/DataTable/useTableUrlState";
import { ErrorAlert } from "src/components/ErrorAlert";
import Time from "src/components/Time";
import { Status } from "src/components/ui";
+import { getDuration } from "src/utils";
const columns: Array<ColumnDef<TaskInstanceResponse>> = [
{
@@ -82,7 +82,7 @@ const columns: Array<ColumnDef<TaskInstanceResponse>> = [
{
cell: ({ row: { original } }) =>
-
`${dayjs.duration(dayjs(original.end_date).diff(original.start_date)).asSeconds().toFixed(2)}s`,
+ `${getDuration(original.start_date, original.end_date)}s`,
header: "Duration",
},
];
@@ -95,13 +95,17 @@ export const TaskInstances = () => {
const orderBy = sort ? `${sort.desc ? "-" : ""}${sort.id}` : "-start_date";
const { data, error, isFetching, isLoading } =
- useTaskInstanceServiceGetTaskInstances({
- dagId,
- dagRunId: runId,
- limit: pagination.pageSize,
- offset: pagination.pageIndex * pagination.pageSize,
- orderBy,
- });
+ useTaskInstanceServiceGetTaskInstances(
+ {
+ dagId,
+ dagRunId: runId,
+ limit: pagination.pageSize,
+ offset: pagination.pageIndex * pagination.pageSize,
+ orderBy,
+ },
+ undefined,
+ { enabled: !isNaN(pagination.pageSize) },
+ );
return (
<Box>
diff --git a/airflow/ui/src/pages/TaskInstance/Header.tsx
b/airflow/ui/src/pages/TaskInstance/Header.tsx
index c8722fa4ff3..4d1a3b84803 100644
--- a/airflow/ui/src/pages/TaskInstance/Header.tsx
+++ b/airflow/ui/src/pages/TaskInstance/Header.tsx
@@ -17,13 +17,13 @@
* under the License.
*/
import { Box, Flex, Heading, HStack, SimpleGrid, Text } from
"@chakra-ui/react";
-import dayjs from "dayjs";
import { MdOutlineModeComment, MdOutlineTask } from "react-icons/md";
import type { TaskInstanceResponse } from "openapi/requests/types.gen";
import { Stat } from "src/components/Stat";
import Time from "src/components/Time";
import { Status } from "src/components/ui";
+import { getDuration } from "src/utils";
export const Header = ({
taskInstance,
@@ -71,11 +71,7 @@ export const Header = ({
<Time datetime={taskInstance.end_date} />
</Stat>
<Stat label="Duration">
- {dayjs
- .duration(dayjs(taskInstance.end_date).diff(taskInstance.start_date))
- .asSeconds()
- .toFixed(2)}
- s
+ {getDuration(taskInstance.start_date, taskInstance.end_date)}s
</Stat>
</SimpleGrid>
</Box>
diff --git a/airflow/ui/src/pages/XCom/XCom.tsx
b/airflow/ui/src/pages/XCom/XCom.tsx
index 13fa99b1021..f309d2532da 100644
--- a/airflow/ui/src/pages/XCom/XCom.tsx
+++ b/airflow/ui/src/pages/XCom/XCom.tsx
@@ -58,14 +58,18 @@ export const XCom = () => {
const { setTableURLState, tableURLState } = useTableURLState();
const { pagination } = tableURLState;
- const { data, error, isFetching, isLoading } = useXcomServiceGetXcomEntries({
- dagId,
- dagRunId: runId,
- limit: pagination.pageSize,
- mapIndex,
- offset: pagination.pageIndex * pagination.pageSize,
- taskId,
- });
+ const { data, error, isFetching, isLoading } = useXcomServiceGetXcomEntries(
+ {
+ dagId,
+ dagRunId: runId,
+ limit: pagination.pageSize,
+ mapIndex,
+ offset: pagination.pageIndex * pagination.pageSize,
+ taskId,
+ },
+ undefined,
+ { enabled: !isNaN(pagination.pageSize) },
+ );
return (
<Box>
diff --git a/airflow/ui/src/queries/useDags.tsx
b/airflow/ui/src/queries/useDags.tsx
index 09f1562fc41..a19592796d3 100644
--- a/airflow/ui/src/queries/useDags.tsx
+++ b/airflow/ui/src/queries/useDags.tsx
@@ -50,10 +50,12 @@ export const useDags = (
tags?: Array<string>;
} = {},
) => {
+ const offsetDefined =
+ searchParams.offset === undefined ? false : !isNaN(searchParams.offset);
const { data, error, isFetching, isLoading } = useDagServiceGetDags(
searchParams,
undefined,
- queryOptions,
+ { ...queryOptions, enabled: offsetDefined },
);
const { orderBy, ...runsParams } = searchParams;
@@ -68,7 +70,7 @@ export const useDags = (
dagRunsLimit: 14,
},
undefined,
- queryOptions,
+ { ...queryOptions, enabled: offsetDefined },
);
const dags = (data?.dags ?? []).map((dag) => {
diff --git a/airflow/ui/src/utils/index.ts
b/airflow/ui/src/utils/datetime_utils.ts
similarity index 78%
copy from airflow/ui/src/utils/index.ts
copy to airflow/ui/src/utils/datetime_utils.ts
index 7083089c2b1..d1660050be7 100644
--- a/airflow/ui/src/utils/index.ts
+++ b/airflow/ui/src/utils/datetime_utils.ts
@@ -16,6 +16,10 @@
* specific language governing permissions and limitations
* under the License.
*/
+import dayjs from "dayjs";
-export { capitalize } from "./capitalize";
-export { pluralize } from "./pluralize";
+export const getDuration = (startDate: string | null, endDate: string | null)
=>
+ dayjs
+ .duration(dayjs(endDate ?? undefined).diff(startDate ?? undefined))
+ .asSeconds()
+ .toFixed(2);
diff --git a/airflow/ui/src/utils/index.ts b/airflow/ui/src/utils/index.ts
index 7083089c2b1..bdfe8ac8d80 100644
--- a/airflow/ui/src/utils/index.ts
+++ b/airflow/ui/src/utils/index.ts
@@ -19,3 +19,4 @@
export { capitalize } from "./capitalize";
export { pluralize } from "./pluralize";
+export { getDuration } from "./datetime_utils";
