@lobehub/chat 1.133.5 → 1.134.0

package/packages/model-runtime/src/providers/google/createImage.ts

@@ -1,4 +1,4 @@
-import { Content, GoogleGenAI, Part } from '@google/genai';
+import { Content, GenerateContentConfig, GoogleGenAI, Part } from '@google/genai';
 
 import { convertGoogleAIUsage } from '../../core/usageConverters/google-ai';
 import { CreateImagePayload, CreateImageResponse } from '../../types/image';
@@ -141,10 +141,19 @@ async function generateImageByChatModel(
     },
   ];
 
+  const config: GenerateContentConfig = {
+    responseModalities: ['Image'],
+    ...(params.aspectRatio
+      ? {
+          imageConfig: {
+            aspectRatio: params.aspectRatio,
+          },
+        }
+      : {}),
+  };
+
   const response = await client.models.generateContent({
-    config: {
-      responseModalities: ['Image'],
-    },
+    config,
     contents,
     model: actualModel,
   });

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 (

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

@@ -1,12 +1,14 @@
 import { ModelTag } from '@lobehub/icons';
-import { memo, useMemo, useState } from 'react';
+import React, { memo, useMemo, useState } from 'react';
 import { Flexbox } from 'react-layout-kit';
 import { shallow } from 'zustand/shallow';
 
+import { isDesktop } from '@/const/version';
 import { useAgentStore } from '@/store/agent';
 import { agentSelectors } from '@/store/agent/selectors';
 import { useChatStore } from '@/store/chat';
 import { chatSelectors } from '@/store/chat/selectors';
+import { useGlobalStore } from '@/store/global';
 import { useSessionStore } from '@/store/session';
 import { sessionHelpers } from '@/store/session/helpers';
 import { sessionMetaSelectors, sessionSelectors } from '@/store/session/selectors';
@@ -24,6 +26,8 @@ const SessionItem = memo<SessionItemProps>(({ id }) => {
   const [createGroupModalOpen, setCreateGroupModalOpen] = useState(false);
   const [defaultModel] = useAgentStore((s) => [agentSelectors.inboxAgentModel(s)]);
 
+  const openSessionInNewWindow = useGlobalStore((s) => s.openSessionInNewWindow);
+
   const [active] = useSessionStore((s) => [s.activeId === id]);
   const [loading] = useChatStore((s) => [chatSelectors.isAIGenerating(s) && id === s.activeId]);
 
@@ -46,6 +50,24 @@ const SessionItem = memo<SessionItemProps>(({ id }) => {
 
   const showModel = model !== defaultModel;
 
+  const handleDoubleClick = () => {
+    if (isDesktop) {
+      openSessionInNewWindow(id);
+    }
+  };
+
+  const handleDragStart = (e: React.DragEvent) => {
+    // Set drag data to identify the session being dragged
+    e.dataTransfer.setData('text/plain', id);
+  };
+
+  const handleDragEnd = (e: React.DragEvent) => {
+    // If drag ends without being dropped in a valid target, open in new window
+    if (isDesktop && e.dataTransfer.dropEffect === 'none') {
+      openSessionInNewWindow(id);
+    }
+  };
+
   const actions = useMemo(
     () => (
       <Actions
@@ -78,8 +100,12 @@ const SessionItem = memo<SessionItemProps>(({ id }) => {
         avatarBackground={avatarBackground}
         date={updateAt?.valueOf()}
         description={description}
+        draggable={isDesktop}
         key={id}
         loading={loading}
+        onDoubleClick={handleDoubleClick}
+        onDragEnd={handleDragEnd}
+        onDragStart={handleDragStart}
         pin={pin}
         showAction={open}
         styles={{

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

@@ -7,6 +7,7 @@ import { PropsWithChildren, memo, useEffect, useMemo, useState } from 'react';
 
 import { withSuspense } from '@/components/withSuspense';
 import { FOLDER_WIDTH } from '@/const/layoutTokens';
+import { useIsSingleMode } from '@/hooks/useIsSingleMode';
 import { usePinnedAgentState } from '@/hooks/usePinnedAgentState';
 import { useGlobalStore } from '@/store/global';
 import { systemStatusSelectors } from '@/store/global/selectors';
@@ -33,11 +34,14 @@ export const useStyles = createStyles(({ css, token }) => ({
 }));
 
 const SessionPanel = memo<PropsWithChildren>(({ children }) => {
+  const isSingleMode = useIsSingleMode();
+
   const { md = true } = useResponsive();
 
   const [isPinned] = usePinnedAgentState();
 
   const { styles } = useStyles();
+
   const [sessionsWidth, sessionExpandable, updatePreference] = useGlobalStore((s) => [
     systemStatusSelectors.sessionWidth(s),
     systemStatusSelectors.showSessionPanel(s),
@@ -72,6 +76,12 @@ const SessionPanel = memo<PropsWithChildren>(({ children }) => {
   const { appearance } = useThemeMode();
 
   const SessionPanel = useMemo(() => {
+    if (isSingleMode) {
+      // 在单一模式下，仍然渲染 children 以确保 SessionHydration 等逻辑组件正常工作
+      // 但使用隐藏样式而不是 return null
+      return <div style={{ display: 'none' }}>{children}</div>;
+    }
+
     return (
       <DraggablePanel
         className={styles.panel}
@@ -92,7 +102,7 @@ const SessionPanel = memo<PropsWithChildren>(({ children }) => {
         </DraggablePanelContainer>
       </DraggablePanel>
     );
-  }, [sessionsWidth, md, isPinned, sessionExpandable, tmpWidth, appearance]);
+  }, [sessionsWidth, md, isPinned, sessionExpandable, tmpWidth, appearance, isSingleMode]);
 
   return SessionPanel;
 });

package/src/app/[variants]/(main)/chat/features/TogglePanelButton.tsx

@@ -6,6 +6,7 @@ import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { DESKTOP_HEADER_ICON_SIZE } from '@/const/layoutTokens';
+import { useIsSingleMode } from '@/hooks/useIsSingleMode';
 import { useGlobalStore } from '@/store/global';
 import { systemStatusSelectors } from '@/store/global/selectors';
 import { useUserStore } from '@/store/user';
@@ -15,6 +16,7 @@ import { HotkeyEnum } from '@/types/hotkey';
 export const TOOGLE_PANEL_BUTTON_ID = 'toggle-panel-button';
 
 const TogglePanelButton = memo(() => {
+  const isSingleMode = useIsSingleMode();
   const hotkey = useUserStore(settingsSelectors.getHotkeyById(HotkeyEnum.ToggleLeftPanel));
 
   const { t } = useTranslation(['chat', 'hotkey']);
@@ -22,6 +24,10 @@ const TogglePanelButton = memo(() => {
   const showSessionPanel = useGlobalStore(systemStatusSelectors.showSessionPanel);
   const updateSystemStatus = useGlobalStore((s) => s.updateSystemStatus);
 
+  if (isSingleMode) {
+    return null
+  }
+
   return (
     <Tooltip hotkey={hotkey} title={t('toggleLeftPanel.title', { ns: 'hotkey' })}>
       <ActionIcon

package/src/app/[variants]/(main)/settings/provider/features/ModelList/ModelItem.tsx

@@ -10,7 +10,6 @@ import { Flexbox } from 'react-layout-kit';
 import { ModelInfoTags } from '@/components/ModelSelect';
 import { useIsMobile } from '@/hooks/useIsMobile';
 import { aiModelSelectors, useAiInfraStore } from '@/store/aiInfra';
-import { AiModelSourceEnum, AiProviderModelListItem } from '../../../../../../../../packages/model-bank/src/types/aiModel';
 import { formatPriceByCurrency } from '@/utils/format';
 import {
   getAudioInputUnitRate,
@@ -18,6 +17,10 @@ import {
   getTextOutputUnitRate,
 } from '@/utils/pricing';
 
+import {
+  AiModelSourceEnum,
+  AiProviderModelListItem,
+} from '../../../../../../../../packages/model-bank/src/types/aiModel';
 import ModelConfigModal from './ModelConfigModal';
 import { ProviderSettingsContext } from './ProviderSettingsContext';
 
@@ -243,7 +246,7 @@ const ModelItem = memo<ModelItemProps>(
             loading={isModelLoading}
             onChange={async (e) => {
               setChecked(e);
-              await toggleModelEnabled({ enabled: e, id, source });
+              await toggleModelEnabled({ enabled: e, id, source, type });
             }}
             size={'small'}
           />
@@ -334,7 +337,7 @@ const ModelItem = memo<ModelItemProps>(
             loading={isModelLoading}
             onChange={async (e) => {
               setChecked(e);
-              await toggleModelEnabled({ enabled: e, id, source });
+              await toggleModelEnabled({ enabled: e, id, source, type });
             }}
             size={'small'}
           />

package/src/config/featureFlags/index.ts

@@ -22,10 +22,10 @@ export const getServerFeatureFlagsValue = () => {
   return merge(DEFAULT_FEATURE_FLAGS, flags);
 };
 
-export const serverFeatureFlags = () => {
+export const serverFeatureFlags = (userId?: string) => {
   const serverConfig = getServerFeatureFlagsValue();
 
-  return mapFeatureFlagsEnvToState(serverConfig);
+  return mapFeatureFlagsEnvToState(serverConfig, userId);
 };
 
 export * from './schema';

package/src/config/featureFlags/schema.test.ts

@@ -1,11 +1,10 @@
 import { describe, expect, it } from 'vitest';
 
-import { FeatureFlagsSchema, mapFeatureFlagsEnvToState } from './schema';
+import { FeatureFlagsSchema, evaluateFeatureFlag, mapFeatureFlagsEnvToState } from './schema';
 
 describe('FeatureFlagsSchema', () => {
-  it('should validate correct feature flags', () => {
+  it('should validate correct feature flags with boolean values', () => {
     const result = FeatureFlagsSchema.safeParse({
-      webrtc_sync: true,
       language_model_settings: false,
       openai_api_key: true,
       openai_proxy_url: false,
@@ -18,20 +17,89 @@ describe('FeatureFlagsSchema', () => {
     expect(result.success).toBe(true);
   });
 
-  it('should reject invalid feature flags', () => {
+  it('should validate correct feature flags with user ID arrays', () => {
     const result = FeatureFlagsSchema.safeParse({
-      edit_agent: 'yes', // Invalid type, should be boolean
+      edit_agent: ['user-123', 'user-456'],
+      create_session: ['user-789'],
+      dalle: true,
+      ai_image: false,
+    });
+
+    expect(result.success).toBe(true);
+  });
+
+  it('should validate mixed boolean and array values', () => {
+    const result = FeatureFlagsSchema.safeParse({
+      edit_agent: ['user-123'],
+      create_session: true,
+      dalle: false,
+      knowledge_base: ['user-456', 'user-789'],
+    });
+
+    expect(result.success).toBe(true);
+  });
+
+  it('should reject invalid feature flags with wrong types', () => {
+    const result = FeatureFlagsSchema.safeParse({
+      edit_agent: 'yes', // Invalid type, should be boolean or array
+    });
+
+    expect(result.success).toBe(false);
+  });
+
+  it('should reject invalid feature flags with non-string array elements', () => {
+    const result = FeatureFlagsSchema.safeParse({
+      edit_agent: [123, 456], // Invalid, array should contain strings
     });
 
     expect(result.success).toBe(false);
   });
 });
 
+describe('evaluateFeatureFlag', () => {
+  it('should return true for boolean true value', () => {
+    expect(evaluateFeatureFlag(true)).toBe(true);
+    expect(evaluateFeatureFlag(true, 'user-123')).toBe(true);
+  });
+
+  it('should return false for boolean false value', () => {
+    expect(evaluateFeatureFlag(false)).toBe(false);
+    expect(evaluateFeatureFlag(false, 'user-123')).toBe(false);
+  });
+
+  it('should return undefined for undefined value', () => {
+    expect(evaluateFeatureFlag(undefined)).toBe(undefined);
+    expect(evaluateFeatureFlag(undefined, 'user-123')).toBe(undefined);
+  });
+
+  it('should return true if user ID is in the allowlist', () => {
+    const allowlist = ['user-123', 'user-456'];
+    expect(evaluateFeatureFlag(allowlist, 'user-123')).toBe(true);
+    expect(evaluateFeatureFlag(allowlist, 'user-456')).toBe(true);
+  });
+
+  it('should return false if user ID is not in the allowlist', () => {
+    const allowlist = ['user-123', 'user-456'];
+    expect(evaluateFeatureFlag(allowlist, 'user-789')).toBe(false);
+  });
+
+  it('should return false if no user ID provided with array value', () => {
+    const allowlist = ['user-123', 'user-456'];
+    expect(evaluateFeatureFlag(allowlist)).toBe(false);
+    expect(evaluateFeatureFlag(allowlist, undefined)).toBe(false);
+  });
+
+  it('should handle empty array', () => {
+    expect(evaluateFeatureFlag([], 'user-123')).toBe(false);
+    expect(evaluateFeatureFlag([])).toBe(false);
+  });
+});
+
 describe('mapFeatureFlagsEnvToState', () => {
-  it('should correctly map feature flags to state', () => {
+  it('should correctly map boolean feature flags to state', () => {
     const config = {
-      webrtc_sync: true,
       language_model_settings: false,
+      provider_settings: true,
       openai_api_key: true,
       openai_proxy_url: false,
       create_session: true,
@@ -40,22 +108,110 @@ describe('mapFeatureFlagsEnvToState', () => {
       ai_image: true,
       check_updates: true,
       welcome_suggest: true,
+      plugins: true,
+      knowledge_base: false,
+      rag_eval: true,
+      clerk_sign_up: false,
+      market: true,
+      speech_to_text: true,
+      changelog: false,
+      pin_list: true,
+      api_key_manage: false,
+      cloud_promotion: true,
+      commercial_hide_github: false,
+      commercial_hide_docs: true,
     };
 
-    const expectedState = {
+    const mappedState = mapFeatureFlagsEnvToState(config);
+
+    expect(mappedState).toMatchObject({
       isAgentEditable: false,
       showCreateSession: true,
       showLLM: false,
+      showProvider: true,
       showOpenAIApiKey: true,
       showOpenAIProxyUrl: false,
       showDalle: true,
       showAiImage: true,
       enableCheckUpdates: true,
       showWelcomeSuggest: true,
+      enablePlugins: true,
+      enableKnowledgeBase: false,
+      enableRAGEval: true,
+      enableClerkSignUp: false,
+      showMarket: true,
+      enableSTT: true,
+      showChangelog: false,
+      showPinList: true,
+      showApiKeyManage: false,
+      showCloudPromotion: true,
+      hideGitHub: false,
+      hideDocs: true,
+    });
+  });
+
+  it('should correctly evaluate user-specific flags with allowlist', () => {
+    const userId = 'user-123';
+    const config = {
+      edit_agent: ['user-123', 'user-456'],
+      create_session: ['user-789'],
+      dalle: true,
+      knowledge_base: ['user-123'],
+    };
+
+    const mappedState = mapFeatureFlagsEnvToState(config, userId);
+
+    expect(mappedState.isAgentEditable).toBe(true); // user-123 is in allowlist
+    expect(mappedState.showCreateSession).toBe(false); // user-123 is not in allowlist
+    expect(mappedState.showDalle).toBe(true); // boolean true
+    expect(mappedState.enableKnowledgeBase).toBe(true); // user-123 is in allowlist
+  });
+
+  it('should return false for array flags when user ID is not in allowlist', () => {
+    const userId = 'user-999';
+    const config = {
+      edit_agent: ['user-123', 'user-456'],
+      create_session: ['user-789'],
+      dalle: true,
+    };
+
+    const mappedState = mapFeatureFlagsEnvToState(config, userId);
+
+    expect(mappedState.isAgentEditable).toBe(false);
+    expect(mappedState.showCreateSession).toBe(false);
+    expect(mappedState.showDalle).toBe(true);
+  });
+
+  it('should return false for array flags when no user ID provided', () => {
+    const config = {
+      edit_agent: ['user-123', 'user-456'],
+      create_session: true,
     };
 
     const mappedState = mapFeatureFlagsEnvToState(config);
 
-    expect(mappedState).toEqual(expectedState);
+    expect(mappedState.isAgentEditable).toBe(false);
+    expect(mappedState.showCreateSession).toBe(true);
+  });
+
+  it('should handle mixed boolean and array values correctly', () => {
+    const userId = 'user-123';
+    const config = {
+      edit_agent: ['user-123'],
+      create_session: true,
+      dalle: false,
+      ai_image: ['user-456'],
+      knowledge_base: ['user-123', 'user-789'],
+      rag_eval: true,
+    };
+
+    const mappedState = mapFeatureFlagsEnvToState(config, userId);
+
+    expect(mappedState.isAgentEditable).toBe(true);
+    expect(mappedState.showCreateSession).toBe(true);
+    expect(mappedState.showDalle).toBe(false);
+    expect(mappedState.showAiImage).toBe(false);
+    expect(mappedState.enableKnowledgeBase).toBe(true);
+    expect(mappedState.enableRAGEval).toBe(true);
   });
 });