fix(docker): include healthy containers in running [EE-6264] (#10746)

app/react/docker/DashboardView/ContainerStatus.tsx

@@ -2,7 +2,10 @@ import { Heart, Power } from 'lucide-react';
 
 import { Icon } from '@/react/components/Icon';
 
-import { DockerContainer } from '../containers/types';
+import {
+  DockerContainer,
+  ContainerStatus as Status,
+} from '../containers/types';
 
 interface Props {
   containers: DockerContainer[];
@@ -40,20 +43,22 @@ export function ContainerStatus({ containers }: Props) {
 }
 
 function runningContainersFilter(containers: DockerContainer[]) {
-  return containers.filter((container) => container.Status === 'running')
-    .length;
+  return containers.filter(
+    (container) =>
+      container.Status === Status.Running || container.Status === Status.Healthy
+  ).length;
 }
 function stoppedContainersFilter(containers: DockerContainer[]) {
   return containers.filter(
     (container) =>
-      container.Status === 'exited' || container.Status === 'stopped'
+      container.Status === Status.Exited || container.Status === Status.Stopped
   ).length;
 }
 function healthyContainersFilter(containers: DockerContainer[]) {
-  return containers.filter((container) => container.Status === 'healthy')
+  return containers.filter((container) => container.Status === Status.Healthy)
     .length;
 }
 function unhealthyContainersFilter(containers: DockerContainer[]) {
-  return containers.filter((container) => container.Status === 'unhealthy')
+  return containers.filter((container) => container.Status === Status.Unhealthy)
     .length;
 }

app/react/docker/snapshots/types/index.ts

@@ -15,6 +15,7 @@ export interface DockerSnapshot {
   NodeCount: number;
   ImageCount: number;
   VolumeCount: number;
+  ContainerCount: number;
   RunningContainerCount: number;
   StoppedContainerCount: number;
   HealthyContainerCount: number;

app/react/portainer/HomeView/EnvironmentList/EnvironmentItem/EnvironmentStatsDocker.tsx

@@ -41,6 +41,7 @@ export function EnvironmentStatsDocker({ snapshot }: Props) {
       )}
 
       <ContainerStats
+        total={snapshot.ContainerCount}
         running={snapshot.RunningContainerCount}
         stopped={snapshot.StoppedContainerCount}
         healthy={snapshot.HealthyContainerCount}
@@ -70,6 +71,7 @@ export function EnvironmentStatsDocker({ snapshot }: Props) {
 }
 
 interface ContainerStatsProps {
+  total: number;
   running: number;
   stopped: number;
   healthy: number;
@@ -77,16 +79,16 @@ interface ContainerStatsProps {
 }
 
 function ContainerStats({
+  total,
   running,
   stopped,
   healthy,
   unhealthy,
 }: ContainerStatsProps) {
-  const containersCount = running + stopped;
-
+  const actualTotal = total || running + stopped;
   return (
-    <StatsItem value={addPlural(containersCount, 'container')} icon={Box}>
-      {containersCount > 0 && (
+    <StatsItem value={addPlural(actualTotal, 'container')} icon={Box}>
+      {actualTotal > 0 && (
         <>
           <StatsItem value={running} icon={Power} iconClass="icon-success" />
           <StatsItem value={stopped} icon={Power} iconClass="icon-danger" />