refactor widget api design

this passes all widget API calls through the backend, with a pluggable design and reusable API handlers
This commit is contained in:
Ben Phelps 2022-09-04 21:58:42 +03:00
parent 975f79f6cc
commit 97bf174b78
27 changed files with 370 additions and 252 deletions

View file

@ -4,16 +4,12 @@ import Widget from "../widget";
import Block from "../block";
import { formatBits } from "utils/stats-helpers";
import { formatApiUrl } from "utils/api-helpers";
export default function Speedtest({ service }) {
const config = service.widget;
function buildApiUrl(endpoint) {
const { url } = config;
return `${url}/api/${endpoint}`;
}
const { data: speedtestData, error: speedtestError } = useSWR(buildApiUrl("speedtest/latest"));
const { data: speedtestData, error: speedtestError } = useSWR(formatApiUrl(config, "speedtest/latest"));
if (speedtestError) {
return <Widget error="Speedtest API Error" />;
@ -31,8 +27,8 @@ export default function Speedtest({ service }) {
return (
<Widget>
<Block label="Download" value={`${formatBits(speedtestData.data.download * 1024 * 1024)}ps`} />
<Block label="Upload" value={`${formatBits(speedtestData.data.upload * 1024 * 1024)}ps`} />
<Block label="Download" value={`${formatBits(speedtestData.data.download * 1024 * 1024, 0)}ps`} />
<Block label="Upload" value={`${formatBits(speedtestData.data.upload * 1024 * 1024, 0)}ps`} />
<Block label="Ping" value={`${speedtestData.data.ping} ms`} />
</Widget>
);