[management,client] 0.75.0 release with new desktop UI (#6473)

- **Wails v3 application** (`client/ui`) with a React + TypeScript + Tailwind frontend replacing the Fyne UI: main connection view, exit-node switcher, networks/peers browser with detail panels, profile management, settings (general, network, SSH, security, troubleshooting, appearance), debug-bundle creation, and a first-run welcome flow.
- **Internationalization**: go-i18n bundle with 9 locales (en, de, es, fr, hu, it, pt, ru, zh-CN) shared between the tray and the frontend.
- **New system tray** implementation with per-platform theme-aware icons, including a native XEmbed host for Linux (`xembed_tray_linux.c`) and a Linux theme watcher.
- **Session handling**: auth session watcher (`client/internal/auth/sessionwatch`), pending login flow, session-expiration dialog and tray notifications, and `netbird login` improvements.
- **Daemon API extensions** (`daemon.proto`): status stream subscription, event stream, networks/exit-node selection endpoints, and richer full status — with probe throttling on the daemon side to protect against UI-driven request storms.
- **UI preferences store** persisted per profile, autostart management via the daemon (single source of truth in HKCU on Windows).
- **Build system**: Taskfile-based builds per platform (macOS, Linux, Windows), Docker cross-compilation images, MSIX/NSIS/nfpm/AppImage packaging, and a new `frontend-ui` CI workflow.

Co-authored-by: Zoltan Papp <zoltan.pmail@gmail.com>
Co-authored-by: Eduard Gert <kontakt@eduardgert.de>
Co-authored-by: braginini <bangvalo@gmail.com>
Co-authored-by: Pascal Fischer <32096965+pascal-fischer@users.noreply.github.com>
Co-authored-by: riccardom <riccardomanfrin@gmail.com>

client/ui/frontend/src/modules/auto-update/UpdateBadge.tsx

@@ -0,0 +1,27 @@
+import { forwardRef, type HTMLAttributes } from "react";
+import { ArrowUpCircleIcon } from "lucide-react";
+import { cn } from "@/lib/cn";
+
+type Props = HTMLAttributes<HTMLDivElement> & {
+    size?: number;
+};
+
+export const UpdateBadge = forwardRef<HTMLDivElement, Props>(function UpdateBadge(
+    { size = 15, className, ...rest },
+    ref,
+) {
+    return (
+        <div
+            ref={ref}
+            className={cn("relative flex items-center justify-center", className)}
+            {...rest}
+        >
+            <span
+                className={
+                    "pointer-events-none absolute inline-flex h-[15px] w-[15px] animate-ping rounded-full bg-netbird opacity-20"
+                }
+            />
+            <ArrowUpCircleIcon size={size} className={"text-netbird"} />
+        </div>
+    );
+});

client/ui/frontend/src/modules/auto-update/UpdateInProgressDialog.tsx

@@ -0,0 +1,187 @@
+import { useEffect, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { useSearchParams } from "react-router-dom";
+import { Loader2, XCircle } from "lucide-react";
+import { Update as UpdateSvc, WindowManager } from "@bindings/services";
+import { Button } from "@/components/buttons/Button";
+import { ConfirmDialog } from "@/components/dialog/ConfirmDialog";
+import { DialogActions } from "@/components/dialog/DialogActions";
+import { DialogDescription } from "@/components/dialog/DialogDescription";
+import { DialogHeading } from "@/components/dialog/DialogHeading";
+import { SquareIcon } from "@/components/SquareIcon";
+import { useAutoSizeWindow } from "@/hooks/useAutoSizeWindow";
+
+const TIMEOUT_MS = 15 * 60 * 1000;
+const POLL_INTERVAL_MS = 2000;
+// Sustained gRPC failure during install is taken as success (installer restarts the daemon mid-flight).
+const DAEMON_DOWN_GRACE_MS = 5000;
+const WINDOW_WIDTH = 360;
+
+type Phase =
+    | { kind: "running" }
+    | { kind: "timeout" }
+    | { kind: "canceled" }
+    | { kind: "failed"; message: string };
+
+export default function UpdateInProgressDialog() {
+    const { t } = useTranslation();
+    const [params] = useSearchParams();
+    const version = params.get("version") ?? "";
+    const [phase, setPhase] = useState<Phase>({ kind: "running" });
+    const phaseRef = useRef(phase);
+    phaseRef.current = phase;
+    const contentRef = useAutoSizeWindow<HTMLDivElement>(WINDOW_WIDTH);
+
+    useEffect(() => {
+        let cancelled = false;
+        let done = false;
+        let timer: ReturnType<typeof setTimeout> | null = null;
+        const start = Date.now();
+        let firstUnreachableAt: number | null = null;
+
+        const poll = async () => {
+            if (cancelled || done) return;
+            if (phaseRef.current.kind !== "running") return;
+
+            if (Date.now() - start > TIMEOUT_MS) {
+                done = true;
+                setPhase({ kind: "timeout" });
+                return;
+            }
+
+            try {
+                const r = await UpdateSvc.GetInstallerResult();
+                if (cancelled || done || phaseRef.current.kind !== "running") return;
+                firstUnreachableAt = null;
+                if (r.success) {
+                    done = true;
+                    UpdateSvc.Quit().catch(console.error);
+                    return;
+                }
+                if (r.errorMsg) {
+                    done = true;
+                    setPhase(mapInstallError(r.errorMsg));
+                    return;
+                }
+            } catch {
+                if (cancelled || done || phaseRef.current.kind !== "running") return;
+                const now = Date.now();
+                if (firstUnreachableAt === null) {
+                    firstUnreachableAt = now;
+                } else if (now - firstUnreachableAt >= DAEMON_DOWN_GRACE_MS) {
+                    done = true;
+                    UpdateSvc.Quit().catch(console.error);
+                    return;
+                }
+            }
+
+            if (!cancelled && !done) {
+                timer = setTimeout(poll, POLL_INTERVAL_MS);
+            }
+        };
+
+        timer = setTimeout(poll, POLL_INTERVAL_MS);
+
+        return () => {
+            cancelled = true;
+            if (timer) clearTimeout(timer);
+        };
+    }, []);
+
+    const isError = phase.kind !== "running";
+    const errorInfo = isError ? classifyPhase(phase, version, t) : null;
+    const updatingHeading = version
+        ? t("update.overlay.updatingVersion", { version })
+        : t("update.overlay.updating");
+
+    return (
+        <ConfirmDialog ref={contentRef}>
+            {isError ? (
+                <SquareIcon icon={XCircle} className={"bg-red-500 [&_svg]:text-white"} />
+            ) : (
+                <SquareIcon icon={Loader2} className={"[&_svg]:animate-spin"} />
+            )}
+
+            <div className={"flex flex-col items-center gap-2"}>
+                <DialogHeading className={"text-balance"}>
+                    {errorInfo ? errorInfo.title : updatingHeading}
+                </DialogHeading>
+                <DialogDescription>
+                    {errorInfo ? (
+                        <>
+                            {errorInfo.description}
+                            {errorInfo.message && (
+                                <>
+                                    <br />
+                                    <span className={"first-letter:uppercase"}>
+                                        {errorInfo.message}
+                                    </span>
+                                </>
+                            )}
+                        </>
+                    ) : (
+                        t("update.overlay.description")
+                    )}
+                </DialogDescription>
+            </div>
+
+            {isError && (
+                <DialogActions>
+                    <Button
+                        autoFocus
+                        variant={"secondary"}
+                        size={"md"}
+                        className={"w-full"}
+                        onClick={() => WindowManager.CloseInstallProgress().catch(console.error)}
+                    >
+                        {t("common.close")}
+                    </Button>
+                </DialogActions>
+            )}
+        </ConfirmDialog>
+    );
+}
+
+function mapInstallError(msg: string): Phase {
+    const m = msg.trim().toLowerCase();
+    if (m === "") return { kind: "failed", message: "" };
+    if (m.includes("deadline exceeded") || m.includes("timeout") || m.includes("timed out")) {
+        return { kind: "timeout" };
+    }
+    if (m.includes("canceled") || m.includes("cancelled") || m.includes("cancel")) {
+        return { kind: "canceled" };
+    }
+    return { kind: "failed", message: msg };
+}
+
+type Variant = { title: string; description: string; message?: string };
+
+function classifyPhase(
+    phase: Phase,
+    version: string,
+    t: (key: string, options?: Record<string, unknown>) => string,
+): Variant {
+    const target = version
+        ? t("update.overlay.error.targetVersion", { version })
+        : t("update.overlay.error.targetFallback");
+    switch (phase.kind) {
+        case "timeout":
+            return {
+                title: t("update.overlay.error.timeoutTitle"),
+                description: t("update.overlay.error.timeoutDescription", { target }),
+            };
+        case "canceled":
+            return {
+                title: t("update.overlay.error.canceledTitle"),
+                description: t("update.overlay.error.canceledDescription", { target }),
+            };
+        case "failed":
+            return {
+                title: t("update.overlay.error.failTitle"),
+                description: t("update.overlay.error.failDescription", { target }),
+                message: phase.message || t("update.overlay.error.unknownMessage"),
+            };
+        default:
+            return { title: "", description: "" };
+    }
+}

client/ui/frontend/src/modules/auto-update/UpdateVersionCard.tsx

@@ -0,0 +1,96 @@
+import { type ReactNode } from "react";
+import { useTranslation } from "react-i18next";
+import { Browser } from "@wailsio/runtime";
+import { DownloadIcon, NotepadText } from "lucide-react";
+import { Button } from "@/components/buttons/Button";
+import { useClientVersion } from "@/contexts/ClientVersionContext";
+import { cn } from "@/lib/cn";
+
+const GITHUB_RELEASES = "https://github.com/netbirdio/netbird/releases/latest";
+
+function openUrl(url: string) {
+    Browser.OpenURL(url).catch(() => {
+        window.open(url, "_blank");
+    });
+}
+
+export function UpdateVersionCard() {
+    const { t } = useTranslation();
+    const { updateVersion, enforced, triggerUpdate } = useClientVersion();
+
+    if (updateVersion) {
+        const titleKey = enforced
+            ? "update.card.versionAvailableInstall"
+            : "update.card.versionAvailableDownload";
+        return (
+            <Card className={"max-w-lg"}>
+                <div>
+                    <Title>{t(titleKey, { version: updateVersion })}</Title>
+                    <Link
+                        url={`https://github.com/netbirdio/netbird/releases/tag/v${updateVersion}`}
+                    >
+                        {t("update.card.whatsNew")}
+                    </Link>
+                </div>
+                {enforced ? (
+                    <Button variant={"primary"} size={"xs"} onClick={triggerUpdate}>
+                        {t("update.card.installNow")}
+                    </Button>
+                ) : (
+                    <Button
+                        variant={"primary"}
+                        size={"xs"}
+                        onClick={() => openUrl(GITHUB_RELEASES)}
+                    >
+                        <DownloadIcon size={14} />
+                        {t("update.card.getInstaller")}
+                    </Button>
+                )}
+            </Card>
+        );
+    }
+
+    return (
+        <Card className={"max-w-lg"}>
+            <div>
+                <Title>{t("update.card.onLatestVersion")}</Title>
+                <p className={"text-sm text-nb-gray-300"}>{t("update.card.autoCheckInterval")}</p>
+            </div>
+            <Button variant={"primary"} size={"xs"} onClick={() => openUrl(GITHUB_RELEASES)}>
+                <NotepadText size={14} />
+                {t("update.card.changelog")}
+            </Button>
+        </Card>
+    );
+}
+
+function Card({ children, className }: Readonly<{ children: ReactNode; className?: string }>) {
+    return (
+        <div
+            className={cn(
+                "flex w-full items-center justify-between gap-4 rounded-md border border-nb-gray-800 bg-nb-gray-910 px-4 py-3",
+                className,
+            )}
+        >
+            {children}
+        </div>
+    );
+}
+
+function Title({ children }: Readonly<{ children: ReactNode }>) {
+    return <p className={"text-sm font-semibold"}>{children}</p>;
+}
+
+function Link({ url, children }: Readonly<{ url: string; children: ReactNode }>) {
+    return (
+        <button
+            type={"button"}
+            onClick={() => openUrl(url)}
+            className={
+                "text-sm font-medium text-netbird hover:underline hover:decoration-[0.5px] hover:underline-offset-4"
+            }
+        >
+            {children}
+        </button>
+    );
+}