mirror of
https://github.com/gethomepage/homepage.git
synced 2026-01-14 21:22:08 +08:00
mini-non-chart charts
This commit is contained in:
@@ -14,6 +14,8 @@ const pointsLimit = 15;
|
||||
|
||||
export default function Component({ service }) {
|
||||
const { t } = useTranslation();
|
||||
const { widget } = service;
|
||||
const { chart } = widget;
|
||||
|
||||
const [dataPoints, setDataPoints] = useState(new Array(pointsLimit).fill({ value: 0 }, 0, pointsLimit));
|
||||
|
||||
@@ -44,32 +46,45 @@ export default function Component({ service }) {
|
||||
}
|
||||
|
||||
return (
|
||||
<Container>
|
||||
<Chart
|
||||
dataPoints={dataPoints}
|
||||
label={[t("resources.used")]}
|
||||
formatter={(value) => t("common.number", {
|
||||
value,
|
||||
style: "unit",
|
||||
unit: "percent",
|
||||
maximumFractionDigits: 0,
|
||||
})}
|
||||
/>
|
||||
<Container chart={chart}>
|
||||
{ chart && (
|
||||
<Chart
|
||||
dataPoints={dataPoints}
|
||||
label={[t("resources.used")]}
|
||||
formatter={(value) => t("common.number", {
|
||||
value,
|
||||
style: "unit",
|
||||
unit: "percent",
|
||||
maximumFractionDigits: 0,
|
||||
})}
|
||||
/>
|
||||
)}
|
||||
|
||||
{ !chart && (
|
||||
<Block position="top-3 right-3">
|
||||
<div className="text-xs opacity-50">
|
||||
{systemData.linux_distro && `${systemData.linux_distro} - ` }
|
||||
{systemData.os_version && systemData.os_version }
|
||||
</div>
|
||||
</Block>
|
||||
)}
|
||||
|
||||
{systemData && !systemError && (
|
||||
<Block position="bottom-3 left-3">
|
||||
{systemData.linux_distro && (
|
||||
{systemData.linux_distro && chart && (
|
||||
<div className="text-xs opacity-50">
|
||||
{systemData.linux_distro}
|
||||
</div>
|
||||
)}
|
||||
{systemData.os_version && (
|
||||
|
||||
{systemData.os_version && chart && (
|
||||
<div className="text-xs opacity-50">
|
||||
{systemData.os_version}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{systemData.hostname && (
|
||||
<div className="text-xs opacity-75">
|
||||
<div className="text-xs opacity-50">
|
||||
{systemData.hostname}
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user