mirror of
https://github.com/karl0ss/homepage.git
synced 2025-05-01 13:09:31 +01:00
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:
parent
14b886793c
commit
fc7e73eba2
@ -299,6 +299,8 @@ export function cleanServiceGroups(groups) {
|
||||
stream, // mjpeg
|
||||
fit,
|
||||
method, // openmediavault widget
|
||||
mappings, // customapi widget
|
||||
refreshInterval,
|
||||
} = cleanedService.widget;
|
||||
|
||||
let fieldsList = fields;
|
||||
@ -372,6 +374,10 @@ export function cleanServiceGroups(groups) {
|
||||
if (type === "openmediavault") {
|
||||
if (method) cleanedService.widget.method = method;
|
||||
}
|
||||
if (type === "customapi") {
|
||||
if (mappings) cleanedService.widget.mappings = mappings;
|
||||
if (refreshInterval) cleanedService.widget.refreshInterval = refreshInterval;
|
||||
}
|
||||
}
|
||||
|
||||
return cleanedService;
|
||||
|
@ -14,6 +14,7 @@ const components = {
|
||||
channelsdvrserver: dynamic(() => import("./channelsdvrserver/component")),
|
||||
cloudflared: dynamic(() => import("./cloudflared/component")),
|
||||
coinmarketcap: dynamic(() => import("./coinmarketcap/component")),
|
||||
customapi: dynamic(() => import("./customapi/component")),
|
||||
deluge: dynamic(() => import("./deluge/component")),
|
||||
diskstation: dynamic(() => import("./diskstation/component")),
|
||||
downloadstation: dynamic(() => import("./downloadstation/component")),
|
||||
|
75
src/widgets/customapi/component.jsx
Normal file
75
src/widgets/customapi/component.jsx
Normal 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>
|
||||
);
|
||||
}
|
8
src/widgets/customapi/widget.js
Normal file
8
src/widgets/customapi/widget.js
Normal file
@ -0,0 +1,8 @@
|
||||
import genericProxyHandler from "utils/proxy/handlers/generic";
|
||||
|
||||
const widget = {
|
||||
api: "{url}",
|
||||
proxyHandler: genericProxyHandler,
|
||||
};
|
||||
|
||||
export default widget;
|
@ -11,6 +11,7 @@ import changedetectionio from "./changedetectionio/widget";
|
||||
import channelsdvrserver from "./channelsdvrserver/widget";
|
||||
import cloudflared from "./cloudflared/widget";
|
||||
import coinmarketcap from "./coinmarketcap/widget";
|
||||
import customapi from "./customapi/widget";
|
||||
import deluge from "./deluge/widget";
|
||||
import diskstation from "./diskstation/widget";
|
||||
import downloadstation from "./downloadstation/widget";
|
||||
@ -109,6 +110,7 @@ const widgets = {
|
||||
channelsdvrserver,
|
||||
cloudflared,
|
||||
coinmarketcap,
|
||||
customapi,
|
||||
deluge,
|
||||
diskstation,
|
||||
downloadstation,
|
||||
|
Loading…
x
Reference in New Issue
Block a user