Feature: Zabbix service widget (#3905)

Co-Authored-By: shamoon <4887959+shamoon@users.noreply.github.com>

src/utils/proxy/handlers/jsonrpc.js

@@ -8,14 +8,18 @@ import widgets from "widgets/widgets";
 
 const logger = createLogger("jsonrpcProxyHandler");
 
-export async function sendJsonRpcRequest(url, method, params, username, password) {
+export async function sendJsonRpcRequest(url, method, params, widget) {
   const headers = {
     "content-type": "application/json",
     accept: "application/json",
   };
 
-  if (username && password) {
-    headers.authorization = `Basic ${Buffer.from(`${username}:${password}`).toString("base64")}`;
+  if (widget.username && widget.password) {
+    headers.Authorization = `Basic ${Buffer.from(`${widget.username}:${widget.password}`).toString("base64")}`;
+  }
+
+  if (widget.key) {
+    headers.Authorization = `Bearer ${widget.key}`;
   }
 
   const client = new JSONRPCClient(async (rpcRequest) => {
@@ -67,6 +71,9 @@ export default async function jsonrpcProxyHandler(req, res) {
     const widget = await getServiceWidget(group, service);
     const api = widgets?.[widget.type]?.api;
 
+    const [, mapping] = Object.entries(widgets?.[widget.type]?.mappings).find(([, value]) => value.endpoint === method);
+    const params = mapping?.params ?? null;
+
     if (!api) {
       return res.status(403).json({ error: "Service does not support API calls" });
     }
@@ -74,8 +81,7 @@ export default async function jsonrpcProxyHandler(req, res) {
     if (widget) {
       const url = formatApiCall(api, { ...widget });
 
-      // eslint-disable-next-line no-unused-vars
-      const [status, contentType, data] = await sendJsonRpcRequest(url, method, null, widget.username, widget.password);
+      const [status, , data] = await sendJsonRpcRequest(url, method, params, widget);
       return res.status(status).end(data);
     }
   }

src/widgets/components.js

@@ -127,6 +127,7 @@ const components = {
   wgeasy: dynamic(() => import("./wgeasy/component")),
   whatsupdocker: dynamic(() => import("./whatsupdocker/component")),
   xteve: dynamic(() => import("./xteve/component")),
+  zabbix: dynamic(() => import("./zabbix/component")),
 };
 
 export default components;

src/widgets/widgets.js

@@ -119,6 +119,7 @@ import whatsupdocker from "./whatsupdocker/widget";
 import xteve from "./xteve/widget";
 import urbackup from "./urbackup/widget";
 import romm from "./romm/widget";
+import zabbix from "./zabbix/widget";
 
 const widgets = {
   adguard,
@@ -245,6 +246,7 @@ const widgets = {
   wgeasy,
   whatsupdocker,
   xteve,
+  zabbix,
 };
 
 export default widgets;

src/widgets/zabbix/component.jsx

@@ -0,0 +1,46 @@
+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";
+
+const PriorityWarning = "2";
+const PriorityAverage = "3";
+const PriorityHigh = "4";
+const PriorityDisaster = "5";
+
+export default function Component({ service }) {
+  const { t } = useTranslation();
+  const { widget } = service;
+
+  const { data: zabbixData, error: zabbixError } = useWidgetAPI(widget, "trigger");
+
+  if (zabbixError) {
+    return <Container service={service} error={zabbixError} />;
+  }
+
+  if (!zabbixData) {
+    return (
+      <Container service={service}>
+        <Block label="zabbix.warning" />
+        <Block label="zabbix.average" />
+        <Block label="zabbix.high" />
+        <Block label="zabbix.disaster" />
+      </Container>
+    );
+  }
+
+  const warning = zabbixData.filter((item) => item.priority === PriorityWarning).length;
+  const average = zabbixData.filter((item) => item.priority === PriorityAverage).length;
+  const high = zabbixData.filter((item) => item.priority === PriorityHigh).length;
+  const disaster = zabbixData.filter((item) => item.priority === PriorityDisaster).length;
+
+  return (
+    <Container service={service}>
+      <Block label="zabbix.warning" value={t("common.number", { value: warning })} />
+      <Block label="zabbix.average" value={t("common.number", { value: average })} />
+      <Block label="zabbix.high" value={t("common.number", { value: high })} />
+      <Block label="zabbix.disaster" value={t("common.number", { value: disaster })} />
+    </Container>
+  );
+}

src/widgets/zabbix/widget.js

@@ -0,0 +1,23 @@
+import jsonrpcProxyHandler from "utils/proxy/handlers/jsonrpc";
+
+const widget = {
+  api: "{url}/api_jsonrpc.php",
+  proxyHandler: jsonrpcProxyHandler,
+
+  mappings: {
+    trigger: {
+      endpoint: "trigger.get",
+      params: {
+        output: ["triggerid", "description", "priority"],
+        filter: {
+          value: 1,
+        },
+        sortfield: "priority",
+        sortorder: "DESC",
+        monitored: "true",
+      },
+    },
+  },
+};
+
+export default widget;