fix(cluster-health): storage items multiply (#3206)

This commit is contained in:
Meier Lukas
2025-05-30 20:52:51 +02:00
committed by GitHub
parent c8202ab3c6
commit 11149348fc
3 changed files with 38 additions and 28 deletions

View File

@@ -69,6 +69,7 @@ const mapResource = (resource: Proxmox.clusterResourcesResources): Resource | nu
const mapComputeResource = (resource: Proxmox.clusterResourcesResources): Omit<ComputeResourceBase<string>, "type"> => {
return {
id: resource.id,
cpu: {
utilization: resource.cpu ?? 0,
cores: resource.maxcpu ?? 0,
@@ -114,6 +115,7 @@ const mapVmResource = (resource: Proxmox.clusterResourcesResources): LxcResource
const mapStorageResource = (resource: Proxmox.clusterResourcesResources): StorageResource => {
return {
id: resource.id,
type: "storage",
name: resource.storage ?? "",
node: resource.node ?? "",

View File

@@ -7,6 +7,7 @@ interface ResourceBase<TType extends string> {
}
export interface ComputeResourceBase<TType extends string> extends ResourceBase<TType> {
id: string;
cpu: {
utilization: number; // previously cpu (0-1)
cores: number; // previously cpuCores
@@ -40,6 +41,7 @@ export interface QemuResource extends ComputeResourceBase<"qemu"> {
}
export interface StorageResource extends ResourceBase<"storage"> {
id: string;
storagePlugin: string;
used: number; // previously disk
total: number; // previously maxDisk

View File

@@ -38,34 +38,40 @@ export const ResourceTable = ({ type, data, isTiny }: ResourceTableProps) => {
</TableTr>
</TableThead>
<TableTbody>
{data.map((item) => {
return (
<ResourcePopover key={item.name} item={item}>
<Popover.Target>
<TableTr fz={isTiny ? "8px" : "xs"}>
<td>
<Group wrap="nowrap" gap={isTiny ? 8 : "xs"}>
<Indicator size={isTiny ? 4 : 8} children={null} color={item.isRunning ? "green" : "yellow"} />
<Text lineClamp={1} fz={isTiny ? "8px" : "xs"}>
{item.name}
</Text>
</Group>
</td>
{item.type === "storage" ? (
<td style={{ WebkitLineClamp: "1" }}>{item.node}</td>
) : (
<>
<td style={{ whiteSpace: "nowrap" }}>{(item.cpu.utilization * 100).toFixed(1)}%</td>
<td style={{ whiteSpace: "nowrap" }}>
{(item.memory.total ? (item.memory.used / item.memory.total) * 100 : 0).toFixed(1)}%
</td>
</>
)}
</TableTr>
</Popover.Target>
</ResourcePopover>
);
})}
{data
.sort((itemA, itemB) => {
const nodeResult = itemA.node.localeCompare(itemB.node);
if (nodeResult !== 0) return nodeResult;
return itemA.name.localeCompare(itemB.name);
})
.map((item) => {
return (
<ResourcePopover key={item.id} item={item}>
<Popover.Target>
<TableTr fz={isTiny ? "8px" : "xs"}>
<td>
<Group wrap="nowrap" gap={isTiny ? 8 : "xs"}>
<Indicator size={isTiny ? 4 : 8} children={null} color={item.isRunning ? "green" : "yellow"} />
<Text lineClamp={1} fz={isTiny ? "8px" : "xs"}>
{item.name}
</Text>
</Group>
</td>
{item.type === "storage" ? (
<td style={{ WebkitLineClamp: "1" }}>{item.node}</td>
) : (
<>
<td style={{ whiteSpace: "nowrap" }}>{(item.cpu.utilization * 100).toFixed(1)}%</td>
<td style={{ whiteSpace: "nowrap" }}>
{(item.memory.total ? (item.memory.used / item.memory.total) * 100 : 0).toFixed(1)}%
</td>
</>
)}
</TableTr>
</Popover.Target>
</ResourcePopover>
);
})}
</TableTbody>
</Table>
);