fix(app): stop macOS window chrome from swallowing clicks below the titlebar (#1748)

fluxer_app/src/features/app/components/layout/NativeDragRegion.module.css

@@ -3,7 +3,3 @@
 .nativeDragRegion {
 	-webkit-app-region: none;
 }
-
-:global(html.platform-native.platform-macos) .nativeDragRegion {
-	-webkit-app-region: drag;
-}

fluxer_app/src/features/user/components/modals/tabs/advanced_settings_tab/AdvancedDesktopControls.tsx

@@ -156,6 +156,7 @@ export const NativeTitleBarControl = observer(() => {
 		},
 		[i18n, updateDesktopWindowBehavior],
 	);
+	if (getElectronAPI()?.platform === 'darwin') return null;
 	return (
 		<Switch
 			ariaLabel={i18n._(USE_NATIVE_TITLE_BAR_DESCRIPTOR)}

fluxer_app/src/features/user/components/settings_utils/search_index/DesktopSettingsIndex.ts

@@ -2,7 +2,7 @@
 
 import {PRODUCT_NAME} from '@app/features/app/config/I18nDisplayConstants';
 import {CLOSE_DESCRIPTOR} from '@app/features/i18n/utils/CommonMessageDescriptors';
-import {getElectronAPI, isDesktop} from '@app/features/ui/utils/NativeUtils';
+import {getElectronAPI, getNativePlatformSync, isDesktop, isNativeMacOS} from '@app/features/ui/utils/NativeUtils';
 import type {SearchableSettingDescriptor} from '@app/features/user/components/settings_utils/search_index/SearchIndexTypes';
 import {BACKGROUND_DESCRIPTOR} from '@app/features/user/components/settings_utils/search_index/SharedDescriptors';
 import {msg} from '@lingui/core/macro';
@@ -283,7 +283,7 @@ export const desktopSettingsIndex: Array<SearchableSettingDescriptor> = [
 		],
 		description: USE_THE_OPERATING_SYSTEM_S_WINDOW_CHROME_DESCRIPTOR,
 		tags: ['desktop', 'appearance'],
-		isVisible: isDesktop,
+		isVisible: () => isDesktop() && !isNativeMacOS(getNativePlatformSync()),
 	},
 	{
 		id: 'advanced-tray-icon',

fluxer_app/src/features/window/hooks/useNativeTitleBar.ts

@@ -1,7 +1,7 @@
 // SPDX-License-Identifier: AGPL-3.0-or-later
 
 import {getDesktopWindowBehaviorSettings} from '@app/features/ui/utils/DesktopWindowBehaviorUtils';
-import {isDesktop} from '@app/features/ui/utils/NativeUtils';
+import {getNativePlatformSync, isDesktop, isNativeMacOS} from '@app/features/ui/utils/NativeUtils';
 import {useEffect, useState} from 'react';
 
 const TITLEBAR_HEIGHT_CSS_VAR = '--native-titlebar-height';
@@ -9,8 +9,12 @@ const CUSTOM_TITLEBAR_HEIGHT = '32px';
 const NATIVE_TITLEBAR_HEIGHT = '0px';
 const NATIVE_SYSTEM_TITLEBAR_CLASS = 'native-system-titlebar';
 
+function supportsSystemTitleBar(): boolean {
+	return isDesktop() && !isNativeMacOS(getNativePlatformSync());
+}
+
 function getInitialUseSystemTitleBar(): boolean {
-	return isDesktop() && document.documentElement.classList.contains(NATIVE_SYSTEM_TITLEBAR_CLASS);
+	return supportsSystemTitleBar() && document.documentElement.classList.contains(NATIVE_SYSTEM_TITLEBAR_CLASS);
 }
 
 export function useNativeTitleBar(): boolean {
@@ -19,6 +23,10 @@ export function useNativeTitleBar(): boolean {
 		if (!isDesktop()) {
 			return;
 		}
+		if (!supportsSystemTitleBar()) {
+			setUseSystemTitleBar(false);
+			return;
+		}
 		let mounted = true;
 		void getDesktopWindowBehaviorSettings().then((settings) => {
 			if (!mounted || !settings) {