mirror of
https://github.com/netbirdio/netbird.git
synced 2026-07-22 08:21:30 +02:00
d9392fdbb8
## Describe your changes Add more information about the current client and GUI versions if the user is running an older client. Update the URL to download the latest RC if the user is running any RC build. <img width="348" height="497" alt="CleanShot 2026-07-10 at 15 11 54" src="https://github.com/user-attachments/assets/2579f5f3-5056-4184-96bb-9f93d5860328" /> ## Issue ticket number and link ## Stack <!-- branch-stack --> ### Checklist - [ ] Is it a bug fix - [ ] Is a typo/documentation fix - [x] Is a feature enhancement - [ ] It is a refactor - [ ] Created tests that fail without the change (if possible) - [ ] This change does **not** modify the public API, gRPC protocols, functionality behavior, CLI / service flags, or introduce a new feature — **OR** I have discussed it with the NetBird team beforehand (link the issue / Slack thread in the description). See [CONTRIBUTING.md](https://github.com/netbirdio/netbird/blob/main/CONTRIBUTING.md#discuss-changes-with-the-netbird-team-first). > By submitting this pull request, you confirm that you have read and agree to the terms of the [Contributor License Agreement](https://github.com/netbirdio/netbird/blob/main/CONTRIBUTOR_LICENSE_AGREEMENT.md). ## Documentation Select exactly one: - [ ] I added/updated documentation for this change - [x] Documentation is **not needed** for this change (explain why) ### Docs PR URL (required if "docs added" is checked) Paste the PR link from https://github.com/netbirdio/docs here: https://github.com/netbirdio/docs/pull/__
100 lines
4.0 KiB
TypeScript
100 lines
4.0 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { AlertTriangleIcon, DownloadIcon } from "lucide-react";
|
|
import { Browser } from "@wailsio/runtime";
|
|
import { Version } from "@bindings/services";
|
|
import { Button } from "@/components/buttons/Button";
|
|
import { useStatus } from "@/contexts/StatusContext.tsx";
|
|
|
|
const RELEASES_URL = "https://github.com/netbirdio/netbird/releases/latest";
|
|
const RC_RELEASES_URL = "https://pkgs.netbird.io/releases/rc";
|
|
|
|
function openUrl(url: string) {
|
|
Browser.OpenURL(url).catch(() => globalThis.open(url, "_blank"));
|
|
}
|
|
|
|
export const DaemonOutdatedOverlay = () => {
|
|
const { t } = useTranslation();
|
|
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;
|
|
|
|
return (
|
|
<div
|
|
className={
|
|
"wails-draggable fixed inset-0 z-[100] flex cursor-default select-none items-center justify-center bg-nb-gray-950 backdrop-blur-sm"
|
|
}
|
|
>
|
|
<div className={"flex max-w-lg flex-col items-center gap-5 px-8 text-center"}>
|
|
<div
|
|
className={
|
|
"flex h-11 w-11 items-center justify-center rounded-xl border border-nb-gray-900 bg-nb-gray-920 text-amber-500"
|
|
}
|
|
>
|
|
<AlertTriangleIcon size={20} />
|
|
</div>
|
|
|
|
<div className={"flex flex-col items-center gap-1"}>
|
|
<p className={"text-base font-medium text-nb-gray-50"}>
|
|
{t("daemon.outdated.title")}
|
|
</p>
|
|
<p className={"text-sm text-nb-gray-300"}>{t("daemon.outdated.description")}</p>
|
|
</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"}>
|
|
<Button variant={"primary"} size={"xs"} onClick={() => openUrl(downloadUrl)}>
|
|
<DownloadIcon size={14} />
|
|
{t("daemon.outdated.download")}
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|