simplify pfsense widget, rename, limit blocks

This commit is contained in:
shamoon 2023-05-13 13:18:38 -07:00
parent 592991980e
commit 4a78006b2d
7 changed files with 60 additions and 92 deletions

View File

@ -514,9 +514,9 @@
"origin_ip": "Origin IP",
"status": "Status"
},
"pfsenseapi": {
"load": "LOAD AVG",
"memory": "MEM USAGE",
"pfsense": {
"load": "Load Avg",
"memory": "Mem Usage",
"wanStatus": "WAN Status",
"up": "Up",
"down": "Down",

View File

@ -267,7 +267,7 @@ export function cleanServiceGroups(groups) {
namespace, // kubernetes widget
app,
podSelector,
wan, // opnsense widget, pfsenseapi widget
wan, // opnsense widget, pfsense widget
enableBlocks, // emby/jellyfin
enableNowPlaying,
volume, // diskstation widget
@ -299,10 +299,10 @@ export function cleanServiceGroups(groups) {
if (app) cleanedService.widget.app = app;
if (podSelector) cleanedService.widget.podSelector = podSelector;
}
if (type === "opnsense" || type === "pfsenseapi") {
if (["opnsense", "pfsense"].includes(type)) {
if (wan) cleanedService.widget.wan = wan;
}
if (type === "emby" || type === "jellyfin") {
if (["emby", "jellyfin"].includes(type)) {
if (enableBlocks !== undefined) cleanedService.widget.enableBlocks = JSON.parse(enableBlocks);
if (enableNowPlaying !== undefined) cleanedService.widget.enableNowPlaying = JSON.parse(enableNowPlaying);
}

View File

@ -52,7 +52,7 @@ const components = {
opnsense: dynamic(() => import("./opnsense/component")),
overseerr: dynamic(() => import("./overseerr/component")),
paperlessngx: dynamic(() => import("./paperlessngx/component")),
pfsenseapi: dynamic(() => import("./pfsenseapi/component")),
pfsense: dynamic(() => import("./pfsense/component")),
photoprism: dynamic(() => import("./photoprism/component")),
proxmoxbackupserver: dynamic(() => import("./proxmoxbackupserver/component")),
pihole: dynamic(() => import("./pihole/component")),

View File

@ -0,0 +1,51 @@
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";
export default function Component({ service }) {
const { t } = useTranslation();
const { widget } = service;
const { data: systemData, error: systemError } = useWidgetAPI(widget, "system");
const { data: interfaceData, error: interfaceError } = useWidgetAPI(widget, "interface");
const showWanIP = widget.fields?.filter(f => f !== 'wanIP').length <= 4 && widget.fields?.includes('wanIP');
const showDiskUsage = widget.fields?.filter(f => f !== 'disk').length <= 4 && widget.fields?.includes('disk');
if (systemError || interfaceError) {
const finalError = systemError ?? interfaceError;
return <Container service={service} error={finalError} />;
}
if (!systemData || !interfaceData) {
return (
<Container service={service}>
<Block label="pfsense.load" />
<Block label="pfsense.memory" />
<Block label="pfsense.temp" />
<Block label="pfsense.wanStatus" />
{showWanIP && <Block label="pfsense.wanIP" />}
{showDiskUsage && <Block label="pfsense.disk" />}
</Container>
);
}
const wan = interfaceData.data.filter(l => l.hwif === widget.wan)[0];
return (
<Container service={service}>
<Block label="pfsense.load" value={systemData.data.load_avg[0]} />
<Block label="pfsense.memory" value={t("common.percent", { value: (systemData.data.mem_usage * 100).toFixed(2) })} />
<Block label="pfsense.temp" value={t("common.number", { value: systemData.data.temp_c, style: "unit", unit: "celsius" })} />
<Block label="pfsense.wanStatus" value={wan.status === "up" ?
<span className="text-green-500">{t("pfsense.up")}</span>:
<span className="text-red-500">{t("pfsense.down")}</span>}
/>
{showWanIP && <Block label="pfsense.wanIP" value={wan.ipaddr} />}
{showDiskUsage && <Block label="pfsense.disk" value={t("common.percent", { value: (systemData.data.disk_usage * 100).toFixed(2) })} />}
</Container>
);
}

View File

@ -1,83 +0,0 @@
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";
export default function Component({ service }) {
const { t } = useTranslation();
const { widget } = service;
const { data: systemData, error: systemError } = useWidgetAPI(widget, "system");
const { data: interfaceData, error: interfaceError } = useWidgetAPI(widget, "interface");
const showDiskUsage = widget.fields?.includes('disk');
const showWanIP = widget.fields?.includes('wanIP');
if (systemError || interfaceError) {
const finalError = systemError ?? interfaceError;
return <Container service={service} error={ finalError } />;
}
if (!systemData || !interfaceData) {
return (
<Container service={service}>
<Block label="pfsenseapi.load" />
<Block label="pfsenseapi.memory" />
<Block label="pfsenseapi.temp" />
<Block label="pfsenseapi.wanStatus" />
{showWanIP && <Block label="pfsenseapi.wanIP" />}
{showDiskUsage && <Block label="pfsenseapi.disk" />}
</Container>
);
}
const loadAvg = systemData.data.load_avg[0];
const memory = systemData.data.mem_usage;
const tempC = systemData.data.temp_c
const disk = systemData.data.disk_usage
const wanState = interfaceData.data.filter(l => l.hwif === widget.wan)[0].status
const wanStatus = (wanState === "up") ?
<span className="text-green-500">{t("pfsenseapi.up")}</span>:
<span className="text-red-500">{t("pfsenseapi.down")}</span>;
const wanIP = interfaceData.data.filter(l => l.hwif === widget.wan)[0].ipaddr
return (
<Container service={service}>
<Block
label="pfsenseapi.load"
value={loadAvg}
/>
<Block
label="pfsenseapi.memory"
value={t("common.percent", { value: (memory * 100).toFixed(2) })}
/>
<Block
label="pfsenseapi.temp"
value={`${tempC} °C`}
/>
<Block
label="pfsenseapi.wanStatus"
value={wanStatus}
/>
{
showWanIP
&&
<Block
label="pfsenseapi.wanIP"
value={wanIP}
/>
}
{
showDiskUsage
&&
<Block
label="pfsenseapi.disk"
value={t("common.percent", { value: (disk * 100).toFixed(2) })}
/>
}
</Container>
);
}

View File

@ -46,7 +46,7 @@ import ombi from "./ombi/widget";
import opnsense from "./opnsense/widget";
import overseerr from "./overseerr/widget";
import paperlessngx from "./paperlessngx/widget";
import pfsenseapi from "./pfsenseapi/widget";
import pfsense from "./pfsense/widget";
import photoprism from "./photoprism/widget";
import proxmoxbackupserver from "./proxmoxbackupserver/widget";
import pihole from "./pihole/widget";
@ -131,7 +131,7 @@ const widgets = {
opnsense,
overseerr,
paperlessngx,
pfsenseapi,
pfsense,
photoprism,
proxmoxbackupserver,
pihole,