[client] Clarify outdated NetBird client overlay

This commit is contained in:
Eduard Gert
2026-07-10 15:18:47 +02:00
parent e0c25ba4ba
commit 7d179e1c2a
10 changed files with 100 additions and 23 deletions
@@ -1,10 +1,13 @@
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { AlertTriangleIcon, DownloadIcon } from "lucide-react"; import { AlertTriangleIcon, DownloadIcon } from "lucide-react";
import { Browser } from "@wailsio/runtime"; import { Browser } from "@wailsio/runtime";
import { Version } from "@bindings/services";
import { Button } from "@/components/buttons/Button"; import { Button } from "@/components/buttons/Button";
import { useStatus } from "@/contexts/StatusContext.tsx"; import { useStatus } from "@/contexts/StatusContext.tsx";
const RELEASES_URL = "https://github.com/netbirdio/netbird/releases/latest"; const RELEASES_URL = "https://github.com/netbirdio/netbird/releases/latest";
const RC_RELEASES_URL = "https://pkgs.netbird.io/releases/rc";
function openUrl(url: string) { function openUrl(url: string) {
Browser.OpenURL(url).catch(() => globalThis.open(url, "_blank")); Browser.OpenURL(url).catch(() => globalThis.open(url, "_blank"));
@@ -12,7 +15,26 @@ function openUrl(url: string) {
export const DaemonOutdatedOverlay = () => { export const DaemonOutdatedOverlay = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const { isDaemonOutdated } = useStatus(); const { status, isDaemonOutdated } = useStatus();
const [guiVersion, setGuiVersion] = useState<string>("-");
const clientVersion = status?.daemonVersion ?? "—";
const isRc = /-rc/i.test(guiVersion) || /-rc/i.test(clientVersion);
const downloadUrl = isRc ? RC_RELEASES_URL : RELEASES_URL;
useEffect(() => {
if (!isDaemonOutdated) return;
let cancelled = false;
Version.GUI()
.then((v) => {
if (!cancelled) setGuiVersion(v);
})
.catch((err) => console.error("[DaemonOutdatedOverlay] GUI version error", err));
return () => {
cancelled = true;
};
}, [isDaemonOutdated]);
if (!isDaemonOutdated) return null; if (!isDaemonOutdated) return null;
@@ -38,10 +60,37 @@ export const DaemonOutdatedOverlay = () => {
<p className={"text-sm text-nb-gray-300"}>{t("daemon.outdated.description")}</p> <p className={"text-sm text-nb-gray-300"}>{t("daemon.outdated.description")}</p>
</div> </div>
<div className={"flex flex-col items-center gap-0.5 text-center"}>
<p className={"text-sm font-semibold text-nb-gray-100"}>
{clientVersion === "development" ? (
<span>
{t("settings.about.clientName")}{" "}
<span className={"font-mono text-yellow-400"}>
{t("settings.about.development")}
</span>
</span>
) : (
t("settings.about.client", { version: clientVersion })
)}
</p>
<p className={"text-sm font-medium text-nb-gray-250"}>
{guiVersion === "development" ? (
<span>
{t("settings.about.guiName")}{" "}
<span className={"font-mono text-yellow-400"}>
{t("settings.about.development")}
</span>
</span>
) : (
t("settings.about.gui", { version: guiVersion })
)}
</p>
</div>
<div className={"wails-no-draggable"}> <div className={"wails-no-draggable"}>
<Button variant={"primary"} size={"xs"} onClick={() => openUrl(RELEASES_URL)}> <Button variant={"primary"} size={"xs"} onClick={() => openUrl(downloadUrl)}>
<DownloadIcon size={14} /> <DownloadIcon size={14} />
{t("update.card.getInstaller")} {t("daemon.outdated.download")}
</Button> </Button>
</div> </div>
</div> </div>
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "Dokumentation" "message": "Dokumentation"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "NetBird-Dienst ist veraltet" "message": "NetBird Client ist veraltet"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Aktualisieren Sie den NetBird-Dienst, um diese App zu verwenden." "message": "Die neue GUI ist nicht mit Ihrem älteren Client kompatibel. Aktualisieren Sie Ihren Client, um die neue Anwendung zu verwenden."
},
"daemon.outdated.download": {
"message": "Neueste Version herunterladen"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "Anmeldung fehlgeschlagen: Die Uhr dieses Geräts ist nicht mit dem Server synchron. Bitte synchronisieren Sie die Systemuhr und versuchen Sie es erneut." "message": "Anmeldung fehlgeschlagen: Die Uhr dieses Geräts ist nicht mit dem Server synchron. Bitte synchronisieren Sie die Systemuhr und versuchen Sie es erneut."
+8 -4
View File
@@ -1724,12 +1724,16 @@
"description": "Documentation link on the daemon-unavailable overlay." "description": "Documentation link on the daemon-unavailable overlay."
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "NetBird Service Is Outdated", "message": "NetBird Client Is Outdated",
"description": "Title of the overlay shown when the NetBird background service is too old to drive this UI." "description": "Title of the overlay shown when the NetBird client (daemon) is too old to drive this UI."
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Update the NetBird service to use this app.", "message": "The new GUI isn't compatible with the older NetBird client. Update your client to use the new application.",
"description": "Body of the daemon-outdated overlay telling the user to upgrade the service." "description": "Body of the daemon-outdated overlay explaining that the GUI is newer than the client and the client must be updated."
},
"daemon.outdated.download": {
"message": "Download Latest",
"description": "Button on the daemon-outdated overlay that opens the download page for the latest release."
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "Sign-in failed: this device's clock is out of sync with the server. Please sync your system clock and try again.", "message": "Sign-in failed: this device's clock is out of sync with the server. Please sync your system clock and try again.",
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "Documentación" "message": "Documentación"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "El servicio de NetBird está desactualizado" "message": "NetBird Client está desactualizado"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Actualice el servicio de NetBird para usar esta aplicación." "message": "La nueva GUI no es compatible con su cliente anterior. Actualice su cliente para usar la nueva aplicación."
},
"daemon.outdated.download": {
"message": "Descargar la última versión"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "Error al iniciar sesión: el reloj de este dispositivo no está sincronizado con el servidor. Sincronice el reloj del sistema e inténtelo de nuevo." "message": "Error al iniciar sesión: el reloj de este dispositivo no está sincronizado con el servidor. Sincronice el reloj del sistema e inténtelo de nuevo."
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "Documentation" "message": "Documentation"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "Le service NetBird est obsolète" "message": "Le Client NetBird est obsolète"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Mettez à jour le service NetBird pour utiliser cette application." "message": "La nouvelle GUI n'est pas compatible avec votre ancien client. Mettez à jour votre client pour utiliser la nouvelle application."
},
"daemon.outdated.download": {
"message": "Télécharger la dernière version"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "Échec de la connexion : l’horloge de cet appareil n’est pas synchronisée avec le serveur. Veuillez synchroniser l’horloge de votre système et réessayer." "message": "Échec de la connexion : l’horloge de cet appareil n’est pas synchronisée avec le serveur. Veuillez synchroniser l’horloge de votre système et réessayer."
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "Dokumentáció" "message": "Dokumentáció"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "A NetBird szolgáltatás elavult" "message": "A NetBird Kliens elavult"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Frissítsd a NetBird szolgáltatást az alkalmazás használatához." "message": "Az új GUI nem kompatibilis a régebbi klienseddel. Frissítsd a klienst az új alkalmazás használatához."
},
"daemon.outdated.download": {
"message": "Legújabb letöltése"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "A bejelentkezés sikertelen: az eszköz órája eltér a szerverétől. Kérjük, szinkronizálja a rendszer óráját, majd próbálja újra." "message": "A bejelentkezés sikertelen: az eszköz órája eltér a szerverétől. Kérjük, szinkronizálja a rendszer óráját, majd próbálja újra."
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "Documentazione" "message": "Documentazione"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "Il servizio NetBird è obsoleto" "message": "NetBird Client è obsoleto"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Aggiorna il servizio NetBird per usare questa app." "message": "La nuova GUI non è compatibile con il tuo client precedente. Aggiorna il client per usare la nuova applicazione."
},
"daemon.outdated.download": {
"message": "Scarica l'ultima versione"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "Accesso non riuscito: l'orologio di questo dispositivo non è sincronizzato con il server. Sincronizzi l'orologio di sistema e riprovi." "message": "Accesso non riuscito: l'orologio di questo dispositivo non è sincronizzato con il server. Sincronizzi l'orologio di sistema e riprovi."
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "Documentação" "message": "Documentação"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "O serviço NetBird está desatualizado" "message": "O NetBird Client está desatualizado"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Atualize o serviço NetBird para usar este aplicativo." "message": "A nova GUI não é compatível com o seu cliente mais antigo. Atualize o seu cliente para usar o novo aplicativo."
},
"daemon.outdated.download": {
"message": "Baixar a versão mais recente"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "Falha no login: o relógio deste dispositivo está fora de sincronia com o servidor. Sincronize o relógio do sistema e tente novamente." "message": "Falha no login: o relógio deste dispositivo está fora de sincronia com o servidor. Sincronize o relógio do sistema e tente novamente."
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "Документация" "message": "Документация"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "Служба NetBird устарела" "message": "Клиент NetBird устарел"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "Обновите службу NetBird, чтобы использовать это приложение." "message": "Новый GUI несовместим с вашим более старым клиентом. Обновите клиент, чтобы использовать новое приложение."
},
"daemon.outdated.download": {
"message": "Скачать последнюю версию"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "Не удалось войти: часы этого устройства рассинхронизированы с сервером. Синхронизируйте системные часы и повторите попытку." "message": "Не удалось войти: часы этого устройства рассинхронизированы с сервером. Синхронизируйте системные часы и повторите попытку."
+5 -2
View File
@@ -1293,10 +1293,13 @@
"message": "文档" "message": "文档"
}, },
"daemon.outdated.title": { "daemon.outdated.title": {
"message": "NetBird 服务版本过旧" "message": "NetBird 客户端版本过旧"
}, },
"daemon.outdated.description": { "daemon.outdated.description": {
"message": "请更新 NetBird 服务以使用此应用。" "message": "新版 GUI 与您较旧的客户端不兼容。请更新客户端以使用新应用。"
},
"daemon.outdated.download": {
"message": "下载最新版本"
}, },
"error.jwt_clock_skew": { "error.jwt_clock_skew": {
"message": "登录失败:此设备的时钟与服务器不同步。请同步您的系统时钟后重试。" "message": "登录失败:此设备的时钟与服务器不同步。请同步您的系统时钟后重试。"