@lobehub/chat 1.133.6 → 1.134.0

package/CHANGELOG.md

@@ -2,6 +2,31 @@
 
 # Changelog
 
+## [Version 1.134.0](https://github.com/lobehub/lobe-chat/compare/v1.133.6...v1.134.0)
+
+<sup>Released on **2025-10-04**</sup>
+
+#### ✨ Features
+
+- **misc**: Support double-click to open multi agent window on the desktop.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's improved
+
+- **misc**: Support double-click to open multi agent window on the desktop, closes [#9331](https://github.com/lobehub/lobe-chat/issues/9331) ([a060901](https://github.com/lobehub/lobe-chat/commit/a060901))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.133.6](https://github.com/lobehub/lobe-chat/compare/v1.133.5...v1.133.6)
 
 <sup>Released on **2025-10-04**</sup>

package/apps/desktop/src/main/appBrowsers.ts

@@ -46,4 +46,55 @@ export const appBrowsers = {
   },
 } satisfies Record<string, BrowserWindowOpts>;
 
+// Window templates for multi-instance windows
+export interface WindowTemplate {
+  allowMultipleInstances: boolean;
+  // Include common BrowserWindow options
+  autoHideMenuBar?: boolean;
+  baseIdentifier: string;
+  basePath: string;
+  devTools?: boolean;
+  height?: number;
+  keepAlive?: boolean;
+  minWidth?: number;
+  parentIdentifier?: string;
+  showOnInit?: boolean;
+  title?: string;
+  titleBarStyle?: 'hidden' | 'default' | 'hiddenInset' | 'customButtonsOnHover';
+  vibrancy?:
+    | 'appearance-based'
+    | 'content'
+    | 'fullscreen-ui'
+    | 'header'
+    | 'hud'
+    | 'menu'
+    | 'popover'
+    | 'selection'
+    | 'sheet'
+    | 'sidebar'
+    | 'titlebar'
+    | 'tooltip'
+    | 'under-page'
+    | 'under-window'
+    | 'window';
+  width?: number;
+}
+
+export const windowTemplates = {
+  chatSingle: {
+    allowMultipleInstances: true,
+    autoHideMenuBar: true,
+    baseIdentifier: 'chatSingle',
+    basePath: '/chat',
+    height: 600,
+    keepAlive: false, // Multi-instance windows don't need to stay alive
+    minWidth: 400,
+    parentIdentifier: 'chat',
+    titleBarStyle: 'hidden',
+    vibrancy: 'under-window',
+    width: 900,
+  },
+} satisfies Record<string, WindowTemplate>;
+
 export type AppBrowsersIdentifiers = keyof typeof appBrowsers;
+export type WindowTemplateIdentifiers = keyof typeof windowTemplates;

package/apps/desktop/src/main/controllers/BrowserWindowsCtr.ts

@@ -1,7 +1,7 @@
 import { InterceptRouteParams } from '@lobechat/electron-client-ipc';
 import { extractSubPath, findMatchingRoute } from '~common/routes';
 
-import { AppBrowsersIdentifiers, BrowsersIdentifiers } from '@/appBrowsers';
+import { AppBrowsersIdentifiers, BrowsersIdentifiers, WindowTemplateIdentifiers } from '@/appBrowsers';
 import { IpcClientEventSender } from '@/types/ipcClientEvent';
 
 import { ControllerModule, ipcClientEvent, shortcut } from './index';
@@ -100,6 +100,77 @@ export default class BrowserWindowsCtr extends ControllerModule {
     }
   }
 
+  /**
+   * Create a new multi-instance window
+   */
+  @ipcClientEvent('createMultiInstanceWindow')
+  async createMultiInstanceWindow(params: {
+    templateId: WindowTemplateIdentifiers;
+    path: string;
+    uniqueId?: string;
+  }) {
+    try {
+      console.log('[BrowserWindowsCtr] Creating multi-instance window:', params);
+
+      const result = this.app.browserManager.createMultiInstanceWindow(
+        params.templateId,
+        params.path,
+        params.uniqueId,
+      );
+
+      // Show the window
+      result.browser.show();
+
+      return {
+        success: true,
+        windowId: result.identifier,
+      };
+    } catch (error) {
+      console.error('[BrowserWindowsCtr] Failed to create multi-instance window:', error);
+      return {
+        error: error.message,
+        success: false,
+      };
+    }
+  }
+
+  /**
+   * Get all windows by template
+   */
+  @ipcClientEvent('getWindowsByTemplate')
+  async getWindowsByTemplate(templateId: string) {
+    try {
+      const windowIds = this.app.browserManager.getWindowsByTemplate(templateId);
+      return {
+        success: true,
+        windowIds,
+      };
+    } catch (error) {
+      console.error('[BrowserWindowsCtr] Failed to get windows by template:', error);
+      return {
+        error: error.message,
+        success: false,
+      };
+    }
+  }
+
+  /**
+   * Close all windows by template
+   */
+  @ipcClientEvent('closeWindowsByTemplate')
+  async closeWindowsByTemplate(templateId: string) {
+    try {
+      this.app.browserManager.closeWindowsByTemplate(templateId);
+      return { success: true };
+    } catch (error) {
+      console.error('[BrowserWindowsCtr] Failed to close windows by template:', error);
+      return {
+        error: error.message,
+        success: false,
+      };
+    }
+  }
+
   /**
    * Open target window and navigate to specified sub-path
    */

package/apps/desktop/src/main/core/browser/BrowserManager.ts

@@ -3,7 +3,7 @@ import { WebContents } from 'electron';
 
 import { createLogger } from '@/utils/logger';
 
-import { AppBrowsersIdentifiers, appBrowsers } from '../../appBrowsers';
+import { AppBrowsersIdentifiers, appBrowsers, WindowTemplate, WindowTemplateIdentifiers, windowTemplates } from '../../appBrowsers';
 import type { App } from '../App';
 import type { BrowserWindowOpts } from './Browser';
 import Browser from './Browser';
@@ -14,9 +14,9 @@ const logger = createLogger('core:BrowserManager');
 export class BrowserManager {
   app: App;
 
-  browsers: Map<AppBrowsersIdentifiers, Browser> = new Map();
+  browsers: Map<string, Browser> = new Map();
 
-  private webContentsMap = new Map<WebContents, AppBrowsersIdentifiers>();
+  private webContentsMap = new Map<WebContents, string>();
 
   constructor(app: App) {
     logger.debug('Initializing BrowserManager');
@@ -51,12 +51,12 @@ export class BrowserManager {
   };
 
   broadcastToWindow = <T extends MainBroadcastEventKey>(
-    identifier: AppBrowsersIdentifiers,
+    identifier: string,
     event: T,
     data: MainBroadcastParams<T>,
   ) => {
     logger.debug(`Broadcasting event ${event} to window: ${identifier}`);
-    this.browsers.get(identifier).broadcast(event, data);
+    this.browsers.get(identifier)?.broadcast(event, data);
   };
 
   /**
@@ -87,13 +87,21 @@ export class BrowserManager {
    * @param identifier Window identifier
    * @param subPath Sub-path, such as 'agent', 'about', etc.
    */
-  async redirectToPage(identifier: AppBrowsersIdentifiers, subPath?: string) {
+  async redirectToPage(identifier: string, subPath?: string) {
     try {
       // Ensure window is retrieved or created
       const browser = this.retrieveByIdentifier(identifier);
       browser.hide();
 
-      const baseRoute = appBrowsers[identifier].path;
+      // Handle both static and dynamic windows
+      let baseRoute: string;
+      if (identifier in appBrowsers) {
+        baseRoute = appBrowsers[identifier as AppBrowsersIdentifiers].path;
+      } else {
+        // For dynamic windows, extract base route from the browser options
+        const browserOptions = browser.options;
+        baseRoute = browserOptions.path;
+      }
 
       // Build complete URL path
       const fullPath = subPath ? `${baseRoute}/${subPath}` : baseRoute;
@@ -114,13 +122,75 @@ export class BrowserManager {
   /**
    * get Browser by identifier
    */
-  retrieveByIdentifier(identifier: AppBrowsersIdentifiers) {
+  retrieveByIdentifier(identifier: string) {
     const browser = this.browsers.get(identifier);
 
     if (browser) return browser;
 
-    logger.debug(`Browser ${identifier} not found, initializing new instance`);
-    return this.retrieveOrInitialize(appBrowsers[identifier]);
+    // Check if it's a static browser
+    if (identifier in appBrowsers) {
+      logger.debug(`Browser ${identifier} not found, initializing new instance`);
+      return this.retrieveOrInitialize(appBrowsers[identifier as AppBrowsersIdentifiers]);
+    }
+
+    throw new Error(`Browser ${identifier} not found and is not a static browser`);
+  }
+
+  /**
+   * Create a multi-instance window from template
+   * @param templateId Template identifier
+   * @param path Full path with query parameters
+   * @param uniqueId Optional unique identifier, will be generated if not provided
+   * @returns The window identifier and Browser instance
+   */
+  createMultiInstanceWindow(templateId: WindowTemplateIdentifiers, path: string, uniqueId?: string) {
+    const template = windowTemplates[templateId];
+    if (!template) {
+      throw new Error(`Window template ${templateId} not found`);
+    }
+
+    // Generate unique identifier
+    const windowId = uniqueId || `${template.baseIdentifier}_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+
+    // Create browser options from template
+    const browserOpts: BrowserWindowOpts = {
+      ...template,
+      identifier: windowId,
+      path: path,
+    };
+
+    logger.debug(`Creating multi-instance window: ${windowId} with path: ${path}`);
+
+    const browser = this.retrieveOrInitialize(browserOpts);
+
+    return {
+      identifier: windowId,
+      browser: browser,
+    };
+  }
+
+  /**
+   * Get all windows based on template
+   * @param templateId Template identifier
+   * @returns Array of window identifiers matching the template
+   */
+  getWindowsByTemplate(templateId: string): string[] {
+    const prefix = `${templateId}_`;
+    return Array.from(this.browsers.keys()).filter(id => id.startsWith(prefix));
+  }
+
+  /**
+   * Close all windows based on template
+   * @param templateId Template identifier
+   */
+  closeWindowsByTemplate(templateId: string): void {
+    const windowIds = this.getWindowsByTemplate(templateId);
+    windowIds.forEach(id => {
+      const browser = this.browsers.get(id);
+      if (browser) {
+        browser.close();
+      }
+    });
   }
 
   /**
@@ -144,7 +214,7 @@ export class BrowserManager {
    * @param options Browser window options
    */
   private retrieveOrInitialize(options: BrowserWindowOpts) {
-    let browser = this.browsers.get(options.identifier as AppBrowsersIdentifiers);
+    let browser = this.browsers.get(options.identifier);
     if (browser) {
       logger.debug(`Retrieved existing browser: ${options.identifier}`);
       return browser;
@@ -153,7 +223,7 @@ export class BrowserManager {
     logger.debug(`Creating new browser: ${options.identifier}`);
     browser = new Browser(options, this.app);
 
-    const identifier = options.identifier as AppBrowsersIdentifiers;
+    const identifier = options.identifier;
     this.browsers.set(identifier, browser);
 
     // 记录 WebContents 和 identifier 的映射
@@ -166,32 +236,32 @@ export class BrowserManager {
 
     browser.browserWindow.on('show', () => {
       if (browser.webContents)
-        this.webContentsMap.set(browser.webContents, browser.identifier as AppBrowsersIdentifiers);
+        this.webContentsMap.set(browser.webContents, browser.identifier);
     });
 
     return browser;
   }
 
   closeWindow(identifier: string) {
-    const browser = this.browsers.get(identifier as AppBrowsersIdentifiers);
+    const browser = this.browsers.get(identifier);
     browser?.close();
   }
 
   minimizeWindow(identifier: string) {
-    const browser = this.browsers.get(identifier as AppBrowsersIdentifiers);
+    const browser = this.browsers.get(identifier);
     browser?.browserWindow.minimize();
   }
 
   maximizeWindow(identifier: string) {
-    const browser = this.browsers.get(identifier as AppBrowsersIdentifiers);
-    if (browser.browserWindow.isMaximized()) {
+    const browser = this.browsers.get(identifier);
+    if (browser?.browserWindow.isMaximized()) {
       browser?.browserWindow.unmaximize();
     } else {
       browser?.browserWindow.maximize();
     }
   }
 
-  getIdentifierByWebContents(webContents: WebContents): AppBrowsersIdentifiers | null {
+  getIdentifierByWebContents(webContents: WebContents): string | null {
     return this.webContentsMap.get(webContents) || null;
   }
 

package/changelog/v1.json

@@ -1,4 +1,13 @@
 [
+  {
+    "children": {
+      "features": [
+        "Support double-click to open multi agent window on the desktop."
+      ]
+    },
+    "date": "2025-10-04",
+    "version": "1.134.0"
+  },
   {
     "children": {
       "fixes": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.133.6",
+  "version": "1.134.0",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",

package/packages/electron-client-ipc/src/events/windows.ts

@@ -1,5 +1,23 @@
 import { InterceptRouteParams, InterceptRouteResponse } from '../types/route';
 
+export interface CreateMultiInstanceWindowParams {
+  templateId: string;
+  path: string;
+  uniqueId?: string;
+}
+
+export interface CreateMultiInstanceWindowResponse {
+  success: boolean;
+  windowId?: string;
+  error?: string;
+}
+
+export interface GetWindowsByTemplateResponse {
+  success: boolean;
+  windowIds?: string[];
+  error?: string;
+}
+
 export interface WindowsDispatchEvents {
   /**
    * 拦截客户端路由导航请求
@@ -14,4 +32,25 @@ export interface WindowsDispatchEvents {
   openDevtools: () => void;
 
   openSettingsWindow: (tab?: string) => void;
+
+  /**
+   * Create a new multi-instance window
+   * @param params Window creation parameters
+   * @returns Creation result
+   */
+  createMultiInstanceWindow: (params: CreateMultiInstanceWindowParams) => CreateMultiInstanceWindowResponse;
+
+  /**
+   * Get all windows by template
+   * @param templateId Template identifier
+   * @returns List of window identifiers
+   */
+  getWindowsByTemplate: (templateId: string) => GetWindowsByTemplateResponse;
+
+  /**
+   * Close all windows by template
+   * @param templateId Template identifier
+   * @returns Operation result
+   */
+  closeWindowsByTemplate: (templateId: string) => { success: boolean; error?: string };
 }

package/src/app/[variants]/(main)/_layout/Desktop/DesktopLayoutContainer.tsx

@@ -1,6 +1,6 @@
 import { useTheme } from 'antd-style';
 import { usePathname } from 'next/navigation';
-import { PropsWithChildren, memo } from 'react';
+import { PropsWithChildren, Suspense, memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
 import SideBar from './SideBar';
@@ -11,7 +11,9 @@ const DesktopLayoutContainer = memo<PropsWithChildren>(({ children }) => {
   const hideSideBar = pathname.startsWith('/settings');
   return (
     <>
-      {!hideSideBar && <SideBar />}
+      <Suspense>
+        {!hideSideBar && <SideBar />}
+      </Suspense>
       <Flexbox
         style={{
           background: theme.colorBgLayout,

package/src/app/[variants]/(main)/_layout/Desktop/SideBar/index.tsx

@@ -6,6 +6,7 @@ import { Suspense, memo } from 'react';
 
 import { isDesktop } from '@/const/version';
 import { useActiveTabKey } from '@/hooks/useActiveTabKey';
+import { useIsSingleMode } from '@/hooks/useIsSingleMode';
 import { usePinnedAgentState } from '@/hooks/usePinnedAgentState';
 import { useGlobalStore } from '@/store/global';
 import { systemStatusSelectors } from '@/store/global/selectors';
@@ -26,11 +27,12 @@ const Top = () => {
 
 const Nav = memo(() => {
   const theme = useTheme();
+  const isSingleMode = useIsSingleMode()
   const inZenMode = useGlobalStore(systemStatusSelectors.inZenMode);
   const { showPinList } = useServerConfigStore(featureFlagsSelectors);
 
   return (
-    !inZenMode && (
+    !inZenMode && !isSingleMode && (
       <SideNav
         avatar={
           <div className={electronStylish.nodrag}>

package/src/app/[variants]/(main)/_layout/Desktop/index.tsx

@@ -48,7 +48,9 @@ const Layout = memo<PropsWithChildren>(({ children }) => {
           <DesktopLayoutContainer>{children}</DesktopLayoutContainer>
         ) : (
           <>
-            <SideBar />
+            <Suspense>
+              <SideBar />
+            </Suspense>
             {children}
           </>
         )}

package/src/app/[variants]/(main)/chat/(workspace)/@topic/features/TopicListContent/TopicItem/TopicContent.tsx

@@ -2,6 +2,7 @@ import { ActionIcon, Dropdown, EditableText, Icon, type MenuProps, Text } from '
 import { App } from 'antd';
 import { createStyles } from 'antd-style';
 import {
+  ExternalLink,
   LucideCopy,
   LucideLoader2,
   MoreVertical,
@@ -16,8 +17,10 @@ import { Flexbox } from 'react-layout-kit';
 
 import BubblesLoading from '@/components/BubblesLoading';
 import { LOADING_FLAT } from '@/const/message';
+import { isDesktop } from '@/const/version';
 import { useIsMobile } from '@/hooks/useIsMobile';
 import { useChatStore } from '@/store/chat';
+import { useGlobalStore } from '@/store/global';
 
 const useStyles = createStyles(({ css }) => ({
   content: css`
@@ -45,6 +48,8 @@ const TopicContent = memo<TopicContentProps>(({ id, title, fav, showMore }) => {
 
   const mobile = useIsMobile();
 
+  const openTopicInNewWindow = useGlobalStore((s) => s.openTopicInNewWindow);
+
   const [
     editing,
     favoriteTopic,
@@ -53,6 +58,7 @@ const TopicContent = memo<TopicContentProps>(({ id, title, fav, showMore }) => {
     autoRenameTopicTitle,
     duplicateTopic,
     isLoading,
+    activeId,
   ] = useChatStore((s) => [
     s.topicRenamingId === id,
     s.favoriteTopic,
@@ -61,6 +67,7 @@ const TopicContent = memo<TopicContentProps>(({ id, title, fav, showMore }) => {
     s.autoRenameTopicTitle,
     s.duplicateTopic,
     s.topicLoadingIds.includes(id),
+    s.activeId,
   ]);
   const { styles, theme } = useStyles();
 
@@ -88,6 +95,18 @@ const TopicContent = memo<TopicContentProps>(({ id, title, fav, showMore }) => {
           toggleEditing(true);
         },
       },
+      ...(isDesktop
+        ? [
+          {
+            icon: <Icon icon={ExternalLink} />,
+            key: 'openInNewWindow',
+            label: '单独打开页面',
+            onClick: () => {
+              openTopicInNewWindow(activeId, id);
+            },
+          },
+        ]
+        : []),
       {
         type: 'divider',
       },
@@ -134,7 +153,7 @@ const TopicContent = memo<TopicContentProps>(({ id, title, fav, showMore }) => {
         },
       },
     ],
-    [],
+    [id, activeId, autoRenameTopicTitle, duplicateTopic, removeTopic, t, toggleEditing, openTopicInNewWindow],
   );
 
   return (
@@ -169,6 +188,11 @@ const TopicContent = memo<TopicContentProps>(({ id, title, fav, showMore }) => {
           <Text
             className={styles.title}
             ellipsis={{ rows: 1, tooltip: { placement: 'left', title } }}
+            onDoubleClick={() => {
+              if (isDesktop) {
+                openTopicInNewWindow(activeId, id)
+              }
+            }}
             style={{ margin: 0 }}
           >
             {title}

package/src/app/[variants]/(main)/chat/@session/features/SessionListContent/List/Item/Actions.tsx

@@ -5,6 +5,7 @@ import { ItemType } from 'antd/es/menu/interface';
 import isEqual from 'fast-deep-equal';
 import {
   Check,
+  ExternalLink,
   HardDriveDownload,
   ListTree,
   LucideCopy,
@@ -17,8 +18,9 @@ import {
 import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { isServerMode } from '@/const/version';
+import { isDesktop, isServerMode } from '@/const/version';
 import { configService } from '@/services/config';
+import { useGlobalStore } from '@/store/global';
 import { useSessionStore } from '@/store/session';
 import { sessionHelpers } from '@/store/session/helpers';
 import { sessionGroupSelectors, sessionSelectors } from '@/store/session/selectors';
@@ -41,6 +43,8 @@ const Actions = memo<ActionProps>(({ group, id, openCreateGroupModal, setOpen })
   const { styles } = useStyles();
   const { t } = useTranslation('chat');
 
+  const openSessionInNewWindow = useGlobalStore((s) => s.openSessionInNewWindow);
+
   const sessionCustomGroups = useSessionStore(sessionGroupSelectors.sessionGroupItems, isEqual);
   const [pin, removeSession, pinSession, duplicateSession, updateSessionGroup] = useSessionStore(
     (s) => {
@@ -82,6 +86,19 @@ const Actions = memo<ActionProps>(({ group, id, openCreateGroupModal, setOpen })
               duplicateSession(id);
             },
           },
+          ...(isDesktop
+            ? [
+                {
+                  icon: <Icon icon={ExternalLink} />,
+                  key: 'openInNewWindow',
+                  label: '单独打开页面',
+                  onClick: ({ domEvent }: { domEvent: Event }) => {
+                    domEvent.stopPropagation();
+                    openSessionInNewWindow(id);
+                  },
+                },
+              ]
+            : []),
           {
             type: 'divider',
           },
@@ -167,7 +184,7 @@ const Actions = memo<ActionProps>(({ group, id, openCreateGroupModal, setOpen })
           },
         ] as ItemType[]
       ).filter(Boolean),
-    [id, pin],
+    [id, pin, openSessionInNewWindow],
   );
 
   return (