From deae081cb3ecf3ce51eee3a72c8d06cadfa47914 Mon Sep 17 00:00:00 2001 From: MacRimi Date: Mon, 20 Oct 2025 22:15:08 +0200 Subject: [PATCH] Update AppImage --- AppImage/components/metrics-dialog.tsx | 48 ++- AppImage/components/virtual-machines.tsx | 373 +++++++++++++++-------- 2 files changed, 297 insertions(+), 124 deletions(-) diff --git a/AppImage/components/metrics-dialog.tsx b/AppImage/components/metrics-dialog.tsx index 8283e39..aa894bb 100644 --- a/AppImage/components/metrics-dialog.tsx +++ b/AppImage/components/metrics-dialog.tsx @@ -43,19 +43,27 @@ export function MetricsView({ vmid, vmName, vmType, metricType, onBack }: Metric setLoading(true) setError(null) + console.log("[v0] Fetching metrics for VMID:", vmid, "Timeframe:", timeframe, "Type:", vmType) + try { const baseUrl = typeof window !== "undefined" ? `${window.location.protocol}//${window.location.hostname}:8008` : "" const apiUrl = `${baseUrl}/api/vms/${vmid}/metrics?timeframe=${timeframe}` + console.log("[v0] Fetching from URL:", apiUrl) + const response = await fetch(apiUrl) + console.log("[v0] Response status:", response.status) + if (!response.ok) { const errorData = await response.json() + console.error("[v0] Error response:", errorData) throw new Error(errorData.error || "Failed to fetch metrics") } const result = await response.json() + console.log("[v0] Metrics data received:", result) const transformedData = result.data.map((item: any) => { const date = new Date(item.time * 1000) @@ -113,8 +121,10 @@ export function MetricsView({ vmid, vmName, vmType, metricType, onBack }: Metric } }) + console.log("[v0] Transformed data:", transformedData.length, "points") setData(transformedData) } catch (err: any) { + console.error("[v0] Error fetching metrics:", err) setError(err.message || "Error loading metrics") } finally { setLoading(false) @@ -156,7 +166,9 @@ export function MetricsView({ vmid, vmName, vmType, metricType, onBack }: Metric switch (metricType) { case "cpu": const maxCpuValue = Math.max(...data.map((d) => d.cpu || 0)) - const cpuDomainMax = Math.ceil(maxCpuValue * 1.15) + const cpuDomainMax = Math.ceil(maxCpuValue * 1.15) // 15% margin + console.log("[v0] CPU - Max value:", maxCpuValue, "Domain max:", cpuDomainMax, "Data points:", data.length) + console.log("[v0] CPU - Sample data:", data.slice(0, 3)) return ( @@ -204,7 +216,16 @@ export function MetricsView({ vmid, vmName, vmType, metricType, onBack }: Metric case "memory": const maxMemoryValue = Math.max(...data.map((d) => d.memory || 0)) - const memoryDomainMax = Math.ceil(maxMemoryValue * 1.15) + const memoryDomainMax = Math.ceil(maxMemoryValue * 1.15) // 15% margin + console.log( + "[v0] Memory - Max value:", + maxMemoryValue, + "Domain max:", + memoryDomainMax, + "Data points:", + data.length, + ) + console.log("[v0] Memory - Sample data:", data.slice(0, 3)) return ( @@ -252,7 +273,24 @@ export function MetricsView({ vmid, vmName, vmType, metricType, onBack }: Metric case "network": const maxNetworkValue = Math.max(...data.map((d) => Math.max(d.netin || 0, d.netout || 0))) - const networkDomainMax = Math.ceil(maxNetworkValue * 1.15) + const networkDomainMax = Math.ceil(maxNetworkValue * 1.15) // 15% margin + console.log( + "[v0] Network - Max value:", + maxNetworkValue, + "Domain max:", + networkDomainMax, + "Data points:", + data.length, + ) + console.log("[v0] Network - Sample data:", data.slice(0, 3)) + console.log( + "[v0] Network - All netin values:", + data.map((d) => d.netin), + ) + console.log( + "[v0] Network - All netout values:", + data.map((d) => d.netout), + ) return ( @@ -309,7 +347,9 @@ export function MetricsView({ vmid, vmName, vmType, metricType, onBack }: Metric case "disk": const maxDiskValue = Math.max(...data.map((d) => Math.max(d.diskread || 0, d.diskwrite || 0))) - const diskDomainMax = Math.ceil(maxDiskValue * 1.15) + const diskDomainMax = Math.ceil(maxDiskValue * 1.15) // 15% margin + console.log("[v0] Disk - Max value:", maxDiskValue, "Domain max:", diskDomainMax, "Data points:", data.length) + console.log("[v0] Disk - Sample data:", data.slice(0, 3)) return ( diff --git a/AppImage/components/virtual-machines.tsx b/AppImage/components/virtual-machines.tsx index 2b03149..c63075c 100644 --- a/AppImage/components/virtual-machines.tsx +++ b/AppImage/components/virtual-machines.tsx @@ -381,6 +381,12 @@ export function VirtualMachines() { return "text-green-500" } + console.log("[v0] Memory status:", { + physical: physicalMemoryGB, + allocated: allocatedMemoryGB, + isOvercommit: isMemoryOvercommit, + }) + if (isLoading) { return (
@@ -717,27 +723,57 @@ export function VirtualMachines() { {currentView === "main" ? ( <> - + -
- - {selectedVM?.name} - ID: {selectedVM?.vmid} -
- {selectedVM && ( -
- - {getTypeBadge(selectedVM.type).icon} - {getTypeBadge(selectedVM.type).label} - - - {selectedVM.status.toUpperCase()} - - {selectedVM.status === "running" && ( - Uptime: {formatUptime(selectedVM.uptime)} - )} + {/* Desktop layout */} +
+
+ + {selectedVM?.name} + ID: {selectedVM?.vmid}
- )} + {selectedVM && ( + <> + + {getTypeBadge(selectedVM.type).icon} + {getTypeBadge(selectedVM.type).label} + + + {selectedVM.status.toUpperCase()} + + {selectedVM.status === "running" && ( + + Uptime: {formatUptime(selectedVM.uptime)} + + )} + + )} +
+ + {/* Mobile layout */} +
+
+ + {selectedVM?.name} + ID: {selectedVM?.vmid} +
+ {selectedVM && ( +
+ + {getTypeBadge(selectedVM.type).icon} + {getTypeBadge(selectedVM.type).label} + + + {selectedVM.status.toUpperCase()} + + {selectedVM.status === "running" && ( + + Uptime: {formatUptime(selectedVM.uptime)} + + )} +
+ )} +
@@ -745,18 +781,17 @@ export function VirtualMachines() {
{selectedVM && ( <> -
- {/* CPU & Memory Card */} -
handleMetricClick("cpu")} - > -

- CPU & Memory -

-
-
-
CPU Usage
+
+

+ Basic Information +

+
+
+
CPU Usage
+
handleMetricClick("cpu")} + >
{(selectedVM.cpu * 100).toFixed(1)}%
@@ -765,8 +800,13 @@ export function VirtualMachines() { className={`h-1.5 ${getModalProgressColor(selectedVM.cpu * 100)}`} />
-
-
Memory
+
+
+
Memory
+
handleMetricClick("memory")} + >
@@ -779,19 +819,12 @@ export function VirtualMachines() { />
-
- - {/* Disk Usage Card */} -
handleMetricClick("disk")} - > -

- Disk Usage -

-
-
-
Storage
+
+
Disk
+
handleMetricClick("disk")} + >
@@ -804,91 +837,190 @@ export function VirtualMachines() { />
-
- - {/* Disk I/O Card */} -
handleMetricClick("disk")} - > -

- Disk I/O -

-
-
- ↓ Read - - {((selectedVM.diskread || 0) / 1024 ** 2).toFixed(2)} MB - +
+
Disk I/O
+
handleMetricClick("disk")} + > +
+ ↓ + {((selectedVM.diskread || 0) / 1024 ** 2).toFixed(2)} MB +
+
+ ↑ + {((selectedVM.diskwrite || 0) / 1024 ** 2).toFixed(2)} MB +
-
- ↑ Write - - {((selectedVM.diskwrite || 0) / 1024 ** 2).toFixed(2)} MB - +
+
+
Network I/O
+
handleMetricClick("network")} + > +
+ ↓ + {((selectedVM.netin || 0) / 1024 ** 2).toFixed(2)} MB +
+
+ ↑ + {((selectedVM.netout || 0) / 1024 ** 2).toFixed(2)} MB +
+
- {/* Network I/O Card */} -
handleMetricClick("network")} - > -

- Network I/O -

-
-
- ↓ Download - - {((selectedVM.netin || 0) / 1024 ** 2).toFixed(2)} MB - +
+

+ Resources +

+
+ {vmDetails?.config.cores && ( +
+
CPU Cores
+
{vmDetails.config.cores}
-
- ↑ Upload - - {((selectedVM.netout || 0) / 1024 ** 2).toFixed(2)} MB - + )} + {vmDetails?.config.sockets && ( +
+
CPU Sockets
+
{vmDetails.config.sockets}
-
+ )} + {vmDetails?.config.memory && ( +
+
Memory
+
{vmDetails.config.memory} MB
+
+ )} + {vmDetails?.config.swap && ( +
+
Swap
+
{vmDetails.config.swap} MB
+
+ )} + {vmDetails?.config.rootfs && ( +
+
Root Filesystem
+
+ {vmDetails.config.rootfs} +
+
+ )} + {Object.keys(vmDetails?.config || {}) + .filter((key) => key.match(/^(scsi|sata|ide|virtio)\d+$/)) + .map((diskKey) => ( +
+
+ {diskKey.toUpperCase().replace(/(\d+)/, " $1")} +
+
+ {vmDetails?.config[diskKey]} +
+
+ ))}
+
- {/* Resources & Configuration Card */} -
-

- Configuration -

- {detailsLoading ? ( -
Loading configuration...
- ) : vmDetails?.config ? ( -
- {vmDetails.config.cores && ( -
-
CPU Cores
-
{vmDetails.config.cores}
+
+

+ Network +

+
+ {Object.keys(vmDetails?.config || {}) + .filter((key) => key.match(/^net\d+$/)) + .map((netKey) => ( +
+
+ Network Interface {netKey.replace("net", "")}
- )} - {vmDetails.config.memory && ( -
-
Memory
-
{vmDetails.config.memory} MB
+
+ {vmDetails?.config[netKey]}
- )} - {vmDetails.config.swap && ( -
-
Swap
-
{vmDetails.config.swap} MB
-
- )} - {vmDetails.config.ostype && ( -
-
OS Type
-
{vmDetails.config.ostype}
-
- )} +
+ ))} + {vmDetails?.config.nameserver && ( +
+
DNS Nameserver
+
{vmDetails.config.nameserver}
- ) : null} + )} + {vmDetails?.config.searchdomain && ( +
+
Search Domain
+
{vmDetails.config.searchdomain}
+
+ )} + {vmDetails?.config.hostname && ( +
+
Hostname
+
{vmDetails.config.hostname}
+
+ )} +
+
+ +
+

+ Options +

+
+ {vmDetails?.config.onboot !== undefined && ( +
+
Start on Boot
+ + {vmDetails.config.onboot ? "Yes" : "No"} + +
+ )} + {vmDetails?.config.unprivileged !== undefined && ( +
+
Unprivileged
+ + {vmDetails.config.unprivileged ? "Yes" : "No"} + +
+ )} + {vmDetails?.config.ostype && ( +
+
OS Type
+
{vmDetails.config.ostype}
+
+ )} + {vmDetails?.config.arch && ( +
+
Architecture
+
{vmDetails.config.arch}
+
+ )} + {vmDetails?.config.boot && ( +
+
Boot Order
+
{vmDetails.config.boot}
+
+ )} + {vmDetails?.config.features && ( +
+
Features
+
{vmDetails.config.features}
+
+ )}
@@ -896,7 +1028,7 @@ export function VirtualMachines() {
-
+

Control Actions

@@ -937,6 +1069,7 @@ export function VirtualMachines() {
) : ( + /* Render metrics view when currentView is "metrics" */ selectedVM && selectedMetric && (