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

Run pre-commit hooks over existing codebase

Browse source 
Co-Authored-By: Ben Phelps <ben@phelps.io>
This commit is contained in:
shamoon 2023-10-17 23:26:55 -07:00
parent fa50bbad9c
commit 19c25713c4
387 changed files with 4785 additions and 4109 deletions
Download patch file Download diff file Expand all files Collapse all files

83
src/widgets/glances/metrics/gpu.jsx
View file

@ -16,11 +16,11 @@ export default function Component({ service }) {
const { t } = useTranslation();
const { widget } = service;
const { chart } = widget;
const [, gpuName] = widget.metric.split(':');
const [, gpuName] = widget.metric.split(":");
const [dataPoints, setDataPoints] = useState(new Array(pointsLimit).fill({ a: 0, b: 0 }, 0, pointsLimit));
const { data, error } = useWidgetAPI(widget, 'gpu', {
const { data, error } = useWidgetAPI(widget, "gpu", {
refreshInterval: 1000,
});
@ -32,68 +32,80 @@ export default function Component({ service }) {
if (gpuData) {
setDataPoints((prevDataPoints) => {
const newDataPoints = [...prevDataPoints, { a: gpuData.mem, b: gpuData.proc }];
if (newDataPoints.length > pointsLimit) {
newDataPoints.shift();
}
return newDataPoints;
if (newDataPoints.length > pointsLimit) {
newDataPoints.shift();
}
return newDataPoints;
});
}
}
}, [data, gpuName]);
if (error) {
return <Container chart={chart}><Error error={error} /></Container>;
return (
<Container chart={chart}>
<Error error={error} />
</Container>
);
}
if (!data) {
return <Container chart={chart}><Block position="bottom-3 left-3">-</Block></Container>;
return (
<Container chart={chart}>
<Block position="bottom-3 left-3">-</Block>
</Container>
);
}
// eslint-disable-next-line eqeqeq
const gpuData = data.find((item) => item[item.key] == gpuName);
if (!gpuData) {
return <Container chart={chart}><Block position="bottom-3 left-3">-</Block></Container>;
return (
<Container chart={chart}>
<Block position="bottom-3 left-3">-</Block>
</Container>
);
}
return (
<Container chart={chart}>
{ chart && (
<ChartDual
{chart && (
<ChartDual
dataPoints={dataPoints}
label={[t("glances.mem"), t("glances.gpu")]}
stack={['mem', 'proc']}
formatter={(value) => t("common.percent", {
value,
maximumFractionDigits: 1,
})}
stack={["mem", "proc"]}
formatter={(value) =>
t("common.percent", {
value,
maximumFractionDigits: 1,
})
}
/>
)}
{ chart && (
{chart && (
<Block position="bottom-3 left-3">
{gpuData && gpuData.name && (
<div className="text-xs opacity-50">
{gpuData.name}
</div>
)}
{gpuData && gpuData.name && <div className="text-xs opacity-50">{gpuData.name}</div>}
<div className="text-xs opacity-50">
{t("common.number", {
value: gpuData.mem,
maximumFractionDigits: 1,
})}% {t("resources.mem")}
})}
% {t("resources.mem")}
</div>
</Block>
)}
{ !chart && (
{!chart && (
<Block position="bottom-3 left-3">
<div className="text-xs opacity-50">
{t("common.number", {
value: gpuData.temperature,
maximumFractionDigits: 1,
})}&deg; C
})}
&deg; C
</div>
</Block>
)}
@ -105,36 +117,33 @@ export default function Component({ service }) {
{t("common.number", {
value: gpuData.proc,
maximumFractionDigits: 1,
})}% {t("glances.gpu")}
})}
% {t("glances.gpu")}
</div>
)}
{ !chart && (
<>&bull;</>
)}
{!chart && <>&bull;</>}
<div className="inline-block ml-1">
{t("common.number", {
value: gpuData.proc,
maximumFractionDigits: 1,
})}% {t("glances.gpu")}
})}
% {t("glances.gpu")}
</div>
</div>
</Block>
<Block position="top-3 right-3">
{ chart && (
{chart && (
<div className="text-xs opacity-50">
{t("common.number", {
value: gpuData.temperature,
maximumFractionDigits: 1,
})}&deg; C
})}
&deg; C
</div>
)}
{gpuData && gpuData.name && !chart && (
<div className="text-xs opacity-50">
{gpuData.name}
</div>
)}
{gpuData && gpuData.name && !chart && <div className="text-xs opacity-50">{gpuData.name}</div>}
</Block>
</Container>
);