Regenerate UI client and handle deadline alerts with no fixed interval

airflow-core/src/airflow/ui/openapi-gen/queries/ensureQueryData.ts

@@ -1872,7 +1872,7 @@ export const ensureUseDeadlinesServiceGetDeadlinesData = (queryClient: QueryClie
 * @param data.dagId
 * @param data.limit
 * @param data.offset
-* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name, interval`
+* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name`
 * @returns DeadlineAlertCollectionResponse Successful Response
 * @throws ApiError
 */

airflow-core/src/airflow/ui/openapi-gen/queries/prefetch.ts

@@ -1872,7 +1872,7 @@ export const prefetchUseDeadlinesServiceGetDeadlines = (queryClient: QueryClient
 * @param data.dagId
 * @param data.limit
 * @param data.offset
-* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name, interval`
+* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name`
 * @returns DeadlineAlertCollectionResponse Successful Response
 * @throws ApiError
 */

airflow-core/src/airflow/ui/openapi-gen/queries/queries.ts

@@ -1872,7 +1872,7 @@ export const useDeadlinesServiceGetDeadlines = <TData = Common.DeadlinesServiceG
 * @param data.dagId
 * @param data.limit
 * @param data.offset
-* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name, interval`
+* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name`
 * @returns DeadlineAlertCollectionResponse Successful Response
 * @throws ApiError
 */

airflow-core/src/airflow/ui/openapi-gen/queries/suspense.ts

@@ -1872,7 +1872,7 @@ export const useDeadlinesServiceGetDeadlinesSuspense = <TData = Common.Deadlines
 * @param data.dagId
 * @param data.limit
 * @param data.offset
-* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name, interval`
+* @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name`
 * @returns DeadlineAlertCollectionResponse Successful Response
 * @throws ApiError
 */

airflow-core/src/airflow/ui/openapi-gen/requests/schemas.gen.ts

@@ -9601,9 +9601,16 @@ export const $DeadlineAlertResponse = {
             title: 'Reference Type'
         },
         interval: {
-            type: 'number',
+            anyOf: [
+                {
+                    type: 'number'
+                },
+                {
+                    type: 'null'
+                }
+            ],
             title: 'Interval',
-            description: 'Interval in seconds between deadline evaluations.'
+            description: 'Interval in seconds between the reference time and the deadline. Null for a dynamic interval (e.g. a VariableInterval) whose value is only resolved at scheduler evaluation time.'
         },
         created_at: {
             type: 'string',
@@ -9612,7 +9619,7 @@ export const $DeadlineAlertResponse = {
         }
     },
     type: 'object',
-    required: ['id', 'reference_type', 'interval', 'created_at'],
+    required: ['id', 'reference_type', 'created_at'],
     title: 'DeadlineAlertResponse',
     description: 'DeadlineAlert serializer for responses.'
 } as const;

airflow-core/src/airflow/ui/openapi-gen/requests/services.gen.ts

@@ -4839,7 +4839,7 @@ export class DeadlinesService {
      * @param data.dagId
      * @param data.limit
      * @param data.offset
-     * @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name, interval`
+     * @param data.orderBy Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name`
      * @returns DeadlineAlertCollectionResponse Successful Response
      * @throws ApiError
      */

airflow-core/src/airflow/ui/openapi-gen/requests/types.gen.ts

@@ -2433,9 +2433,9 @@ export type DeadlineAlertResponse = {
     name?: string | null;
     reference_type: string;
     /**
-     * Interval in seconds between deadline evaluations.
+     * Interval in seconds between the reference time and the deadline. Null for a dynamic interval (e.g. a VariableInterval) whose value is only resolved at scheduler evaluation time.
      */
-    interval: number;
+    interval?: number | null;
     created_at: string;
 };
 
@@ -4604,7 +4604,7 @@ export type GetDagDeadlineAlertsData = {
     limit?: number;
     offset?: number;
     /**
-     * Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name, interval`
+     * Attributes to order by, multi criteria sort is supported. Prefix with `-` for descending order. Supported attributes: `id, created_at, name`
      */
     orderBy?: Array<(string)>;
 };

airflow-core/src/airflow/ui/public/i18n/locales/en/dag.json

@@ -42,6 +42,7 @@
   },
   "deadlineAlerts": {
     "completionRule": "Must complete within {{interval}} of {{reference}}",
+    "completionRuleDynamic": "Must complete within a variable interval measured from {{reference}}",
     "count_one": "{{count}} deadline",
     "count_other": "{{count}} deadlines",
     "referenceType": {

airflow-core/src/airflow/ui/src/pages/Dag/DeadlineAlertsBadge.test.tsx

@@ -0,0 +1,89 @@
+/*!
+ * 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 "@testing-library/jest-dom";
+import { fireEvent, render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+import type * as OpenapiQueries from "openapi/queries";
+import type { DeadlineAlertResponse } from "openapi/requests/types.gen";
+import { Wrapper } from "src/utils/Wrapper";
+
+import { DeadlineAlertsBadge } from "./DeadlineAlertsBadge";
+
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({
+    // eslint-disable-next-line id-length
+    t: (key: string, options?: { interval?: string; reference?: string }) => {
+      if (options?.reference === undefined) {
+        return key;
+      }
+
+      return options.interval === undefined
+        ? `${key}:${options.reference}`
+        : `${key}:${options.interval}:${options.reference}`;
+    },
+  }),
+}));
+
+vi.mock("openapi/queries", async (importOriginal) => {
+  const actual = await importOriginal<typeof OpenapiQueries>();
+
+  return {
+    ...actual,
+    useDeadlinesServiceGetDagDeadlineAlerts: vi.fn(),
+  };
+});
+
+const { useDeadlinesServiceGetDagDeadlineAlerts } = await import("openapi/queries");
+
+// Defaults to a VariableInterval alert, whose interval only the scheduler resolves at evaluation
+// time. Without a rule of its own, dayjs humanizes that null interval as "a few seconds" and the
+// popover claims the run must complete within a few seconds of its logical date.
+const baseAlert: DeadlineAlertResponse = {
+  created_at: "2025-01-01T00:00:00Z",
+  id: "alert-1",
+  interval: null,
+  name: null,
+  reference_type: "DagRunLogicalDateDeadline",
+};
+
+const REFERENCE = "deadlineAlerts.referenceType.DagRunLogicalDateDeadline";
+const DYNAMIC_RULE = `deadlineAlerts.completionRuleDynamic:${REFERENCE}`;
+const FIXED_RULE = `deadlineAlerts.completionRule:an hour:${REFERENCE}`;
+
+describe("DeadlineAlertsBadge", () => {
+  it.each([
+    { absent: FIXED_RULE, expected: DYNAMIC_RULE, interval: null },
+    { absent: DYNAMIC_RULE, expected: FIXED_RULE, interval: 3600 },
+  ])(
+    "states the completion rule for an alert with interval $interval",
+    async ({ absent, expected, interval }) => {
+      vi.mocked(useDeadlinesServiceGetDagDeadlineAlerts).mockReturnValue({
+        data: { deadline_alerts: [{ ...baseAlert, interval }], total_entries: 1 },
+      } as ReturnType<typeof useDeadlinesServiceGetDagDeadlineAlerts>);
+
+      render(<DeadlineAlertsBadge dagId="test_dag" />, { wrapper: Wrapper });
+
+      fireEvent.click(screen.getByRole("button"));
+
+      expect(await screen.findByText(expected)).toBeInTheDocument();
+      expect(screen.queryByText(absent)).not.toBeInTheDocument();
+    },
+  );
+});

airflow-core/src/airflow/ui/src/pages/Dag/DeadlineAlertsBadge.tsx

@@ -17,30 +17,21 @@
  * under the License.
  */
 import { Box, Button, Separator, Text, VStack } from "@chakra-ui/react";
-import dayjs from "dayjs";
-import duration from "dayjs/plugin/duration";
-import relativeTime from "dayjs/plugin/relativeTime";
 import { useTranslation } from "react-i18next";
 import { FiClock } from "react-icons/fi";
 
 import { useDeadlinesServiceGetDagDeadlineAlerts } from "openapi/queries";
 import type { DeadlineAlertResponse } from "openapi/requests/types.gen";
 import { Popover } from "src/components/ui";
-
-dayjs.extend(duration);
-dayjs.extend(relativeTime);
+import { translateCompletionRule } from "src/utils/deadlines";
 
 const AlertRow = ({ alert }: { readonly alert: DeadlineAlertResponse }) => {
   const { t: translate } = useTranslation("dag");
-  const reference = translate(`deadlineAlerts.referenceType.${alert.reference_type}`, {
-    defaultValue: alert.reference_type,
-  });
-  const interval = dayjs.duration(alert.interval, "seconds").humanize();
 
   return (
     <Box py={2} width="100%">
       <Text color="fg.muted" fontSize="xs">
-        {translate("deadlineAlerts.completionRule", { interval, reference })}
+        {translateCompletionRule(translate, alert)}
         {Boolean(alert.name) && (
           <Text as="span" color="fg.subtle" fontSize="xs">
             {" "}

airflow-core/src/airflow/ui/src/pages/Dag/Overview/DeadlineRow.tsx

@@ -17,18 +17,13 @@
  * under the License.
  */
 import { Badge, HStack, Text, VStack } from "@chakra-ui/react";
-import dayjs from "dayjs";
-import duration from "dayjs/plugin/duration";
-import relativeTime from "dayjs/plugin/relativeTime";
 import { useTranslation } from "react-i18next";
 import { FiAlertTriangle, FiClock } from "react-icons/fi";
 
 import type { DeadlineAlertResponse, DeadlineResponse } from "openapi/requests/types.gen";
 import Time from "src/components/Time";
 import { RouterLink } from "src/components/ui";
-
-dayjs.extend(duration);
-dayjs.extend(relativeTime);
+import { translateCompletionRule } from "src/utils/deadlines";
 
 type DeadlineRowProps = {
   readonly alert?: DeadlineAlertResponse;
@@ -38,12 +33,7 @@ type DeadlineRowProps = {
 export const DeadlineRow = ({ alert, deadline }: DeadlineRowProps) => {
   const { t: translate } = useTranslation("dag");
 
-  const reference = alert
-    ? translate(`deadlineAlerts.referenceType.${alert.reference_type}`, {
-        defaultValue: alert.reference_type,
-      })
-    : undefined;
-  const interval = alert ? dayjs.duration(alert.interval, "seconds").humanize() : undefined;
+  const completionRule = translateCompletionRule(translate, alert);
 
   return (
     <HStack justifyContent="space-between" px={2} py={1.5} width="100%">
@@ -61,11 +51,11 @@ export const DeadlineRow = ({ alert, deadline }: DeadlineRowProps) => {
             {deadline.dag_run_id}
           </RouterLink>
         </HStack>
-        {reference !== undefined && interval !== undefined ? (
+        {completionRule === undefined ? undefined : (
           <Text color="fg.muted" fontSize="xs">
-            {translate("deadlineAlerts.completionRule", { interval, reference })}
+            {completionRule}
           </Text>
-        ) : undefined}
+        )}
       </VStack>
       <HStack gap={1}>
         <Text color="fg.muted" fontSize="xs">

airflow-core/src/airflow/ui/src/pages/Run/DeadlineStatus.tsx

@@ -18,8 +18,6 @@
  */
 import { Badge, Button, HStack, Text, VStack } from "@chakra-ui/react";
 import dayjs from "dayjs";
-import duration from "dayjs/plugin/duration";
-import relativeTime from "dayjs/plugin/relativeTime";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { FiAlertTriangle, FiCheck, FiClock } from "react-icons/fi";
@@ -29,12 +27,10 @@ import type { DeadlineAlertResponse } from "openapi/requests/types.gen";
 import Time from "src/components/Time";
 import { Tooltip } from "src/components/ui/Tooltip";
 import { renderDuration } from "src/utils/datetimeUtils";
+import { translateCompletionRule } from "src/utils/deadlines";
 
 import { DeadlineStatusModal } from "./DeadlineStatusModal";
 
-dayjs.extend(duration);
-dayjs.extend(relativeTime);
-
 type DeadlineStatusProps = {
   readonly dagId: string;
   readonly dagRunId: string;
@@ -84,12 +80,7 @@ export const DeadlineStatus = ({ dagId, dagRunId, endDate }: DeadlineStatusProps
       <VStack alignItems="flex-start" gap={0.5}>
         {(alertData?.deadline_alerts ?? []).map((deadlineAlert) => (
           <Text fontSize="xs" key={deadlineAlert.id}>
-            {translate("deadlineAlerts.completionRule", {
-              interval: dayjs.duration(deadlineAlert.interval, "seconds").humanize(),
-              reference: translate(`deadlineAlerts.referenceType.${deadlineAlert.reference_type}`, {
-                defaultValue: deadlineAlert.reference_type,
-              }),
-            })}
+            {translateCompletionRule(translate, deadlineAlert)}
           </Text>
         ))}
       </VStack>
@@ -156,6 +147,7 @@ export const DeadlineStatus = ({ dagId, dagRunId, endDate }: DeadlineStatusProps
   }
 
   const alert = dl.alert_id !== undefined && dl.alert_id !== null ? alertMap.get(dl.alert_id) : undefined;
+  const completionRule = translateCompletionRule(translate, alert);
   const deadlineTime = dayjs(dl.deadline_time);
 
   let actualDurationLabel: string | undefined;
@@ -185,14 +177,9 @@ export const DeadlineStatus = ({ dagId, dagRunId, endDate }: DeadlineStatusProps
           </Text>
         )}
       </HStack>
-      {alert === undefined ? undefined : (
+      {completionRule === undefined ? undefined : (
         <Text color="fg.muted" fontSize="xs">
-          {translate("deadlineAlerts.completionRule", {
-            interval: dayjs.duration(alert.interval, "seconds").humanize(),
-            reference: translate(`deadlineAlerts.referenceType.${alert.reference_type}`, {
-              defaultValue: alert.reference_type,
-            }),
-          })}
+          {completionRule}
         </Text>
       )}
       <HStack gap={1}>

airflow-core/src/airflow/ui/src/pages/Run/DeadlineStatusModal.tsx

@@ -18,8 +18,6 @@
  */
 import { Badge, Heading, HStack, Separator, Skeleton, Text, VStack } from "@chakra-ui/react";
 import dayjs from "dayjs";
-import duration from "dayjs/plugin/duration";
-import relativeTime from "dayjs/plugin/relativeTime";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { FiAlertTriangle, FiClock } from "react-icons/fi";
@@ -31,9 +29,7 @@ import Time from "src/components/Time";
 import { Dialog } from "src/components/ui";
 import { Pagination } from "src/components/ui/Pagination";
 import { renderDuration } from "src/utils/datetimeUtils";
-
-dayjs.extend(duration);
-dayjs.extend(relativeTime);
+import { translateCompletionRule } from "src/utils/deadlines";
 
 const PAGE_LIMIT = 10;
 
@@ -99,6 +95,7 @@ export const DeadlineStatusModal = ({
               {deadlines.map((dl) => {
                 const alert =
                   dl.alert_id !== undefined && dl.alert_id !== null ? alertMap.get(dl.alert_id) : undefined;
+                const completionRule = translateCompletionRule(translate, alert);
                 const deadlineTime = dayjs(dl.deadline_time);
 
                 let actualDurationLabel: string | undefined;
@@ -128,14 +125,9 @@ export const DeadlineStatusModal = ({
                         </Text>
                       )}
                     </HStack>
-                    {alert === undefined ? undefined : (
+                    {completionRule === undefined ? undefined : (
                       <Text color="fg.muted" fontSize="xs">
-                        {translate("deadlineAlerts.completionRule", {
-                          interval: dayjs.duration(alert.interval, "seconds").humanize(),
-                          reference: translate(`deadlineAlerts.referenceType.${alert.reference_type}`, {
-                            defaultValue: alert.reference_type,
-                          }),
-                        })}
+                        {completionRule}
                       </Text>
                     )}
                     <HStack gap={1}>