mirror of
https://github.com/gethomepage/homepage.git
synced 2026-05-18 19:40:58 +08:00
percents, bytes
This commit is contained in:
@@ -41,17 +41,19 @@ export default function Component({ service }) {
|
||||
}
|
||||
|
||||
const { rxBytes, txBytes } = calculateThroughput(statsData.stats);
|
||||
const cpuPercent = calculateCPUPercent(statsData.stats);
|
||||
const usedMemory = calculateUsedMemory(statsData.stats);
|
||||
|
||||
return (
|
||||
<Container service={service}>
|
||||
<Block label="docker.cpu" value={t("common.percent", { value: calculateCPUPercent(statsData.stats) })} />
|
||||
<Block label="docker.cpu" value={t("common.percent", { value: cpuPercent })} highlightValue={cpuPercent} />
|
||||
{statsData.stats.memory_stats.usage && (
|
||||
<Block label="docker.mem" value={t("common.bytes", { value: calculateUsedMemory(statsData.stats) })} />
|
||||
<Block label="docker.mem" value={t("common.bytes", { value: usedMemory })} highlightValue={usedMemory} />
|
||||
)}
|
||||
{statsData.stats.networks && (
|
||||
<>
|
||||
<Block label="docker.rx" value={t("common.bytes", { value: rxBytes })} />
|
||||
<Block label="docker.tx" value={t("common.bytes", { value: txBytes })} />
|
||||
<Block label="docker.rx" value={t("common.bytes", { value: rxBytes })} highlightValue={rxBytes} />
|
||||
<Block label="docker.tx" value={t("common.bytes", { value: txBytes })} highlightValue={txBytes} />
|
||||
</>
|
||||
)}
|
||||
</Container>
|
||||
|
||||
@@ -105,8 +105,16 @@ export default function Component({ service }) {
|
||||
<Block label="dockhand.paused" value={t("common.number", { value: paused ?? 0 })} />
|
||||
<Block label="dockhand.pending_updates" value={t("common.number", { value: pendingUpdates ?? 0 })} />
|
||||
<Block label="dockhand.total" value={t("common.number", { value: totalContainers })} />
|
||||
<Block label="dockhand.cpu" value={t("common.percent", { value: cpuPercent, maximumFractionDigits: 1 })} />
|
||||
<Block label="dockhand.memory" value={t("common.percent", { value: memoryPercent, maximumFractionDigits: 1 })} />
|
||||
<Block
|
||||
label="dockhand.cpu"
|
||||
value={t("common.percent", { value: cpuPercent, maximumFractionDigits: 1 })}
|
||||
highlightValue={cpuPercent}
|
||||
/>
|
||||
<Block
|
||||
label="dockhand.memory"
|
||||
value={t("common.percent", { value: memoryPercent, maximumFractionDigits: 1 })}
|
||||
highlightValue={memoryPercent}
|
||||
/>
|
||||
<Block label="dockhand.images" value={t("common.number", { value: imagesTotal ?? 0 })} />
|
||||
<Block label="dockhand.volumes" value={t("common.number", { value: volumesTotal ?? 0 })} />
|
||||
<Block
|
||||
|
||||
@@ -43,14 +43,23 @@ export default function Component({ service }) {
|
||||
return (
|
||||
<Container service={service}>
|
||||
{(statsData.stats.cpuLimit && (
|
||||
<Block label="docker.cpu" value={t("common.percent", { value: statsData.stats.cpuUsage })} />
|
||||
<Block
|
||||
label="docker.cpu"
|
||||
value={t("common.percent", { value: statsData.stats.cpuUsage })}
|
||||
highlightValue={statsData.stats.cpuUsage}
|
||||
/>
|
||||
)) || (
|
||||
<Block
|
||||
label="docker.cpu"
|
||||
value={t("common.number", { value: statsData.stats.cpu, maximumFractionDigits: 4 })}
|
||||
highlightValue={statsData.stats.cpu}
|
||||
/>
|
||||
)}
|
||||
<Block label="docker.mem" value={t("common.bytes", { value: statsData.stats.mem })} />
|
||||
<Block
|
||||
label="docker.mem"
|
||||
value={t("common.bytes", { value: statsData.stats.mem })}
|
||||
highlightValue={statsData.stats.mem}
|
||||
/>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -67,8 +67,16 @@ export default function Component({ service }) {
|
||||
<Container service={service}>
|
||||
<Block label="proxmox.vms" value={`${runningVMs} / ${vms.length}`} />
|
||||
<Block label="proxmox.lxc" value={`${runningLXC} / ${lxc.length}`} />
|
||||
<Block label="resources.cpu" value={t("common.percent", { value: (usedCpu / maxCpu) * 100 })} />
|
||||
<Block label="resources.mem" value={t("common.percent", { value: (usedMemory / maxMemory) * 100 })} />
|
||||
<Block
|
||||
label="resources.cpu"
|
||||
value={t("common.percent", { value: (usedCpu / maxCpu) * 100 })}
|
||||
highlightValue={(usedCpu / maxCpu) * 100}
|
||||
/>
|
||||
<Block
|
||||
label="resources.mem"
|
||||
value={t("common.percent", { value: (usedMemory / maxMemory) * 100 })}
|
||||
highlightValue={(usedMemory / maxMemory) * 100}
|
||||
/>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -47,10 +47,22 @@ export default function Component({ service }) {
|
||||
|
||||
return (
|
||||
<Container service={service}>
|
||||
<Block label="proxmoxbackupserver.datastore_usage" value={t("common.percent", { value: datastoreUsage })} />
|
||||
<Block
|
||||
label="proxmoxbackupserver.datastore_usage"
|
||||
value={t("common.percent", { value: datastoreUsage })}
|
||||
highlightValue={datastoreUsage}
|
||||
/>
|
||||
<Block label="proxmoxbackupserver.failed_tasks_24h" value={failedTasks} />
|
||||
<Block label="proxmoxbackupserver.cpu_usage" value={t("common.percent", { value: cpuUsage })} />
|
||||
<Block label="proxmoxbackupserver.memory_usage" value={t("common.percent", { value: memoryUsage })} />
|
||||
<Block
|
||||
label="proxmoxbackupserver.cpu_usage"
|
||||
value={t("common.percent", { value: cpuUsage })}
|
||||
highlightValue={cpuUsage}
|
||||
/>
|
||||
<Block
|
||||
label="proxmoxbackupserver.memory_usage"
|
||||
value={t("common.percent", { value: memoryUsage })}
|
||||
highlightValue={memoryUsage}
|
||||
/>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -25,8 +25,12 @@ export default function ProxmoxVM({ service }) {
|
||||
|
||||
return (
|
||||
<Container service={service}>
|
||||
<Block label="resources.cpu" value={t("common.percent", { value: data.cpu * 100 })} />
|
||||
<Block label="resources.mem" value={t("common.bytes", { value: data.mem })} />
|
||||
<Block
|
||||
label="resources.cpu"
|
||||
value={t("common.percent", { value: data.cpu * 100 })}
|
||||
highlightValue={data.cpu * 100}
|
||||
/>
|
||||
<Block label="resources.mem" value={t("common.bytes", { value: data.mem })} highlightValue={data.mem} />
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -58,35 +58,59 @@ export default function Component({ service }) {
|
||||
return (
|
||||
<Container service={service}>
|
||||
<Block label="unraid.status" value={t(`unraid.${data.arrayState}`)} />
|
||||
<Block label="unraid.memoryAvailable" value={t("common.bbytes", { value: data.memoryAvailable })} />
|
||||
<Block label="unraid.memoryUsed" value={t("common.bbytes", { value: data.memoryUsed })} />
|
||||
<Block
|
||||
label="unraid.memoryAvailable"
|
||||
value={t("common.bbytes", { value: data.memoryAvailable })}
|
||||
highlightValue={data.memoryAvailable}
|
||||
/>
|
||||
<Block
|
||||
label="unraid.memoryUsed"
|
||||
value={t("common.bbytes", { value: data.memoryUsed })}
|
||||
highlightValue={data.memoryUsed}
|
||||
/>
|
||||
<Block
|
||||
field="unraid.memoryPercent"
|
||||
label="unraid.memoryUsed"
|
||||
value={t("common.percent", { value: data.memoryUsedPercent })}
|
||||
highlightValue={data.memoryUsedPercent}
|
||||
/>
|
||||
<Block
|
||||
label="unraid.cpu"
|
||||
value={t("common.percent", { value: data.cpuPercent })}
|
||||
highlightValue={data.cpuPercent}
|
||||
/>
|
||||
<Block label="unraid.cpu" value={t("common.percent", { value: data.cpuPercent })} />
|
||||
<Block label="unraid.notifications" value={t("common.number", { value: data.unreadNotifications })} />
|
||||
<Block
|
||||
field="unraid.arrayUsedSpace"
|
||||
label="unraid.arrayUsed"
|
||||
value={t("common.bytes", { value: data.arrayUsed })}
|
||||
highlightValue={data.arrayUsed}
|
||||
/>
|
||||
<Block
|
||||
label="unraid.arrayFree"
|
||||
value={t("common.bytes", { value: data.arrayFree })}
|
||||
highlightValue={data.arrayFree}
|
||||
/>
|
||||
<Block label="unraid.arrayFree" value={t("common.bytes", { value: data.arrayFree })} />
|
||||
<Block
|
||||
field="unraid.arrayUsedPercent"
|
||||
label="unraid.arrayUsed"
|
||||
value={t("common.percent", { value: data.arrayUsedPercent })}
|
||||
highlightValue={data.arrayUsedPercent}
|
||||
/>
|
||||
{...POOLS.flatMap((pool) =>
|
||||
POOL_FIELDS.map(({ param, label, valueKey, valueType }) => (
|
||||
<Block
|
||||
key={`${pool}-${param}`}
|
||||
field={`unraid.${pool}${param}`}
|
||||
label={t(`unraid.${label}`, { pool: widget?.[pool] || pool })}
|
||||
value={t(valueType, { value: data.caches?.[widget?.[pool]]?.[valueKey] || "-" })}
|
||||
/>
|
||||
)),
|
||||
POOL_FIELDS.map(({ param, label, valueKey, valueType }) => {
|
||||
const poolValue = data.caches?.[widget?.[pool]]?.[valueKey] || "-";
|
||||
|
||||
return (
|
||||
<Block
|
||||
key={`${pool}-${param}`}
|
||||
field={`unraid.${pool}${param}`}
|
||||
label={t(`unraid.${label}`, { pool: widget?.[pool] || pool })}
|
||||
value={t(valueType, { value: poolValue })}
|
||||
highlightValue={poolValue}
|
||||
/>
|
||||
);
|
||||
}),
|
||||
)}
|
||||
</Container>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user