From f520629298e70b714ba6b7de5274f5be0a2f810e Mon Sep 17 00:00:00 2001
From: Andre Jarrell <mail@andre.cx>
Date: Sat, 6 May 2023 12:22:17 -0400
Subject: [PATCH] Removed refresh and added translations

---
 public/locales/en/common.json       |  9 ++++++++-
 src/widgets/tailscale/component.jsx | 22 ++++++++++++----------
 2 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index f3f89ff1..96c08505 100755
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -235,7 +235,14 @@
     "tailscale": {
         "address": "Address",
         "expires": "Expires",
-        "last_seen": "Last Seen"
+        "last_seen": "Last Seen",
+        "years": "{{number}}y",
+        "weeks": "{{number}}w",
+        "days": "{{number}}d",
+        "hours": "{{number}}h",
+        "minutes": "{{number}}m",
+        "seconds": "{{number}}s",
+        "ago": "{{value}} Ago"
     },
     "tdarr": {
         "queue": "Queue",
diff --git a/src/widgets/tailscale/component.jsx b/src/widgets/tailscale/component.jsx
index 34168826..d7942588 100644
--- a/src/widgets/tailscale/component.jsx
+++ b/src/widgets/tailscale/component.jsx
@@ -1,13 +1,15 @@
+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: statsData, error: statsError } = useWidgetAPI(widget, "device", {
-    refreshInterval: 1000 * 60,
-  });
+  const { data: statsData, error: statsError } = useWidgetAPI(widget, "device");
 
   if (statsError) {
     return <Container service={service} error={statsError} />;
@@ -34,24 +36,24 @@ export default function Component({ service }) {
   const compareDifferenceInTwoDates = (priorDate, futureDate) => {
     const diff = futureDate.getTime() - priorDate.getTime();
     const diffInYears = Math.ceil(diff / (1000 * 60 * 60 * 24 * 365));
-    if (diffInYears > 1) return `${diffInYears}y`;
+    if (diffInYears > 1) return t("tailscale.years", { number: diffInYears });
     const diffInWeeks = Math.ceil(diff / (1000 * 60 * 60 * 24 * 7));
-    if (diffInWeeks > 1) return `${diffInWeeks}w`;
+    if (diffInWeeks > 1) return t("tailscale.weeks", { number: diffInWeeks });
     const diffInDays = Math.ceil(diff / (1000 * 60 * 60 * 24));
-    if (diffInDays > 1) return `${diffInDays}d`;
+    if (diffInDays > 1) return t("tailscale.days", { number: diffInDays });
     const diffInHours = Math.ceil(diff / (1000 * 60 * 60));
-    if (diffInHours > 1) return `${diffInHours}h`;
+    if (diffInHours > 1) return t("tailscale.hours", { number: diffInHours });
     const diffInMinutes = Math.ceil(diff / (1000 * 60));
-    if (diffInMinutes > 1) return `${diffInMinutes}m`;
+    if (diffInMinutes > 1) return t("tailscale.minutes", { number: diffInMinutes });
     const diffInSeconds = Math.ceil(diff / 1000);
-    if (diffInSeconds > 10) return `${diffInSeconds}s`;
+    if (diffInSeconds > 10) return t("tailscale.seconds", { number: diffInSeconds });
     return "Now";
   };
 
   const getLastSeen = () => {
     const date = new Date(lastSeen);
     const diff = compareDifferenceInTwoDates(date, now);
-    return `${diff === "Now" ? diff : `${diff} Ago`}`;
+    return diff === "Now" ? diff : t("tailscale.ago", { value: diff });
   };
 
   const getExpiry = () => {