Files
SolarEnergy/central_frontend/src/routes/HomeRoute/RelayConsumptionWidget.tsx
Pierre HUBERT d6e0eccb00
All checks were successful
continuous-integration/drone/push Build is passing
Make dashboard titles customizable
2024-11-19 19:02:09 +01:00

43 lines
1.2 KiB
TypeScript

import React from "react";
import { EnergyApi } from "../../api/EnergyApi";
import { useSnackbar } from "../../hooks/context_providers/SnackbarProvider";
import StatCard from "../../widgets/StatCard";
import { ServerApi } from "../../api/ServerApi";
export function RelayConsumptionWidget(): React.ReactElement {
const snackbar = useSnackbar();
const [val, setVal] = React.useState<undefined | number>();
const [history, setHistory] = React.useState<number[] | undefined>();
const refresh = async () => {
try {
const s = await EnergyApi.RelaysConsumption();
const history = await EnergyApi.RelaysConsumptionHistory();
setVal(s);
setHistory(history);
} catch (e) {
console.error(e);
snackbar("Failed to refresh current relays consumption!");
}
};
React.useEffect(() => {
const i = setInterval(() => refresh(), 3000);
return () => clearInterval(i);
});
return (
<StatCard
title={
ServerApi.Config.dashboard_custom_relays_consumption_title ??
"Relays consumption"
}
data={history ?? []}
interval="Last day"
value={val?.toString() ?? "Loading"}
/>
);
}