@lobehub/chat 1.84.5 → 1.84.7

package/src/features/PluginDevModal/MCPManifestForm/index.tsx

@@ -8,7 +8,7 @@ import {
 } from '@icons-pack/react-simple-icons';
 import { LobeChatPluginManifest } from '@lobehub/chat-plugin-sdk';
 import { Alert, AutoComplete, FormItem, Input, TextArea } from '@lobehub/ui';
-import { Button, Form, FormInstance } from 'antd';
+import { Button, Divider, Form, FormInstance } from 'antd';
 import { FC, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
@@ -52,6 +52,7 @@ const STDIO_COMMAND = ['customParams', 'mcp', 'command'];
 const STDIO_ARGS = ['customParams', 'mcp', 'args'];
 const STDIO_ENV = ['customParams', 'mcp', 'env'];
 const MCP_TYPE = ['customParams', 'mcp', 'type'];
+const DESC_TYPE = ['customParams', 'description'];
 
 const MCPManifestForm = ({ form, isEditMode }: MCPManifestFormProps) => {
   const { t } = useTranslation('plugin');
@@ -150,16 +151,24 @@ const MCPManifestForm = ({ form, isEditMode }: MCPManifestFormProps) => {
       const values = form.getFieldsValue();
       const id = values.identifier;
       const mcp = values.customParams?.mcp;
+      const description = values.customParams?.description;
+      const avatar = values.customParams?.avatar;
 
       let data: LobeChatPluginManifest;
 
       if (mcp.type === 'http') {
         if (!mcp.url) throw new Error(t('dev.mcp.url.required'));
-        data = await mcpService.getStreamableMcpServerManifest(id, mcp.url);
+        data = await mcpService.getStreamableMcpServerManifest(id, mcp.url, {
+          avatar,
+          description,
+        });
       } else if (mcp.type === 'stdio') {
         if (!mcp.command) throw new Error(t('dev.mcp.command.required'));
         if (!mcp.args) throw new Error(t('dev.mcp.args.required'));
-        data = await mcpService.getStdioMcpServerManifest(id, mcp.command, mcp.args);
+        data = await mcpService.getStdioMcpServerManifest(id, mcp.command, mcp.args, {
+          avatar,
+          description,
+        });
       } else {
         throw new Error('Invalid MCP type'); // Internal error
       }
@@ -253,7 +262,6 @@ const MCPManifestForm = ({ form, isEditMode }: MCPManifestFormProps) => {
           >
             <MCPTypeSelect />
           </Form.Item>
-
           <FormItem
             desc={t('dev.mcp.identifier.desc')}
             label={t('dev.mcp.identifier.label')}
@@ -281,7 +289,6 @@ const MCPManifestForm = ({ form, isEditMode }: MCPManifestFormProps) => {
           >
             <Input placeholder={t('dev.mcp.identifier.placeholder')} />
           </FormItem>
-
           {mcpType === 'http' && (
             <FormItem
               desc={t('dev.mcp.url.desc')}
@@ -296,7 +303,6 @@ const MCPManifestForm = ({ form, isEditMode }: MCPManifestFormProps) => {
               <Input placeholder="https://mcp.higress.ai/mcp-github/xxxxx" />
             </FormItem>
           )}
-
           {mcpType === 'stdio' && (
             <>
               <FormItem
@@ -349,7 +355,6 @@ const MCPManifestForm = ({ form, isEditMode }: MCPManifestFormProps) => {
               </Button>
             </Flexbox>
           </FormItem>
-
           {connectionError && (
             <Alert
               closable
@@ -361,6 +366,22 @@ const MCPManifestForm = ({ form, isEditMode }: MCPManifestFormProps) => {
             />
           )}
           <FormItem name={'manifest'} noStyle />
+          <Divider />
+          <FormItem
+            desc={t('dev.mcp.desc.desc')}
+            label={t('dev.mcp.desc.label')}
+            name={DESC_TYPE}
+            tag={'description'}
+          >
+            <Input placeholder={t('dev.mcp.desc.placeholder')} />
+          </FormItem>
+          <FormItem
+            label={t('dev.mcp.avatar.label')}
+            name={['customParams', 'avatar']}
+            tag={'avatar'}
+          >
+            <Input placeholder={'https://plugin-avatar.com'} />
+          </FormItem>
         </Flexbox>
       </Form>
     </>

package/src/features/PluginDevModal/PluginPreview/ApiVisualizer.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { Block, Icon, Tag } from '@lobehub/ui';
-import { Input, Space, Typography } from 'antd';
+import { Input, Space } from 'antd';
 import { createStyles } from 'antd-style';
 import { ChevronDown, ChevronRight } from 'lucide-react';
 import { memo, useState } from 'react';
@@ -9,13 +9,21 @@ import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
 const useStyles = createStyles(({ css, token }) => ({
+  apiDesc: css`
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+
+    font-size: 12px;
+    color: ${token.colorTextTertiary};
+  `,
   apiHeader: css`
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: space-between;
   `,
-
   apiTitle: css`
     font-family: ${token.fontFamilyCode};
   `,
@@ -99,9 +107,9 @@ const ApiItem = memo<ApiItemProps>(({ api }) => {
   return (
     <Block gap={8} padding={16}>
       <div className={styles.apiHeader} onClick={() => setExpanded(!expanded)}>
-        <Flexbox gap={4}>
+        <Flexbox gap={8}>
           <div className={styles.apiTitle}>{api.name}</div>
-          <Typography.Text type="secondary">{api.description}</Typography.Text>
+          <div className={styles.apiDesc}>{api.description}</div>
         </Flexbox>
 
         <Icon icon={expanded ? ChevronDown : ChevronRight} />

package/src/features/PluginDevModal/PluginPreview/EmptyState.tsx

@@ -11,6 +11,7 @@ const useStyles = createStyles(({ token, css }) => ({
   container: css`
     display: flex;
     flex-direction: column;
+    gap: 12px;
     align-items: center;
     justify-content: center;
 
@@ -19,7 +20,6 @@ const useStyles = createStyles(({ token, css }) => ({
     padding: ${token.paddingLG}px;
   `,
   description: css`
-    max-width: 320px;
     color: ${token.colorTextSecondary};
     text-align: center;
   `,
@@ -30,7 +30,6 @@ const useStyles = createStyles(({ token, css }) => ({
 
     width: 64px;
     height: 64px;
-    margin-block-end: ${token.marginMD}px;
     border-radius: 50%;
 
     background-color: ${token.colorPrimaryBg};
@@ -68,7 +67,7 @@ export default function PluginEmptyState() {
         {t('dev.preview.empty.title')}
       </Title>
       <Paragraph className={styles.description}>{t('dev.preview.empty.desc')}</Paragraph>
-      <Space align="center" direction="vertical" style={{ marginTop: 24 }}>
+      <Space align="center" direction="vertical">
         <div className={styles.line} style={{ width: 128 }} />
         <div className={styles.line} style={{ width: 96 }} />
         <div className={styles.line} style={{ width: 48 }} />

package/src/libs/mcp/types.ts

@@ -17,7 +17,7 @@ interface HttpMCPClientParams {
   url: string;
 }
 
-interface StdioMCPParams {
+export interface StdioMCPParams {
   args: string[];
   command: string;
   env?: Record<string, string>;

package/src/libs/trpc/client/helpers/desktopRemoteRPCFetch.ts

@@ -11,7 +11,7 @@ const log = debug('lobe-lambda:desktopRemoteRPCFetch');
 // eslint-disable-next-line no-undef
 export const desktopRemoteRPCFetch = async (input: string, init?: RequestInit) => {
   const isSyncActive = electronSyncSelectors.isSyncActive(getElectronStoreState());
-  log('isDesktop:', isDesktop, 'isSyncActive:', isSyncActive);
+  log('isSyncActive:', isSyncActive);
 
   if (isSyncActive) {
     log('Using IPC proxy for tRPC request');

package/src/locales/default/error.ts

@@ -66,6 +66,7 @@ export default {
     429: '很抱歉，您的请求太多，服务器有点累了，请稍后再试',
     431: '很抱歉，您的请求头字段太大，服务器无法处理',
     451: '很抱歉，由于法律原因，服务器拒绝提供此资源',
+    499: '很抱歉，您的请求在服务器处理中被意外中断，可能是因为您主动取消了操作或网络连接不稳定。请检查网络状况后重试。',
     500: '很抱歉，服务器似乎遇到了一些困难，暂时无法完成您的请求，请稍后再试',
     501: '很抱歉，服务器还不知道如何处理这个请求，请确认您的操作是否正确',
     502: '很抱歉，服务器似乎迷失了方向，暂时无法提供服务，请稍后再试',
@@ -76,6 +77,8 @@ export default {
     507: '很抱歉，服务器存储空间不足，无法处理您的请求，请稍后再试',
     509: '很抱歉，服务器的带宽已用尽，请稍后再试',
     510: '很抱歉，服务器不支持请求的扩展功能，请联系管理员',
+    520: '很抱歉，服务器遇到了一个意外的问题，导致无法完成您的请求。请稍后再试，我们正努力解决这个问题。',
+    522: '很抱歉，服务器连接超时，未能及时响应您的请求。可能是网络不稳定或服务器暂时无法访问。请稍后再试，我们正在努力恢复服务。',
     524: '很抱歉，服务器在等回复时超时了，可能是因为响应太慢，请稍后再试',
 
     /* eslint-disable sort-keys-fix/sort-keys-fix */

package/src/locales/default/plugin.ts

@@ -54,12 +54,20 @@ export default {
         placeholder: '例如：mcp-hello-world',
         required: '请输入启动参数',
       },
+      avatar: {
+        label: '插件图标',
+      },
       command: {
         desc: '用于启动 MCP STDIO Server 的可执行文件或脚本',
         label: '命令',
         placeholder: '例如：npx / uv / docker 等',
         required: '请输入启动命令',
       },
+      desc: {
+        desc: '添加插件的描述说明',
+        label: '插件描述',
+        placeholder: '补充该插件的使用说明和场景等信息',
+      },
       endpoint: {
         desc: '输入你的 MCP Streamable HTTP Server 的地址',
         label: 'MCP Endpoint URL',

package/src/server/routers/desktop/mcp.ts

@@ -8,6 +8,12 @@ import { mcpService } from '@/server/services/mcp';
 const stdioParamsSchema = z.object({
   args: z.array(z.string()).optional().default([]),
   command: z.string().min(1),
+  metadata: z
+    .object({
+      avatar: z.string().optional(),
+      description: z.string().optional(),
+    })
+    .optional(),
   name: z.string().min(1),
   type: z.literal('stdio').default('stdio'),
 });
@@ -16,7 +22,10 @@ const mcpProcedure = isServerMode ? authedProcedure : passwordProcedure;
 
 export const mcpRouter = router({
   getStdioMcpServerManifest: mcpProcedure.input(stdioParamsSchema).query(async ({ input }) => {
-    return await mcpService.getStdioMcpServerManifest(input.name, input.command, input.args);
+    return await mcpService.getStdioMcpServerManifest(
+      { args: input.args, command: input.command, name: input.name },
+      input.metadata,
+    );
   }),
 
   /* eslint-disable sort-keys-fix/sort-keys-fix */

package/src/server/routers/tools/mcp.ts

@@ -39,11 +39,21 @@ export const mcpRouter = router({
     .input(
       z.object({
         identifier: z.string(),
+        metadata: z
+          .object({
+            avatar: z.string().optional(),
+            description: z.string().optional(),
+          })
+          .optional(),
         url: z.string().url(),
       }),
     )
     .query(async ({ input }) => {
-      return await mcpService.getStreamableMcpServerManifest(input.identifier, input.url);
+      return await mcpService.getStreamableMcpServerManifest(
+        input.identifier,
+        input.url,
+        input.metadata,
+      );
     }),
   /* eslint-disable sort-keys-fix/sort-keys-fix */
   // --- MCP Interaction ---

package/src/server/services/mcp/index.ts

@@ -3,7 +3,8 @@ import { McpError } from '@modelcontextprotocol/sdk/types.js';
 import { TRPCError } from '@trpc/server';
 import debug from 'debug';
 
-import { MCPClient, MCPClientParams } from '@/libs/mcp';
+import { MCPClient, MCPClientParams, StdioMCPParams } from '@/libs/mcp';
+import { CustomPluginMetadata } from '@/types/tool/plugin';
 import { safeParseJSON } from '@/utils/safeParseJSON';
 
 const log = debug('lobe-mcp:service');
@@ -58,9 +59,20 @@ class MCPService {
       const result = await client.callTool(toolName, args); // Pass args directly
       log(`Tool "${toolName}" called successfully for params: %O, result: %O`, params, result);
       const { content, isError } = result;
-      if (!isError) return content;
 
-      return result;
+      if (isError) return result;
+
+      const data = content as { text: string; type: 'text' }[];
+
+      const text = data?.[0]?.text;
+
+      if (!text) return data;
+
+      // try to get json object, which will be stringify in the client
+      const json = safeParseJSON(text);
+      if (json) return json;
+
+      return text;
     } catch (error) {
       if (error instanceof McpError) {
         const mcpError = error as McpError;
@@ -143,6 +155,7 @@ class MCPService {
   async getStreamableMcpServerManifest(
     identifier: string,
     url: string,
+    metadata?: CustomPluginMetadata,
   ): Promise<LobeChatPluginManifest> {
     const tools = await this.listTools({ name: identifier, type: 'http', url }); // Get client using params
 
@@ -150,27 +163,37 @@ class MCPService {
       api: tools,
       identifier,
       meta: {
-        avatar: 'MCP_AVATAR',
-        description: `${identifier} MCP server has ${tools.length} tools, like "${tools[0]?.name}"`,
+        avatar: metadata?.avatar || 'MCP_AVATAR',
+        description:
+          metadata?.description ||
+          `${identifier} MCP server has ${tools.length} tools, like "${tools[0]?.name}"`,
         title: identifier,
       },
       // TODO: temporary
       type: 'mcp' as any,
     };
   }
+
   async getStdioMcpServerManifest(
-    identifier: string,
-    command: string,
-    args: string[],
+    params: Omit<StdioMCPParams, 'type'>,
+    metadata?: CustomPluginMetadata,
   ): Promise<LobeChatPluginManifest> {
-    const tools = await this.listTools({ args, command, name: identifier, type: 'stdio' }); // Get client using params
-
+    const tools = await this.listTools({
+      args: params.args,
+      command: params.command,
+      name: params.name,
+      type: 'stdio',
+    });
+
+    const identifier = params.name;
     return {
       api: tools,
       identifier,
       meta: {
-        avatar: 'MCP_AVATAR',
-        description: `${identifier} MCP server has ${tools.length} tools, like "${tools[0]?.name}"`,
+        avatar: metadata?.avatar || 'MCP_AVATAR',
+        description:
+          metadata?.description ||
+          `${identifier} MCP server has ${tools.length} tools, like "${tools[0]?.name}"`,
         title: identifier,
       },
       // TODO: temporary

package/src/services/mcp.ts

@@ -1,6 +1,7 @@
 import { isDesktop } from '@/const/version';
 import { desktopClient, toolsClient } from '@/libs/trpc/client';
 import { ChatToolPayload } from '@/types/message';
+import { CustomPluginMetadata } from '@/types/tool/plugin';
 
 class MCPService {
   async invokeMcpToolCall(payload: ChatToolPayload, { signal }: { signal?: AbortSignal }) {
@@ -30,14 +31,24 @@ class MCPService {
     return toolsClient.mcp.callTool.mutate(data, { signal });
   }
 
-  async getStreamableMcpServerManifest(identifier: string, url: string) {
-    return toolsClient.mcp.getStreamableMcpServerManifest.query({ identifier, url });
+  async getStreamableMcpServerManifest(
+    identifier: string,
+    url: string,
+    metadata?: CustomPluginMetadata,
+  ) {
+    return toolsClient.mcp.getStreamableMcpServerManifest.query({ identifier, metadata, url });
   }
 
-  async getStdioMcpServerManifest(identifier: string, command: string, args?: string[]) {
+  async getStdioMcpServerManifest(
+    identifier: string,
+    command: string,
+    args?: string[],
+    metadata?: CustomPluginMetadata,
+  ) {
     return desktopClient.mcp.getStdioMcpServerManifest.query({
       args: args,
       command,
+      metadata,
       name: identifier,
     });
   }

package/src/types/tool/plugin.ts

@@ -4,13 +4,21 @@ import { LobeToolType } from './tool';
 
 export type PluginManifestMap = Record<string, LobeChatPluginManifest>;
 
+export interface CustomPluginMetadata {
+  avatar?: string;
+  description?: string;
+}
+
 export interface CustomPluginParams {
   apiMode?: 'openapi' | 'simple';
   enableSettings?: boolean;
   manifestMode?: 'local' | 'url';
   manifestUrl?: string;
+  useProxy?: boolean;
+
+  /* eslint-disable sort-keys-fix/sort-keys-fix , typescript-sort-keys/interface */
   /**
-   * 临时方案，后续需要做一次大重构
+   * TODO: 临时方案，后续需要做一次大重构
    */
   mcp?: {
     args?: string[];
@@ -18,7 +26,9 @@ export interface CustomPluginParams {
     type: 'http' | 'stdio';
     url?: string;
   };
-  useProxy?: boolean;
+  avatar?: string;
+  description?: string;
+  /* eslint-enable */
 }
 
 export interface LobeToolCustomPlugin {

package/src/app/[variants]/(main)/repos/[id]/@menu/default.tsx

@@ -1,33 +0,0 @@
-import { notFound } from 'next/navigation';
-import { Flexbox } from 'react-layout-kit';
-
-import { KnowledgeBaseModel } from '@/database/models/knowledgeBase';
-import { serverDB } from '@/database/server';
-
-import Head from './Head';
-import Menu from './Menu';
-
-interface Params {
-  id: string;
-}
-
-type Props = { params: Promise<Params> };
-
-const MenuPage = async (props: Props) => {
-  const params = await props.params;
-  const id = params.id;
-  const item = await KnowledgeBaseModel.findById(serverDB, params.id);
-
-  if (!item) return notFound();
-
-  return (
-    <Flexbox gap={16} height={'100%'} paddingInline={12} style={{ paddingTop: 12 }}>
-      <Head name={item.name} />
-      <Menu id={id} />
-    </Flexbox>
-  );
-};
-
-MenuPage.displayName = 'Menu';
-
-export default MenuPage;