dominik/homepage-plus
1
0
Fork 0
mirror of https://github.com/DI0IK/homepage-plus.git synced 2025-07-13 08:20:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

mini-non-chart charts

Browse source
This commit is contained in:
Ben Phelps 2023-09-06 13:53:39 +03:00
parent c2058f353d
commit 17b0f635d8
12 changed files with 437 additions and 245 deletions
Download patch file Download diff file Expand all files Collapse all files

44
src/widgets/glances/metrics/sensor.jsx
View file

@ -15,6 +15,7 @@ const pointsLimit = 15;
export default function Component({ service }) {
const { t } = useTranslation();
const { widget } = service;
const { chart } = widget;
const [, sensorName] = widget.metric.split(':');
const [dataPoints, setDataPoints] = useState(new Array(pointsLimit).fill({ value: 0 }, 0, pointsLimit));
@ -51,37 +52,46 @@ export default function Component({ service }) {
}
return (
<Container>
<Chart
dataPoints={dataPoints}
label={[sensorData.unit]}
max={sensorData.critical}
formatter={(value) => t("common.number", {
value,
})}
/>
<Container chart={chart}>
{ chart && (
<Chart
dataPoints={dataPoints}
label={[sensorData.unit]}
max={sensorData.critical}
formatter={(value) => t("common.number", {
value,
})}
/>
)}
{sensorData && !error && (
<Block position="bottom-3 left-3">
{sensorData.warning && (
{sensorData.warning && chart && (
<div className="text-xs opacity-50">
{sensorData.warning}{sensorData.unit} {t("glances.warn")}
{t("glances.warn")} {sensorData.warning} {sensorData.unit}
</div>
)}
{sensorData.critical && (
<div className="text-xs opacity-50">
{sensorData.critical} {sensorData.unit} {t("glances.crit")}
{t("glances.crit")} {sensorData.critical} {sensorData.unit}
</div>
)}
</Block>
)}
<Block position="bottom-3 right-3">
<div className="text-xs opacity-75">
{t("common.number", {
value: sensorData.value,
})} {sensorData.unit}
</div>
<div className="text-xs opacity-50">
{sensorData.warning && !chart && (
<>
{t("glances.warn")} {sensorData.warning} {sensorData.unit}
</>
)}
</div>
<div className="text-xs opacity-75">
{t("glances.temp")} {t("common.number", {
value: sensorData.value,
})} {sensorData.unit}
</div>
</Block>
</Container>
);