@lobehub/chat 1.12.13 → 1.12.14

package/CHANGELOG.md

@@ -2,6 +2,31 @@
 
 # Changelog
 
+### [Version 1.12.14](https://github.com/lobehub/lobe-chat/compare/v1.12.13...v1.12.14)
+
+<sup>Released on **2024-08-24**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Fix tts file saving in server mode.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Fix tts file saving in server mode, closes [#3585](https://github.com/lobehub/lobe-chat/issues/3585) ([ab1cb47](https://github.com/lobehub/lobe-chat/commit/ab1cb47))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.12.13](https://github.com/lobehub/lobe-chat/compare/v1.12.12...v1.12.13)
 
 <sup>Released on **2024-08-24**</sup>

package/README.md

@@ -268,12 +268,12 @@ Our marketplace is not just a showcase platform but also a collaborative space.
 
 | Recent Submits                                                                                                                                                                                | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    |
 | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| [TypeScript Solution Architect](https://chat-preview.lobehub.com/market?agent=typescript-developer)<br/><sup>By **[swarfte](https://github.com/swarfte)** on **2024-08-24**</sup>             | Expert in TypeScript, Node.js, Vue.js 3, Nuxt.js 3, Express.js, React.js, and modern UI libraries.<br/>`type-script` `java-script` `web-development` `coding-standards` `best-practices`                                                                                                                                                                                                                                                                                                                                       |
 | [Variable Name Conversion Expert](https://chat-preview.lobehub.com/market?agent=variable-name-conversion)<br/><sup>By **[zengyishou](https://github.com/zengyishou)** on **2024-08-21**</sup> | In software development, naming variables is a common yet relatively time-consuming task. This assistant can automatically convert Chinese variable names into English variable names that conform to camelCase, PascalCase, snake_case, kebab-case, and constant naming conventions based on specific naming rules. This not only improves code readability but also alleviates the frustration of variable naming.<br/>`software-development` `variable-naming` `chinese-to-english` `code-standards` `automatic-conversion` |
 | [Prompt Engineering Expert](https://chat-preview.lobehub.com/market?agent=ai-prompts-assistant)<br/><sup>By **[cyicz123](https://github.com/cyicz123)** on **2024-08-12**</sup>               | Specializing in prompt optimization and design<br/>`prompt-engineering` `ai-interaction` `writing` `optimization` `consulting`                                                                                                                                                                                                                                                                                                                                                                                                 |
 | [Commit Message Generator](https://chat-preview.lobehub.com/market?agent=commit-assistant)<br/><sup>By **[cyicz123](https://github.com/cyicz123)** on **2024-08-12**</sup>                    | Expert at generating precise Git commit messages<br/>`programming` `git` `commit-message` `code-review`                                                                                                                                                                                                                                                                                                                                                                                                                        |
-| [RO-SCIRAW Prompt Word Expert](https://chat-preview.lobehub.com/market?agent=rosciraw)<br/><sup>By **[kirklin](https://github.com/kirklin)** on **2024-08-06**</sup>                          | The RO-SCIRAW framework, created by Kirk Lin, is a methodology for prompt words that provides a new paradigm for building highly precise and efficient prompt words. Please enter the information for the persona you want to create.<br/>`prompt-word-framework`                                                                                                                                                                                                                                                              |
 
-> 📊 Total agents: [<kbd>**315**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
+> 📊 Total agents: [<kbd>**316**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
 
  <!-- AGENT LIST -->
 

package/README.zh-CN.md

@@ -256,12 +256,12 @@ LobeChat 的插件生态系统是其核心功能的重要扩展，它极大地
 
 | 最近新增                                                                                                                                                                         | 助手说明                                                                                                                                                                                                                                                                              |
 | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [TypeScript 解决方案架构师](https://chat-preview.lobehub.com/market?agent=typescript-developer)<br/><sup>By **[swarfte](https://github.com/swarfte)** on **2024-08-24**</sup>    | 精通 TypeScript、Node.js、Vue.js 3、Nuxt.js 3、Express.js、React.js 和现代 UI 库。<br/>`类型脚本` `java-script` `网页开发` `编码标准` `最佳实践`                                                                                                                                      |
 | [开发变量名转换专家](https://chat-preview.lobehub.com/market?agent=variable-name-conversion)<br/><sup>By **[zengyishou](https://github.com/zengyishou)** on **2024-08-21**</sup> | 在软件开发过程中，命名变量是一项常见却相对耗时的任务。本助手能够根据特定的命名规则自动将中文变量名转换为符合小驼峰、大驼峰、下划线、横线以及常量命名规范的英文变量名。这不仅提高了代码的可读性，还解决了变量命名的苦恼。<br/>`软件开发` `变量命名` `中文转英文` `代码规范` `自动转换` |
 | [提示工程专家](https://chat-preview.lobehub.com/market?agent=ai-prompts-assistant)<br/><sup>By **[cyicz123](https://github.com/cyicz123)** on **2024-08-12**</sup>               | 专精 Prompt 优化与设计<br/>`提示工程` `ai交互` `写作` `优化` `咨询`                                                                                                                                                                                                                   |
 | [提交信息生成器](https://chat-preview.lobehub.com/market?agent=commit-assistant)<br/><sup>By **[cyicz123](https://github.com/cyicz123)** on **2024-08-12**</sup>                 | 擅长生成精准的 Git 提交信息<br/>`编程` `git` `提交信息` `代码审查`                                                                                                                                                                                                                    |
-| [RO-SCIRAW 提示词专家](https://chat-preview.lobehub.com/market?agent=rosciraw)<br/><sup>By **[kirklin](https://github.com/kirklin)** on **2024-08-06**</sup>                     | RO-SCIRAW 框架是由 Kirk Lin 开创的提示词方法论，为构建高度精确和高效的提示词提供了一个全新的范式。请输入你要创建的分身信息。<br/>`提示词框架`                                                                                                                                         |
 
-> 📊 Total agents: [<kbd>**315**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
+> 📊 Total agents: [<kbd>**316**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
 
  <!-- AGENT LIST -->
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.12.13",
+  "version": "1.12.14",
   "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/database/server/models/__tests__/message.test.ts

@@ -248,9 +248,10 @@ describe('MessageModel', () => {
 
       // 断言结果
       expect(result[0].extra.translate).toEqual({ content: 'translated', from: 'en', to: 'zh' });
-      // TODO: 确认是否需要包含 tts 字段
       expect(result[0].extra.tts).toEqual({
-        // contentMd5: 'md5', file: 'f1', voice: 'voice1'
+        contentMd5: 'md5',
+        file: 'f1',
+        voice: 'voice1',
       });
     });
 

package/src/database/server/models/message.ts

@@ -89,11 +89,9 @@ export class MessageModel {
         },
 
         ttsId: messageTTS.id,
-
-        // TODO: 确认下如何处理 TTS 的读取
-        // ttsContentMd5: messageTTS.contentMd5,
-        // ttsFile: messageTTS.fileId,
-        // ttsVoice: messageTTS.voice,
+        ttsContentMd5: messageTTS.contentMd5,
+        ttsFile: messageTTS.fileId,
+        ttsVoice: messageTTS.voice,
         /* eslint-enable */
       })
       .from(messages)
@@ -113,7 +111,7 @@ export class MessageModel {
 
     const messageIds = result.map((message) => message.id as string);
 
-    if (messageIds.length === 0) return result;
+    if (messageIds.length === 0) return [];
 
     // 2. get relative files
     const rawRelatedFileList = await serverDB
@@ -166,14 +164,7 @@ export class MessageModel {
       .where(inArray(messageQueries.messageId, messageIds));
 
     return result.map(
-      ({
-        model,
-        provider,
-        translate,
-        ttsId,
-        // ttsFile, ttsId, ttsContentMd5, ttsVoice,
-        ...item
-      }) => {
+      ({ model, provider, translate, ttsId, ttsFile, ttsContentMd5, ttsVoice, ...item }) => {
         const messageQuery = messageQueriesList.find((relation) => relation.messageId === item.id);
         return {
           ...item,
@@ -185,9 +176,9 @@ export class MessageModel {
             translate,
             tts: ttsId
               ? {
-                  // contentMd5: ttsContentMd5,
-                  // file: ttsFile,
-                  // voice: ttsVoice,
+                  contentMd5: ttsContentMd5,
+                  file: ttsFile,
+                  voice: ttsVoice,
                 }
               : undefined,
           },

package/src/server/routers/lambda/message.ts

@@ -150,7 +150,7 @@ export const messageRouter = router({
         value: z
           .object({
             contentMd5: z.string().optional(),
-            fileId: z.string().optional(),
+            file: z.string().optional(),
             voice: z.string().optional(),
           })
           .or(z.literal(false)),

package/src/store/file/slices/tts/action.test.ts

@@ -52,38 +52,6 @@ describe('TTSFileAction', () => {
     expect(fileService.removeFile).toHaveBeenCalledWith(fileId);
   });
 
-  // Test for uploadTTSFile
-  it('uploadTTSFile should upload the file and return the file id', async () => {
-    const testFile = new File(['content'], 'test.mp3', { type: 'audio/mp3' });
-    const uploadedFileData = {
-      id: 'new-tts-file-id',
-      createdAt: testFile.lastModified,
-      data: await testFile.arrayBuffer(),
-      fileType: testFile.type,
-      name: testFile.name,
-      saveMode: 'local',
-      size: testFile.size,
-    };
-
-    // Mock the fileService.uploadFile to resolve with uploadedFileData
-    vi.spyOn(fileService, 'createFile').mockResolvedValue({ id: uploadedFileData.id, url: '' });
-
-    let fileId;
-    await act(async () => {
-      fileId = await useStore.getState().uploadTTSFile(testFile);
-    });
-
-    expect(fileService.createFile).toHaveBeenCalledWith({
-      createdAt: testFile.lastModified,
-      data: await testFile.arrayBuffer(),
-      fileType: testFile.type,
-      name: testFile.name,
-      saveMode: 'local',
-      size: testFile.size,
-    });
-    expect(fileId).toBe(uploadedFileData.id);
-  });
-
   // Test for uploadTTSByArrayBuffers
   it('uploadTTSByArrayBuffers should create a file and call uploadTTSFile', async () => {
     const messageId = 'message-id';
@@ -93,8 +61,8 @@ describe('TTSFileAction', () => {
 
     // Spy on uploadTTSFile to simulate a successful upload
     const uploadTTSFileSpy = vi
-      .spyOn(useStore.getState(), 'uploadTTSFile')
-      .mockResolvedValue('new-tts-file-id');
+      .spyOn(useStore.getState(), 'uploadWithProgress')
+      .mockResolvedValue({ id: 'new-tts-file-id', url: '1' });
 
     let fileId;
     await act(async () => {

package/src/store/file/slices/tts/action.ts

@@ -1,12 +1,14 @@
-import useSWR, { SWRResponse } from 'swr';
+import { SWRResponse } from 'swr';
 import { StateCreator } from 'zustand/vanilla';
 
+import { useClientDataSWR } from '@/libs/swr';
 import { fileService } from '@/services/file';
-import { legacyUploadService } from '@/services/upload_legacy';
 import { FileItem } from '@/types/files';
 
 import { FileStore } from '../../store';
 
+const FETCH_TTS_FILE = 'fetchTTSFile';
+
 export interface TTSFileAction {
   removeTTSFile: (id: string) => Promise<void>;
 
@@ -15,8 +17,6 @@ export interface TTSFileAction {
     arrayBuffers: ArrayBuffer[],
   ) => Promise<string | undefined>;
 
-  uploadTTSFile: (file: File) => Promise<string | undefined>;
-
   useFetchTTSFile: (id: string | null) => SWRResponse<FileItem>;
 }
 
@@ -38,26 +38,11 @@ export const createTTSFileSlice: StateCreator<
       type: fileType,
     };
     const file = new File([blob], fileName, fileOptions);
-    return get().uploadTTSFile(file);
-  },
-  uploadTTSFile: async (file) => {
-    try {
-      const res = await legacyUploadService.uploadFile({
-        createdAt: file.lastModified,
-        data: await file.arrayBuffer(),
-        fileType: file.type,
-        name: file.name,
-        saveMode: 'local',
-        size: file.size,
-      });
-
-      const data = await fileService.createFile(res);
-
-      return data.id;
-    } catch (error) {
-      // 提示用户上传失败
-      console.error('upload error:', error);
-    }
+
+    const res = await get().uploadWithProgress({ file });
+
+    return res?.id;
   },
-  useFetchTTSFile: (id) => useSWR(id, fileService.getFile),
+  useFetchTTSFile: (id) =>
+    useClientDataSWR(!!id ? [FETCH_TTS_FILE, id] : null, () => fileService.getFile(id!)),
 });

package/src/store/file/slices/upload/action.ts

@@ -16,7 +16,7 @@ const serverFileService = new ServerService();
 interface UploadWithProgressParams {
   file: File;
   knowledgeBaseId?: string;
-  onStatusUpdate: (
+  onStatusUpdate?: (
     data:
       | {
           id: string;
@@ -53,7 +53,7 @@ export const createFileUploadSlice: StateCreator<
 > = (set, get) => ({
   internal_uploadToClientDB: async ({ file, onStatusUpdate }) => {
     if (!file.type.startsWith('image')) {
-      onStatusUpdate({ id: file.name, type: 'removeFile' });
+      onStatusUpdate?.({ id: file.name, type: 'removeFile' });
       message.info({
         content: t('upload.fileOnlySupportInServerMode', {
           ext: file.name.split('.').pop(),
@@ -73,7 +73,7 @@ export const createFileUploadSlice: StateCreator<
       file,
     );
 
-    onStatusUpdate({
+    onStatusUpdate?.({
       id: file.name,
       type: 'updateFile',
       value: {
@@ -99,7 +99,7 @@ export const createFileUploadSlice: StateCreator<
     // 2. if file exist, just skip upload
     if (checkStatus.isExist) {
       metadata = checkStatus.metadata as FileMetadata;
-      onStatusUpdate({
+      onStatusUpdate?.({
         id: file.name,
         type: 'updateFile',
         value: { status: 'processing', uploadState: { progress: 100, restTime: 0, speed: 0 } },
@@ -107,7 +107,7 @@ export const createFileUploadSlice: StateCreator<
     } else {
       // 2. if file don't exist, need upload files
       metadata = await uploadService.uploadWithProgress(file, (status, upload) => {
-        onStatusUpdate({
+        onStatusUpdate?.({
           id: file.name,
           type: 'updateFile',
           value: { status: status === 'success' ? 'processing' : status, uploadState: upload },
@@ -140,7 +140,7 @@ export const createFileUploadSlice: StateCreator<
       knowledgeBaseId,
     );
 
-    onStatusUpdate({
+    onStatusUpdate?.({
       id: file.name,
       type: 'updateFile',
       value: {

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

@@ -1,72 +0,0 @@
-import { beforeAll, describe, expect, it, vi } from 'vitest';
-
-import { DB_File } from '@/database/client/schemas/files';
-import { edgeClient } from '@/libs/trpc/client';
-import { API_ENDPOINTS } from '@/services/_url';
-import { serverConfigSelectors } from '@/store/serverConfig/selectors';
-import { createServerConfigStore } from '@/store/serverConfig/store';
-
-import { legacyUploadService as uploadService } from '../upload_legacy';
-
-vi.mock('@/store/serverConfig/selectors');
-vi.mock('@/libs/trpc/client', () => {
-  return {
-    edgeClient: {
-      upload: {
-        createS3PreSignedUrl: { mutate: vi.fn() },
-      },
-    },
-  };
-});
-
-beforeAll(() => {
-  createServerConfigStore();
-});
-
-describe('UploadService', () => {
-  describe('uploadFile', () => {
-    it('should upload file to server when enableServer is true', async () => {
-      // Arrange
-      const file: DB_File = {
-        data: new ArrayBuffer(10),
-        fileType: 'text/plain',
-        metadata: {},
-        name: 'test.txt',
-        saveMode: 'local',
-        size: 10,
-      };
-      const mockCreateS3Url = vi.fn().mockResolvedValue('https://example.com');
-      vi.mocked(edgeClient.upload.createS3PreSignedUrl.mutate).mockImplementation(mockCreateS3Url);
-      vi.spyOn(serverConfigSelectors, 'enableUploadFileToServer').mockReturnValue(true);
-      global.fetch = vi.fn().mockResolvedValue({ ok: true } as Response);
-
-      // Act
-      const result = await uploadService.uploadFile(file);
-
-      // Assert
-      expect(mockCreateS3Url).toHaveBeenCalledTimes(1);
-      expect(fetch).toHaveBeenCalledTimes(1);
-      expect(result.url).toMatch(/\/\d+\/[a-f0-9-]+\.txt/);
-      expect(result.saveMode).toBe('url');
-    });
-
-    it('should save file locally when enableServer is false', async () => {
-      // Arrange
-      const file: DB_File = {
-        data: new ArrayBuffer(10),
-        fileType: 'text/plain',
-        metadata: {},
-        name: 'test.txt',
-        saveMode: 'local',
-        size: 10,
-      };
-      vi.spyOn(serverConfigSelectors, 'enableUploadFileToServer').mockReturnValue(false);
-
-      // Act
-      const result = await uploadService.uploadFile(file);
-
-      // Assert
-      expect(result).toEqual(file);
-    });
-  });
-});

package/src/services/upload_legacy.ts

@@ -1,104 +0,0 @@
-import { fileEnv } from '@/config/file';
-import { DB_File } from '@/database/client/schemas/files';
-import { edgeClient } from '@/libs/trpc/client';
-import { API_ENDPOINTS } from '@/services/_url';
-import { serverConfigSelectors } from '@/store/serverConfig/selectors';
-import compressImage from '@/utils/compressImage';
-import { uuid } from '@/utils/uuid';
-
-class UploadService {
-  async uploadFile(file: DB_File) {
-    if (this.enableServer) {
-      const { data, ...params } = file;
-      const filename = `${uuid()}.${file.name.split('.').at(-1)}`;
-
-      // 精确到以 h 为单位的 path
-      const date = (Date.now() / 1000 / 60 / 60).toFixed(0);
-      const dirname = `${fileEnv.NEXT_PUBLIC_S3_FILE_PATH}/${date}`;
-      const pathname = `${dirname}/${filename}`;
-
-      const url = await edgeClient.upload.createS3PreSignedUrl.mutate({ pathname });
-
-      const res = await fetch(url, {
-        body: data,
-        headers: { 'Content-Type': file.fileType },
-        method: 'PUT',
-      });
-
-      if (res.ok) {
-        return {
-          ...params,
-          metadata: { date, dirname: dirname, filename: filename, path: pathname },
-          name: file.name,
-          saveMode: 'url',
-          url: pathname,
-        } as DB_File;
-      } else {
-        throw new Error('Upload Error');
-      }
-    }
-
-    // 跳过图片上传测试
-    const isTestData = file.size === 1;
-    if (this.isImage(file.fileType) && !isTestData) {
-      return this.uploadImageFile(file);
-    }
-
-    // save to local storage
-    // we may want to save to a remote server later
-    return file;
-  }
-
-  /**
-   * @deprecated
-   * @param url
-   * @param file
-   */
-  async uploadImageByUrl(url: string, file: Pick<DB_File, 'name' | 'metadata'>) {
-    const res = await fetch(API_ENDPOINTS.proxy, { body: url, method: 'POST' });
-    const data = await res.arrayBuffer();
-    const fileType = res.headers.get('content-type') || 'image/webp';
-
-    return this.uploadFile({
-      data,
-      fileType,
-      metadata: file.metadata,
-      name: file.name,
-      saveMode: 'local',
-      size: data.byteLength,
-    });
-  }
-
-  private isImage(fileType: string) {
-    const imageRegex = /^image\//;
-    return imageRegex.test(fileType);
-  }
-
-  private async uploadImageFile(file: DB_File) {
-    // 加载图片
-    const url = file.url || URL.createObjectURL(new Blob([file.data!]));
-
-    const img = new Image();
-    img.src = url;
-    await (() =>
-      new Promise((resolve) => {
-        img.addEventListener('load', resolve);
-      }))();
-
-    // 压缩图片
-    const base64String = compressImage({ img, type: file.fileType });
-    const binaryString = atob(base64String.split('base64,')[1]);
-    const uint8Array = Uint8Array.from(binaryString, (char) => char.charCodeAt(0));
-    file.data = uint8Array.buffer;
-
-    return file;
-  }
-
-  private get enableServer() {
-    return serverConfigSelectors.enableUploadFileToServer(
-      window.global_serverConfigStore.getState(),
-    );
-  }
-}
-
-export const legacyUploadService = new UploadService();