albert/status-monitor
1
0
Fork 0
mirror of https://github.com/csehviktor/status-monitor.git synced 2025-08-08 18:06:14 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix network units

Browse Source
This commit is contained in:
csehviktor
2025-07-10 20:50:19 +02:00
parent 67f871882e
commit 6225a45848
4 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ui/src/hooks/useChartData.tsx
View File

@@ -102,12 +102,12 @@ export function useChartData(data: StatusMessage | null): ChartDataReturns {
labels: realtimeData.map((p) => formatTimestamp(p.timestamp)), labels: realtimeData.map((p) => formatTimestamp(p.timestamp)),
datasets: [ datasets: [
{ {
label: "Upload (B/s)", label: "Upload (bps)",
data: realtimeData.map(({ metrics }) => metrics.network.up), data: realtimeData.map(({ metrics }) => metrics.network.up),
color: "#ef4444", color: "#ef4444",
}, },
{ {
label: "Download (B/s)", label: "Download (bps)",
data: realtimeData.map( data: realtimeData.map(
({ metrics }) => metrics.network.down, ({ metrics }) => metrics.network.down,
), ),

7
ui/src/pages/agent.tsx
View File

@@ -11,9 +11,10 @@ import { SysinfoCard } from "@/components/SysinfoCard";
import { useChartData } from "@/hooks/useChartData"; import { useChartData } from "@/hooks/useChartData";
import { getLastMessage, setLastMessage } from "@/services/store"; import { getLastMessage, setLastMessage } from "@/services/store";
import { import {
formatBytes, formatBits,
formatPercentage, formatPercentage,
calcPercentage, calcPercentage,
formatBytes,
} from "@/services/utils"; } from "@/services/utils";
import { initializeConnection } from "@/services/websocket"; import { initializeConnection } from "@/services/websocket";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
@@ -127,9 +128,9 @@ export function AgentPage() {
<MetricCard <MetricCard
props={{ props={{
title: "NETWORK ACTIVITY", title: "NETWORK ACTIVITY",
value: formatBytes(networkUsage), value: formatBits(networkUsage),
status: "nil", status: "nil",
subtitle: `↑ ${formatBytes(networkUp)}/s ↓ ${formatBytes(networkDown)}/s`, subtitle: `↑ ${formatBits(networkUp)}/s ↓ ${formatBits(networkDown)}/s`,
}} }}
> >
<DonutChart <DonutChart

1
ui/src/pages/home.tsx
View File

@@ -84,6 +84,7 @@ export function HomePage() {
key={index} key={index}
data={agent} data={agent}
onClick={() => onClick={() =>
isAgentOnline(agent) &&
navigate(`/agents/${agent.agent}`) navigate(`/agents/${agent.agent}`)
} }
/> />

4
ui/src/services/utils.ts
View File

@@ -55,6 +55,10 @@ export function formatBytes(bytes: number | undefined): string {
return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`; return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
} }
export function formatBits(bits: number | undefined): string {
return formatBytes((bits ?? 0) / 8);
}
export function calcPercentage( export function calcPercentage(
value: number | undefined, value: number | undefined,
total: number | undefined, total: number | undefined,