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

cleanup redundant code

Browse Source
This commit is contained in:
csehviktor
2025-07-10 05:48:24 +02:00
parent 04ebda9a54
commit 67f871882e
5 changed files with 67 additions and 174 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,6 +1,6 @@
import type { StatusMessage } from "@/services/types";
import { addRealtimeData, getRealtimeData } from "@/services/data_service";
import { formatTimestamp } from "@/services/utils";
import { addDataPoint, getRealtimeData } from "@/services/store";
import { formatTimestamp, calcPercentage } from "@/services/utils";
import { useEffect } from "react";
export type ChartData = {
@@ -22,82 +22,95 @@ export function useChartData(data: StatusMessage | null): ChartDataReturns {
useEffect(() => {
if (!data) return;
addRealtimeData(data);
addDataPoint(data);
}, [data]);
const cpuPoints = getRealtimeData("cpu");
const cpuUserPoints = getRealtimeData("cpu_user");
const cpuSystemPoints = getRealtimeData("cpu_system");
const cpuIdlePoints = getRealtimeData("cpu_idle");
const cpuStealPoints = getRealtimeData("cpu_steal");
const cpuIowaitPoints = getRealtimeData("cpu_iowait");
const memoryPoints = getRealtimeData("memory");
const swapPoints = getRealtimeData("swap");
const networkUpPoints = getRealtimeData("network_up");
const networkDownPoints = getRealtimeData("network_down");
const realtimeData = getRealtimeData();
return {
cpuData: {
labels: cpuPoints.map((p) => formatTimestamp(p.timestamp)),
labels: realtimeData.map((p) => formatTimestamp(p.timestamp)),
datasets: [
{
label: "Total CPU (%)",
data: cpuPoints.map((p) => p.value),
data: realtimeData.map(({ metrics }) => metrics.cpu.usage),
color: "#3b82f6",
},
{
label: "User (%)",
data: cpuUserPoints.map((p) => p.value),
data: realtimeData.map(
({ metrics }) => metrics.cpu.breakdown.user,
),
color: "#10b981",
},
{
label: "System (%)",
data: cpuSystemPoints.map((p) => p.value),
data: realtimeData.map(
({ metrics }) => metrics.cpu.breakdown.system,
),
color: "#f59e0b",
},
{
label: "I/O Wait (%)",
data: cpuIowaitPoints.map((p) => p.value),
data: realtimeData.map(
({ metrics }) => metrics.cpu.breakdown.iowait,
),
color: "#ef4444",
},
{
label: "Steal (%)",
data: cpuStealPoints.map((p) => p.value),
data: realtimeData.map(
({ metrics }) => metrics.cpu.breakdown.steal,
),
color: "#8b5cf6",
},
{
label: "Idle (%)",
data: cpuIdlePoints.map((p) => p.value),
data: realtimeData.map(
({ metrics }) => metrics.cpu.breakdown.idle,
),
color: "#6b7280",
},
],
},
memoryData: {
labels: memoryPoints.map((p) => formatTimestamp(p.timestamp)),
labels: realtimeData.map((p) => formatTimestamp(p.timestamp)),
datasets: [
{
label: "Memory Usage (%)",
data: memoryPoints.map((p) => p.value),
data: realtimeData.map(({ metrics }) =>
calcPercentage(
metrics.memory.used,
metrics.memory.total,
),
),
color: "#10b981",
},
{
label: "Swap Usage (%)",
data: swapPoints.map((p) => p.value),
data: realtimeData.map(({ metrics }) =>
calcPercentage(
metrics.memory.swap_used,
metrics.memory.swap_total,
),
),
color: "#f59e0b",
},
],
},
networkData: {
labels: networkUpPoints.map((p) => formatTimestamp(p.timestamp)),
labels: realtimeData.map((p) => formatTimestamp(p.timestamp)),
datasets: [
{
label: "Upload (B/s)",
data: networkUpPoints.map((p) => p.value),
data: realtimeData.map(({ metrics }) => metrics.network.up),
color: "#ef4444",
},
{
label: "Download (B/s)",
data: networkDownPoints.map((p) => p.value),
data: realtimeData.map(
({ metrics }) => metrics.network.down,
),
color: "#3b82f6",
},
],