bbovenzi commented on code in PR #62195:
URL: https://github.com/apache/airflow/pull/62195#discussion_r3133000816
##########
airflow-core/src/airflow/ui/public/i18n/locales/en/dag.json:
##########
@@ -40,6 +45,35 @@
"parseDuration": "Parse Duration:",
"parsedAt": "Parsed at:"
},
+ "deadlineAlerts": {
+ "completionRule": "The run must complete within {{interval}} of
{{reference}}",
+ "count_one": "{{count}} deadline",
+ "count_other": "{{count}} deadlines",
+ "referenceType": {
+ "AverageRuntimeDeadline": "average runtime",
+ "DagRunLogicalDateDeadline": "logical date",
+ "DagRunQueuedAtDeadline": "queue time",
+ "FixedDatetimeDeadline": "fixed datetime"
+ },
+ "title": "Deadline Alerts",
+ "unnamed": "Unnamed Alert"
Review Comment:
We don't use this key anymore.
##########
airflow-core/src/airflow/ui/src/pages/Dag/Overview/AllDeadlinesModal.tsx:
##########
@@ -0,0 +1,153 @@
+/*!
+ * 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 { Heading, HStack, Separator, Skeleton, VStack } from
"@chakra-ui/react";
+import { useState } from "react";
+
+import { useDagRunServiceGetDagRuns, useDeadlinesServiceGetDeadlines } from
"openapi/queries";
+import type { DAGRunResponse, DeadlineAlertResponse } from
"openapi/requests/types.gen";
+import { ErrorAlert } from "src/components/ErrorAlert";
+import { Dialog } from "src/components/ui";
+import { Pagination } from "src/components/ui/Pagination";
+
+import { DeadlineRow } from "./DeadlineRow";
+
+const PAGE_LIMIT = 10;
+
+type AllDeadlinesModalProps = {
+ readonly alertMap: Map<string, DeadlineAlertResponse>;
+ readonly dagId: string;
+ readonly endDate: string;
+ readonly missed: boolean;
+ readonly onClose: () => void;
+ readonly open: boolean;
+ readonly refetchInterval: number | false;
+ readonly startDate: string;
+ readonly title: string;
+};
+
+export const AllDeadlinesModal = ({
+ alertMap,
+ dagId,
+ endDate,
+ missed,
+ onClose,
+ open,
+ refetchInterval,
+ startDate,
+ title,
+}: AllDeadlinesModalProps) => {
+ const [page, setPage] = useState(1);
+ const offset = (page - 1) * PAGE_LIMIT;
+
+ const { data, error, isLoading } = useDeadlinesServiceGetDeadlines(
+ missed
+ ? {
+ dagId,
+ dagRunId: "~",
+ lastUpdatedAtGte: startDate,
+ lastUpdatedAtLte: endDate,
+ limit: PAGE_LIMIT,
+ missed: true,
+ offset,
+ orderBy: ["-last_updated_at"],
+ }
+ : {
+ dagId,
+ dagRunId: "~",
+ deadlineTimeGte: endDate,
+ limit: PAGE_LIMIT,
+ missed: false,
+ offset,
+ orderBy: ["deadline_time"],
+ },
+ undefined,
+ { enabled: open, refetchInterval },
+ );
+
+ const { data: runsData } = useDagRunServiceGetDagRuns(
+ { dagId, limit: 100, runAfterGte: startDate, runAfterLte: endDate },
+ undefined,
+ { enabled: open, refetchInterval },
+ );
Review Comment:
Oh I missed that this is how we're finding the dag run state. Actually,
let's remove this and any of the dag run info that we don't have in the
deadline or alert for now.
##########
airflow-core/src/airflow/ui/src/pages/Dag/Overview/DagDeadlines.tsx:
##########
@@ -0,0 +1,243 @@
+/*!
+ * 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 { Badge, Box, Button, Flex, Heading, HStack, Separator, Skeleton,
VStack } from "@chakra-ui/react";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { FiAlertTriangle, FiClock } from "react-icons/fi";
+
+import {
+ useDagRunServiceGetDagRuns,
+ useDeadlinesServiceGetDagDeadlineAlerts,
+ useDeadlinesServiceGetDeadlines,
+} from "openapi/queries";
+import type { DAGRunResponse, DeadlineAlertResponse } from
"openapi/requests/types.gen";
+import { ErrorAlert } from "src/components/ErrorAlert";
+import { useAutoRefresh } from "src/utils";
+
+import { AllDeadlinesModal } from "./AllDeadlinesModal";
+import { DeadlineRow } from "./DeadlineRow";
+
+const LIMIT = 5;
+
+type DagDeadlinesProps = {
+ readonly dagId: string;
+ readonly endDate: string;
+ readonly startDate: string;
+};
+
+export const DagDeadlines = ({ dagId, endDate, startDate }: DagDeadlinesProps)
=> {
+ const { t: translate } = useTranslation("dag");
+ const refetchInterval = useAutoRefresh({ dagId });
+ const [modalOpen, setModalOpen] = useState<"missed" | "pending" |
undefined>(undefined);
+
+ const {
+ data: pendingData,
+ error: pendingError,
+ isLoading: isPendingLoading,
+ } = useDeadlinesServiceGetDeadlines(
+ {
+ dagId,
+ dagRunId: "~",
+ deadlineTimeGte: endDate,
+ limit: LIMIT,
+ missed: false,
+ orderBy: ["deadline_time"],
+ },
+ undefined,
+ { refetchInterval },
+ );
+
+ const {
+ data: missedData,
+ error: missedError,
+ isLoading: isMissedLoading,
+ } = useDeadlinesServiceGetDeadlines(
+ {
+ dagId,
+ dagRunId: "~",
+ lastUpdatedAtGte: startDate,
+ lastUpdatedAtLte: endDate,
+ limit: LIMIT,
+ missed: true,
+ orderBy: ["-last_updated_at"],
+ },
+ undefined,
+ { refetchInterval },
+ );
+
+ const { data: runsData } = useDagRunServiceGetDagRuns(
+ { dagId, limit: 100, runAfterGte: startDate, runAfterLte: endDate },
+ undefined,
+ { refetchInterval },
+ );
Review Comment:
Let's remove this runsData check too.
##########
airflow-core/src/airflow/ui/src/pages/Dag/Overview/DagDeadlines.tsx:
##########
@@ -0,0 +1,243 @@
+/*!
+ * 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 { Badge, Box, Button, Flex, Heading, HStack, Separator, Skeleton,
VStack } from "@chakra-ui/react";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { FiAlertTriangle, FiClock } from "react-icons/fi";
+
+import {
+ useDagRunServiceGetDagRuns,
+ useDeadlinesServiceGetDagDeadlineAlerts,
+ useDeadlinesServiceGetDeadlines,
+} from "openapi/queries";
+import type { DAGRunResponse, DeadlineAlertResponse } from
"openapi/requests/types.gen";
+import { ErrorAlert } from "src/components/ErrorAlert";
+import { useAutoRefresh } from "src/utils";
+
+import { AllDeadlinesModal } from "./AllDeadlinesModal";
+import { DeadlineRow } from "./DeadlineRow";
+
+const LIMIT = 5;
+
+type DagDeadlinesProps = {
+ readonly dagId: string;
+ readonly endDate: string;
+ readonly startDate: string;
+};
+
+export const DagDeadlines = ({ dagId, endDate, startDate }: DagDeadlinesProps)
=> {
+ const { t: translate } = useTranslation("dag");
+ const refetchInterval = useAutoRefresh({ dagId });
+ const [modalOpen, setModalOpen] = useState<"missed" | "pending" |
undefined>(undefined);
+
+ const {
+ data: pendingData,
+ error: pendingError,
+ isLoading: isPendingLoading,
+ } = useDeadlinesServiceGetDeadlines(
+ {
+ dagId,
+ dagRunId: "~",
+ deadlineTimeGte: endDate,
+ limit: LIMIT,
+ missed: false,
+ orderBy: ["deadline_time"],
+ },
+ undefined,
+ { refetchInterval },
+ );
+
+ const {
+ data: missedData,
+ error: missedError,
+ isLoading: isMissedLoading,
+ } = useDeadlinesServiceGetDeadlines(
Review Comment:
We're repeating these requests in multiple components. It might be worth it
to extract the common logic to a custom `getDeadlines()` hook. Then we can make
sure the query keys are an exact match and we can reuse cached results too
##########
airflow-core/src/airflow/ui/src/pages/Dag/Overview/DagDeadlines.tsx:
##########
@@ -0,0 +1,243 @@
+/*!
+ * 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 { Badge, Box, Button, Flex, Heading, HStack, Separator, Skeleton,
VStack } from "@chakra-ui/react";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { FiAlertTriangle, FiClock } from "react-icons/fi";
+
+import {
+ useDagRunServiceGetDagRuns,
+ useDeadlinesServiceGetDagDeadlineAlerts,
+ useDeadlinesServiceGetDeadlines,
+} from "openapi/queries";
+import type { DAGRunResponse, DeadlineAlertResponse } from
"openapi/requests/types.gen";
+import { ErrorAlert } from "src/components/ErrorAlert";
+import { useAutoRefresh } from "src/utils";
+
+import { AllDeadlinesModal } from "./AllDeadlinesModal";
+import { DeadlineRow } from "./DeadlineRow";
+
+const LIMIT = 5;
+
+type DagDeadlinesProps = {
+ readonly dagId: string;
+ readonly endDate: string;
+ readonly startDate: string;
+};
+
+export const DagDeadlines = ({ dagId, endDate, startDate }: DagDeadlinesProps)
=> {
+ const { t: translate } = useTranslation("dag");
+ const refetchInterval = useAutoRefresh({ dagId });
+ const [modalOpen, setModalOpen] = useState<"missed" | "pending" |
undefined>(undefined);
+
+ const {
+ data: pendingData,
+ error: pendingError,
+ isLoading: isPendingLoading,
+ } = useDeadlinesServiceGetDeadlines(
+ {
+ dagId,
+ dagRunId: "~",
+ deadlineTimeGte: endDate,
+ limit: LIMIT,
+ missed: false,
+ orderBy: ["deadline_time"],
+ },
+ undefined,
+ { refetchInterval },
+ );
+
+ const {
+ data: missedData,
+ error: missedError,
+ isLoading: isMissedLoading,
+ } = useDeadlinesServiceGetDeadlines(
+ {
+ dagId,
+ dagRunId: "~",
+ lastUpdatedAtGte: startDate,
+ lastUpdatedAtLte: endDate,
+ limit: LIMIT,
+ missed: true,
+ orderBy: ["-last_updated_at"],
+ },
+ undefined,
+ { refetchInterval },
+ );
+
+ const { data: runsData } = useDagRunServiceGetDagRuns(
+ { dagId, limit: 100, runAfterGte: startDate, runAfterLte: endDate },
+ undefined,
+ { refetchInterval },
+ );
+
+ const { data: alertData } = useDeadlinesServiceGetDagDeadlineAlerts({ dagId,
limit: 100 }, undefined, {
+ refetchInterval,
Review Comment:
We don't need to refetch this. This only changes when the dag code changes.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
