diff --git a/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json b/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json
index 6da5b7cba6468..7821e6babf7c0 100644
--- a/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json
+++ b/airflow-core/src/airflow/ui/public/i18n/locales/en/common.json
@@ -159,15 +159,6 @@
"placeholder": "Add a note...",
"taskInstance": "Task Instance Note"
},
- "pools": {
- "deferred": "Deferred",
- "open": "Open",
- "pools_one": "pool",
- "pools_other": "pools",
- "queued": "Queued",
- "running": "Running",
- "scheduled": "Scheduled"
- },
"reset": "Reset",
"runId": "Run ID",
"runTypes": {
@@ -207,6 +198,7 @@
"failed": "Failed",
"no_status": "No Status",
"none": "No Status",
+ "open": "Open",
"planned": "Planned",
"queued": "Queued",
"removed": "Removed",
diff --git a/airflow-core/src/airflow/ui/src/components/PoolBar.tsx b/airflow-core/src/airflow/ui/src/components/PoolBar.tsx
index d7b68b6b5600c..e19cce8ecdd00 100644
--- a/airflow-core/src/airflow/ui/src/components/PoolBar.tsx
+++ b/airflow-core/src/airflow/ui/src/components/PoolBar.tsx
@@ -16,11 +16,12 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { Flex, Link, Box } from "@chakra-ui/react";
+import { Box, Flex, Text, VStack, Link, HStack } from "@chakra-ui/react";
import { useTranslation } from "react-i18next";
import { Link as RouterLink } from "react-router-dom";
-import type { PoolResponse } from "openapi/requests/types.gen";
+import type { PoolResponse, TaskInstanceState } from "openapi/requests/types.gen";
+import { StateIcon } from "src/components/StateIcon";
import { Tooltip } from "src/components/ui";
import { SearchParamsKeys } from "src/constants/searchParams";
import { type Slots, slotConfigs } from "src/utils/slots";
@@ -36,52 +37,87 @@ export const PoolBar = ({
}) => {
const { t: translate } = useTranslation("common");
+ const isDashboard = Boolean(poolsWithSlotType);
+ const includeDeferredInBar = "include_deferred" in pool && pool.include_deferred;
+ const barSlots = ["running", "queued", "open"];
+
+ if (isDashboard || includeDeferredInBar) {
+ barSlots.push("deferred");
+ }
+ const infoSlots = ["scheduled"];
+
+ if (!isDashboard && !includeDeferredInBar) {
+ infoSlots.push("deferred");
+ }
+
+ const preparedSlots = slotConfigs.map((config) => {
+ const slotType = config.key.replace("_slots", "") as TaskInstanceState;
+
+ return {
+ ...config,
+ label: translate(`common:states.${slotType}`),
+ slotType,
+ slotValue: (pool[config.key] as number | undefined) ?? 0,
+ };
+ });
+
return (
- <>
- {slotConfigs.map(({ color, icon, key }) => {
- const slotValue = pool[key];
- const flexValue = slotValue / totalSlots || 0;
+
+
+ {preparedSlots
+ .filter((slot) => barSlots.includes(slot.slotType) && slot.slotValue > 0)
+ .map((slot) => {
+ const flexValue = slot.slotValue / totalSlots || 0;
- if (flexValue === 0) {
- return undefined;
- }
+ const poolContent = (
+
+
+ {slot.icon}
+
+ {slot.slotValue}
+
+
+
+ );
- const slotType = key.replace("_slots", "");
- const poolCount = poolsWithSlotType ? poolsWithSlotType[key] : 0;
- const tooltipContent = `${translate(`pools.${slotType}`)}: ${slotValue} (${poolCount} ${translate("pools.pools", { count: poolCount })})`;
- const poolContent = (
-
-
- {icon}
- {slotValue}
-
-
- );
+ return slot.color !== "success" && "name" in pool ? (
+
+
+ {poolContent}
+
+
+ ) : (
+
+ {poolContent}
+
+ );
+ })}
+
- return color !== "success" && "name" in pool ? (
-
-
- {poolContent}
-
-
- ) : (
-
- {poolContent}
-
- );
- })}
- >
+
+ {preparedSlots
+ .filter((slot) => infoSlots.includes(slot.slotType) && slot.slotValue > 0)
+ .map((slot) => (
+
+
+
+ {slot.label}: {slot.slotValue}
+
+
+ ))}
+
+
);
};
diff --git a/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx b/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx
index 444b4424fe12c..65f4ba790958c 100644
--- a/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx
@@ -99,9 +99,7 @@ export const PoolSummary = () => {
{isLoading ? (
) : (
-
-
-
+
)}
);
diff --git a/airflow-core/src/airflow/ui/src/pages/Pools/PoolBarCard.tsx b/airflow-core/src/airflow/ui/src/pages/Pools/PoolBarCard.tsx
index d1d416e9c7e12..218eb24a6b3c1 100644
--- a/airflow-core/src/airflow/ui/src/pages/Pools/PoolBarCard.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Pools/PoolBarCard.tsx
@@ -61,11 +61,8 @@ const PoolBarCard = ({ pool }: PoolBarCardProps) => {
)}
-
-
-
-
+
);