diff --git a/client/ui-wails/frontend/index.html b/client/ui-wails/frontend/index.html index 93aa1039b..2efe3d5ca 100644 --- a/client/ui-wails/frontend/index.html +++ b/client/ui-wails/frontend/index.html @@ -7,6 +7,6 @@
- + diff --git a/client/ui-wails/frontend/src/app.tsx b/client/ui-wails/frontend/src/app-new.tsx similarity index 100% rename from client/ui-wails/frontend/src/app.tsx rename to client/ui-wails/frontend/src/app-new.tsx diff --git a/client/ui-wails/frontend/src/components/Button.tsx b/client/ui-wails/frontend/src/components/Button.tsx index c9bf164b6..424242994 100644 --- a/client/ui-wails/frontend/src/components/Button.tsx +++ b/client/ui-wails/frontend/src/components/Button.tsx @@ -39,6 +39,11 @@ export const buttonVariants = cva( "dark:ring-offset-neutral-950/50 dark:focus:ring-neutral-500/20", "dark:bg-nb-gray-900/70 dark:text-gray-400 dark:border-gray-700/70 dark:hover:text-white dark:hover:bg-nb-gray-800/60", ], + subtle: [ + "bg-nb-gray-50 hover:bg-nb-gray-100 focus:ring-nb-gray-200/60 border-nb-gray-200 text-nb-gray-900", + "dark:ring-offset-neutral-950/50 dark:focus:ring-nb-gray-200/40", + "dark:bg-nb-gray-50 dark:text-nb-gray-900 dark:border-nb-gray-200 dark:hover:bg-nb-gray-100 dark:hover:text-nb-gray-950", + ], input: [ "bg-white hover:text-black focus:ring-zinc-200/50 hover:bg-gray-100 border-neutral-200 text-gray-900", "dark:ring-offset-neutral-950/50 dark:focus:ring-neutral-500/20", diff --git a/client/ui-wails/frontend/src/components/Input.tsx b/client/ui-wails/frontend/src/components/Input.tsx index 8dbab86a2..c3cc22ed8 100644 --- a/client/ui-wails/frontend/src/components/Input.tsx +++ b/client/ui-wails/frontend/src/components/Input.tsx @@ -185,7 +185,7 @@ export const Input = forwardRef(function Input( icon && "!pl-10", "border", props.readOnly && - "!bg-nb-gray-910 text-nb-gray-400 !border-nb-gray-800", + "!bg-nb-gray-910 text-nb-gray-350 !border-nb-gray-800", showStepper && "!rounded-r-none [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none [-moz-appearance:textfield]", className, diff --git a/client/ui-wails/frontend/src/layouts/AppLayout.tsx b/client/ui-wails/frontend/src/layouts/AppLayout.tsx index 1fbe0ea4c..012506844 100644 --- a/client/ui-wails/frontend/src/layouts/AppLayout.tsx +++ b/client/ui-wails/frontend/src/layouts/AppLayout.tsx @@ -1,6 +1,6 @@ import { Outlet } from "react-router-dom"; import { Header } from "@/layouts/Header.tsx"; -import { AutoUpdate } from "@/modules/auto-update/AutoUpdate.tsx"; +import { UpdateAvailableBanner } from "@/modules/auto-update/UpdateAvailableBanner.tsx"; import { DebugBundleProvider } from "@/modules/debug-bundle/DebugBundleContext.tsx"; import { ProfileProvider } from "@/modules/profile/ProfileContext.tsx"; @@ -11,7 +11,7 @@ export const AppLayout = () => {
- +
diff --git a/client/ui-wails/frontend/src/modules/auto-update/AutoUpdate.tsx b/client/ui-wails/frontend/src/modules/auto-update/AutoUpdate.tsx deleted file mode 100644 index 178c5b643..000000000 --- a/client/ui-wails/frontend/src/modules/auto-update/AutoUpdate.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import { useState } from "react"; -import { Button } from "@/components/Button"; -import { useStatus } from "@/hooks/useStatus"; -import { Update as UpdateSvc } from "@bindings/services"; - -export const AutoUpdate = () => { - const { status } = useStatus(); - const [dismissed, setDismissed] = useState(false); - - if (import.meta.env.DEV) return null; - - const updateVersion = (status?.events ?? []) - .map((e) => e.metadata?.["new_version_available"]) - .find((v): v is string => Boolean(v)); - - if (!updateVersion || dismissed) return null; - - const triggerUpdate = () => { - UpdateSvc.Trigger().catch(() => {}); - }; - - return ( -
-

- NetBird will update when you restart the app. -

- - -
- ); -}; - -export default AutoUpdate; diff --git a/client/ui-wails/frontend/src/modules/auto-update/UpdateAvailableBanner.tsx b/client/ui-wails/frontend/src/modules/auto-update/UpdateAvailableBanner.tsx new file mode 100644 index 000000000..91de44c56 --- /dev/null +++ b/client/ui-wails/frontend/src/modules/auto-update/UpdateAvailableBanner.tsx @@ -0,0 +1,49 @@ +import { useState } from "react"; +import { Button } from "@/components/Button"; +import { useStatus } from "@/hooks/useStatus"; +import { cn } from "@/lib/cn"; +import { Update as UpdateSvc } from "@bindings/services"; + +// TODO: Shown only when management has auto updates enabled + there are updates available + force updates is disabled +export const UpdateAvailableBanner = () => { + const { status } = useStatus(); + const [dismissed, setDismissed] = useState(false); + + if (import.meta.env.DEV) return null; + + const updateVersion = (status?.events ?? []) + .map((e) => e.metadata?.["new_version_available"]) + .find((v): v is string => Boolean(v)); + + if (!updateVersion || dismissed) return null; + + const triggerUpdate = () => { + UpdateSvc.Trigger().catch(() => {}); + }; + + return ( +
+

+ NetBird will update when you restart the app. +

+
+ + +
+
+ ); +}; + +export default UpdateAvailableBanner; diff --git a/client/ui-wails/frontend/src/modules/settings/SettingsTroubleshooting.tsx b/client/ui-wails/frontend/src/modules/settings/SettingsTroubleshooting.tsx index e21e9d042..46523d1a1 100644 --- a/client/ui-wails/frontend/src/modules/settings/SettingsTroubleshooting.tsx +++ b/client/ui-wails/frontend/src/modules/settings/SettingsTroubleshooting.tsx @@ -198,7 +198,7 @@ function DoneResult({
{showKey && } - {result.path && ( + {result.path && !showKey && (