Re: [PR] WIP: Creating run backfill [airflow]

2025-02-12 Thread via GitHub


aritra24 commented on PR #46348:
URL: https://github.com/apache/airflow/pull/46348#issuecomment-2654317368

   https://github.com/user-attachments/assets/b02e8079-2cf4-416e-bdf8-9f4a81606723";
 />
   Latest UI


-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-11 Thread via GitHub


aritra24 commented on code in PR #46348:
URL: https://github.com/apache/airflow/pull/46348#discussion_r1951866233


##
airflow/ui/src/components/Menu/RunBackfillModal.tsx:
##
@@ -0,0 +1,48 @@
+/*!
+ * 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 } from "@chakra-ui/react";
+import React from "react";
+
+import type { DAGResponse, DAGWithLatestDagRunsResponse } from 
"openapi/requests/types.gen";
+import { Dialog } from "src/components/ui";
+
+import RunBackfillForm from "./RunBackfillForm";
+
+type RunBackfillModalProps = {
+  dag: DAGResponse | DAGWithLatestDagRunsResponse;
+  onClose: () => void;
+  open: boolean;
+};
+
+const RunBackfillModal: React.FC = ({ dag, onClose, 
open }) => (
+  
+
+  
+{/*  */}

Review Comment:
   Ack



-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-11 Thread via GitHub


aritra24 commented on code in PR #46348:
URL: https://github.com/apache/airflow/pull/46348#discussion_r1951865912


##
airflow/ui/src/queries/useCreateBackfill.ts:
##
@@ -0,0 +1,86 @@
+/*!
+ * 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 { useState } from "react";
+
+import { useBackfillServiceCreateBackfill } from "openapi/queries";
+import type { CreateBackfillData } from "openapi/requests/types.gen";
+import { toaster } from "src/components/ui";
+
+export const useCreateBackfill = ({ onSuccessConfirm }: { onSuccessConfirm: () 
=> void }) => {
+  const [dateValidationError, setDateValidationError] = 
useState(undefined);
+  const [error, setError] = useState(undefined);
+
+  const onSuccess = () => {
+toaster.create({
+  description: "Backfill jobs have been successfully triggered.",
+  title: "Backfill generated",
+  type: "success",
+});
+onSuccessConfirm();
+  };
+
+  const onError = (_error: unknown) => {
+setError(_error);
+  };
+
+  const { isPending, mutate } = useBackfillServiceCreateBackfill({ onError, 
onSuccess });
+
+  const createBackfill = (data: CreateBackfillData) => {
+const DataIntervalStart = new Date(data.requestBody.from_date);
+const DataIntervalEnd = new Date(data.requestBody.to_date);

Review Comment:
   Ack



-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-11 Thread via GitHub


bbovenzi commented on code in PR #46348:
URL: https://github.com/apache/airflow/pull/46348#discussion_r1951732461


##
airflow/ui/src/queries/useCreateBackfill.ts:
##
@@ -0,0 +1,86 @@
+/*!
+ * 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 { useState } from "react";
+
+import { useBackfillServiceCreateBackfill } from "openapi/queries";
+import type { CreateBackfillData } from "openapi/requests/types.gen";
+import { toaster } from "src/components/ui";
+
+export const useCreateBackfill = ({ onSuccessConfirm }: { onSuccessConfirm: () 
=> void }) => {
+  const [dateValidationError, setDateValidationError] = 
useState(undefined);
+  const [error, setError] = useState(undefined);
+
+  const onSuccess = () => {
+toaster.create({
+  description: "Backfill jobs have been successfully triggered.",
+  title: "Backfill generated",
+  type: "success",
+});
+onSuccessConfirm();
+  };
+
+  const onError = (_error: unknown) => {
+setError(_error);
+  };
+
+  const { isPending, mutate } = useBackfillServiceCreateBackfill({ onError, 
onSuccess });
+
+  const createBackfill = (data: CreateBackfillData) => {
+const DataIntervalStart = new Date(data.requestBody.from_date);
+const DataIntervalEnd = new Date(data.requestBody.to_date);

Review Comment:
   ```suggestion
   const dataIntervalStart = new Date(data.requestBody.from_date);
   const dataIntervalEnd = new Date(data.requestBody.to_date);
   ```
   
   Normal variables start with a lowercase letter



-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-11 Thread via GitHub


bbovenzi commented on PR #46348:
URL: https://github.com/apache/airflow/pull/46348#issuecomment-2652268580

   > https://private-user-images.githubusercontent.com/24430013/411215118-5ea8e428-b5d6-4755-8b3d-1b91550a48cd.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MzkyMTQzODEsIm5iZiI6MTczOTIxNDA4MSwicGF0aCI6Ii8yNDQzMDAxMy80MTEyMTUxMTgtNWVhOGU0MjgtYjVkNi00NzU1LThiM2QtMWI5MTU1MGE0OGNkLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTAlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEwVDE5MDEyMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWEzNWY2Yzk2MzIzYWEwY2Q0ODUxNzViZDFlNjFiNjdmZTQ3MTI3NGJlOGJkNjYzY2IzODgyMDhjYTI0M2U5ZTMmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.gR0zb7iw_a3bi_1IW425IxXM9ClxeEdA7_KLSSMR_FU";>
 This is what the UI looks like right now.
   
   
   Looking better. A few notes:
   
   - "Data Interval Start/End" should simply be "Date Range"
   - "Run Type" should be "Reprocess Behavior"
   - Let's try to get the radio cards to render in a row instead of a column


-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-11 Thread via GitHub


bbovenzi commented on code in PR #46348:
URL: https://github.com/apache/airflow/pull/46348#discussion_r1951732964


##
airflow/ui/src/components/Menu/RunBackfillModal.tsx:
##
@@ -0,0 +1,48 @@
+/*!
+ * 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 } from "@chakra-ui/react";
+import React from "react";
+
+import type { DAGResponse, DAGWithLatestDagRunsResponse } from 
"openapi/requests/types.gen";
+import { Dialog } from "src/components/ui";
+
+import RunBackfillForm from "./RunBackfillForm";
+
+type RunBackfillModalProps = {
+  dag: DAGResponse | DAGWithLatestDagRunsResponse;
+  onClose: () => void;
+  open: boolean;
+};
+
+const RunBackfillModal: React.FC = ({ dag, onClose, 
open }) => (
+  
+
+  
+{/*  */}

Review Comment:
   Delete this line?



-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-11 Thread via GitHub


bbovenzi commented on code in PR #46348:
URL: https://github.com/apache/airflow/pull/46348#discussion_r1951733435


##
airflow/ui/src/components/Menu/RunBackfillForm.tsx:
##
@@ -0,0 +1,226 @@
+/*!
+ * 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 { Input, Box, Spacer, HStack, Field, VStack, Flex } from 
"@chakra-ui/react";
+import { useEffect, useState } from "react";
+import { useForm, Controller, useWatch } from "react-hook-form";
+
+import type {
+  DAGResponse,
+  DAGWithLatestDagRunsResponse,
+  BackfillPostBody,
+  TaskInstanceCollectionResponse,
+} from "openapi/requests/types.gen";
+import { Button } from "src/components/ui";
+import { useCreateBackfill } from "src/queries/useCreateBackfill";
+import { useCreateBackfillDryRun } from "src/queries/useCreateBackfillDryRun";
+
+import { ActionAccordion } from "../ActionAccordion";
+import { ErrorAlert } from "../ErrorAlert";
+import { Checkbox } from "../ui/Checkbox";
+import { RadioCardItem, RadioCardLabel, RadioCardRoot } from "../ui/RadioCard";
+
+type RunBackfillFormProps = {
+  readonly dag: DAGResponse | DAGWithLatestDagRunsResponse;
+  readonly onClose: () => void;
+};
+
+const RunBackfillForm = ({ dag, onClose }: RunBackfillFormProps) => {
+  const [errors, setErrors] = useState<{ conf?: string; date?: unknown }>({});
+
+  const { control, handleSubmit, reset, watch } = useForm({
+defaultValues: {
+  dag_id: dag.dag_id,
+  dag_run_conf: {},
+  from_date: undefined,
+  max_active_runs: undefined,
+  reprocess_behavior: undefined,
+  run_backwards: undefined,
+  to_date: undefined,
+},
+mode: "onBlur",
+  });
+  const values = useWatch({
+control,
+  });
+  const { data } = useCreateBackfillDryRun({
+requestBody: {
+  requestBody: {
+dag_id: dag.dag_id,
+dag_run_conf: undefined,
+from_date: values.from_date ?? new Date().toDateString(),
+max_active_runs: undefined,
+reprocess_behavior: undefined,
+run_backwards: undefined,
+to_date: values.to_date ?? new Date().toDateString(),
+  },
+},
+  });
+
+  const { createBackfill, dateValidationError, error, isPending } = 
useCreateBackfill({
+onSuccessConfirm: onClose,
+  });
+
+  useEffect(() => {
+if (Boolean(dateValidationError)) {
+  setErrors((prev) => ({ ...prev, date: dateValidationError }));
+}
+  }, [dateValidationError]);
+
+  const dataIntervalStart = watch("from_date");
+  const dataIntervalEnd = watch("to_date");
+
+  const onSubmit = (fdata: BackfillPostBody) => {
+createBackfill({
+  requestBody: fdata,
+});
+  };
+
+  const onCancel = (fdata: BackfillPostBody) => {
+reset(fdata);
+onClose();
+  };
+
+  const resetDateError = () => {
+setErrors((prev) => ({ ...prev, date: undefined }));
+  };
+
+  const affectedTasks = data ?? {
+task_instances: [],
+total_entries: 0,
+  };
+
+  const reprocessBehaviors = [
+{ label: "Missing Runs", value: "failed" },
+{ label: "Missing and Errored Runs", value: "completed" },
+{ label: "All Runs", value: "none" },
+  ];

Review Comment:
   Let's move this outside of the component.



-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-08 Thread via GitHub


aritra24 commented on PR #46348:
URL: https://github.com/apache/airflow/pull/46348#issuecomment-2644798276

   https://github.com/user-attachments/assets/5ea8e428-b5d6-4755-8b3d-1b91550a48cd";
 />
   This is what the UI looks like right now.


-- 
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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-08 Thread via GitHub


aritra24 commented on PR #46348:
URL: https://github.com/apache/airflow/pull/46348#issuecomment-2644798098

   Still needs some fixing up, throws a bunch of errors on sending the 
requests. Pushing now to get some feedback on the UI 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]



Re: [PR] WIP: Creating run backfill [airflow]

2025-02-01 Thread via GitHub


bbovenzi commented on code in PR #46348:
URL: https://github.com/apache/airflow/pull/46348#discussion_r1938325521


##
airflow/ui/src/components/Menu/RunBackfillForm.tsx:
##
@@ -0,0 +1,174 @@
+/*!
+ * 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 { Input, Button, Box, Spacer, HStack, Field, RadioGroup, VStack } from 
"@chakra-ui/react";
+import { useEffect, useState } from "react";
+import { useForm, Controller } from "react-hook-form";
+
+import type { DAGResponse, DAGWithLatestDagRunsResponse } from 
"openapi/requests/types.gen";
+import { useTrigger } from "src/queries/useTrigger";
+
+import { ErrorAlert } from "../ErrorAlert";
+
+type RunBackfillFormProps = {
+  readonly dag: DAGResponse | DAGWithLatestDagRunsResponse;
+  readonly onClose: () => void;
+};
+
+export type DagRunTriggerParams = {
+  conf: string;
+  dagId: string;
+  dataIntervalEnd: string;
+  dataIntervalStart: string;
+  runType: string;
+};
+
+const RunBackfillForm = ({ dag, onClose }: RunBackfillFormProps) => {
+  const [errors, setErrors] = useState<{ conf?: string; date?: unknown }>({});
+  const {
+dateValidationError,
+error: errorTrigger,
+isPending,
+  } = useTrigger({ dagId: dag.dag_id, onSuccessConfirm: onClose });
+
+  const { control, handleSubmit, reset, watch } = 
useForm({
+defaultValues: {
+  dagId: "",
+  dataIntervalEnd: "",
+  dataIntervalStart: "",
+  runType: "",
+},
+  });
+
+  useEffect(() => {
+if (Boolean(dateValidationError)) {
+  setErrors((prev) => ({ ...prev, date: dateValidationError }));
+}
+  }, [dateValidationError]);
+
+  const dataIntervalStart = watch("dataIntervalStart");
+  const dataIntervalEnd = watch("dataIntervalEnd");
+  const runType = watch("runType");
+
+  const onSubmit = (data: DagRunTriggerParams) => {
+reset(data);
+  };
+
+  const onCancel = (data: DagRunTriggerParams) => {
+reset(data);
+  };
+
+  const resetDateError = () => {
+setErrors((prev) => ({ ...prev, date: undefined }));
+  };
+
+  const runTypes = [
+{ label: "Missing Runs", value: "1" },
+{ label: "Missing and Errored Runs", value: "2" },
+{ label: "All Runs", value: "3" },
+  ];
+
+  return (
+<>
+  
+
+   (
+  
+Data Interval Start 
Date
+
+  
+)}
+  />
+
+   (
+  
+Data Interval End Date
+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 { Input, Button, Box, Spacer, HStack, Field, RadioGroup, VStack } from 
"@chakra-ui/react";
+import { useEffect, useState } from "react";
+import { useForm, Controller } from "react-hook-form";
+
+import type { DAGResponse, DAGWithLatestDagRunsResponse } from 
"openapi/requests/types.gen";
+import { useTrigger } from "src/queries/useTrigger";
+
+import { ErrorAlert } from "../ErrorAlert";
+
+type RunBackfillFormProps = {
+  readonly dag: DAGResponse | DAGWithLatestDagRunsResponse;
+  readonly onClose: () => void;
+};
+
+export type DagRunTriggerParams = {

Review Comment:
   Let's import `BackfillPostBody` instead



##
airflow/ui/src/components/Menu/RunBackfillForm.tsx:
##
@@ -0,0 +1,174 @@
+/*!
+ * 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