diff --git a/airflow/www/static/js/dag/details/AuditLog.tsx b/airflow/www/static/js/dag/details/AuditLog.tsx
index e30fbbe68e88..d99181278187 100644
--- a/airflow/www/static/js/dag/details/AuditLog.tsx
+++ b/airflow/www/static/js/dag/details/AuditLog.tsx
@@ -29,6 +29,9 @@ import {
Input,
SimpleGrid,
Button,
+ RadioGroup,
+ Stack,
+ Radio,
} from "@chakra-ui/react";
import { createColumnHelper } from "@tanstack/react-table";
import { snakeCase } from "lodash";
@@ -74,12 +77,21 @@ const AuditLog = ({ taskId, run }: Props) => {
const { tableURLState, setTableURLState } = useTableURLState({
sorting: [{ id: "when", desc: true }],
});
- const [includedEvents, setIncludedEvents] = useState(
- configIncludedEvents.length ? configIncludedEvents.split(",") : []
- );
- const [excludedEvents, setExcludedEvents] = useState(
- configExcludedEvents.length ? configExcludedEvents.split(",") : []
- );
+ const includedEvents = configIncludedEvents.length
+ ? configIncludedEvents.split(",")
+ : [];
+ const excludedEvents = configExcludedEvents.length
+ ? configExcludedEvents.split(",")
+ : [];
+
+ let defaultEventFilter = "include";
+ let defaultEvents = includedEvents;
+ if (!includedEvents.length && excludedEvents.length) {
+ defaultEventFilter = "exclude";
+ defaultEvents = excludedEvents;
+ }
+ const [eventFilter, setEventFilter] = useState(defaultEventFilter);
+ const [events, setEvents] = useState(defaultEvents);
const sort = tableURLState.sorting[0];
const orderBy = sort ? `${sort.desc ? "-" : ""}${snakeCase(sort.id)}` : "";
@@ -94,8 +106,10 @@ const AuditLog = ({ taskId, run }: Props) => {
limit: tableURLState.pagination.pageSize,
offset:
tableURLState.pagination.pageIndex * tableURLState.pagination.pageSize,
- includedEvents: includedEvents ? includedEvents.join(",") : undefined,
- excludedEvents: excludedEvents ? excludedEvents.join(",") : undefined,
+ includedEvents:
+ eventFilter === "include" && events ? events.join(",") : undefined,
+ excludedEvents:
+ eventFilter === "exclude" && events ? events.join(",") : undefined,
});
const columns = useMemo(() => {
@@ -155,31 +169,17 @@ const AuditLog = ({ taskId, run }: Props) => {
}),
};
- const excludedEventsSelectProps = useChakraSelectProps