Merge branch 'main' into embedded-vnc

client/ui/frontend/src/components/ReadySignal.tsx

@@ -0,0 +1,18 @@
+import { useEffect, useRef } from "react";
+import { Events } from "@wailsio/runtime";
+import { useStatus } from "@/contexts/StatusContext.tsx";
+
+const EVENT_WINDOW_PAINTED = "netbird:window-painted";
+
+export const ReadySignal = () => {
+    const { isReady } = useStatus();
+    const sent = useRef(false);
+
+    useEffect(() => {
+        if (!isReady || sent.current) return;
+        sent.current = true;
+        void Events.Emit(EVENT_WINDOW_PAINTED);
+    }, [isReady]);
+
+    return null;
+};

client/ui/frontend/src/contexts/DebugBundleContext.tsx

@@ -71,10 +71,12 @@ type BundleOptions = {
     hasWindow: boolean;
     totalSec: number;
     uploadUrl: string;
-    anonymize: boolean;
+    anonymizeLevel: AnonymizeLevel;
     systemInfo: boolean;
 };
 
+export type AnonymizeLevel = "none" | "default" | "strict";
+
 const startCaptureBestEffort = async (totalSec: number, pcap: CaptureState) => {
     try {
         // Mirror the CLI's safety margin: window + 30s, server caps at 10m.
@@ -187,7 +189,10 @@ const runBundleFlow = async (
 
     if (opts.uploadUrl) setStage({ kind: "uploading" });
     const result = await DebugSvc.Bundle({
-        anonymize: opts.anonymize,
+        anonymize: opts.anonymizeLevel !== "none",
+        // The daemon only knows "default" and "strict"; "none" is expressed
+        // through the anonymize flag being off.
+        anonymizeLevel: opts.anonymizeLevel === "strict" ? "strict" : "default",
         systemInfo: opts.systemInfo,
         uploadUrl: opts.uploadUrl,
         logFileCount,
@@ -198,7 +203,7 @@ const runBundleFlow = async (
 };
 
 const useDebugBundle = () => {
-    const [anonymize, setAnonymize] = useState(false);
+    const [anonymizeLevel, setAnonymizeLevel] = useState<AnonymizeLevel>("none");
     const [systemInfo, setSystemInfo] = useState(true);
     const [upload, setUpload] = useState(true);
     const [trace, setTrace] = useState(true);
@@ -240,7 +245,7 @@ const useDebugBundle = () => {
             hasWindow: capture && totalSec > 0,
             totalSec,
             uploadUrl: upload ? NETBIRD_UPLOAD_URL : "",
-            anonymize,
+            anonymizeLevel,
             systemInfo,
         };
 
@@ -272,8 +277,8 @@ const useDebugBundle = () => {
     };
 
     return {
-        anonymize,
-        setAnonymize,
+        anonymizeLevel,
+        setAnonymizeLevel,
         systemInfo,
         setSystemInfo,
         upload,

client/ui/frontend/src/hooks/useKeepConnectedOnQuit.ts

@@ -0,0 +1,35 @@
+import { useCallback, useEffect, useState } from "react";
+import { Preferences } from "@bindings/services";
+
+export const useKeepConnectedOnQuit = () => {
+    const [keepConnected, setKeepConnected] = useState<boolean | null>(null);
+
+    useEffect(() => {
+        let cancelled = false;
+        Preferences.Get()
+            .then((prefs) => {
+                if (cancelled) return;
+                setKeepConnected(prefs?.keepConnectedOnQuit ?? false);
+            })
+            .catch((err: unknown) => {
+                if (cancelled) return;
+                console.warn("[useKeepConnectedOnQuit] load preferences failed", err);
+                setKeepConnected(false);
+            });
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+
+    const setKeepConnectedOnQuit = useCallback(async (keep: boolean) => {
+        setKeepConnected(keep);
+        try {
+            await Preferences.SetKeepConnectedOnQuit(keep);
+        } catch (err: unknown) {
+            setKeepConnected(!keep);
+            console.error("[useKeepConnectedOnQuit] SetKeepConnectedOnQuit failed", err);
+        }
+    }, []);
+
+    return { keepConnected, setKeepConnectedOnQuit };
+};

client/ui/frontend/src/layouts/AppLayout.tsx

@@ -5,6 +5,7 @@ import { DebugBundleProvider } from "@/contexts/DebugBundleContext.tsx";
 import { ProfileProvider } from "@/contexts/ProfileContext.tsx";
 import { DialogProvider } from "@/contexts/DialogContext.tsx";
 import { RestrictionsProvider } from "@/contexts/RestrictionsContext.tsx";
+import { ReadySignal } from "@/components/ReadySignal.tsx";
 
 export const AppLayout = () => {
     return (
@@ -16,6 +17,7 @@ export const AppLayout = () => {
                             <DebugBundleProvider>
                                 <ClientVersionProvider>
                                     <Outlet />
+                                    <ReadySignal />
                                 </ClientVersionProvider>
                             </DebugBundleProvider>
                         </RestrictionsProvider>

client/ui/frontend/src/modules/settings/SettingsGeneral.tsx

@@ -11,6 +11,7 @@ import { ManagementServerSwitch } from "@/components/ManagementServerSwitch.tsx"
 import { ManagementMode, useManagementUrl } from "@/hooks/useManagementUrl.ts";
 import { LanguagePicker } from "@/components/LanguagePicker.tsx";
 import { useRestrictions } from "@/contexts/RestrictionsContext.tsx";
+import { useKeepConnectedOnQuit } from "@/hooks/useKeepConnectedOnQuit.ts";
 
 export function SettingsGeneral() {
     const { t } = useTranslation();
@@ -19,6 +20,7 @@ export function SettingsGeneral() {
     const { mode, setMode, setUrl, displayUrl, showError, canSave, save, checking, unreachable } =
         useManagementUrl();
     const { mdm, features } = useRestrictions();
+    const { keepConnected, setKeepConnectedOnQuit } = useKeepConnectedOnQuit();
 
     const inputRef = useRef<HTMLInputElement>(null);
     const managementUrlId = useId();
@@ -57,6 +59,15 @@ export function SettingsGeneral() {
                         helpText={t("settings.general.autostart.help")}
                     />
                 )}
+                <FancyToggleSwitch
+                    value={keepConnected ?? false}
+                    onChange={(v) => {
+                        void setKeepConnectedOnQuit(v);
+                    }}
+                    loading={keepConnected === null}
+                    label={t("settings.general.keepConnectedOnQuit.label")}
+                    helpText={t("settings.general.keepConnectedOnQuit.help")}
+                />
             </SectionGroup>
 
             {!mdm.managementURL && !features.disableUpdateSettings && (

client/ui/frontend/src/modules/settings/SettingsTroubleshooting.tsx

@@ -1,6 +1,6 @@
 import { useId, type ReactNode } from "react";
 import { Trans, useTranslation } from "react-i18next";
-import { CircleCheckBig, FolderOpen, Loader2 } from "lucide-react";
+import { ChevronDown, CircleCheckBig, FolderOpen, Info, Loader2 } from "lucide-react";
 import { Browser } from "@wailsio/runtime";
 import { Debug as DebugSvc } from "@bindings/services";
 import type { DebugBundleResult } from "@bindings/services/models.js";
@@ -8,13 +8,22 @@ import { Button } from "@/components/buttons/Button";
 import { DialogActions } from "@/components/dialog/DialogActions";
 import { DialogDescription } from "@/components/dialog/DialogDescription";
 import { DialogHeading } from "@/components/dialog/DialogHeading";
+import {
+    DropdownMenu,
+    DropdownMenuContent,
+    DropdownMenuRadioGroup,
+    DropdownMenuRadioItem,
+    DropdownMenuTrigger,
+} from "@/components/DropdownMenu";
 import FancyToggleSwitch from "@/components/switches/FancyToggleSwitch";
 import HelpText from "@/components/typography/HelpText.tsx";
 import { Input } from "@/components/inputs/Input";
 import { Label } from "@/components/typography/Label";
 import { SquareIcon } from "@/components/SquareIcon";
+import { Tooltip } from "@/components/Tooltip";
+import { cn } from "@/lib/cn";
 import { formatRemaining } from "@/lib/formatters";
-import type { DebugStage } from "@/contexts/DebugBundleContext";
+import type { AnonymizeLevel, DebugStage } from "@/contexts/DebugBundleContext";
 import { useDebugBundleContext } from "@/contexts/DebugBundleContext";
 import { SectionGroup, SettingsBottomBar } from "@/modules/settings/SettingsSection.tsx";
 
@@ -24,8 +33,8 @@ export function SettingsTroubleshooting() {
     const { t } = useTranslation();
     const durationId = useId();
     const {
-        anonymize,
-        setAnonymize,
+        anonymizeLevel,
+        setAnonymizeLevel,
         systemInfo,
         setSystemInfo,
         upload,
@@ -55,12 +64,71 @@ export function SettingsTroubleshooting() {
 
     return (
         <SectionGroup title={t("settings.troubleshooting.section.title")}>
-            <FancyToggleSwitch
-                value={anonymize}
-                onChange={setAnonymize}
-                label={t("settings.troubleshooting.anonymize.label")}
-                helpText={t("settings.troubleshooting.anonymize.help")}
-            />
+            <div className={"flex items-center justify-between gap-6"}>
+                <div className={"max-w-md flex-1"}>
+                    <Label as={"div"}>
+                        <span className={"inline-flex items-center gap-1.5"}>
+                            {t("settings.troubleshooting.anonymize.label")}
+                            <Tooltip
+                                content={
+                                    <div className={"max-w-xs whitespace-normal leading-relaxed"}>
+                                        {t("settings.troubleshooting.anonymize.info")}
+                                    </div>
+                                }
+                            >
+                                <Info
+                                    size={14}
+                                    aria-label={t("settings.troubleshooting.anonymize.label")}
+                                    className={"shrink-0 cursor-default text-nb-gray-400"}
+                                />
+                            </Tooltip>
+                        </span>
+                    </Label>
+                    <HelpText margin={false}>
+                        {t("settings.troubleshooting.anonymize.help")}
+                    </HelpText>
+                </div>
+                <div className={"shrink-0"}>
+                    <DropdownMenu>
+                        <DropdownMenuTrigger asChild>
+                            <button
+                                type={"button"}
+                                aria-label={t("settings.troubleshooting.anonymize.label")}
+                                className={cn(
+                                    "inline-flex h-[40px] min-w-[160px] items-center justify-between gap-2 px-3",
+                                    "rounded-md border bg-white dark:bg-nb-gray-900",
+                                    "border-neutral-200 dark:border-nb-gray-700",
+                                    "cursor-default text-xs font-semibold text-nb-gray-100 outline-none",
+                                    "hover:border-nb-gray-600 data-[state=open]:border-nb-gray-600",
+                                )}
+                            >
+                                {t(`settings.troubleshooting.anonymize.${anonymizeLevel}`)}
+                                <ChevronDown
+                                    size={16}
+                                    aria-hidden={"true"}
+                                    className={"shrink-0 text-nb-gray-200"}
+                                />
+                            </button>
+                        </DropdownMenuTrigger>
+                        <DropdownMenuContent align={"end"} className={"min-w-[160px]"}>
+                            <DropdownMenuRadioGroup
+                                value={anonymizeLevel}
+                                onValueChange={(v) => setAnonymizeLevel(v as AnonymizeLevel)}
+                            >
+                                <DropdownMenuRadioItem value={"none"}>
+                                    {t("settings.troubleshooting.anonymize.none")}
+                                </DropdownMenuRadioItem>
+                                <DropdownMenuRadioItem value={"default"}>
+                                    {t("settings.troubleshooting.anonymize.default")}
+                                </DropdownMenuRadioItem>
+                                <DropdownMenuRadioItem value={"strict"}>
+                                    {t("settings.troubleshooting.anonymize.strict")}
+                                </DropdownMenuRadioItem>
+                            </DropdownMenuRadioGroup>
+                        </DropdownMenuContent>
+                    </DropdownMenu>
+                </div>
+            </div>
             <FancyToggleSwitch
                 value={systemInfo}
                 onChange={setSystemInfo}