mirror of
https://github.com/netbirdio/netbird.git
synced 2026-07-22 08:21:30 +02:00
- **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>
88 lines
3.2 KiB
TypeScript
88 lines
3.2 KiB
TypeScript
import { useTranslation } from "react-i18next";
|
|
import { Tooltip } from "@/components/Tooltip.tsx";
|
|
import { VerticalTabs } from "@/components/VerticalTabs.tsx";
|
|
import { UpdateBadge } from "@/modules/auto-update/UpdateBadge.tsx";
|
|
import { useClientVersion } from "@/contexts/ClientVersionContext.tsx";
|
|
import { useRestrictions } from "@/contexts/RestrictionsContext.tsx";
|
|
import {
|
|
BoltIcon,
|
|
InfoIcon,
|
|
LifeBuoyIcon,
|
|
NetworkIcon,
|
|
ShieldIcon,
|
|
SlidersHorizontalIcon,
|
|
SquareTerminalIcon,
|
|
UserCircleIcon,
|
|
} from "lucide-react";
|
|
|
|
export const SettingsNavigation = () => {
|
|
const { t } = useTranslation();
|
|
const { updateAvailable } = useClientVersion();
|
|
const { mdm, features } = useRestrictions();
|
|
const showSsh = mdm.allowServerSSH ?? !features.disableUpdateSettings;
|
|
|
|
const aboutAdornment = updateAvailable ? (
|
|
<Tooltip content={t("settings.tabs.updateAvailable")} side={"right"}>
|
|
<UpdateBadge />
|
|
</Tooltip>
|
|
) : undefined;
|
|
|
|
return (
|
|
<div className={"flex w-52 shrink-0 select-none flex-col items-center"}>
|
|
<VerticalTabs.List aria-label={t("settings.nav.label")}>
|
|
<VerticalTabs.Trigger
|
|
value={"general"}
|
|
icon={SlidersHorizontalIcon}
|
|
title={t("settings.tabs.general")}
|
|
/>
|
|
{!features.disableUpdateSettings && (
|
|
<>
|
|
<VerticalTabs.Trigger
|
|
value={"network"}
|
|
icon={NetworkIcon}
|
|
title={t("settings.tabs.network")}
|
|
/>
|
|
<VerticalTabs.Trigger
|
|
value={"security"}
|
|
icon={ShieldIcon}
|
|
title={t("settings.tabs.security")}
|
|
/>
|
|
</>
|
|
)}
|
|
{!features.disableProfiles && (
|
|
<VerticalTabs.Trigger
|
|
value={"profiles"}
|
|
icon={UserCircleIcon}
|
|
title={t("settings.tabs.profiles")}
|
|
/>
|
|
)}
|
|
{showSsh && (
|
|
<VerticalTabs.Trigger
|
|
value={"ssh"}
|
|
icon={SquareTerminalIcon}
|
|
title={t("settings.tabs.ssh")}
|
|
/>
|
|
)}
|
|
{!features.disableUpdateSettings && (
|
|
<VerticalTabs.Trigger
|
|
value={"advanced"}
|
|
icon={BoltIcon}
|
|
title={t("settings.tabs.advanced")}
|
|
/>
|
|
)}
|
|
<VerticalTabs.Trigger
|
|
value={"troubleshooting"}
|
|
icon={LifeBuoyIcon}
|
|
title={t("settings.tabs.troubleshooting")}
|
|
/>
|
|
<VerticalTabs.Trigger
|
|
value={"about"}
|
|
icon={InfoIcon}
|
|
title={t("settings.tabs.about")}
|
|
adornment={aboutAdornment}
|
|
/>
|
|
</VerticalTabs.List>
|
|
</div>
|
|
);
|
|
};
|