(airflow) branch main updated: Fix Dashboard overflow and handle no status tasks (#49964)

[bbovenzi]

This is an automated email from the ASF dual-hosted git repository.

bbovenzi pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/airflow.git


The following commit(s) were added to refs/heads/main by this push:
     new ac3f3d8ce33 Fix Dashboard overflow and handle no status tasks (#49964)
ac3f3d8ce33 is described below

commit ac3f3d8ce3333430c867848fdf1d2c089dfcd46a
Author: Pierre Jeambrun <pierrejb...@gmail.com>
AuthorDate: Tue Apr 29 21:29:58 2025 +0200

    Fix Dashboard overflow and handle no status tasks (#49964)
---
 airflow-core/src/airflow/ui/src/pages/Dashboard/Dashboard.tsx    | 2 +-
 .../ui/src/pages/Dashboard/HistoricalMetrics/MetricSection.tsx   | 9 +++++----
 .../pages/Dashboard/HistoricalMetrics/TaskInstanceMetrics.tsx    | 1 +
 3 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/airflow-core/src/airflow/ui/src/pages/Dashboard/Dashboard.tsx 
b/airflow-core/src/airflow/ui/src/pages/Dashboard/Dashboard.tsx
index 79cd1297073..1c872aca3a9 100644
--- a/airflow-core/src/airflow/ui/src/pages/Dashboard/Dashboard.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Dashboard/Dashboard.tsx
@@ -32,7 +32,7 @@ export const Dashboard = () => {
   const alerts = useConfig("dashboard_alert") as Array<UIAlert>;
 
   return (
-    <Box px={4}>
+    <Box overflow="auto" px={4}>
       <VStack alignItems="start">
         {alerts.length > 0 ? (
           <Accordion.Root collapsible defaultValue={["ui_alerts"]}>
diff --git 
a/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/MetricSection.tsx
 
b/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/MetricSection.tsx
index 41292947c4b..cf50400fab9 100644
--- 
a/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/MetricSection.tsx
+++ 
b/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/MetricSection.tsx
@@ -19,7 +19,7 @@
 import { Box, Flex, HStack, VStack, Text } from "@chakra-ui/react";
 import { Link as RouterLink } from "react-router-dom";
 
-import type { TaskInstanceState } from "openapi/requests/types.gen";
+import type { TaskInstanceStateCount } from "openapi/requests/types.gen";
 import { StateBadge } from "src/components/StateBadge";
 import { capitalize } from "src/utils";
 
@@ -31,7 +31,7 @@ type MetricSectionProps = {
   readonly kind: string;
   readonly runs: number;
   readonly startDate: string;
-  readonly state: TaskInstanceState;
+  readonly state: keyof TaskInstanceStateCount;
   readonly total: number;
 };
 
@@ -53,7 +53,8 @@ export const MetricSection = ({ endDate, kind, runs, 
startDate, state, total }:
       <Flex justify="space-between">
         <HStack>
           <RouterLink to={`/${kind}?${searchParams.toString()}`}>
-            <StateBadge fontSize="md" state={state}>
+            {/* eslint-disable-next-line unicorn/no-null */}
+            <StateBadge fontSize="md" state={state === "no_status" ? null : 
state}>
               {runs}
             </StateBadge>
           </RouterLink>
@@ -68,7 +69,7 @@ export const MetricSection = ({ endDate, kind, runs, 
startDate, state, total }:
       </Flex>
       <HStack gap={0} mt={2}>
         <Box
-          bg={`${state}.solid`}
+          bg={`${state === "no_status" ? "none" : state}.solid`}
           borderLeftRadius={5}
           height={`${BAR_HEIGHT}px`}
           minHeight={2}
diff --git 
a/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/TaskInstanceMetrics.tsx
 
b/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/TaskInstanceMetrics.tsx
index 563995d6b02..a9975032e9b 100644
--- 
a/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/TaskInstanceMetrics.tsx
+++ 
b/airflow-core/src/airflow/ui/src/pages/Dashboard/HistoricalMetrics/TaskInstanceMetrics.tsx
@@ -45,6 +45,7 @@ const TASK_STATES: Array<keyof TaskInstanceStateCount> = [
   "up_for_reschedule",
   "upstream_failed",
   "deferred",
+  "no_status",
 ];
 
 export const TaskInstanceMetrics = ({