Added custom API widget (#1858)

* Added custom API widget

* Rename custom widget to customapi

---------

Co-authored-by: shamoon <4887959+shamoon@users.noreply.github.com>
This commit is contained in:
Denis Papec 2023-08-26 07:39:15 +01:00 committed by GitHub
parent 14b886793c
commit fc7e73eba2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 92 additions and 0 deletions

View file

@ -0,0 +1,75 @@
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";
function getValue(field, data) {
let value = data;
let lastField = field;
let key = '';
while (typeof lastField === "object") {
key = Object.keys(lastField)[0] ?? null;
if (key === null) {
break;
}
value = value[key];
lastField = lastField[key];
}
if (typeof value === 'undefined') {
return null;
}
return value[lastField] ?? null;
}
function formatValue(t, mapping, value) {
switch (mapping?.format) {
case 'number':
return t("common.number", { value: parseInt(value, 10) });
case 'float':
return t("common.number", { value });
case 'percent':
return t("common.percent", { value });
case 'text':
default:
return value;
}
}
export default function Component({ service }) {
const { t } = useTranslation();
const { widget } = service;
const { mappings = [], refreshInterval = 10000 } = widget;
const { data: customData, error: customError } = useWidgetAPI(widget, null, {
refreshInterval: Math.max(1000, refreshInterval),
});
if (customError) {
return <Container service={service} error={customError} />;
}
if (!customData) {
return (
<Container service={service}>
{ mappings.slice(0,4).map(item => <Block label={item.label} key={item.field} />) }
</Container>
);
}
return (
<Container service={service}>
{ mappings.slice(0,4).map(mapping => <Block
label={mapping.label}
key={mapping.field}
value={formatValue(t, mapping, getValue(mapping.field, customData))}
/>) }
</Container>
);
}

View file

@ -0,0 +1,8 @@
import genericProxyHandler from "utils/proxy/handlers/generic";
const widget = {
api: "{url}",
proxyHandler: genericProxyHandler,
};
export default widget;