@lobehub/chat 1.26.11 → 1.26.13

package/CHANGELOG.md

@@ -2,6 +2,56 @@
 
 # Changelog
 
+### [Version 1.26.13](https://github.com/lobehub/lobe-chat/compare/v1.26.12...v1.26.13)
+
+<sup>Released on **2024-10-30**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Fix the artifacts interface not scrolling.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Fix the artifacts interface not scrolling, closes [#4499](https://github.com/lobehub/lobe-chat/issues/4499) ([8b6e630](https://github.com/lobehub/lobe-chat/commit/8b6e630))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
+### [Version 1.26.12](https://github.com/lobehub/lobe-chat/compare/v1.26.11...v1.26.12)
+
+<sup>Released on **2024-10-30**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Fix file image prompts in client mode.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Fix file image prompts in client mode, closes [#4548](https://github.com/lobehub/lobe-chat/issues/4548) ([1b66639](https://github.com/lobehub/lobe-chat/commit/1b66639))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.26.11](https://github.com/lobehub/lobe-chat/compare/v1.26.10...v1.26.11)
 
 <sup>Released on **2024-10-29**</sup>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.26.11",
+  "version": "1.26.13",
   "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/src/app/(main)/chat/(workspace)/@portal/Artifacts/Body/Renderer/index.tsx

@@ -18,7 +18,7 @@ const Renderer = memo<{ content: string; type?: string }>(({ content, type }) =>
     }
 
     case 'text/markdown': {
-      return <Markdown>{content}</Markdown>;
+      return <Markdown style={{ overflow: 'auto' }}>{content}</Markdown>;
     }
 
     default: {

package/src/app/(main)/chat/(workspace)/@portal/Plugins/Body/index.tsx

@@ -26,7 +26,7 @@ const ToolUI = () => {
 
   return (
     <>
-      <Flexbox flex={1} height={'100%'} paddingInline={12}>
+      <Flexbox flex={1} height={'100%'} paddingInline={12} style={{ overflow: 'auto' }}>
         <ToolRender />
       </Flexbox>
       <Footer />

package/src/app/(main)/chat/(workspace)/@portal/features/Body.tsx

@@ -16,7 +16,7 @@ const Body = ({ children }: PropsWithChildren) => {
     <Flexbox
       className={cx(body, 'portal-body')}
       height={'100%'}
-      style={{ position: 'relative' }}
+      style={{ flex: 1, height: 0, position: 'relative' }}
       width={'100%'}
     >
       {children}

package/src/services/__tests__/chat.test.ts

@@ -2,8 +2,10 @@ import { LobeChatPluginManifest } from '@lobehub/chat-plugin-sdk';
 import { act } from '@testing-library/react';
 import { merge } from 'lodash-es';
 import OpenAI from 'openai';
-import { describe, expect, it, vi } from 'vitest';
+import { beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
 
+import { getAppConfig } from '@/config/app';
+import { getServerDBConfig } from '@/config/db';
 import { DEFAULT_AGENT_CONFIG } from '@/const/settings';
 import {
   LobeAnthropicAI,
@@ -53,6 +55,15 @@ vi.mock('@/utils/fetch', async (importOriginal) => {
   return { ...(module as any), getMessageError: vi.fn() };
 });
 
+beforeEach(() => {
+  // 清除所有模块的缓存
+  vi.resetModules();
+  // 默认设置 isServerMode 为 false
+  vi.mock('@/const/version', () => ({
+    isServerMode: false,
+  }));
+});
+
 // mock auth
 vi.mock('../_auth', () => ({
   createHeaderWithAuth: vi.fn().mockResolvedValue({}),
@@ -126,92 +137,6 @@ describe('ChatService', () => {
       );
     });
 
-    describe('handle with files content', () => {
-      it('should includes files', async () => {
-        const messages = [
-          {
-            content: 'Hello',
-            role: 'user',
-            imageList: [
-              {
-                id: 'imagecx1',
-                url: 'http://example.com/xxx0asd-dsd.png',
-                alt: 'ttt.png',
-              },
-            ],
-            fileList: [
-              {
-                fileType: 'plain/txt',
-                size: 100000,
-                id: 'file1',
-                url: 'http://abc.com/abc.txt',
-                name: 'abc.png',
-              },
-              {
-                id: 'file_oKMve9qySLMI',
-                name: '2402.16667v1.pdf',
-                type: 'application/pdf',
-                size: 11256078,
-                url: 'https://xxx.com/ppp/480497/5826c2b8-fde0-4de1-a54b-a224d5e3d898.pdf',
-              },
-            ],
-          }, // Message with files
-          { content: 'Hi', role: 'tool', plugin: { identifier: 'plugin1', apiName: 'api1' } }, // Message with tool role
-          { content: 'Hey', role: 'assistant' }, // Regular user message
-        ] as ChatMessage[];
-
-        const getChatCompletionSpy = vi.spyOn(chatService, 'getChatCompletion');
-        await chatService.createAssistantMessage({
-          messages,
-          plugins: [],
-          model: 'gpt-4o',
-        });
-
-        expect(getChatCompletionSpy).toHaveBeenCalledWith(
-          {
-            messages: [
-              {
-                content: [
-                  {
-                    text: `Hello
-
-<files_info>
-<images>
-<images_docstring>here are user upload images you can refer to</images_docstring>
-<image name="ttt.png" url="http://example.com/xxx0asd-dsd.png"></image>
-</images>
-<files>
-<files_docstring>here are user upload files you can refer to</files_docstring>
-<file id="file1" name="abc.png" type="plain/txt" size="100000" url="http://abc.com/abc.txt"></file>
-<file id="file_oKMve9qySLMI" name="2402.16667v1.pdf" type="undefined" size="11256078" url="https://xxx.com/ppp/480497/5826c2b8-fde0-4de1-a54b-a224d5e3d898.pdf"></file>
-</files>
-</files_info>`,
-                    type: 'text',
-                  },
-                  {
-                    image_url: { detail: 'auto', url: 'http://example.com/xxx0asd-dsd.png' },
-                    type: 'image_url',
-                  },
-                ],
-                role: 'user',
-              },
-              {
-                content: 'Hi',
-                name: 'plugin1____api1',
-                role: 'tool',
-              },
-              {
-                content: 'Hey',
-                role: 'assistant',
-              },
-            ],
-            model: 'gpt-4o',
-          },
-          undefined,
-        );
-      });
-    });
-
     describe('should handle content correctly for vision models', () => {
       it('should include image content when with vision model', async () => {
         const messages = [
@@ -243,15 +168,7 @@ describe('ChatService', () => {
               {
                 content: [
                   {
-                    text: `Hello
-
-<files_info>
-<images>
-<images_docstring>here are user upload images you can refer to</images_docstring>
-<image name="abc.png" url="http://example.com/image.jpg"></image>
-</images>
-
-</files_info>`,
+                    text: 'Hello',
                     type: 'text',
                   },
                   {
@@ -829,6 +746,163 @@ describe('ChatService', () => {
         },
       ]);
     });
+
+    describe('handle with files content in server mode', () => {
+      it('should includes files', async () => {
+        // 重新模拟模块，设置 isServerMode 为 true
+        vi.doMock('@/const/version', () => ({
+          isServerMode: true,
+        }));
+
+        // 需要在修改模拟后重新导入相关模块
+        const { chatService } = await import('../chat');
+
+        const messages = [
+          {
+            content: 'Hello',
+            role: 'user',
+            imageList: [
+              {
+                id: 'imagecx1',
+                url: 'http://example.com/xxx0asd-dsd.png',
+                alt: 'ttt.png',
+              },
+            ],
+            fileList: [
+              {
+                fileType: 'plain/txt',
+                size: 100000,
+                id: 'file1',
+                url: 'http://abc.com/abc.txt',
+                name: 'abc.png',
+              },
+              {
+                id: 'file_oKMve9qySLMI',
+                name: '2402.16667v1.pdf',
+                type: 'application/pdf',
+                size: 11256078,
+                url: 'https://xxx.com/ppp/480497/5826c2b8-fde0-4de1-a54b-a224d5e3d898.pdf',
+              },
+            ],
+          }, // Message with files
+          { content: 'Hi', role: 'tool', plugin: { identifier: 'plugin1', apiName: 'api1' } }, // Message with tool role
+          { content: 'Hey', role: 'assistant' }, // Regular user message
+        ] as ChatMessage[];
+
+        const output = chatService['processMessages']({
+          messages,
+          model: 'gpt-4o',
+        });
+
+        expect(output).toEqual([
+          {
+            content: [
+              {
+                text: `Hello
+
+<files_info>
+<images>
+<images_docstring>here are user upload images you can refer to</images_docstring>
+<image name="ttt.png" url="http://example.com/xxx0asd-dsd.png"></image>
+</images>
+<files>
+<files_docstring>here are user upload files you can refer to</files_docstring>
+<file id="file1" name="abc.png" type="plain/txt" size="100000" url="http://abc.com/abc.txt"></file>
+<file id="file_oKMve9qySLMI" name="2402.16667v1.pdf" type="undefined" size="11256078" url="https://xxx.com/ppp/480497/5826c2b8-fde0-4de1-a54b-a224d5e3d898.pdf"></file>
+</files>
+</files_info>`,
+                type: 'text',
+              },
+              {
+                image_url: { detail: 'auto', url: 'http://example.com/xxx0asd-dsd.png' },
+                type: 'image_url',
+              },
+            ],
+            role: 'user',
+          },
+          {
+            content: 'Hi',
+            name: 'plugin1____api1',
+            role: 'tool',
+          },
+          {
+            content: 'Hey',
+            role: 'assistant',
+          },
+        ]);
+      });
+    });
+
+    it('should include image files in server mode', async () => {
+      // 重新模拟模块，设置 isServerMode 为 true
+      vi.doMock('@/const/version', () => ({
+        isServerMode: true,
+      }));
+
+      // 需要在修改模拟后重新导入相关模块
+      const { chatService } = await import('../chat');
+      const messages = [
+        {
+          content: 'Hello',
+          role: 'user',
+          imageList: [
+            {
+              id: 'file1',
+              url: 'http://example.com/image.jpg',
+              alt: 'abc.png',
+            },
+          ],
+        }, // Message with files
+        { content: 'Hi', role: 'tool', plugin: { identifier: 'plugin1', apiName: 'api1' } }, // Message with tool role
+        { content: 'Hey', role: 'assistant' }, // Regular user message
+      ] as ChatMessage[];
+
+      const getChatCompletionSpy = vi.spyOn(chatService, 'getChatCompletion');
+      await chatService.createAssistantMessage({
+        messages,
+        plugins: [],
+        model: 'gpt-4-vision-preview',
+      });
+
+      expect(getChatCompletionSpy).toHaveBeenCalledWith(
+        {
+          messages: [
+            {
+              content: [
+                {
+                  text: `Hello
+
+<files_info>
+<images>
+<images_docstring>here are user upload images you can refer to</images_docstring>
+<image name="abc.png" url="http://example.com/image.jpg"></image>
+</images>
+
+</files_info>`,
+                  type: 'text',
+                },
+                {
+                  image_url: { detail: 'auto', url: 'http://example.com/image.jpg' },
+                  type: 'image_url',
+                },
+              ],
+              role: 'user',
+            },
+            {
+              content: 'Hi',
+              name: 'plugin1____api1',
+              role: 'tool',
+            },
+            {
+              content: 'Hey',
+              role: 'assistant',
+            },
+          ],
+          model: 'gpt-4-vision-preview',
+        },
+        undefined,
+      );
+    });
   });
 });
 

package/src/services/chat.ts

@@ -7,6 +7,7 @@ import { INBOX_GUIDE_SYSTEMROLE } from '@/const/guide';
 import { INBOX_SESSION_ID } from '@/const/session';
 import { DEFAULT_AGENT_CONFIG } from '@/const/settings';
 import { TracePayload, TraceTagMap } from '@/const/trace';
+import { isServerMode } from '@/const/version';
 import { AgentRuntime, ChatCompletionErrorPayload, ModelProvider } from '@/libs/agent-runtime';
 import { filesPrompts } from '@/prompts/files';
 import { useSessionStore } from '@/store/session';
@@ -420,7 +421,7 @@ class ChatService {
 
       const imageList = m.imageList || [];
 
-      const filesContext = filesPrompts({ fileList: m.fileList, imageList });
+      const filesContext = isServerMode ? filesPrompts({ fileList: m.fileList, imageList }) : '';
       return [
         { text: (m.content + '\n\n' + filesContext).trim(), type: 'text' },
         ...imageList.map(