feat: add Electron desktop app

src/components/settings/view/Settings.tsx

@@ -1,3 +1,4 @@
+import { useEffect, useMemo, useState } from 'react';
 import { X } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 
@@ -10,6 +11,7 @@ import CredentialsSettingsTab from '../view/tabs/api-settings/CredentialsSetting
 import VoiceSettingsTab from '../view/tabs/VoiceSettingsTab';
 import GitSettingsTab from '../view/tabs/git-settings/GitSettingsTab';
 import BrowserUseSettingsTab from '../view/tabs/browser-use-settings/BrowserUseSettingsTab';
+import ComputerUseSettingsTab from '../view/tabs/computer-use-settings/ComputerUseSettingsTab';
 import NotificationsSettingsTab from '../view/tabs/NotificationsSettingsTab';
 import TasksSettingsTab from '../view/tabs/tasks-settings/TasksSettingsTab';
 import PluginSettingsTab from '../../plugins/view/PluginSettingsTab';
@@ -18,8 +20,22 @@ import { useSettingsController } from '../hooks/useSettingsController';
 import { useWebPush } from '../../../hooks/useWebPush';
 import type { SettingsProps } from '../types/types';
 
+type DesktopNotificationsState = {
+  enabled: boolean;
+  supported: boolean;
+  connectedCount?: number;
+  targetCount?: number;
+  lastError?: string | null;
+};
+
 function Settings({ isOpen, onClose, projects = [], initialTab = 'agents' }: SettingsProps) {
   const { t } = useTranslation('settings');
+  const desktopNotificationsBridge = useMemo(() => (
+    typeof window === 'undefined'
+      ? null
+      : ((window as any).cloudcliDesktopNotifications || null)
+  ), []);
+  const [desktopNotificationsState, setDesktopNotificationsState] = useState<DesktopNotificationsState | null>(null);
   const {
     activeTab,
     setActiveTab,
@@ -75,6 +91,45 @@ function Settings({ isOpen, onClose, projects = [], initialTab = 'agents' }: Set
     });
   };
 
+  useEffect(() => {
+    if (!desktopNotificationsBridge) return undefined;
+    let mounted = true;
+    desktopNotificationsBridge.getState().then((state: any) => {
+      if (mounted) {
+        setDesktopNotificationsState(state?.desktopNotifications || null);
+      }
+    }).catch(() => {});
+    const unsubscribe = desktopNotificationsBridge.onStateUpdated?.((state: any) => {
+      if (mounted) {
+        setDesktopNotificationsState(state?.desktopNotifications || null);
+      }
+    });
+    return () => {
+      mounted = false;
+      unsubscribe?.();
+    };
+  }, [desktopNotificationsBridge]);
+
+  const handleEnableDesktopNotifications = async () => {
+    if (!desktopNotificationsBridge) return;
+    const state = await desktopNotificationsBridge.update({ enabled: true });
+    setDesktopNotificationsState(state?.desktopNotifications || null);
+    setNotificationPreferences({
+      ...notificationPreferences,
+      channels: { ...notificationPreferences.channels, desktop: true },
+    });
+  };
+
+  const handleDisableDesktopNotifications = async () => {
+    if (!desktopNotificationsBridge) return;
+    const state = await desktopNotificationsBridge.update({ enabled: false });
+    setDesktopNotificationsState(state?.desktopNotifications || null);
+    setNotificationPreferences({
+      ...notificationPreferences,
+      channels: { ...notificationPreferences.channels, desktop: false },
+    });
+  };
+
   if (!isOpen) {
     return null;
   }
@@ -144,6 +199,8 @@ function Settings({ isOpen, onClose, projects = [], initialTab = 'agents' }: Set
 
               {activeTab === 'browser' && <BrowserUseSettingsTab />}
 
+              {activeTab === 'computer' && <ComputerUseSettingsTab />}
+
               {activeTab === 'notifications' && (
                 <NotificationsSettingsTab
                   notificationPreferences={notificationPreferences}
@@ -153,6 +210,10 @@ function Settings({ isOpen, onClose, projects = [], initialTab = 'agents' }: Set
                   isPushLoading={isPushLoading}
                   onEnablePush={handleEnablePush}
                   onDisablePush={handleDisablePush}
+                  isDesktop={Boolean(desktopNotificationsBridge)}
+                  desktopNotifications={desktopNotificationsState}
+                  onEnableDesktopNotifications={handleEnableDesktopNotifications}
+                  onDisableDesktopNotifications={handleDisableDesktopNotifications}
                 />
               )}