fixup! Show current task executions in the UI

The loop choices sat in a checkbox stack below the options row, so the same dialog presented its clear scope in two different widgets. They are now options of the existing segmented control, shown only when they apply: later iterations whenever a loop member is selected, whole expansion only when the selection also holds mapped members. Their booleans are read from the selected options instead of separate state, and the initial selection already includes later iterations in loop mode so the first dry run matches what is shown. The selection is a copy of the saved defaults, so the loop options are never written back to them. The now unused execution.clearLater and execution.clearWhole keys are replaced by short labels beside the other clear options.

Author: ashb

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

@@ -69,9 +69,7 @@
     "upcomingCount_other": "{{count}} Upcoming Deadlines"
   },
   "execution": {
-    "clearLater": "Clear later loop iterations",
     "clearSelected": "Clear selected executions",
-    "clearWhole": "Clear whole mapped expansions",
     "empty": "No executions in this run.",
     "iteration": "{{node}} · Iteration {{index}}",
     "mapped_one": "{{task}} ({{count}} mapped task on this page)",

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

@@ -92,13 +92,15 @@
       "existingTasks": "Clear existing tasks",
       "future": "Future",
       "keepTaskState": "Keep task state and resume",
+      "laterIterations": "Later iterations",
       "onlyFailed": "Clear only failed tasks",
       "past": "Past",
       "preventRunningTasks": "Prevent rerun if task is running",
       "queueNew": "Queue up new tasks",
       "runOnLatestVersion": "Run with latest bundle version",
       "runOnLatestVersionForced": "Always uses the latest — there's no earlier version to go back to",
-      "upstream": "Upstream"
+      "upstream": "Upstream",
+      "wholeExpansion": "Whole expansion"
     }
   },
   "runStateCounts": {

airflow-core/src/airflow/ui/src/components/Clear/TaskInstance/ClearTaskInstanceDialog.test.tsx

@@ -211,10 +211,26 @@ describe("ClearTaskInstanceDialog", () => {
       );
 
       expect(await screen.findByRole("checkbox", { name: /keepTaskState/iu })).toBeVisible();
-      expect(screen.queryByRole("checkbox", { name: /execution\.clearLater/iu }) !== null).toBe(shown);
+      expect(screen.queryByRole("button", { name: /options\.laterIterations/iu }) !== null).toBe(shown);
     },
   );
 
+  it("includes later iterations in the first dry run and leaves the saved defaults untouched", async () => {
+    localStorage.setItem(CLEAR_TASK_INSTANCE_DEFAULT_OPTIONS_KEY, JSON.stringify(["downstream"]));
+    render(<ClearTaskInstanceDialog onClose={vi.fn()} open taskInstance={loopMember} />, {
+      wrapper: Wrapper,
+    });
+
+    fireEvent.click(await screen.findByRole("button", { name: /options\.laterIterations/iu }));
+
+    expect(dryRunsMock.mock.calls[0]?.[0]).toMatchObject({
+      requests: [{ requestBody: { include_later_loop_iterations: true } }],
+    });
+    expect(localStorage.getItem(CLEAR_TASK_INSTANCE_DEFAULT_OPTIONS_KEY)).toBe(
+      JSON.stringify(["downstream"]),
+    );
+  });
+
   it("clears a loop member by execution id with the later-iterations choice and never sends past or future", async () => {
     localStorage.setItem(
       CLEAR_TASK_INSTANCE_DEFAULT_OPTIONS_KEY,
@@ -224,7 +240,7 @@ describe("ClearTaskInstanceDialog", () => {
       wrapper: Wrapper,
     });
 
-    fireEvent.click(await screen.findByRole("checkbox", { name: /execution\.clearLater/iu }));
+    fireEvent.click(await screen.findByRole("button", { name: /options\.laterIterations/iu }));
     fireEvent.click(await screen.findByRole("button", { name: /modal\.confirm/iu }));
 
     await waitFor(() => expect(mutateMock).toHaveBeenCalledTimes(1));
@@ -248,7 +264,7 @@ describe("ClearTaskInstanceDialog", () => {
       wrapper: Wrapper,
     });
 
-    fireEvent.click(await screen.findByRole("checkbox", { name: /execution\.clearWhole/iu }));
+    fireEvent.click(await screen.findByRole("button", { name: /options\.wholeExpansion/iu }));
     fireEvent.click(await screen.findByRole("button", { name: /modal\.confirm/iu }));
 
     await waitFor(() => expect(mutateMock).toHaveBeenCalledTimes(1));
@@ -265,8 +281,8 @@ describe("ClearTaskInstanceDialog", () => {
       wrapper: Wrapper,
     });
 
-    expect(await screen.findByRole("checkbox", { name: /execution\.clearLater/iu })).toBeVisible();
-    expect(screen.queryByRole("checkbox", { name: /execution\.clearWhole/iu })).not.toBeInTheDocument();
+    expect(await screen.findByRole("button", { name: /options\.laterIterations/iu })).toBeVisible();
+    expect(screen.queryByRole("button", { name: /options\.wholeExpansion/iu })).not.toBeInTheDocument();
   });
 
   it("does not offer the exclusion checkboxes for a loop clear", async () => {
@@ -437,6 +453,6 @@ describe("ClearTaskInstanceDialog", () => {
 
     fireEvent.click(screen.getByRole("button", { name: /clear\.button/iu }));
 
-    expect(await screen.findByRole("checkbox", { name: /execution\.clearLater/iu })).toBeVisible();
+    expect(await screen.findByRole("button", { name: /options\.laterIterations/iu })).toBeVisible();
   });
 });

airflow-core/src/airflow/ui/src/components/Clear/TaskInstance/ClearTaskInstanceDialog.tsx

@@ -18,7 +18,7 @@
  */
 import { useEffect, useState } from "react";
 
-import { Button, Flex, Stack, useDisclosure } from "@chakra-ui/react";
+import { Button, Flex, useDisclosure } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
 import { CgRedo } from "react-icons/cg";
 
@@ -119,6 +119,9 @@ const getRunGroups = (targets: Array<ClearTarget>): Array<RunGroup> => {
   return [...groups.values()];
 };
 
+const LATER_ITERATIONS = "laterIterations";
+const WHOLE_EXPANSION = "wholeExpansion";
+
 // An empty mapped expansion is a placeholder at region index -1.
 const isMappedTarget = (target: ClearTarget) => target.map_index >= 0 || target.region_index === -1;
 
@@ -160,17 +163,20 @@ const ClearTaskInstanceDialog = (props: Props) => {
   const [clearTaskInstanceDefaultOptions] = useClearTaskInstanceDefaultOptions();
   const [preventRunningTaskDefault] = useClearPreventRunningTaskDefault();
   const [keepTaskStateDefault] = useClearKeepTaskStateDefault();
-  const [selectedOptions, setSelectedOptions] = useState<Array<string>>(clearTaskInstanceDefaultOptions);
+  const initialOptions = loopMode
+    ? [...clearTaskInstanceDefaultOptions, LATER_ITERATIONS]
+    : clearTaskInstanceDefaultOptions;
+  const [selectedOptions, setSelectedOptions] = useState<Array<string>>(initialOptions);
 
   const onlyFailed = selectedOptions.includes("onlyFailed");
   const past = selectedOptions.includes("past");
   const future = selectedOptions.includes("future");
   const upstream = selectedOptions.includes("upstream");
   const downstream = selectedOptions.includes("downstream");
+  const laterLoopIterations = selectedOptions.includes(LATER_ITERATIONS);
+  const wholeExpansions = selectedOptions.includes(WHOLE_EXPANSION);
   const [keepTaskState, setKeepTaskState] = useState(keepTaskStateDefault);
   const [preventRunningTask, setPreventRunningTask] = useState(preventRunningTaskDefault);
-  const [laterLoopIterations, setLaterLoopIterations] = useState(true);
-  const [wholeExpansions, setWholeExpansions] = useState(false);
 
   const [note, setNote] = useState<string | null>(initialNote);
 
@@ -186,8 +192,6 @@ const ClearTaskInstanceDialog = (props: Props) => {
   useEffect(() => {
     if (openDialog) {
       setKeepTaskState(keepTaskStateDefault);
-      setLaterLoopIterations(true);
-      setWholeExpansions(false);
     }
   }, [openDialog, keepTaskStateDefault]);
 
@@ -432,7 +436,7 @@ const ClearTaskInstanceDialog = (props: Props) => {
       >
         <Flex justifyContent="center">
           <SegmentedControl
-            defaultValues={clearTaskInstanceDefaultOptions}
+            defaultValues={initialOptions}
             multiple
             onChange={setSelectedOptions}
             options={[
@@ -458,27 +462,25 @@ const ClearTaskInstanceDialog = (props: Props) => {
                 label: translate("dags:runAndTaskActions.options.onlyFailed"),
                 value: "onlyFailed",
               },
+              ...(loopMode
+                ? [
+                    {
+                      label: translate("dags:runAndTaskActions.options.laterIterations"),
+                      value: LATER_ITERATIONS,
+                    },
+                  ]
+                : []),
+              ...(loopMode && hasMappedTargets
+                ? [
+                    {
+                      label: translate("dags:runAndTaskActions.options.wholeExpansion"),
+                      value: WHOLE_EXPANSION,
+                    },
+                  ]
+                : []),
             ]}
           />
         </Flex>
-        {loopMode ? (
-          <Stack alignItems="center" gap={2} mt={4}>
-            <Checkbox
-              checked={laterLoopIterations}
-              onCheckedChange={(event) => setLaterLoopIterations(event.checked === true)}
-            >
-              {translate("dag:execution.clearLater")}
-            </Checkbox>
-            {hasMappedTargets ? (
-              <Checkbox
-                checked={wholeExpansions}
-                onCheckedChange={(event) => setWholeExpansions(event.checked === true)}
-              >
-                {translate("dag:execution.clearWhole")}
-              </Checkbox>
-            ) : undefined}
-          </Stack>
-        ) : undefined}
         <ErrorAlert error={dryRunError} />
         <ActionAccordion
           affectedTasks={data}

airflow-core/src/airflow/ui/src/pages/Run/Execution.test.tsx

@@ -37,6 +37,7 @@ import { BaseWrapper } from "src/utils/Wrapper";
 
 import commonTranslations from "../../../public/i18n/locales/en/common.json";
 import dagTranslations from "../../../public/i18n/locales/en/dag.json";
+import dagsTranslations from "../../../public/i18n/locales/en/dags.json";
 import { Execution } from "./Execution";
 
 vi.mock("src/router", () => ({ taskInstanceRoutes: [] }));
@@ -66,6 +67,7 @@ vi.mock("src/components/Clear/TaskInstance/ClearTaskInstanceConfirmationDialog",
 beforeAll(() => {
   i18n.addResourceBundle("en", "dag", dagTranslations, true, true);
   i18n.addResourceBundle("en", "common", commonTranslations, true, true);
+  i18n.addResourceBundle("en", "dags", dagsTranslations, true, true);
 });
 
 const refresh = vi.hoisted<{ interval: number | false }>(() => ({ interval: false }));
@@ -417,7 +419,7 @@ describe("Run Execution", () => {
     );
     fireEvent.click(screen.getByRole("button", { name: "Clear selected executions" }));
 
-    expect(await screen.findByRole("checkbox", { name: "Clear later loop iterations" })).toBeChecked();
+    expect(await screen.findByRole("button", { name: "Later iterations" })).toBeVisible();
     await waitFor(() =>
       expect(clear.mock.lastCall?.[0].requestBody).toMatchObject({
         include_later_loop_iterations: true,
@@ -450,7 +452,7 @@ describe("Run Execution", () => {
       expect(clear.mock.lastCall?.[0].requestBody).toMatchObject({ task_ids: [["plain", 0]] }),
     );
     expect(clear.mock.lastCall?.[0].requestBody).not.toHaveProperty("task_instance_ids");
-    expect(screen.queryByRole("checkbox", { name: "Clear later loop iterations" })).not.toBeInTheDocument();
+    expect(screen.queryByRole("button", { name: "Later iterations" })).not.toBeInTheDocument();
   });
 
   it("selects the current execution once a selected one has been retried", async () => {