Merge pull request #3933 from bluewave-labs/feat/docker-state-palette

feat: docker state palette

client/src/Pages/Docker/ContainerDetails/Components/StatBoxes.tsx

@@ -10,6 +10,7 @@ import type { DockerContainerInfo } from "@/Types/Check";
 
 // Utils
 import { formatDuration } from "@/Utils/TimeUtils";
+import { getDockerPalette } from "@/Utils/MonitorUtils";
 
 export const DockerContainerStatusBoxes = ({
 	container,
@@ -24,6 +25,7 @@ export const DockerContainerStatusBoxes = ({
 	const { state, restartCount, health } = container;
 	const startedAt = container.startedAt ?? "0";
 	const runningFor = Date.now() - new Date(startedAt).getTime();
+	const palette = getDockerPalette(state);
 	return (
 		<Stack
 			direction="row"
@@ -33,6 +35,7 @@ export const DockerContainerStatusBoxes = ({
 			<StatBox
 				title={t("common.labels.state")}
 				subtitle={state}
+				palette={palette}
 			/>
 			<StatBox
 				title={t("common.labels.uptime")}

client/src/Utils/MonitorUtils.ts

@@ -40,6 +40,14 @@ export const getStatusPalette = (status: MonitorStatus): PaletteKey => {
 	return "warning";
 };
 
+export const getDockerPalette = (dockerState: DockerContainerState): PaletteKey => {
+	if (dockerState === "created") return "success";
+	if (dockerState === "running") return "success";
+	if (dockerState === "dead") return "error";
+	if (dockerState === "exited") return "error";
+	return "warning";
+};
+
 export const getValuePalette = (value: ValueType): PaletteKey => {
 	const paletteMap: Record<ValueType, PaletteKey> = {
 		positive: "success",