From 0dcb503f795b29eb19f36e191d8b8447e5576c36 Mon Sep 17 00:00:00 2001 From: Uriel Date: Tue, 24 Sep 2024 20:43:14 +0200 Subject: [PATCH] Add OS decorations toggle --- gui/package.json | 3 +- gui/public/i18n/en/translation.ftl | 3 ++ gui/src-tauri/capabilities/migrated.json | 1 + gui/src-tauri/src/state.rs | 5 +++ gui/src/components/TopBar.tsx | 44 +++++++++++++------ .../settings/pages/InterfaceSettings.tsx | 25 +++++++++++ gui/src/hooks/config.ts | 2 + pnpm-lock.yaml | 12 +++++ 8 files changed, 80 insertions(+), 15 deletions(-) diff --git a/gui/package.json b/gui/package.json index c7128b4741..3417851bcd 100644 --- a/gui/package.json +++ b/gui/package.json @@ -33,7 +33,8 @@ "solarxr-protocol": "file:../solarxr-protocol", "three": "^0.163.0", "ts-pattern": "^5.2.0", - "typescript": "^5.4.5" + "typescript": "^5.4.5", + "use-double-tap": "^1.3.6" }, "scripts": { "start": "vite --force", diff --git a/gui/public/i18n/en/translation.ftl b/gui/public/i18n/en/translation.ftl index 783ab650a4..546f0a6f8b 100644 --- a/gui/public/i18n/en/translation.ftl +++ b/gui/public/i18n/en/translation.ftl @@ -435,6 +435,9 @@ settings-interface-appearance-font-os_font = OS font settings-interface-appearance-font-slime_font = Default font settings-interface-appearance-font_size = Base font scaling settings-interface-appearance-font_size-description = This affects the font size of the whole interface except this settings panel. +settings-interface-appearance-decorations = Use the system native decorations +settings-interface-appearance-decorations-description = This will not render the top bar of the interface and will use the operating system's instead. +settings-interface-appearance-decorations-label = Use native decorations ## Notification settings settings-interface-notifications = Notifications diff --git a/gui/src-tauri/capabilities/migrated.json b/gui/src-tauri/capabilities/migrated.json index 834fa4b619..baa764f0b4 100644 --- a/gui/src-tauri/capabilities/migrated.json +++ b/gui/src-tauri/capabilities/migrated.json @@ -24,6 +24,7 @@ "window:allow-hide", "window:allow-show", "window:allow-set-focus", + "window:allow-set-decorations", "shell:allow-open", "store:allow-get", "store:allow-set", diff --git a/gui/src-tauri/src/state.rs b/gui/src-tauri/src/state.rs index d0223875de..03c58d589a 100644 --- a/gui/src-tauri/src/state.rs +++ b/gui/src-tauri/src/state.rs @@ -15,6 +15,7 @@ pub struct WindowState { height: f64, x: i32, y: i32, + decorated: bool, #[serde(skip)] old: bool, } @@ -50,6 +51,8 @@ impl WindowState { window: &Window, ignore_maximized: bool, ) -> Result<()> { + self.decorated = window.is_decorated()?; + let maximized = window.is_maximized()?; self.maximized = maximized || (self.maximized && ignore_maximized); // We early return when it's maximized because we dont have to save the state @@ -70,6 +73,8 @@ impl WindowState { } pub fn update_window(&self, window: &Window, ignore_maximized: bool) -> Result<()> { + window.set_decorations(self.decorated)?; + let maximized = !ignore_maximized && window.is_maximized()?; if maximized && !self.maximized { window.unmaximize()?; diff --git a/gui/src/components/TopBar.tsx b/gui/src/components/TopBar.tsx index 8c7216e520..acb6c5576c 100644 --- a/gui/src/components/TopBar.tsx +++ b/gui/src/components/TopBar.tsx @@ -27,6 +27,8 @@ import { TrackersStillOnModal } from './TrackersStillOnModal'; import { useConfig } from '@/hooks/config'; import { listen } from '@tauri-apps/api/event'; import { TrayOrExitModal } from './TrayOrExitModal'; +import { error } from '@/utils/logging'; +import { useDoubleTap } from 'use-double-tap'; export function VersionTag() { return ( @@ -62,6 +64,7 @@ export function TopBar({ const [localIp, setLocalIp] = useState(null); const [showConnectedTrackersWarning, setConnectedTrackerWarning] = useState(false); + const [showVersionMobile, setShowVersionMobile] = useState(false); const [showTrayOrExitModal, setShowTrayOrExitModal] = useState(false); const doesMatchSettings = useMatch({ path: '/settings/*', @@ -90,6 +93,8 @@ export function TopBar({ await closeApp(); } }; + const showVersionBind = useDoubleTap(() => setShowVersionMobile(true)); + const unshowVersionBind = useDoubleTap(() => setShowVersionMobile(false)); useEffect(() => { const unlisten = listen('try-close', async () => { @@ -104,6 +109,11 @@ export function TopBar({ }; }, [config?.useTray, config?.connectedTrackersWarning]); + useEffect(() => { + if (config === null || !isTauri) return; + getCurrent().setDecorations(config?.decorations).catch(error); + }, [config?.decorations]); + useEffect(() => { sendRPCPacket(RpcMessage.ServerInfosRequest, new ServerInfosRequestT()); }, []); @@ -121,18 +131,20 @@ export function TopBar({
-
- - - - {(isTauri || !isMobile) && ( +
+ {!config?.decorations && ( + + + + )} + {(isTauri || !isMobile) && !config?.decorations && (
SlimeVR
)} - {!isMobile && ( + {(!(isMobile && !config?.decorations) || showVersionMobile) && ( <> {doesMatchSettings && ( @@ -149,6 +161,7 @@ export function TopBar({ 'flex justify-around flex-col text-standard-bold text-status-special', 'bg-status-special bg-opacity-20 rounded-lg px-3 select-text' )} + {...unshowVersionBind} > {localIp || 'unknown local ip'}
@@ -192,8 +205,11 @@ export function TopBar({ )} - {!isTauri && ( -
+ {!isTauri && !showVersionMobile && !config?.decorations && ( +
)} - {isTauri && ( + {isTauri && !config?.decorations && ( <>
+ + {l10n.getString('settings-interface-appearance-decorations')} + +
+ + {l10n.getString( + 'settings-interface-appearance-decorations-description' + )} + +
+
+ +
+
{l10n.getString('settings-general-interface-theme')} diff --git a/gui/src/hooks/config.ts b/gui/src/hooks/config.ts index 864591aa12..19fdabfd42 100644 --- a/gui/src/hooks/config.ts +++ b/gui/src/hooks/config.ts @@ -37,6 +37,7 @@ export interface Config { mirrorView: boolean; assignMode: AssignMode; discordPresence: boolean; + decorations: boolean; } export interface ConfigContext { @@ -62,6 +63,7 @@ export const defaultConfig: Omit = { mirrorView: true, assignMode: AssignMode.Core, discordPresence: false, + decorations: false, }; interface CrossStorage { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f13e9cdaa7..244296c638 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -110,6 +110,9 @@ importers: typescript: specifier: ^5.4.5 version: 5.4.5 + use-double-tap: + specifier: ^1.3.6 + version: 1.3.6(react@18.3.1) devDependencies: '@dword-design/eslint-plugin-import-alias': specifier: ^4.0.9 @@ -2955,6 +2958,11 @@ packages: uri-js@4.4.1: resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==} + use-double-tap@1.3.6: + resolution: {integrity: sha512-zWmzlihSTuLJpT+YJqhVUySV8UNvmdmaXokBEIh+FxR4m/vaSk2cS5hlqEPDj64rmkHlL7zfRTrJPw30Jd0OZA==} + peerDependencies: + react: '>=16.8.0' + use-sync-external-store@1.2.0: resolution: {integrity: sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==} peerDependencies: @@ -6122,6 +6130,10 @@ snapshots: dependencies: punycode: 2.3.1 + use-double-tap@1.3.6(react@18.3.1): + dependencies: + react: 18.3.1 + use-sync-external-store@1.2.0(react@18.3.1): dependencies: react: 18.3.1