Karl/homepage
1
0
Fork 0
mirror of https://github.com/karl0ss/homepage.git synced 2025-05-02 13:33:40 +01:00
Code Issues Packages Projects Releases Wiki Activity

Enhancement: support different bytes multipliers for disk space for resources / glances and metrics widgets (#2966)

Browse Source
This commit is contained in:
shamoon 2024-02-20 22:19:53 -08:00 committed by GitHub
parent 8fb6d608c3
commit 9a5481ef4e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 22 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
docs/widgets/info/glances.md
View File

@ -17,6 +17,7 @@ The Glances widget allows you to monitor the resources (CPU, memory, storage, te
cputemp: true # disabled by default
uptime: true # disabled by default
disk: / # disabled by default, use mount point of disk(s) in glances. Can also be a list (see below)
diskUnits: bytes # optional, bytes (default) or bbytes. Only applies to disk
expanded: true # show the expanded view
label: MyMachine # optional
```

1
docs/widgets/info/resources.md
View File

@ -22,6 +22,7 @@ _Note: unfortunately, the package used for getting CPU temp ([systeminformation]
uptime: true
units: imperial # only used by cpu temp
refresh: 3000 # optional, in ms
diskUnits: bytes # optional, bytes (default) or bbytes. Only applies to disk
```
You can also pass a `label` option, which allows you to group resources under named sections,

1
docs/widgets/services/glances.md
View File

@ -18,6 +18,7 @@ widget:
username: user # optional if auth enabled in Glances
password: pass # optional if auth enabled in Glances
metric: cpu
diskUnits: bytes # optional, bytes (default) or bbytes. Only applies to disk
```
_Please note, this widget does not need an `href`, `icon` or `description` on its parent service. To achieve the same effect as the examples above, see as an example:_

5
src/components/widgets/glances/glances.jsx
View File

@ -21,6 +21,7 @@ function convertToFahrenheit(t) {
export default function Widget({ options }) {
const { t, i18n } = useTranslation();
const { settings } = useContext(SettingsContext);
const diskUnits = options.diskUnits === "bbytes" ? "common.bbytes" : "common.bytes";
const { data, error } = useSWR(
`/api/widgets/glances?${new URLSearchParams({ lang: i18n.language, ...options }).toString()}`,
@ -132,9 +133,9 @@ export default function Widget({ options }) {
<Resource
key={`disk_${disk.mnt_point ?? disk.device_name}`}
icon={FiHardDrive}
value={t("common.bytes", { value: disk.free })}
value={t(diskUnits, { value: disk.free })}
label={t("glances.free")}
expandedValue={t("common.bytes", { value: disk.size })}
expandedValue={t(diskUnits, { value: disk.size })}
expandedLabel={t("glances.total")}
percentage={disk.percent}
expanded={options.expanded}

7
src/components/widgets/resources/disk.jsx
View File

@ -5,8 +5,9 @@ import { useTranslation } from "next-i18next";
import Resource from "../widget/resource";
import Error from "../widget/error";
export default function Disk({ options, expanded, refresh = 1500 }) {
export default function Disk({ options, expanded, diskUnits, refresh = 1500 }) {
const { t } = useTranslation();
const diskUnitsName = diskUnits === "bbytes" ? "common.bbytes" : "common.bytes";
const { data, error } = useSWR(`/api/widgets/resources?type=disk&target=${options.disk}`, {
refreshInterval: refresh,
@ -36,9 +37,9 @@ export default function Disk({ options, expanded, refresh = 1500 }) {
return (
<Resource
icon={FiHardDrive}
value={t("common.bytes", { value: data.drive.available })}
value={t(diskUnitsName, { value: data.drive.available })}
label={t("resources.free")}
expandedValue={t("common.bytes", { value: data.drive.size })}
expandedValue={t(diskUnitsName, { value: data.drive.size })}
expandedLabel={t("resources.total")}
percentage={percent}
expanded={expanded}

8
src/components/widgets/resources/resources.jsx
View File

@ -8,7 +8,7 @@ import CpuTemp from "./cputemp";
import Uptime from "./uptime";
export default function Resources({ options }) {
const { expanded, units } = options;
const { expanded, units, diskUnits } = options;
let { refresh } = options;
if (!refresh) refresh = 1500;
refresh = Math.max(refresh, 1000);
@ -19,8 +19,10 @@ export default function Resources({ options }) {
{options.cpu && <Cpu expanded={expanded} refresh={refresh} />}
{options.memory && <Memory expanded={expanded} refresh={refresh} />}
{Array.isArray(options.disk)
? options.disk.map((disk) => <Disk key={disk} options={{ disk }} expanded={expanded} refresh={refresh} />)
: options.disk && <Disk options={options} expanded={expanded} refresh={refresh} />}
? options.disk.map((disk) => (
<Disk key={disk} options={{ disk }} expanded={expanded} diskUnits={diskUnits} refresh={refresh} />
))
: options.disk && <Disk options={options} expanded={expanded} diskUnits={diskUnits} refresh={refresh} />}
{options.cputemp && <CpuTemp expanded={expanded} units={units} refresh={refresh} />}
{options.uptime && <Uptime refresh={refresh} />}
</div>

2
src/utils/config/service-helpers.js
View File

@ -395,6 +395,7 @@ export function cleanServiceGroups(groups) {
chart,
metric,
pointsLimit,
diskUnits,
// glances, customapi, iframe
refreshInterval,
@ -533,6 +534,7 @@ export function cleanServiceGroups(groups) {
}
if (refreshInterval) cleanedService.widget.refreshInterval = refreshInterval;
if (pointsLimit) cleanedService.widget.pointsLimit = pointsLimit;
if (diskUnits) cleanedService.widget.diskUnits = diskUnits;
}
if (type === "mjpeg") {
if (stream) cleanedService.widget.stream = stream;

9
src/widgets/glances/metrics/fs.jsx
View File

@ -13,6 +13,7 @@ export default function Component({ service }) {
const { widget } = service;
const { chart, refreshInterval = defaultInterval } = widget;
const [, fsName] = widget.metric.split("fs:");
const diskUnits = widget.diskUnits === "bbytes" ? "common.bbytes" : "common.bytes";
const { data, error } = useWidgetAPI(widget, "fs", {
refreshInterval: Math.max(defaultInterval, refreshInterval),
@ -60,7 +61,7 @@ export default function Component({ service }) {
<Block position="bottom-3 left-3">
{fsData.used && chart && (
<div className="text-xs opacity-50">
{t("common.bbytes", {
{t(diskUnits, {
value: fsData.used,
maximumFractionDigits: 0,
})}{" "}
@ -69,7 +70,7 @@ export default function Component({ service }) {
)}
<div className="text-xs opacity-75">
{t("common.bbytes", {
{t(diskUnits, {
value: fsData.free,
maximumFractionDigits: 1,
})}{" "}
@ -81,7 +82,7 @@ export default function Component({ service }) {
<Block position="top-3 right-3">
{fsData.used && (
<div className="text-xs opacity-50">
{t("common.bbytes", {
{t(diskUnits, {
value: fsData.used,
maximumFractionDigits: 0,
})}{" "}
@ -93,7 +94,7 @@ export default function Component({ service }) {
<Block position="bottom-3 right-3">
<div className="text-xs opacity-75">
{t("common.bbytes", {
{t(diskUnits, {
value: fsData.size,
maximumFractionDigits: 1,
})}{" "}