feat: add OS detection hook and integrate into FileBrowserDialog for improved keyboard shortcut handling

- Introduced useOSDetection hook to determine the user's operating system.
- Updated FileBrowserDialog to utilize the OS detection for displaying the correct keyboard shortcut (⌘ or Ctrl) based on the detected OS.

apps/ui/src/hooks/index.ts

@@ -3,6 +3,7 @@ export { useBoardBackgroundSettings } from './use-board-background-settings';
 export { useElectronAgent } from './use-electron-agent';
 export { useKeyboardShortcuts } from './use-keyboard-shortcuts';
 export { useMessageQueue } from './use-message-queue';
+export { useOSDetection, type OperatingSystem, type OSDetectionResult } from './use-os-detection';
 export { useResponsiveKanban } from './use-responsive-kanban';
 export { useScrollTracking } from './use-scroll-tracking';
 export { useSettingsMigration } from './use-settings-migration';

apps/ui/src/hooks/use-os-detection.ts

@@ -0,0 +1,48 @@
+import { useMemo } from 'react';
+
+export type OperatingSystem = 'mac' | 'windows' | 'linux' | 'unknown';
+
+export interface OSDetectionResult {
+  readonly os: OperatingSystem;
+  readonly isMac: boolean;
+  readonly isWindows: boolean;
+  readonly isLinux: boolean;
+}
+
+function detectOS(): OperatingSystem {
+  // Check Electron's process.platform first (most reliable in Electron apps)
+  if (typeof process !== 'undefined' && process.platform) {
+    if (process.platform === 'darwin') return 'mac';
+    if (process.platform === 'win32') return 'windows';
+    if (process.platform === 'linux') return 'linux';
+  }
+
+  if (typeof navigator === 'undefined') {
+    return 'unknown';
+  }
+
+  // Fallback: use modern userAgentData API with fallback to navigator.platform
+  const nav = navigator as Navigator & { userAgentData?: { platform: string } };
+  const platform = (nav.userAgentData?.platform ?? navigator.platform ?? '').toLowerCase();
+
+  if (platform.includes('mac')) return 'mac';
+  if (platform.includes('win')) return 'windows';
+  if (platform.includes('linux') || platform.includes('x11')) return 'linux';
+  return 'unknown';
+}
+
+/**
+ * Hook to detect the user's operating system.
+ * Returns OS information and convenience boolean flags.
+ */
+export function useOSDetection(): OSDetectionResult {
+  return useMemo(() => {
+    const os = detectOS();
+    return {
+      os,
+      isMac: os === 'mac',
+      isWindows: os === 'windows',
+      isLinux: os === 'linux',
+    };
+  }, []);
+}