@lobehub/lobehub 2.0.0-next.345 → 2.0.0-next.347

package/CHANGELOG.md

@@ -2,6 +2,64 @@
 
 # Changelog
 
+## [Version 2.0.0-next.347](https://github.com/lobehub/lobe-chat/compare/v2.0.0-next.346...v2.0.0-next.347)
+
+<sup>Released on **2026-01-23**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Add advace config back in agent/group profiles.
+
+#### 💄 Styles
+
+- **misc**: Move plugin store button outside scroll container.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Add advace config back in agent/group profiles, closes [#11727](https://github.com/lobehub/lobe-chat/issues/11727) ([403175f](https://github.com/lobehub/lobe-chat/commit/403175f))
+
+#### Styles
+
+- **misc**: Move plugin store button outside scroll container, closes [#11728](https://github.com/lobehub/lobe-chat/issues/11728) ([c484d1a](https://github.com/lobehub/lobe-chat/commit/c484d1a))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
+## [Version 2.0.0-next.346](https://github.com/lobehub/lobe-chat/compare/v2.0.0-next.345...v2.0.0-next.346)
+
+<sup>Released on **2026-01-23**</sup>
+
+#### 🐛 Bug Fixes
+
+- **pdf**: Upgrade pdfjs-dist and react-pdf to v5.x.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **pdf**: Upgrade pdfjs-dist and react-pdf to v5.x, closes [#11686](https://github.com/lobehub/lobe-chat/issues/11686) ([2b620df](https://github.com/lobehub/lobe-chat/commit/2b620df))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ## [Version 2.0.0-next.345](https://github.com/lobehub/lobe-chat/compare/v2.0.0-next.344...v2.0.0-next.345)
 
 <sup>Released on **2026-01-23**</sup>

package/CLAUDE.md

@@ -61,9 +61,11 @@ see @.cursor/rules/typescript.mdc
 - **Dev**: Translate `locales/zh-CN/namespace.json` and `locales/en-US/namespace.json` locales file only for dev preview
 - DON'T run `pnpm i18n`, let CI auto handle it
 
-## Linear Issue Management(ignore if not installed linear mcp)
+## Linear Issue Management (search tools first; ignore if not installed)
 
-Read @.cursor/rules/linear.mdc when working with Linear issues.
+ClaudeCode may not inject MCP tools until they are discovered/used.\
+Before applying Linear workflows, **use tool search** to confirm `linear-server` exists (e.g. search `linear` / `mcp__linear-server__`). If not found, treat it as not installed.\
+Then read `@.cursor/rules/linear.mdc` when working with Linear issues.
 
 ## Rules Index
 

package/changelog/v1.json

@@ -1,4 +1,21 @@
 [
+  {
+    "children": {
+      "fixes": [
+        "Add advace config back in agent/group profiles."
+      ],
+      "improvements": [
+        "Move plugin store button outside scroll container."
+      ]
+    },
+    "date": "2026-01-23",
+    "version": "2.0.0-next.347"
+  },
+  {
+    "children": {},
+    "date": "2026-01-23",
+    "version": "2.0.0-next.346"
+  },
   {
     "children": {
       "features": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/lobehub",
-  "version": "2.0.0-next.345",
+  "version": "2.0.0-next.347",
   "description": "LobeHub - an open-source,comprehensive AI Agent 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",
@@ -133,6 +133,7 @@
     ]
   },
   "overrides": {
+    "pdfjs-dist": "5.4.530",
     "stylelint-config-clean-order": "7.0.0"
   },
   "dependencies": {
@@ -206,11 +207,12 @@
     "@lobehub/tts": "^4.0.2",
     "@lobehub/ui": "^4.27.4",
     "@modelcontextprotocol/sdk": "^1.25.1",
+    "@napi-rs/canvas": "^0.1.88",
     "@neondatabase/serverless": "^1.0.2",
     "@next/third-parties": "^16.1.1",
     "@opentelemetry/exporter-jaeger": "^2.2.0",
     "@opentelemetry/winston-transport": "^0.19.0",
-    "@react-pdf/renderer": "^4.3.1",
+    "@react-pdf/renderer": "^4.3.2",
     "@react-three/drei": "^10.7.7",
     "@react-three/fiber": "^9.4.2",
     "@saintno/comfyui-sdk": "^0.2.49",
@@ -296,7 +298,7 @@
     "path-browserify-esm": "^1.0.6",
     "pathe": "^2.0.3",
     "pdf-parse": "^1.1.4",
-    "pdfjs-dist": "4.8.69",
+    "pdfjs-dist": "5.4.530",
     "pdfkit": "^0.17.2",
     "pg": "^8.16.3",
     "pino": "^10.1.0",
@@ -316,7 +318,7 @@
     "react-hotkeys-hook": "^5.2.1",
     "react-i18next": "^16.5.0",
     "react-lazy-load": "^4.0.1",
-    "react-pdf": "^9.2.1",
+    "react-pdf": "^10.3.0",
     "react-responsive": "^10.0.1",
     "react-rnd": "^10.5.2",
     "react-router-dom": "^7.11.0",

package/packages/file-loaders/package.json

@@ -30,7 +30,7 @@
     "debug": "^4.4.3",
     "mammoth": "^1.11.0",
     "officeparser": "5.1.1",
-    "pdfjs-dist": "4.10.38",
+    "pdfjs-dist": "5.4.530",
     "word-extractor": "^1.0.4",
     "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz",
     "yauzl": "^3.2.0"

package/packages/file-loaders/src/loadFile.ts

@@ -2,10 +2,8 @@ import debug from 'debug';
 import { stat } from 'node:fs/promises';
 import * as path from 'node:path';
 
-import { fileLoaders } from './loaders';
-import { TextLoader } from './loaders/text';
-import { FileDocument, FileMetadata, SupportedFileType } from './types';
-import type { DocumentPage, FileLoaderInterface } from './types';
+import { getFileLoader } from './loaders';
+import type { DocumentPage, FileDocument, FileMetadata, SupportedFileType } from './types';
 import { isTextReadableFile } from './utils/isTextReadableFile';
 
 const log = debug('file-loaders:loadFile');
@@ -64,9 +62,6 @@ const getFileType = (filePath: string): SupportedFileType | undefined => {
   }
 };
 
-// Default fallback loader class
-const DefaultLoader = TextLoader;
-
 /**
  * Loads a file from the specified path, automatically detecting the file type
  * and using the appropriate loader class.
@@ -113,18 +108,18 @@ export const loadFile = async (
     source,
   });
 
-  const paserType = getFileType(filePath);
-  log('Parser type determined as:', paserType);
+  const parserType = getFileType(filePath);
+  log('Parser type determined as:', parserType);
 
-  // Select the loader CLASS based on the determined fileType, fallback to DefaultLoader
-  const LoaderClass: new () => FileLoaderInterface = paserType
-    ? fileLoaders[paserType]
-    : DefaultLoader;
+  // Use lazy loading to get the loader class - this prevents heavy dependencies
+  // like pdfjs-dist from being loaded until they're actually needed
+  const loaderType = parserType ?? 'txt';
+  const LoaderClass = await getFileLoader(loaderType);
   log('Selected loader class:', LoaderClass.name);
 
-  if (!paserType) {
+  if (!parserType) {
     console.warn(
-      `No specific loader found for file type '${fileType}'. Using default loader (${DefaultLoader.name}) as fallback.`,
+      `No specific loader found for file type '${fileType}'. Using default loader (TextLoader) as fallback.`,
     );
   }
 

package/packages/file-loaders/src/loaders/index.ts

@@ -1,21 +1,70 @@
-import { FileLoaderInterface, SupportedFileType } from '../types';
-import { DocLoader } from './doc';
-import { DocxLoader } from './docx';
-// import { EpubLoader } from './epub';
-import { ExcelLoader } from './excel';
-import { PdfLoader } from './pdf';
-import { PptxLoader } from './pptx';
-import { TextLoader } from './text';
+import type { FileLoaderInterface, SupportedFileType } from '../types';
 
-// Loader configuration map
-// Key: file extension (lowercase, without leading dot) or specific type name
-// Value: Loader Class implementing FileLoaderInterface
-export const fileLoaders: Record<SupportedFileType, new () => FileLoaderInterface> = {
-  doc: DocLoader,
-  docx: DocxLoader,
-  // epub: EpubLoader,
-  excel: ExcelLoader,
-  pdf: PdfLoader,
-  pptx: PptxLoader,
-  txt: TextLoader,
+// Lazy loader factory type - returns a Promise that resolves to the loader class
+type LazyLoaderFactory = () => Promise<new () => FileLoaderInterface>;
+
+// Loader configuration map using lazy imports
+// This prevents pdfjs-dist from being loaded at module initialization
+// and only loads it when PDF files need to be processed
+const lazyFileLoaders: Record<SupportedFileType, LazyLoaderFactory> = {
+  doc: async () => {
+    const { DocLoader } = await import('./doc');
+    return DocLoader;
+  },
+  docx: async () => {
+    const { DocxLoader } = await import('./docx');
+    return DocxLoader;
+  },
+  excel: async () => {
+    const { ExcelLoader } = await import('./excel');
+    return ExcelLoader;
+  },
+  pdf: async () => {
+    // Polyfill DOMMatrix for Node.js environment before importing pdfjs-dist
+    // pdfjs-dist 5.x uses DOMMatrix at module initialization which doesn't exist in Node.js
+    if (typeof globalThis.DOMMatrix === 'undefined') {
+      try {
+        // eslint-disable-next-line @typescript-eslint/no-require-imports
+        const canvas = require('@napi-rs/canvas');
+        globalThis.DOMMatrix = canvas.DOMMatrix;
+        globalThis.DOMPoint = canvas.DOMPoint;
+        globalThis.DOMRect = canvas.DOMRect;
+        globalThis.Path2D = canvas.Path2D;
+      } catch {
+        // @napi-rs/canvas not available, pdfjs-dist may fail if DOMMatrix is needed
+      }
+    }
+    const { PdfLoader } = await import('./pdf');
+    return PdfLoader;
+  },
+  pptx: async () => {
+    const { PptxLoader } = await import('./pptx');
+    return PptxLoader;
+  },
+  txt: async () => {
+    const { TextLoader } = await import('./text');
+    return TextLoader;
+  },
+};
+
+/**
+ * Get a file loader class for the specified file type.
+ * Uses dynamic imports to avoid loading heavy dependencies (like pdfjs-dist) until needed.
+ * Falls back to TextLoader if no specific loader is found.
+ */
+export const getFileLoader = async (
+  fileType: SupportedFileType | string,
+): Promise<new () => FileLoaderInterface> => {
+  const loaderFactory = lazyFileLoaders[fileType as SupportedFileType];
+  if (!loaderFactory) {
+    // Fallback to TextLoader for unsupported file types
+    const { TextLoader } = await import('./text');
+    return TextLoader;
+  }
+  return loaderFactory();
 };
+
+// For backward compatibility - but prefer using getFileLoader for lazy loading
+// This is kept to avoid breaking existing imports, but it will trigger immediate loading
+// of all loaders. Consider migrating to getFileLoader.
+export { lazyFileLoaders as fileLoaderFactories };

package/packages/file-loaders/src/loaders/pdf/__snapshots__/index.test.ts.snap

@@ -52,7 +52,7 @@ exports[`PdfLoader > should attach document metadata correctly 1`] = `
     "Title": "test",
   },
   "pdfMetadata": null,
-  "pdfVersion": "4.10.38",
+  "pdfVersion": "5.4.530",
 }
 `;
 

package/packages/file-loaders/test/__snapshots__/loaders.test.ts.snap

@@ -25,7 +25,7 @@ exports[`loadFile Integration Tests > PDF Handling > should load content from a
         "Title": "test",
       },
       "pdfMetadata": null,
-      "pdfVersion": "4.10.38",
+      "pdfVersion": "5.4.530",
     },
   },
   "pages": [

package/pnpm-workspace.yaml

@@ -13,6 +13,7 @@ overrides:
   '@swagger-api/apidom-reference': 1.1.0
   jose: ^6.1.3
   stylelint-config-clean-order: 7.0.0
+  pdfjs-dist: 5.4.530
 
 patchedDependencies:
   '@swagger-api/apidom-reference': patches/@swagger-api__apidom-reference.patch

package/src/app/[variants]/(main)/agent/profile/features/AgentSettings/Content.tsx

@@ -0,0 +1,133 @@
+'use client';
+
+import { Avatar, Block, Flexbox, Icon, Text } from '@lobehub/ui';
+import { useTheme } from 'antd-style';
+import type { ItemType } from 'antd/es/menu/interface';
+import isEqual from 'fast-deep-equal';
+import { BrainIcon, MessageSquareHeartIcon, Settings2Icon } from 'lucide-react';
+import { memo, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import Menu from '@/components/Menu';
+import { DEFAULT_AVATAR, DEFAULT_INBOX_AVATAR } from '@/const/meta';
+import { AgentSettings as Settings } from '@/features/AgentSetting';
+import { useAgentStore } from '@/store/agent';
+import { agentSelectors, builtinAgentSelectors } from '@/store/agent/selectors';
+import { ChatSettingsTabs } from '@/store/global/initialState';
+
+const Content = memo(() => {
+  const { t } = useTranslation('setting');
+  const theme = useTheme();
+  const [agentId, isInbox] = useAgentStore((s) => [
+    s.activeAgentId,
+    builtinAgentSelectors.isInboxAgent(s),
+  ]);
+  const config = useAgentStore(agentSelectors.currentAgentConfig, isEqual);
+  const meta = useAgentStore(agentSelectors.currentAgentMeta, isEqual);
+  const [tab, setTab] = useState(ChatSettingsTabs.Chat);
+
+  const updateAgentConfig = async (config: any) => {
+    if (!agentId) return;
+    await useAgentStore.getState().optimisticUpdateAgentConfig(agentId, config);
+  };
+
+  const updateAgentMeta = async (meta: any) => {
+    if (!agentId) return;
+    await useAgentStore.getState().optimisticUpdateAgentMeta(agentId, meta);
+  };
+
+  const menuItems: ItemType[] = useMemo(
+    () =>
+      [
+        {
+          icon: <Icon icon={Settings2Icon} />,
+          key: ChatSettingsTabs.Chat,
+          label: t('agentTab.chat'),
+        },
+        !isInbox
+          ? {
+              icon: <Icon icon={MessageSquareHeartIcon} />,
+              key: ChatSettingsTabs.Opening,
+              label: t('agentTab.opening'),
+            }
+          : null,
+        {
+          icon: <Icon icon={BrainIcon} />,
+          key: ChatSettingsTabs.Modal,
+          label: t('agentTab.modal'),
+        },
+      ].filter(Boolean) as ItemType[],
+    [t, isInbox],
+  );
+
+  const displayTitle = isInbox ? 'Lobe AI' : meta.title || t('defaultSession', { ns: 'common' });
+
+  return (
+    <Flexbox
+      direction="horizontal"
+      height="100%"
+      style={{
+        padding: 0,
+        position: 'relative',
+      }}
+    >
+      <Flexbox
+        height={'100%'}
+        paddingBlock={24}
+        paddingInline={8}
+        style={{
+          background: theme.colorBgLayout,
+          borderRight: `1px solid ${theme.colorBorderSecondary}`,
+        }}
+        width={200}
+      >
+        <Block
+          align={'center'}
+          gap={8}
+          horizontal
+          paddingBlock={'14px 16px'}
+          paddingInline={4}
+          style={{
+            overflow: 'hidden',
+          }}
+          variant={'borderless'}
+        >
+          <Avatar
+            avatar={isInbox ? DEFAULT_INBOX_AVATAR : meta.avatar || DEFAULT_AVATAR}
+            background={meta.backgroundColor || undefined}
+            shape={'square'}
+            size={28}
+          />
+          <Text ellipsis weight={500}>
+            {displayTitle}
+          </Text>
+        </Block>
+        <Menu
+          items={menuItems}
+          onClick={({ key }) => setTab(key as ChatSettingsTabs)}
+          selectable
+          selectedKeys={[tab]}
+          style={{ width: '100%' }}
+        />
+      </Flexbox>
+      <Flexbox
+        flex={1}
+        paddingBlock={24}
+        paddingInline={64}
+        style={{ overflow: 'scroll', width: '100%' }}
+      >
+        <Settings
+          config={config}
+          id={agentId}
+          loading={false}
+          meta={meta}
+          onConfigChange={updateAgentConfig}
+          onMetaChange={updateAgentMeta}
+          tab={tab}
+        />
+      </Flexbox>
+    </Flexbox>
+  );
+});
+
+export default Content;

package/src/app/[variants]/(main)/agent/profile/features/AgentSettings/index.tsx

@@ -0,0 +1,35 @@
+'use client';
+
+import { Modal } from '@lobehub/ui';
+import { memo } from 'react';
+
+import { useAgentStore } from '@/store/agent';
+
+import Content from './Content';
+
+const AgentSettings = memo(() => {
+  const showAgentSetting = useAgentStore((s) => s.showAgentSetting);
+
+  return (
+    <Modal
+      centered
+      footer={null}
+      onCancel={() => useAgentStore.setState({ showAgentSetting: false })}
+      open={showAgentSetting}
+      styles={{
+        body: {
+          height: '60vh',
+          overflow: 'scroll',
+          padding: 0,
+          position: 'relative',
+        },
+      }}
+      title={null}
+      width={960}
+    >
+      <Content />
+    </Modal>
+  );
+});
+
+export default AgentSettings;

package/src/app/[variants]/(main)/agent/profile/features/ProfileEditor/index.tsx

@@ -3,8 +3,9 @@
 import { ENABLE_BUSINESS_FEATURES } from '@lobechat/business-const';
 import { Button, Flexbox } from '@lobehub/ui';
 import { Divider } from 'antd';
+import { useTheme } from 'antd-style';
 import isEqual from 'fast-deep-equal';
-import { Clock, PlayIcon } from 'lucide-react';
+import { Clock, PlayIcon, Settings2Icon } from 'lucide-react';
 import React, { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import urlJoin from 'url-join';
@@ -16,6 +17,7 @@ import { agentSelectors } from '@/store/agent/selectors';
 import { useChatStore } from '@/store/chat';
 
 import AgentCronJobs from '../AgentCronJobs';
+import AgentSettings from '../AgentSettings';
 import EditorCanvas from '../EditorCanvas';
 import AgentPublishButton from '../Header/AgentPublishButton';
 import AgentHeader from './AgentHeader';
@@ -23,6 +25,7 @@ import AgentTool from './AgentTool';
 
 const ProfileEditor = memo(() => {
   const { t } = useTranslation('setting');
+  const theme = useTheme();
   const config = useAgentStore(agentSelectors.currentAgentConfig, isEqual);
   const updateConfig = useAgentStore((s) => s.updateAgentConfig);
   const agentId = useAgentStore((s) => s.activeAgentId);
@@ -44,7 +47,7 @@ const ProfileEditor = memo(() => {
       >
         {/* Header: Avatar + Name + Description */}
         <AgentHeader />
-        {/* Config Bar: Model Selector */}
+        {/* Config Bar: Model Selector + Settings Button */}
         <Flexbox
           align={'center'}
           gap={8}
@@ -59,6 +62,15 @@ const ProfileEditor = memo(() => {
               provider: config.provider,
             }}
           />
+          <Button
+            icon={Settings2Icon}
+            onClick={() => useAgentStore.setState({ showAgentSetting: true })}
+            size={'small'}
+            style={{ color: theme.colorTextSecondary }}
+            type={'text'}
+          >
+            {t('advancedSettings')}
+          </Button>
         </Flexbox>
         <AgentTool />
         <Flexbox
@@ -93,6 +105,8 @@ const ProfileEditor = memo(() => {
       <EditorCanvas />
       {/* Agent Cron Jobs Display (only show if jobs exist) */}
       {ENABLE_BUSINESS_FEATURES && <AgentCronJobs />}
+      {/* Advanced Settings Modal */}
+      <AgentSettings />
     </>
   );
 });

package/src/app/[variants]/(main)/group/profile/features/AgentSettings/Content.tsx

@@ -0,0 +1,140 @@
+'use client';
+
+import { Avatar, Block, Flexbox, Icon, Text } from '@lobehub/ui';
+import { useTheme } from 'antd-style';
+import type { ItemType } from 'antd/es/menu/interface';
+import { MessageSquareHeartIcon } from 'lucide-react';
+import { memo, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import Menu from '@/components/Menu';
+import { DEFAULT_AVATAR } from '@/const/meta';
+import { AgentSettings as Settings } from '@/features/AgentSetting';
+import { useAgentGroupStore } from '@/store/agentGroup';
+import { agentGroupSelectors } from '@/store/agentGroup/selectors';
+import { ChatSettingsTabs } from '@/store/global/initialState';
+
+const Content = memo(() => {
+  const { t } = useTranslation('setting');
+  const theme = useTheme();
+  const groupId = useAgentGroupStore(agentGroupSelectors.activeGroupId);
+  const currentGroup = useAgentGroupStore(agentGroupSelectors.currentGroup);
+  const [tab] = useState(ChatSettingsTabs.Opening);
+
+  const updateGroupConfig = async (config: any) => {
+    if (!groupId) return;
+    // Only update openingMessage and openingQuestions
+    const groupConfig = {
+      openingMessage: config.openingMessage,
+      openingQuestions: config.openingQuestions,
+    };
+    await useAgentGroupStore.getState().updateGroupConfig(groupConfig);
+  };
+
+  const updateGroupMeta = async (meta: any) => {
+    if (!groupId) return;
+    await useAgentGroupStore.getState().updateGroup(groupId, meta);
+  };
+
+  // Convert group config to agent config format for AgentSettings component
+  const agentConfig = useMemo(
+    () =>
+      ({
+        chatConfig: {},
+        model: '',
+        openingMessage: currentGroup?.config?.openingMessage,
+        openingQuestions: currentGroup?.config?.openingQuestions,
+        params: {},
+        systemRole: '',
+        tts: {},
+      }) as any,
+    [currentGroup?.config],
+  );
+
+  const agentMeta = useMemo(
+    () => ({
+      avatar: currentGroup?.avatar || undefined,
+      backgroundColor: currentGroup?.backgroundColor || undefined,
+      description: currentGroup?.description || undefined,
+      tags: [] as string[],
+      title: currentGroup?.title || undefined,
+    }),
+    [currentGroup],
+  );
+
+  const menuItems: ItemType[] = useMemo(
+    () => [
+      {
+        icon: <Icon icon={MessageSquareHeartIcon} />,
+        key: ChatSettingsTabs.Opening,
+        label: t('agentTab.opening'),
+      },
+    ],
+    [t],
+  );
+
+  const displayTitle = currentGroup?.title || t('defaultSession', { ns: 'common' });
+
+  return (
+    <Flexbox
+      direction="horizontal"
+      height="100%"
+      style={{
+        padding: 0,
+        position: 'relative',
+      }}
+    >
+      <Flexbox
+        height={'100%'}
+        paddingBlock={24}
+        paddingInline={8}
+        style={{
+          background: theme.colorBgLayout,
+          borderRight: `1px solid ${theme.colorBorderSecondary}`,
+        }}
+        width={200}
+      >
+        <Block
+          align={'center'}
+          gap={8}
+          horizontal
+          paddingBlock={'14px 16px'}
+          paddingInline={4}
+          style={{
+            overflow: 'hidden',
+          }}
+          variant={'borderless'}
+        >
+          <Avatar
+            avatar={currentGroup?.avatar || DEFAULT_AVATAR}
+            background={currentGroup?.backgroundColor || undefined}
+            shape={'square'}
+            size={28}
+          />
+          <Text ellipsis weight={500}>
+            {displayTitle}
+          </Text>
+        </Block>
+        <Menu items={menuItems} selectable selectedKeys={[tab]} style={{ width: '100%' }} />
+      </Flexbox>
+      <Flexbox
+        flex={1}
+        paddingBlock={24}
+        paddingInline={64}
+        style={{ overflow: 'scroll', width: '100%' }}
+      >
+        <Settings
+          config={agentConfig}
+          id={groupId}
+          loading={false}
+          meta={agentMeta}
+          onConfigChange={updateGroupConfig}
+          onMetaChange={updateGroupMeta}
+          tab={tab}
+        />
+      </Flexbox>
+    </Flexbox>
+  );
+});
+
+export default Content;

package/src/app/[variants]/(main)/group/profile/features/AgentSettings/index.tsx

@@ -0,0 +1,36 @@
+'use client';
+
+import { Modal } from '@lobehub/ui';
+import { memo } from 'react';
+
+import Content from './Content';
+
+interface AgentSettingsProps {
+  onCancel: () => void;
+  open: boolean;
+}
+
+const AgentSettings = memo<AgentSettingsProps>(({ open, onCancel }) => {
+  return (
+    <Modal
+      centered
+      footer={null}
+      onCancel={onCancel}
+      open={open}
+      styles={{
+        body: {
+          height: '60vh',
+          overflow: 'scroll',
+          padding: 0,
+          position: 'relative',
+        },
+      }}
+      title={null}
+      width={960}
+    >
+      <Content />
+    </Modal>
+  );
+});
+
+export default AgentSettings;

package/src/app/[variants]/(main)/group/profile/features/GroupProfile/index.tsx

@@ -2,8 +2,9 @@
 
 import { Button, Flexbox } from '@lobehub/ui';
 import { Divider } from 'antd';
-import { PlayIcon } from 'lucide-react';
-import { memo, useCallback, useMemo } from 'react';
+import { useTheme } from 'antd-style';
+import { PlayIcon, Settings2Icon } from 'lucide-react';
+import { memo, useCallback, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import urlJoin from 'url-join';
 
@@ -13,12 +14,15 @@ import { useAgentGroupStore } from '@/store/agentGroup';
 import { agentGroupSelectors } from '@/store/agentGroup/selectors';
 import { useGroupProfileStore } from '@/store/groupProfile';
 
+import AgentSettings from '../AgentSettings';
 import AutoSaveHint from '../Header/AutoSaveHint';
 import GroupPublishButton from '../Header/GroupPublishButton';
 import GroupHeader from './GroupHeader';
 
 const GroupProfile = memo(() => {
   const { t } = useTranslation(['setting', 'chat']);
+  const theme = useTheme();
+  const [showAgentSetting, setShowAgentSetting] = useState(false);
   const groupId = useAgentGroupStore(agentGroupSelectors.activeGroupId);
   const currentGroup = useAgentGroupStore(agentGroupSelectors.currentGroup);
   const updateGroup = useAgentGroupStore((s) => s.updateGroup);
@@ -86,6 +90,15 @@ const GroupProfile = memo(() => {
             {t('startConversation')}
           </Button>
           <GroupPublishButton />
+          <Button
+            icon={Settings2Icon}
+            onClick={() => setShowAgentSetting(true)}
+            size={'small'}
+            style={{ color: theme.colorTextSecondary }}
+            type={'text'}
+          >
+            {t('advancedSettings')}
+          </Button>
         </Flexbox>
       </Flexbox>
       <Divider />
@@ -97,6 +110,8 @@ const GroupProfile = memo(() => {
         onContentChange={onContentChange}
         placeholder={t('group.profile.contentPlaceholder', { ns: 'chat' })}
       />
+      {/* Advanced Settings Modal */}
+      <AgentSettings onCancel={() => setShowAgentSetting(false)} open={showAgentSetting} />
     </>
   );
 });

package/src/app/[variants]/(main)/resource/features/store/action.ts

@@ -1,6 +1,6 @@
 import { type StateCreator } from 'zustand/vanilla';
 
-import { type ResouceManagerMode } from '@/features/ResourceManager';
+import { type ResourceManagerMode } from '@/features/ResourceManager';
 import { type FilesTabs, SortType } from '@/types/files';
 
 import { type State, type ViewMode, initialState } from './initialState';
@@ -67,7 +67,7 @@ export interface Action {
   /**
    * Set the view mode
    */
-  setMode: (mode: ResouceManagerMode) => void;
+  setMode: (mode: ResourceManagerMode) => void;
   /**
    * Set the pending rename item ID
    */

package/src/app/[variants]/(main)/resource/features/store/initialState.ts

@@ -1,4 +1,4 @@
-import { type ResouceManagerMode } from '@/features/ResourceManager';
+import { type ResourceManagerMode } from '@/features/ResourceManager';
 import { FilesTabs, SortType } from '@/types/files';
 
 export type ViewMode = 'list' | 'masonry';
@@ -39,7 +39,7 @@ export interface State {
   /**
    * View mode for displaying resources
    */
-  mode: ResouceManagerMode;
+  mode: ResourceManagerMode;
   /**
    * ID of item currently being renamed (for inline editing)
    */

package/src/app/[variants]/(main)/resource/store/action.ts

@@ -1,6 +1,6 @@
 import { type StateCreator } from 'zustand/vanilla';
 
-import { type ResouceManagerMode } from '@/features/ResourceManager';
+import { type ResourceManagerMode } from '@/features/ResourceManager';
 
 import { type State, initialState } from './initialState';
 
@@ -12,7 +12,7 @@ export interface Action {
   /**
    * Set the view mode
    */
-  setMode: (mode: ResouceManagerMode) => void;
+  setMode: (mode: ResourceManagerMode) => void;
   /**
    * Set selected file IDs
    */

package/src/app/[variants]/(main)/resource/store/initialState.ts

@@ -1,8 +1,8 @@
-import { type ResouceManagerMode } from '@/features/ResourceManager';
+import { type ResourceManagerMode } from '@/features/ResourceManager';
 
 export interface State {
   currentViewItemId?: string;
-  mode: ResouceManagerMode;
+  mode: ResourceManagerMode;
   selectedFileIds: string[];
 }
 

package/src/features/AgentSetting/AgentOpening/OpeningQuestions.tsx

@@ -86,13 +86,14 @@ const OpeningQuestions = memo(() => {
   const isRepeat = openingQuestions.includes(questionInput.trim());
 
   return (
-    <Flexbox gap={8}>
-      <Flexbox gap={4}>
-        <Space.Compact>
+    <Flexbox gap={8} width={'100%'}>
+      <Flexbox gap={4} width={'100%'}>
+        <Space.Compact style={{ width: '100%' }}>
           <Input
             onChange={(e) => setQuestionInput(e.target.value)}
             onPressEnter={addQuestion}
             placeholder={t('settingOpening.openingQuestions.placeholder')}
+            style={{ flex: 1 }}
             value={questionInput}
           />
           <Button

package/src/features/AgentSetting/AgentOpening/index.tsx

@@ -4,8 +4,6 @@ import { Form } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { FORM_STYLE } from '@/const/layoutTokens';
-
 import OpeningMessage from './OpeningMessage';
 import OpeningQuestions from './OpeningQuestions';
 
@@ -44,7 +42,6 @@ const AgentOpening = memo(() => {
       ]}
       itemsType={'group'}
       variant={'borderless'}
-      {...FORM_STYLE}
     />
   );
 });

package/src/features/FileViewer/Renderer/PDF/index.tsx

@@ -1,22 +1,19 @@
 'use client';
 
 import { Flexbox } from '@lobehub/ui';
-import type { PDFDocumentProxy } from 'pdfjs-dist';
 import { Fragment, memo, useCallback, useState } from 'react';
 import { Document, Page, pdfjs } from 'react-pdf';
-import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
-import 'react-pdf/dist/esm/Page/TextLayer.css';
+import 'react-pdf/dist/Page/AnnotationLayer.css';
+import 'react-pdf/dist/Page/TextLayer.css';
 
 import NeuralNetworkLoading from '@/components/NeuralNetworkLoading';
+import '@/libs/pdfjs/worker';
 import { lambdaQuery } from '@/libs/trpc/client';
 
 import HighlightLayer from './HighlightLayer';
 import { styles } from './style';
 import useResizeObserver from './useResizeObserver';
 
-// 如果海外的地址： https://unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs
-pdfjs.GlobalWorkerOptions.workerSrc = `https://registry.npmmirror.com/pdfjs-dist/${pdfjs.version}/files/build/pdf.worker.min.mjs`;
-
 const options = {
   cMapUrl: `https://registry.npmmirror.com/pdfjs-dist/${pdfjs.version}/files/cmaps/`,
   standardFontDataUrl: `https://registry.npmmirror.com/pdfjs-dist/${pdfjs.version}/files/standard_fonts/`,
@@ -46,8 +43,8 @@ const PDFViewer = memo<PDFViewerProps>(({ url, fileId }) => {
 
   useResizeObserver(containerRef, onResize);
 
-  const onDocumentLoadSuccess = ({ numPages: nextNumPages }: PDFDocumentProxy) => {
-    setNumPages(nextNumPages);
+  const onDocumentLoadSuccess = (document: unknown) => {
+    setNumPages((document as { numPages: number }).numPages);
     setIsLoaded(true);
   };
 

package/src/features/ProfileEditor/AgentTool.tsx

@@ -35,6 +35,7 @@ import { type LobeToolMetaWithAvailability } from '@/store/tool/slices/builtin/s
 
 import PluginTag from './PluginTag';
 
+
 const WEB_BROWSING_IDENTIFIER = 'lobe-web-browsing';
 
 type TabType = 'all' | 'installed';
@@ -44,13 +45,7 @@ const prefixCls = 'ant';
 const styles = createStaticStyles(({ css }) => ({
   dropdown: css`
     overflow: hidden;
-
     width: 100%;
-    border: 1px solid ${cssVar.colorBorderSecondary};
-    border-radius: ${cssVar.borderRadiusLG};
-
-    background: ${cssVar.colorBgElevated};
-    box-shadow: ${cssVar.boxShadowSecondary};
 
     .${prefixCls}-dropdown-menu {
       border-radius: 0 !important;
@@ -339,7 +334,7 @@ const AgentTool = memo<AgentToolProps>(
       () => [
         // 原有的 builtin 工具
         ...filteredBuiltinList.map((item) => ({
-          icon: <Avatar avatar={item.meta.avatar} size={20} style={{ flex: 'none' }} />,
+          icon: <Avatar avatar={item.meta.avatar} size={20} style={{ flex: 'none', marginRight: 0 }} />,
           key: item.identifier,
           label: (
             <ToolItem
@@ -412,18 +407,6 @@ const AgentTool = memo<AgentToolProps>(
           ),
           type: 'group',
         },
-        {
-          type: 'divider',
-        },
-        {
-          extra: <Icon icon={ArrowRight} />,
-          icon: Store,
-          key: 'plugin-store',
-          label: t('tools.plugins.store'),
-          onClick: () => {
-            createSkillStoreModal();
-          },
-        },
       ],
       [builtinItems, pluginItems, enablePluginCount, t],
     );
@@ -557,7 +540,6 @@ const AgentTool = memo<AgentToolProps>(
           {/* Plugin Selector Dropdown - Using Action component pattern */}
           <Suspense fallback={button}>
             <ActionDropdown
-              maxHeight={500}
               maxWidth={400}
               menu={{
                 items: currentItems,
@@ -567,11 +549,10 @@ const AgentTool = memo<AgentToolProps>(
                   overflowY: 'visible',
                 },
               }}
-              minHeight={isKlavisEnabledInEnv || isLobehubSkillEnabled ? 500 : undefined}
               minWidth={400}
               placement={'bottomLeft'}
               popupRender={(menu) => (
-                <div className={styles.dropdown}>
+                <Flexbox className={styles.dropdown} style={{ maxHeight: 500 }}>
                   {/* stopPropagation prevents dropdown's onClick from calling preventDefault on Segmented */}
                   <div className={styles.header} onClick={(e) => e.stopPropagation()}>
                     <Segmented
@@ -591,16 +572,26 @@ const AgentTool = memo<AgentToolProps>(
                       value={effectiveTab}
                     />
                   </div>
-                  <div
-                    className={styles.scroller}
+                  <div className={styles.scroller} style={{ flex: 1 }}>
+                    {menu}
+                  </div>
+                  <Flexbox
+                    align="center"
+                    gap={8}
+                    horizontal
+                    onClick={() => createSkillStoreModal()}
                     style={{
-                      maxHeight: 500,
-                      minHeight: isKlavisEnabledInEnv || isLobehubSkillEnabled ? 500 : undefined,
+                      borderBlockStart: `1px solid ${cssVar.colorBorderSecondary}`,
+                      cursor: 'pointer',
+                      flex: 'none',
+                      padding: cssVar.paddingSM,
                     }}
                   >
-                    {menu}
-                  </div>
-                </div>
+                    <Icon icon={Store} />
+                    <span style={{ flex: 1 }}>{t('tools.plugins.store')}</span>
+                    <Icon icon={ArrowRight} />
+                  </Flexbox>
+                </Flexbox>
               )}
               trigger={'click'}
             >

package/src/features/ResourceManager/components/Explorer/ListView/ListItem/index.tsx

@@ -41,7 +41,6 @@ const styles = createStaticStyles(({ css }) => {
       cursor: pointer;
       min-width: 800px;
 
-      /* Hover effect for individual rows */
       &:hover {
         background: ${cssVar.colorFillTertiary};
       }
@@ -194,7 +193,6 @@ const FileListItem = memo<FileListItemProps>(
     const [isDragging, setIsDragging] = useState(false);
     const [isOver, setIsOver] = useState(false);
 
-    // Memoize computed values that don't change
     const computedValues = useMemo(() => {
       const isPDF = fileType?.toLowerCase() === 'pdf' || name?.toLowerCase().endsWith('.pdf');
       return {
@@ -208,7 +206,6 @@ const FileListItem = memo<FileListItemProps>(
 
     const { isSupportedForChunking, isPage, isFolder, emoji } = computedValues;
 
-    // Memoize drag data to prevent recreation
     const dragData = useMemo(
       () => ({
         fileType,
@@ -219,7 +216,6 @@ const FileListItem = memo<FileListItemProps>(
       [fileType, isFolder, name, sourceType],
     );
 
-    // Native HTML5 drag event handlers
     const handleDragStart = useCallback(
       (e: DragEvent) => {
         if (!resourceManagerState.libraryId) {
@@ -264,7 +260,6 @@ const FileListItem = memo<FileListItemProps>(
     }, []);
 
     const handleDrop = useCallback(() => {
-      // Clear the highlight after drop
       setIsOver(false);
     }, []);
 
@@ -359,7 +354,6 @@ const FileListItem = memo<FileListItemProps>(
           { replace: true },
         );
       } else {
-        // Set mode to file and store the file ID
         resourceManagerState.setCurrentViewItemId(id);
         resourceManagerState.setMode('editor');
         // Also update URL query parameter for shareable links
@@ -378,7 +372,6 @@ const FileListItem = memo<FileListItemProps>(
     useEffect(() => {
       if (pendingRenameItemId === id && isFolder && !isRenaming) {
         handleRenameStart();
-        // Clear the pending rename item after triggering
         resourceManagerState.setPendingRenameItemId(null);
       }
     }, [pendingRenameItemId, id, isFolder, resourceManagerState]);
@@ -575,7 +568,6 @@ const FileListItem = memo<FileListItemProps>(
   },
   // Custom comparison function to prevent unnecessary re-renders
   (prevProps, nextProps) => {
-    // Only re-render if these critical props change
     return (
       prevProps.id === nextProps.id &&
       prevProps.name === nextProps.name &&

package/src/features/ResourceManager/index.tsx

@@ -48,7 +48,7 @@ const styles = createStaticStyles(({ css, cssVar }) => {
   };
 });
 
-export type ResouceManagerMode = 'editor' | 'explorer' | 'page';
+export type ResourceManagerMode = 'editor' | 'explorer' | 'page';
 
 /**
  * Manage resources. Can be from a certian library.

package/src/features/ShareModal/SharePdf/PdfPreview.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { LoadingOutlined } from '@ant-design/icons';
 import { Button, Flexbox } from '@lobehub/ui';
 import { Input, Modal, Spin } from 'antd';
@@ -5,15 +7,13 @@ import { createStaticStyles, cx } from 'antd-style';
 import { ChevronLeft, ChevronRight, Expand, FileText } from 'lucide-react';
 import { memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Document, Page, pdfjs } from 'react-pdf';
+import { Document, Page } from 'react-pdf';
 
 import { useIsMobile } from '@/hooks/useIsMobile';
+import '@/libs/pdfjs/worker';
 
 import { containerStyles } from '../style';
 
-// Set PDF.js worker
-pdfjs.GlobalWorkerOptions.workerSrc = `https://registry.npmmirror.com/pdfjs-dist/${pdfjs.version}/files/build/pdf.worker.min.mjs`;
-
 const styles = createStaticStyles(({ css }) => ({
   containerWrapper: css`
     position: relative;

package/src/libs/next/config/define-config.ts

@@ -17,16 +17,14 @@ interface CustomNextConfig {
 export function defineConfig(config: CustomNextConfig) {
   const isProd = process.env.NODE_ENV === 'production';
   const buildWithDocker = process.env.DOCKER === 'true';
-  const isDesktop = process.env.NEXT_PUBLIC_IS_DESKTOP_APP === '1';
+
   const enableReactScan = !!process.env.REACT_SCAN_MONITOR_API_KEY;
   const shouldUseCSP = process.env.ENABLED_CSP === '1';
 
   const isTest =
     process.env.NODE_ENV === 'test' || process.env.TEST === '1' || process.env.E2E === '1';
 
-  // if you need to proxy the api endpoint to remote server
-
-  const isStandaloneMode = buildWithDocker || isDesktop;
+  const isStandaloneMode = buildWithDocker || process.env.NEXT_BUILD_STANDALONE === '1';
 
   const standaloneConfig: NextConfig = {
     output: 'standalone',
@@ -38,6 +36,7 @@ export function defineConfig(config: CustomNextConfig) {
   const nextConfig: NextConfig = {
     ...(isStandaloneMode ? standaloneConfig : {}),
     assetPrefix,
+
     compiler: {
       emotion: true,
     },
@@ -321,13 +320,14 @@ export function defineConfig(config: CustomNextConfig) {
       },
       ...(config.redirects ?? []),
     ],
-
     // when external packages in dev mode with turbopack, this config will lead to bundle error
+    // @napi-rs/canvas is a native module that can't be bundled by Turbopack
+    // pdfjs-dist uses @napi-rs/canvas for DOMMatrix polyfill in Node.js environment
     serverExternalPackages: config.serverExternalPackages
       ? config.serverExternalPackages
-      : ['pdfkit'],
+      : ['pdfkit', '@napi-rs/canvas', 'pdfjs-dist'],
 
-    transpilePackages: ['pdfjs-dist', 'mermaid', 'better-auth-harmony'],
+    transpilePackages: ['mermaid', 'better-auth-harmony'],
     turbopack: {
       rules: isTest
         ? void 0
@@ -406,14 +406,13 @@ export function defineConfig(config: CustomNextConfig) {
 
   const withBundleAnalyzer = process.env.ANALYZE === 'true' ? analyzer() : noWrapper;
 
-  const withPWA =
-    isProd && !isDesktop
-      ? withSerwistInit({
-          register: false,
-          swDest: 'public/sw.js',
-          swSrc: 'src/app/sw.ts',
-        })
-      : noWrapper;
+  const withPWA = isProd
+    ? withSerwistInit({
+        register: false,
+        swDest: 'public/sw.js',
+        swSrc: 'src/app/sw.ts',
+      })
+    : noWrapper;
 
   return withBundleAnalyzer(withPWA(nextConfig as NextConfig));
 }

package/src/libs/pdfjs/pdf.worker.ts

@@ -0,0 +1 @@
+import 'pdfjs-dist/build/pdf.worker.min.mjs';

package/src/libs/pdfjs/worker.ts

@@ -0,0 +1,12 @@
+'use client';
+
+import { pdfjs } from 'react-pdf';
+
+pdfjs.GlobalWorkerOptions.workerSrc = `https://registry.npmmirror.com/pdfjs-dist/${pdfjs.version}/files/build/pdf.worker.min.mjs`;
+
+// TODO: Re-enable module worker when fully on Turbopack.
+// if (typeof Worker !== 'undefined' && !pdfjs.GlobalWorkerOptions.workerPort) {
+//   pdfjs.GlobalWorkerOptions.workerPort = new Worker(new URL('./pdf.worker.ts', import.meta.url), {
+//     type: 'module',
+//   });
+// }