Implement Caddy widget

public/locales/en/common.json

@@ -102,6 +102,11 @@
         "subscriptions": "Subscriptions",
         "unread": "Unread"
     },
+    "caddy": {
+        "upstreams": "Upstreams",
+        "requests": "Current requests",
+        "requests_failed": "Failed requests"
+    },
     "changedetectionio": {
         "totalObserved": "Total Observed",
         "diffsDetected": "Diffs Detected"
@@ -517,11 +522,11 @@
     "pfsense": {
         "load": "Load Avg",
         "memory": "Mem Usage",
-        "wanStatus": "WAN Status",   
-        "up": "Up",   
-        "down": "Down",   
-        "temp": "Temp",   
-        "disk": "Disk Usage",        
+        "wanStatus": "WAN Status",
+        "up": "Up",
+        "down": "Down",
+        "temp": "Temp",
+        "disk": "Disk Usage",
         "wanIP": "WAN IP"
     },
     "proxmoxbackupserver": {

src/widgets/caddy/component.jsx

@@ -0,0 +1,39 @@
+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: resultData, error: resultError } = useWidgetAPI(widget, "result");
+
+
+  if (resultError) {
+    return <Container service={service} error={resultError} />;
+  }
+
+  if (!resultData) {
+    return (
+      <Container service={service}>,
+        <Block label="caddy.upstreams" />
+        <Block label="caddy.requests" />
+        <Block label="caddy.requests_failed" />
+      </Container>
+    );
+  }
+
+  const upstreams = resultData.length;
+  const requests = resultData.reduce((acc, val) => acc + val.num_requests, 0);
+  const requestsFailed = resultData.reduce((acc, val) => acc + val.fails, 0);
+
+  return (
+    <Container service={service}>
+      <Block label="caddy.upstreams" value={t("common.number", { value: upstreams })} />
+      <Block label="caddy.requests" value={t("common.number", { value: requests })} />
+      <Block label="caddy.requests_failed" value={t("common.number", { value: requestsFailed })} />
+    </Container>
+  );
+}

src/widgets/caddy/widget.js

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

src/widgets/components.js

@@ -6,6 +6,7 @@ const components = {
   authentik: dynamic(() => import("./authentik/component")),
   autobrr: dynamic(() => import("./autobrr/component")),
   bazarr: dynamic(() => import("./bazarr/component")),
+  caddy: dynamic(() => import("./caddy/component")),
   changedetectionio: dynamic(() => import("./changedetectionio/component")),
   channelsdvrserver: dynamic(() => import("./channelsdvrserver/component")),
   cloudflared: dynamic(() => import("./cloudflared/component")),

src/widgets/widgets.js

@@ -3,6 +3,7 @@ import audiobookshelf from "./audiobookshelf/widget";
 import authentik from "./authentik/widget";
 import autobrr from "./autobrr/widget";
 import bazarr from "./bazarr/widget";
+import caddy from "./caddy/widget";
 import changedetectionio from "./changedetectionio/widget";
 import channelsdvrserver from "./channelsdvrserver/widget";
 import cloudflared from "./cloudflared/widget";
@@ -87,6 +88,7 @@ const widgets = {
   authentik,
   autobrr,
   bazarr,
+  caddy,
   changedetectionio,
   channelsdvrserver,
   cloudflared,