working titlecardmaker widget

public/locales/en/common.json

@@ -797,5 +797,17 @@
         "digitalRelease": "Digital release",
         "noEventsToday": "No events for today!",
         "noEventsFound": "No events found"
+    },
+    "titlecardmaker": {
+        "totalCards": "Total Cards",
+        "totalSeries": "Total Series",
+        "monitoredSeries": "Monitored Series",
+        "unmonitoredSeries": "Unmonitored Series",
+        "totalEpisodes": "Total Episodes",
+        "cardSize": "File Size Of Cards",
+        "totalFonts": "Total Fonts",
+        "totalTemplates": "Total Templates",
+        "totalSyncs": "Total Syncs",
+        "loadedCards": "Loaded Cards"      
     }
 }

src/widgets/components.js

@@ -96,6 +96,7 @@ const components = {
   tailscale: dynamic(() => import("./tailscale/component")),
   tautulli: dynamic(() => import("./tautulli/component")),
   tdarr: dynamic(() => import("./tdarr/component")),
+  titlecardmaker: dynamic(() => import("./titlecardmaker/component")),
   traefik: dynamic(() => import("./traefik/component")),
   transmission: dynamic(() => import("./transmission/component")),
   tubearchivist: dynamic(() => import("./tubearchivist/component")),

src/widgets/titlecardmaker/component.jsx

@@ -0,0 +1,52 @@
+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: statistics, error: statisticsStatsError } = useWidgetAPI(widget, "statistics");
+
+  if (statisticsStatsError) {
+    return (
+      <Container service={service}>
+        <Block label="Error" value={statisticsStatsError.message} />
+      </Container>
+    );
+  }
+
+  if (statisticsStatsError) {
+    return <Container service={service} error={statisticsStatsError} />;
+  }
+
+  if (statistics) {
+    if (widget.fields) {
+      return (
+        <Container service={service}>
+          <Block label="titlecardmaker.totalCards" value={statistics[0].value} />
+          <Block label="titlecardmaker.totalSeries" value={statistics[1].value} />
+          <Block label="titlecardmaker.monitoredSeries" value={statistics[2].value} />
+          <Block label="titlecardmaker.unmonitoredSeries" value={statistics[3].value} />
+          <Block label="titlecardmaker.totalEpisodes" value={statistics[4].value} />
+          <Block label="titlecardmaker.cardSize" value={t("common.bytes", { value: statistics[5].value })} />
+          <Block label="titlecardmaker.totalFonts" value={statistics[6].value} />
+          <Block label="titlecardmaker.totalTemplates" value={statistics[7].value} />
+          <Block label="titlecardmaker.totalSyncs" value={statistics[8].value} />
+          <Block label="titlecardmaker.loadedCards" value={statistics[9].value} />
+        </Container>
+      );
+    } 
+    return (
+        <Container service={service}>
+          <Block label="titlecardmaker.totalEpisodes" value={statistics[4].value} />
+          <Block label="titlecardmaker.totalCards" value={statistics[0].value} />
+          <Block label="titlecardmaker.loadedCards" value={statistics[9].value} />
+          <Block label="titlecardmaker.cardSize" value={t("common.bytes", { value: statistics[5].value })} />
+        </Container>
+    );
+  }
+}

src/widgets/titlecardmaker/widget.js

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

src/widgets/widgets.js

@@ -88,6 +88,7 @@ import strelaysrv from "./strelaysrv/widget";
 import tailscale from "./tailscale/widget";
 import tautulli from "./tautulli/widget";
 import tdarr from "./tdarr/widget";
+import titlecardmaker from "./titlecardmaker/widget";
 import traefik from "./traefik/widget";
 import transmission from "./transmission/widget";
 import tubearchivist from "./tubearchivist/widget";
@@ -196,6 +197,7 @@ const widgets = {
   tailscale,
   tautulli,
   tdarr,
+  titlecardmaker,
   traefik,
   transmission,
   tubearchivist,