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

Feature: Fritz!Box Widget (#2387)

Browse source 
* Feature: Fritz!Box Widget

* Use i18n

* code style & formatting

---------

Co-authored-by: Thorben Grove <thorben.grove@tui.de>
Co-authored-by: shamoon <4887959+shamoon@users.noreply.github.com>
This commit is contained in:
Thorben 2023-11-27 05:48:54 +01:00 • committed by GitHub
parent b3414fc35f
commit 4c45c6453f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 220 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

67
src/widgets/fritzbox/component.jsx Normal file
View file

@ -0,0 +1,67 @@
import { useTranslation } from "next-i18next";
import Container from "components/services/widget/container";
import Block from "components/services/widget/block";
import useWidgetAPI from "utils/proxy/use-widget-api";
const formatUptime = (timestamp) => {
const hours = Math.floor(timestamp / 3600);
const minutes = Math.floor((timestamp % 3600) / 60);
const seconds = timestamp % 60;
const hourDuration = hours > 0 ? `${hours}h` : "00h";
const minDuration = minutes > 0 ? `${minutes}m` : "00m";
const secDuration = seconds > 0 ? `${seconds}s` : "00s";
return hourDuration + minDuration + secDuration;
};
export default function Component({ service }) {
const { t } = useTranslation();
const { widget } = service;
const { data: fritzboxData, error: fritzboxError } = useWidgetAPI(widget, "status");
if (fritzboxError) {
return <Container service={service} error={fritzboxError} />;
}
// Default fields
if (!widget.fields?.length > 0) {
widget.fields = ["connectionStatus", "uptime", "maxDown", "maxUp"];
}
const MAX_ALLOWED_FIELDS = 4;
// Limits max number of displayed fields
if (widget.fields?.length > MAX_ALLOWED_FIELDS) {
widget.fields = widget.fields.slice(0, MAX_ALLOWED_FIELDS);
}
if (!fritzboxData) {
return (
<Container service={service}>
<Block label="fritzbox.connectionStatus" />
<Block label="fritzbox.uptime" />
<Block label="fritzbox.maxDown" />
<Block label="fritzbox.maxUp" />
<Block label="fritzbox.down" />
<Block label="fritzbox.up" />
<Block label="fritzbox.received" />
<Block label="fritzbox.sent" />
<Block label="fritzbox.externalIPAddress" />
</Container>
);
}
return (
<Container service={service}>
<Block label="fritzbox.connectionStatus" value={t(`fritzbox.connectionStatus${fritzboxData.connectionStatus}`)} />
<Block label="fritzbox.uptime" value={formatUptime(fritzboxData.uptime)} />
<Block label="fritzbox.maxDown" value={t("common.byterate", { value: fritzboxData.maxDown / 8, decimals: 1 })} />
<Block label="fritzbox.maxUp" value={t("common.byterate", { value: fritzboxData.maxUp / 8, decimals: 1 })} />
<Block label="fritzbox.down" value={t("common.byterate", { value: fritzboxData.down, decimals: 1 })} />
<Block label="fritzbox.up" value={t("common.byterate", { value: fritzboxData.up, decimals: 1 })} />
<Block label="fritzbox.received" value={t("common.bytes", { value: fritzboxData.received })} />
<Block label="fritzbox.sent" value={t("common.bytes", { value: fritzboxData.sent })} />
<Block label="fritzbox.externalIPAddress" value={fritzboxData.externalIPAddress} />
</Container>
);
}