@lobehub/lobehub 2.0.0-next.353 → 2.0.0-next.354

package/.cursor/rules/desktop-menu-configuration.mdc

@@ -1,209 +0,0 @@
----
-description:
-globs:
-alwaysApply: false
----
-
-# 桌面端菜单配置指南
-
-## 菜单系统概述
-
-LobeChat 桌面应用有三种主要的菜单类型：
-
-1. **应用菜单 (App Menu)**：显示在应用窗口顶部（macOS）或窗口标题栏（Windows/Linux）
-2. **上下文菜单 (Context Menu)**：右键点击时显示的菜单
-3. **托盘菜单 (Tray Menu)**：点击系统托盘图标显示的菜单
-
-## 菜单相关文件结构
-
-```plaintext
-apps/desktop/src/main/
-├── menus/                 # 菜单定义
-│   ├── appMenu.ts         # 应用菜单配置
-│   ├── contextMenu.ts     # 上下文菜单配置
-│   └── factory.ts         # 菜单工厂函数
-├── controllers/
-│   ├── MenuCtr.ts         # 菜单控制器
-│   └── TrayMenuCtr.ts     # 托盘菜单控制器
-```
-
-## 菜单配置流程
-
-### 1. 应用菜单配置
-
-应用菜单在 `apps/desktop/src/main/menus/appMenu.ts` 中定义：
-
-1. **导入依赖**
-
-   ```typescript
-   import { BrowserWindow, Menu, MenuItem, MenuItemConstructorOptions, app } from 'electron';
-   import { is } from 'electron-util';
-   ```
-
-2. **定义菜单项**
-   - 使用 `MenuItemConstructorOptions` 类型定义菜单结构
-   - 每个菜单项可以包含：label, accelerator (快捷键), role, submenu, click 等属性
-
-3. **创建菜单工厂函数**
-
-   ```typescript
-   export const createAppMenu = (win: BrowserWindow) => {
-     const template = [
-       // 定义菜单项...
-     ];
-
-     return Menu.buildFromTemplate(template);
-   };
-   ```
-
-4. **注册菜单**
-   - 在 `MenuCtr.ts` 控制器中使用 `Menu.setApplicationMenu(menu)` 设置应用菜单
-
-### 2. 上下文菜单配置
-
-上下文菜单通常在特定元素上右键点击时显示：
-
-1. **在主进程中定义菜单模板**
-
-   ```typescript
-   // apps/desktop/src/main/menus/contextMenu.ts
-   export const createContextMenu = () => {
-     const template = [
-       // 定义菜单项...
-     ];
-
-     return Menu.buildFromTemplate(template);
-   };
-   ```
-
-2. **在适当的事件处理器中显示菜单**
-
-   ```typescript
-   const menu = createContextMenu();
-   menu.popup();
-   ```
-
-### 3. 托盘菜单配置
-
-托盘菜单在 `TrayMenuCtr.ts` 中配置：
-
-1. **创建托盘图标**
-
-   ```typescript
-   this.tray = new Tray(trayIconPath);
-   ```
-
-2. **定义托盘菜单**
-
-   ```typescript
-   const contextMenu = Menu.buildFromTemplate([
-     { label: '显示主窗口', click: this.showMainWindow },
-     { type: 'separator' },
-     { label: '退出', click: () => app.quit() },
-   ]);
-   ```
-
-3. **设置托盘菜单**
-
-   ```typescript
-   this.tray.setContextMenu(contextMenu);
-   ```
-
-## 多语言支持
-
-为菜单添加多语言支持：
-
-1. **导入本地化工具**
-
-   ```typescript
-   import { i18n } from '../locales';
-   ```
-
-2. **使用翻译函数**
-
-   ```typescript
-   const template = [
-     {
-       label: i18n.t('menu.file'),
-       submenu: [
-         { label: i18n.t('menu.new'), click: createNew },
-         // ...
-       ],
-     },
-     // ...
-   ];
-   ```
-
-3. **在语言切换时更新菜单** 在 `MenuCtr.ts` 中监听语言变化事件并重新创建菜单
-
-## 添加新菜单项流程
-
-1. **确定菜单位置**
-   - 决定添加到哪个菜单（应用菜单、上下文菜单或托盘菜单）
-   - 确定在菜单中的位置（主菜单项或子菜单项）
-
-2. **定义菜单项**
-
-   ```typescript
-   const newMenuItem: MenuItemConstructorOptions = {
-     label: '新功能',
-     accelerator: 'CmdOrCtrl+N',
-     click: (_, window) => {
-       // 处理点击事件
-       if (window) window.webContents.send('trigger-new-feature');
-     },
-   };
-   ```
-
-3. **添加到菜单模板** 将新菜单项添加到相应的菜单模板中
-
-4. **对于与渲染进程交互的功能**
-   - 使用 `window.webContents.send()` 发送 IPC 消息到渲染进程
-   - 在渲染进程中监听该消息并处理
-
-## 菜单项启用/禁用控制
-
-动态控制菜单项状态：
-
-1. **保存对菜单项的引用**
-
-   ```typescript
-   this.menuItems = {};
-   const menu = Menu.buildFromTemplate(template);
-   this.menuItems.newFeature = menu.getMenuItemById('new-feature');
-   ```
-
-2. **根据条件更新状态**
-
-   ```typescript
-   updateMenuState(state) {
-     if (this.menuItems.newFeature) {
-       this.menuItems.newFeature.enabled = state.canUseNewFeature;
-     }
-   }
-   ```
-
-## 最佳实践
-
-1. **使用标准角色**
-   - 尽可能使用 Electron 预定义的角色（如 `role: 'copy'`）以获得本地化和一致的行为
-
-2. **平台特定菜单**
-   - 使用 `process.platform` 检查为不同平台提供不同菜单
-
-   ```typescript
-   if (process.platform === 'darwin') {
-     template.unshift({ role: 'appMenu' });
-   }
-   ```
-
-3. **快捷键冲突**
-   - 避免与系统快捷键冲突
-   - 使用 `CmdOrCtrl` 代替 `Ctrl` 以支持 macOS 和 Windows/Linux
-
-4. **保持菜单简洁**
-   - 避免过多嵌套的子菜单
-   - 将相关功能分组在一起
-
-5. **添加分隔符**
-   - 使用 `{ type: 'separator' }` 在逻辑上分隔不同组的菜单项

package/.cursor/rules/desktop-window-management.mdc

@@ -1,301 +0,0 @@
----
-description:
-globs:
-alwaysApply: false
----
-
-# 桌面端窗口管理指南
-
-## 窗口管理概述
-
-LobeChat 桌面应用使用 Electron 的 `BrowserWindow` 管理应用窗口。主要的窗口管理功能包括：
-
-1. **窗口创建和配置**
-2. **窗口状态管理**（大小、位置、最大化等）
-3. **多窗口协调**
-4. **窗口事件处理**
-
-## 相关文件结构
-
-```plaintext
-apps/desktop/src/main/
-├── appBrowsers.ts               # 窗口管理的核心文件
-├── controllers/
-│   └── BrowserWindowsCtr.ts     # 窗口控制器
-└── modules/
-    └── browserWindowManager.ts  # 窗口管理模块
-```
-
-## 窗口管理流程
-
-### 1. 窗口创建
-
-在 `appBrowsers.ts` 或 `BrowserWindowsCtr.ts` 中定义窗口创建逻辑：
-
-```typescript
-export const createMainWindow = () => {
-  const mainWindow = new BrowserWindow({
-    width: 1200,
-    height: 800,
-    minWidth: 600,
-    minHeight: 400,
-    webPreferences: {
-      preload: path.join(__dirname, '../preload/index.js'),
-      contextIsolation: true,
-      nodeIntegration: false,
-    },
-    // 其他窗口配置项...
-  });
-
-  // 加载应用内容
-  if (isDev) {
-    mainWindow.loadURL('http://localhost:3000');
-    mainWindow.webContents.openDevTools();
-  } else {
-    mainWindow.loadFile(path.join(__dirname, '../../renderer/index.html'));
-  }
-
-  return mainWindow;
-};
-```
-
-### 2. 窗口状态管理
-
-实现窗口状态持久化保存和恢复：
-
-1. **保存窗口状态**
-
-   ```typescript
-   const saveWindowState = (window: BrowserWindow) => {
-     if (!window.isMinimized() && !window.isMaximized()) {
-       const position = window.getPosition();
-       const size = window.getSize();
-
-       settings.set('windowState', {
-         x: position[0],
-         y: position[1],
-         width: size[0],
-         height: size[1],
-       });
-     }
-   };
-   ```
-
-2. **恢复窗口状态**
-
-   ```typescript
-   const restoreWindowState = (window: BrowserWindow) => {
-     const savedState = settings.get('windowState');
-
-     if (savedState) {
-       window.setBounds({
-         x: savedState.x,
-         y: savedState.y,
-         width: savedState.width,
-         height: savedState.height,
-       });
-     }
-   };
-   ```
-
-3. **监听窗口事件**
-
-   ```typescript
-   window.on('close', () => saveWindowState(window));
-   window.on('moved', () => saveWindowState(window));
-   window.on('resized', () => saveWindowState(window));
-   ```
-
-### 3. 实现多窗口管理
-
-对于需要多窗口支持的功能：
-
-1. **跟踪窗口**
-
-   ```typescript
-   export class WindowManager {
-     private windows: Map<string, BrowserWindow> = new Map();
-
-     createWindow(id: string, options: BrowserWindowConstructorOptions) {
-       const window = new BrowserWindow(options);
-       this.windows.set(id, window);
-
-       window.on('closed', () => {
-         this.windows.delete(id);
-       });
-
-       return window;
-     }
-
-     getWindow(id: string) {
-       return this.windows.get(id);
-     }
-
-     getAllWindows() {
-       return Array.from(this.windows.values());
-     }
-   }
-   ```
-
-2. **窗口间通信**
-
-   ```typescript
-   // 从一个窗口向另一个窗口发送消息
-   sendMessageToWindow(targetWindowId, channel, data) {
-     const targetWindow = this.getWindow(targetWindowId);
-     if (targetWindow) {
-       targetWindow.webContents.send(channel, data);
-     }
-   }
-   ```
-
-### 4. 窗口与渲染进程通信
-
-通过 IPC 实现窗口操作：
-
-1. **在主进程中注册 IPC 处理器**
-
-   ```typescript
-   // apps/desktop/src/main/controllers/BrowserWindowsCtr.ts
-   import { BrowserWindow } from 'electron';
-
-   import { ControllerModule, IpcMethod } from '@/controllers';
-
-   export default class BrowserWindowsCtr extends ControllerModule {
-     static override readonly groupName = 'windows';
-
-     @IpcMethod()
-     minimizeWindow() {
-       const focusedWindow = BrowserWindow.getFocusedWindow();
-       focusedWindow?.minimize();
-       return { success: true };
-     }
-
-     @IpcMethod()
-     maximizeWindow() {
-       const focusedWindow = BrowserWindow.getFocusedWindow();
-       if (focusedWindow?.isMaximized()) focusedWindow.restore();
-       else focusedWindow?.maximize();
-       return { success: true };
-     }
-
-     @IpcMethod()
-     closeWindow() {
-       BrowserWindow.getFocusedWindow()?.close();
-       return { success: true };
-     }
-   }
-   ```
-
-   - `@IpcMethod()` 根据控制器的 `groupName` 自动将方法映射为 `windows.minimizeWindow` 形式的通道名称。
-   - 控制器需继承 `ControllerModule`，并在 `controllers/registry.ts` 中通过 `controllerIpcConstructors` 注册，便于类型生成。
-
-2. **在渲染进程中调用**
-
-   ```typescript
-   // src/services/electron/windowService.ts
-   import { ensureElectronIpc } from '@/utils/electron/ipc';
-
-   const ipc = ensureElectronIpc();
-
-   export const windowService = {
-     minimize: () => ipc.windows.minimizeWindow(),
-     maximize: () => ipc.windows.maximizeWindow(),
-     close: () => ipc.windows.closeWindow(),
-   };
-   ```
-
-   - `ensureElectronIpc()` 会基于 `DesktopIpcServices` 运行时生成 Proxy，并通过 `window.electronAPI.invoke` 与主进程通信；不再直接使用 `dispatch`。
-
-### 5. 自定义窗口控制 (无边框窗口)
-
-对于自定义窗口标题栏：
-
-1. **创建无边框窗口**
-
-   ```typescript
-   const window = new BrowserWindow({
-     frame: false,
-     titleBarStyle: 'hidden',
-     // 其他选项...
-   });
-   ```
-
-2. **在渲染进程中实现拖拽区域**
-
-   ```css
-   /* CSS */
-   .titlebar {
-     -webkit-app-region: drag;
-   }
-
-   .titlebar-button {
-     -webkit-app-region: no-drag;
-   }
-   ```
-
-## 最佳实践
-
-1. **性能考虑**
-   - 避免创建过多窗口
-   - 使用 `show: false` 创建窗口，在内容加载完成后再显示，避免白屏
-
-2. **安全性**
-   - 始终设置适当的 `webPreferences` 确保安全
-
-   ```typescript
-   webPreferences: {
-     preload: path.join(__dirname, '../preload/index.js'),
-     contextIsolation: true,
-     nodeIntegration: false,
-     sandbox: true,
-   }
-   ```
-
-3. **跨平台兼容性**
-   - 考虑不同操作系统的窗口行为差异
-   - 使用 `process.platform` 为不同平台提供特定实现
-
-4. **崩溃恢复**
-   - 监听 `webContents.on('crashed')` 事件处理崩溃
-   - 提供崩溃恢复选项
-
-5. **内存管理**
-   - 确保窗口关闭时清理所有相关资源
-   - 使用 `window.on('closed')` 而不是 `window.on('close')` 进行最终清理
-
-## 示例：创建设置窗口
-
-```typescript
-// apps/desktop/src/main/controllers/BrowserWindowsCtr.ts
-import type { OpenSettingsWindowOptions } from '@lobechat/electron-client-ipc';
-
-import { ControllerModule, IpcMethod } from '@/controllers';
-
-export default class BrowserWindowsCtr extends ControllerModule {
-  static override readonly groupName = 'windows';
-
-  @IpcMethod()
-  async openSettingsWindow(options?: string | OpenSettingsWindowOptions) {
-    const normalizedOptions =
-      typeof options === 'string' || options === undefined
-        ? { tab: typeof options === 'string' ? options : undefined }
-        : options;
-
-    const mainWindow = this.app.browserManager.getMainWindow();
-    const query = new URLSearchParams();
-    if (normalizedOptions.tab) query.set('active', normalizedOptions.tab);
-    if (normalizedOptions.searchParams) {
-      for (const [key, value] of Object.entries(normalizedOptions.searchParams)) {
-        if (value) query.set(key, value);
-      }
-    }
-
-    const fullPath = `/settings${query.size ? `?${query.toString()}` : ''}`;
-    await mainWindow.loadUrl(fullPath);
-    mainWindow.show();
-
-    return { success: true };
-  }
-}
-```