From a822db59676ad6c91db1a15358d113e27b08a4d0 Mon Sep 17 00:00:00 2001
From: Mauricio Siu <siumauricio@icloud.com>
Date: Thu, 27 Aug 2026 01:44:49 -0600
Subject: [PATCH] fix: correct network monitoring chart labels and units

Network chart showed values labeled as KB/s, but the underlying data
is MB totals accumulated since boot. Convert to GB and relabel as
Network Total (since Boot).

Fixes #5115
---
 .../monitoring/paid/servers/network-chart.tsx     | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/apps/dokploy/components/dashboard/monitoring/paid/servers/network-chart.tsx b/apps/dokploy/components/dashboard/monitoring/paid/servers/network-chart.tsx
index 249df308b..8f72f2fca 100644
--- a/apps/dokploy/components/dashboard/monitoring/paid/servers/network-chart.tsx
+++ b/apps/dokploy/components/dashboard/monitoring/paid/servers/network-chart.tsx
@@ -19,6 +19,11 @@ interface NetworkChartProps {
 	data: any[];
 }
 
+function formatNetworkGB(valueInMB: number) {
+	if (Number.isNaN(valueInMB)) return "0";
+	return (valueInMB / 1024).toFixed(1);
+}
+
 const chartConfig = {
 	networkIn: {
 		label: "Network In",
@@ -38,8 +43,8 @@ export function NetworkChart({ data }: NetworkChartProps) {
 			<CardHeader className="border-b py-5">
 				<CardTitle>Network</CardTitle>
 				<CardDescription>
-					Network Traffic: ↑ {latestData.networkOut} KB/s ↓{" "}
-					{latestData.networkIn} KB/s
+					Network Total: ↑ {formatNetworkGB(latestData.networkOut)} GB ↓{" "}
+					{formatNetworkGB(latestData.networkIn)} GB (since Boot)
 				</CardDescription>
 			</CardHeader>
 			<CardContent className="px-2 pt-4 sm:px-6 sm:pt-6">
@@ -83,7 +88,7 @@ export function NetworkChart({ data }: NetworkChartProps) {
 							minTickGap={32}
 							tickFormatter={(value) => formatTimestamp(value)}
 						/>
-						<YAxis tickFormatter={(value) => `${value} KB/s`} />
+						<YAxis tickFormatter={(value) => `${formatNetworkGB(value)} GB`} />
 						<ChartTooltip
 							cursor={false}
 							content={({ active, payload, label }) => {
@@ -105,8 +110,8 @@ export function NetworkChart({ data }: NetworkChartProps) {
 														Network
 													</span>
 													<span className="font-bold">
-														↑ {data.networkOut} KB/s
-														<br />↓ {data.networkIn} KB/s
+														↑ {formatNetworkGB(data.networkOut)} GB
+														<br />↓ {formatNetworkGB(data.networkIn)} GB
 													</span>
 												</div>
 											</div>