new watchyourlan widget

docs/widgets/services/watchyourlan.md

@@ -0,0 +1,14 @@
+---
+title: WatchYourLAN
+description: WatchYourLAN Widget Configuration
+---
+
+Learn more about [WatchYourLAN](https://github.com/aceberg/WatchYourLAN).
+
+No specific configuration is required on WatchYourLAN to configure this widget. The API is enabled by default.
+
+```yaml
+widget:
+  type: watchyourlan
+  url: http://your-ip-address:8840
+```

mkdocs.yml

@@ -160,6 +160,7 @@ nav:
           - widgets/services/urbackup.md
           - widgets/services/vikunja.md
           - widgets/services/watchtower.md
+          - widgets/services/watchyourlan.md
           - widgets/services/wgeasy.md
           - widgets/services/whatsupdocker.md
           - widgets/services/xteve.md

public/locales/en/common.json

@@ -1010,5 +1010,9 @@
         "issues": "Issues",
         "merges": "Merge Requests",
         "projects": "Projects"
+    },
+    "watchyourlan": {
+        "unknown_hosts": "Unknown Hosts",
+        "known_hosts": "Known Hosts"
     }
 }

src/widgets/components.js

@@ -134,6 +134,7 @@ const components = {
   urbackup: dynamic(() => import("./urbackup/component")),
   vikunja: dynamic(() => import("./vikunja/component")),
   watchtower: dynamic(() => import("./watchtower/component")),
+  watchyourlan: dynamic(() => import("./watchyourlan/component")),
   wgeasy: dynamic(() => import("./wgeasy/component")),
   whatsupdocker: dynamic(() => import("./whatsupdocker/component")),
   xteve: dynamic(() => import("./xteve/component")),

src/widgets/watchyourlan/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: watchYourLANData, error: watchYourLANError } = useWidgetAPI(widget, "all");
+
+  if (watchYourLANError) {
+    return <Container service={service} error={watchYourLANError} />;
+  }
+
+  if (!watchYourLANData) {
+    return (
+      <Container service={service}>
+        <Block label="watchyourlan.unknown_hosts" />
+        <Block label="watchyourlan.known_hosts" />
+      </Container>
+    );
+  }
+
+  return (
+    <Container service={service}>
+      <Block
+        label="watchyourlan.unknown_hosts"
+        value={t("common.number", { value: watchYourLANData.filter((item) => item.Known != 1).length })}
+      />
+      <Block
+        label="watchyourlan.known_hosts"
+        value={t("common.number", { value: watchYourLANData.filter((item) => item.Known == 1).length })}
+      />
+    </Container>
+  );
+}

src/widgets/watchyourlan/widget.js

@@ -0,0 +1,14 @@
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
+
+const widget = {
+  api: "{url}/api/{endpoint}",
+  proxyHandler: credentialedProxyHandler,
+
+  mappings: {
+    all: {
+      endpoint: "all",
+    },
+  },
+};
+
+export default widget;

src/widgets/widgets.js

@@ -124,6 +124,7 @@ import uptimekuma from "./uptimekuma/widget";
 import uptimerobot from "./uptimerobot/widget";
 import vikunja from "./vikunja/widget";
 import watchtower from "./watchtower/widget";
+import watchyourlan from "./watchyourlan/widget";
 import wgeasy from "./wgeasy/widget";
 import whatsupdocker from "./whatsupdocker/widget";
 import xteve from "./xteve/widget";
@@ -263,6 +264,7 @@ const widgets = {
   urbackup,
   vikunja,
   watchtower,
+  watchyourlan,
   wgeasy,
   whatsupdocker,
   xteve,