Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-07-24 07:49:41 +02:00
Code Issues Releases Activity

refactor(app): redesign dashboard-item component [EE-3634] (#7175)

Browse source
This commit is contained in:
Chaim Lev-Ari 2022-07-06 11:23:53 +03:00 • committed by GitHub
parent a66fd78dc1
commit 8bf1c91bc9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 236 additions and 248 deletions
Download patch file Download diff file Expand all files Collapse all files

52
app/react/docker/DashboardView/ContainerStatus.tsx Normal file
View file

@ -0,0 +1,52 @@
import { DockerContainer } from '../containers/types';
interface Props {
containers: DockerContainer[];
}
export function useContainerStatusComponent(containers: DockerContainer[]) {
return <ContainerStatus containers={containers} />;
}
export function ContainerStatus({ containers }: Props) {
return (
<>
<div className="pull-right pl-1">
<div>
<i className="fa fa-power-off space-right green-icon" />
{runningContainersFilter(containers)} running
</div>
<div>
<i className="fa fa-power-off space-right red-icon" />
{stoppedContainersFilter(containers)} stopped
</div>
</div>
<div className="pull-right pr-5">
<div>
<i className="fa fa-heartbeat space-right green-icon" />
{healthyContainersFilter(containers)} healthy
</div>
<div>
<i className="fa fa-heartbeat space-right orange-icon" />
{unhealthyContainersFilter(containers)} unhealthy
</div>
</div>
</>
);
}
function runningContainersFilter(containers: DockerContainer[]) {
return containers.filter((container) => container.Status === 'running')
.length;
}
function stoppedContainersFilter(containers: DockerContainer[]) {
return containers.filter((container) => container.Status === 'exited').length;
}
function healthyContainersFilter(containers: DockerContainer[]) {
return containers.filter((container) => container.Status === 'healthy')
.length;
}
function unhealthyContainersFilter(containers: DockerContainer[]) {
return containers.filter((container) => container.Status === 'unhealthy')
.length;
}