diff --git a/AppImage/components/login.tsx b/AppImage/components/login.tsx index 534fddcd..0e48443b 100644 --- a/AppImage/components/login.tsx +++ b/AppImage/components/login.tsx @@ -271,7 +271,7 @@ export function Login({ onLogin }: LoginProps) { -

ProxMenux Monitor v1.2.2

+

ProxMenux Monitor v1.2.2.1-beta

) diff --git a/AppImage/components/network-metrics.tsx b/AppImage/components/network-metrics.tsx index 74cafd3e..fe70e1d9 100644 --- a/AppImage/components/network-metrics.tsx +++ b/AppImage/components/network-metrics.tsx @@ -300,26 +300,49 @@ export function NetworkMetrics() { return (
{/* Network Overview Cards */} -
- - - Network Traffic - - - -
-
- Received: - ↓ {trafficInFormatted} -
-
- Sent: - ↑ {trafficOutFormatted} -
-
- - +
+ {/* ── Network Traffic (preview restyle: Down/Up dual headline + stacked bar) ── */} + {(() => { + const downBytes = networkData.traffic.bytes_recv || 0 + const upBytes = networkData.traffic.bytes_sent || 0 + const totalBytes = downBytes + upBytes + const downPct = totalBytes > 0 ? (downBytes / totalBytes) * 100 : 50 + const upPct = totalBytes > 0 ? (upBytes / totalBytes) * 100 : 50 + return ( + + + Network Traffic + + + +
+
+
+ ↓ Down +
+
{trafficInFormatted}
+
+
+
+ ↑ Up +
+
{trafficOutFormatted}
+
+
+
+
+
+
+
+ Down {Math.round(downPct)}% + Up {Math.round(upPct)}% +
+ + + ) + })()} + {/* ── Active Interfaces (preview restyle v2: revertido al original con title uppercase) ── */} Active Interfaces @@ -330,10 +353,10 @@ export function NetworkMetrics() { {(networkData.physical_active_count ?? 0) + (networkData.bridge_active_count ?? 0)}
- + Physical: {networkData.physical_active_count ?? 0}/{networkData.physical_total_count ?? 0} - + Bridges: {networkData.bridge_active_count ?? 0}/{networkData.bridge_total_count ?? 0}
@@ -343,31 +366,43 @@ export function NetworkMetrics() { - {/* Merged Network Config & Health Card */} + {/* ── Network Status (preview restyle: packet-loss highlight + 2x2 grid) ── */} Network Status - - {healthStatus} - + {healthStatus === 'Healthy' ? '✓ ' : ''}{healthStatus} -
-
- Hostname - {hostname} + {(() => { + const lossPct = Number.parseFloat(avgPacketLoss) || 0 + const lossColor = + lossPct >= 5 ? 'text-red-500' : + lossPct >= 1 ? 'text-orange-500' : + lossPct > 0 ? 'text-yellow-500' : + 'text-blue-500' + return ( +
+ {avgPacketLoss}% + Packet Loss +
+ ) + })()} +
+
+
Hostname:
+
{hostname}
-
- Primary DNS - {primaryDNS} +
+
DNS:
+
{primaryDNS}
-
- Packet Loss - {avgPacketLoss}% +
+
Errors:
+
{totalErrors}
-
- Errors - {totalErrors} +
+
Domain:
+
{networkData.domain || '—'}
diff --git a/AppImage/components/proxmox-dashboard.tsx b/AppImage/components/proxmox-dashboard.tsx index a864ea98..e69e7140 100644 --- a/AppImage/components/proxmox-dashboard.tsx +++ b/AppImage/components/proxmox-dashboard.tsx @@ -858,7 +858,7 @@ export function ProxmoxDashboard() {