@lobehub/chat 0.118.8 → 0.118.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/docs/Add-New-Locale.md +54 -0
  3. package/docs/Add-New-Locale.zh-CN.md +54 -0
  4. package/docs/Home.md +10 -8
  5. package/docs/_Sidebar.md +21 -19
  6. package/package.json +2 -1
  7. package/src/app/chat/(desktop)/features/ChatInput/index.tsx +18 -1
  8. package/src/store/chat/slices/message/action.test.ts +71 -0
  9. package/src/store/chat/slices/message/action.ts +11 -0
package/CHANGELOG.md CHANGED
@@ -2,6 +2,31 @@
2
2
 
3
3
  # Changelog
4
4
 
5
+ ### [Version 0.118.9](https://github.com/lobehub/lobe-chat/compare/v0.118.8...v0.118.9)
6
+
7
+ <sup>Released on **2024-01-03**</sup>
8
+
9
+ #### 💄 Styles
10
+
11
+ - **misc**: Add leaving protect alert.
12
+
13
+ <br/>
14
+
15
+ <details>
16
+ <summary><kbd>Improvements and Fixes</kbd></summary>
17
+
18
+ #### Styles
19
+
20
+ - **misc**: Add leaving protect alert, closes [#927](https://github.com/lobehub/lobe-chat/issues/927) ([ea1d0c0](https://github.com/lobehub/lobe-chat/commit/ea1d0c0))
21
+
22
+ </details>
23
+
24
+ <div align="right">
25
+
26
+ [![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
27
+
28
+ </div>
29
+
5
30
  ### [Version 0.118.8](https://github.com/lobehub/lobe-chat/compare/v0.118.7...v0.118.8)
6
31
 
7
32
  <sup>Released on **2024-01-03**</sup>
package/docs/Add-New-Locale.md ADDED
@@ -0,0 +1,54 @@
1
+ # LobeChat New Locale Guide
2
+
3
+ LobeChat uses [lobe-i18n](https://github.com/lobehub/lobe-cli-toolbox/tree/master/packages/lobe-i18n) as the i18n solution, which allows for quick addition of new language support in the application.
4
+
5
+ ## Adding New Language Support
6
+
7
+ To add new language internationalization support in LobeChat (for example, adding Vietnamese `vi-VN`), please follow the steps below:
8
+
9
+ ### Step 1: Update the Internationalization Configuration File
10
+
11
+ 1. Open the `.i18nrc.js` file. You can find this file in the project's root directory.
12
+ 2. Add the new language code to the configuration file. For example, to add Vietnamese, you need to add `'vi-VN'` to the configuration file.
13
+
14
+ ```js
15
+ module.exports = {
16
+ // ... Other configurations
17
+
18
+ outputLocales: [
19
+ 'zh-TW',
20
+ 'en-US',
21
+ 'ru-RU',
22
+ 'ja-JP',
23
+ // ...Other languages
24
+
25
+ 'vi-VN', // Add 'vi-VN' to the array
26
+ ],
27
+ };
28
+ ```
29
+
30
+ ### Step 2: Automatically Translate Language Files
31
+
32
+ LobeChat uses the `lobe-i18n` tool to automatically translate language files, so manual updating of i18n files is not required.
33
+
34
+ Run the following command to automatically translate and generate the Vietnamese language files:
35
+
36
+ ```bash
37
+ npm run i18n
38
+ ```
39
+
40
+ This will utilize the `lobe-i18n` tool to process the language files.
41
+
42
+ ### Step 3: Submit and Review Your Changes
43
+
44
+ Once you have completed the above steps, you need to submit your changes and create a Pull Request.
45
+
46
+ Ensure that you follow LobeChat's contribution guidelines and provide a necessary description to explain your changes. For example, refer to a similar previous Pull Request [#759](https://github.com/lobehub/lobe-chat/pull/759).
47
+
48
+ ### Additional Information
49
+
50
+ - After submitting your Pull Request, please patiently wait for the project maintainers to review it.
51
+ - If you encounter any issues, you can reach out to the LobeChat community for assistance.
52
+ - For more accurate results, ensure that your Pull Request is based on the latest main branch and stays in sync with the main branch.
53
+
54
+ By following the above steps, you can successfully add new language support to LobeChat and ensure that the application provides a localized experience for more users.
package/docs/Add-New-Locale.zh-CN.md ADDED
@@ -0,0 +1,54 @@
1
+ # LobeChat 新语种添加指南
2
+
3
+ LobeChat 使用 [lobe-i18n](https://github.com/lobehub/lobe-cli-toolbox/tree/master/packages/lobe-i18n) 作为 i18n 解决方案，可以在应用中快速添加新的语言支持。
4
+
5
+ ## 添加新的语言支持
6
+
7
+ 为了在 LobeChat 中添加新的语言国际化支持，（例如添加越南语 `vi-VN`)，请按照以下步骤操作：
8
+
9
+ ### 步骤 1: 更新国际化配置文件
10
+
11
+ 1. 打开 `.i18nrc.js` 文件。你可以在项目的根目录中找到此文件。
12
+ 2. 将新的语言代码添加到配置文件中。例如，为了添加越南语，你需要在配置文件中添加 `'vi-VN'`。
13
+
14
+ ```js
15
+ module.exports = {
16
+ // ... 其他配置
17
+
18
+ outputLocales: [
19
+ 'zh-TW',
20
+ 'en-US',
21
+ 'ru-RU',
22
+ 'ja-JP',
23
+ // ...其他语言
24
+
25
+ 'vi-VN', // 在数组中添加 'vi-VN'
26
+ ],
27
+ };
28
+ ```
29
+
30
+ ### 步骤 2: 自动翻译语言文件
31
+
32
+ LobeChat 使用 `lobe-i18n` 工具来自动翻译语言文件，因此不需要手动更新 i18n 文件。
33
+
34
+ 运行以下命令来自动翻译并生成越南语的语言文件：
35
+
36
+ ```bash
37
+ npm run i18n
38
+ ```
39
+
40
+ 这将会利用 `lobe-i18n` 工具来处理语言文件。
41
+
42
+ ### 步骤 3: 提交和审查你的更改
43
+
44
+ 一旦你完成了上述步骤，你需要提交你的更改并创建一个 Pull Request。
45
+
46
+ 请确保你遵循了 LobeChat 的贡献指南，并提供必要的描述来说明你的更改。例如，参考之前的类似 Pull Request [#759](https://github.com/lobehub/lobe-chat/pull/759)。
47
+
48
+ ### 附加信息
49
+
50
+ - 提交你的 Pull Request 后，请耐心等待项目维护人员的审查。
51
+ - 如果遇到任何问题，可以联系 LobeChat 社区寻求帮助。
52
+ - 为了更精确的结果，确保你的 Pull Request 是基于最新的主分支，并且与主分支保持同步。
53
+
54
+ 通过遵循上述步骤，你可以成功为 LobeChat 添加新的语言支持，并且确保应用能够为更多用户提供本地化的体验。
package/docs/Home.md CHANGED
@@ -12,6 +12,8 @@ LobeChat is a open-source, extensible ([Function Calling][fc-url]), high-perform
12
12
 
13
13
  ![](https://raw.githubusercontent.com/andreasbm/readme/master/assets/lines/rainbow.png)
14
14
 
15
+ [New Locale Guide](https://github.com/lobehub/lobe-chat/wiki/Add-New-Locale) | [新语种添加指南](https://github.com/lobehub/lobe-chat/wiki/Add-New-Locale.zh-CN)
16
+
15
17
  <!-- DOCS LIST -->
16
18
 
17
19
  ### 🤯 Usage
@@ -23,31 +25,31 @@ LobeChat is a open-source, extensible ([Function Calling][fc-url]), high-perform
23
25
 
24
26
  ### 🛳 Self-Hosting
25
27
 
26
- - [Data Statistics](https://github.com/lobehub/lobe-chat/wiki/Analytics) | [数据统计](https://github.com/lobehub/lobe-chat/wiki/Analytics.zh-CN)
27
- - [Deploying with Azure OpenAI](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI) | [使用 Azure OpenAI 部署](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI.zh-CN)
28
- - [Docker Deployment Guide](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment) | [Docker 部署指引](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment.zh-CN)
29
28
  - [Environment Variables](https://github.com/lobehub/lobe-chat/wiki/Environment-Variable) | [环境变量](https://github.com/lobehub/lobe-chat/wiki/Environment-Variable.zh-CN)
29
+ - [Docker Deployment Guide](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment) | [Docker 部署指引](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment.zh-CN)
30
+ - [Deploying with Azure OpenAI](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI) | [使用 Azure OpenAI 部署](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI.zh-CN)
30
31
  - [Upstream Sync](https://github.com/lobehub/lobe-chat/wiki/Upstream-Sync) | [自部署保持更新](https://github.com/lobehub/lobe-chat/wiki/Upstream-Sync.zh-CN)
32
+ - [Data Statistics](https://github.com/lobehub/lobe-chat/wiki/Analytics) | [数据统计](https://github.com/lobehub/lobe-chat/wiki/Analytics.zh-CN)
31
33
 
32
34
  <br/>
33
35
 
34
36
  ### ⌨️ Development
35
37
 
36
38
  - [Technical Development Getting Started Guide](https://github.com/lobehub/lobe-chat/wiki/index) | [技术开发上手指南](https://github.com/lobehub/lobe-chat/wiki/index.zh-CN)
39
+ - [Environment Setup Guide](https://github.com/lobehub/lobe-chat/wiki/Steup-Development) | [开发环境设置](https://github.com/lobehub/lobe-chat/wiki/Steup-Development.zh-CN)
37
40
  - [Architecture Design](https://github.com/lobehub/lobe-chat/wiki/Architecture) | [架构设计](https://github.com/lobehub/lobe-chat/wiki/Architecture.zh-CN)
38
- - [Conversation API Implementation Logic](https://github.com/lobehub/lobe-chat/wiki/Chat-API) | [会话 API 实现逻辑](https://github.com/lobehub/lobe-chat/wiki/Chat-API.zh-CN)
39
- - [Data Store Selector](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors) | [数据存储取数模块](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors.zh-CN)
40
41
  - [Directory Structure](https://github.com/lobehub/lobe-chat/wiki/Folder-Structure) | [目录架构](https://github.com/lobehub/lobe-chat/wiki/Folder-Structure.zh-CN)
41
- - [Environment Setup Guide](https://github.com/lobehub/lobe-chat/wiki/Steup-Development) | [环境设置指南](https://github.com/lobehub/lobe-chat/wiki/Steup-Development.zh-CN)
42
+ - [Data Store Selector](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors) | [数据存储取数模块](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors.zh-CN)
43
+ - [Conversation API Implementation Logic](https://github.com/lobehub/lobe-chat/wiki/Chat-API) | [会话 API 实现逻辑](https://github.com/lobehub/lobe-chat/wiki/Chat-API.zh-CN)
42
44
  - [How to Develop a New Feature](https://github.com/lobehub/lobe-chat/wiki/Feature-Development) | [如何开发一个新功能](https://github.com/lobehub/lobe-chat/wiki/Feature-Development.zh-CN)
43
- - [Resources and References](https://github.com/lobehub/lobe-chat/wiki/Resources) | [资源与参考](https://github.com/lobehub/lobe-chat/wiki/Resources.zh-CN)
44
45
  - [Testing Guide](https://github.com/lobehub/lobe-chat/wiki/Test) | [测试指南](https://github.com/lobehub/lobe-chat/wiki/Test.zh-CN)
46
+ - [Resources and References](https://github.com/lobehub/lobe-chat/wiki/Resources) | [资源与参考](https://github.com/lobehub/lobe-chat/wiki/Resources.zh-CN)
45
47
 
46
48
  <br/>
47
49
 
48
50
  ### 🤖 Agents
49
51
 
50
- - [Agent Index and Submit](https://github.com/lobehub/lobe-chat-agents) | [助手索引与提交](https://github.com/lobehub/lobe-chat-agents/blob/main/README.zh-CN.md)
52
+ - [Agent Index and Submit](https://github.com/lobehub/lobe-chat-agents) | [助手市场与提交](https://github.com/lobehub/lobe-chat-agents/blob/main/README.zh-CN.md)
51
53
 
52
54
  <br/>
53
55
 
package/docs/_Sidebar.md CHANGED
@@ -6,44 +6,46 @@
6
6
 
7
7
  <!-- DOCS LIST -->
8
8
 
9
+ [New Locale Guide](https://github.com/lobehub/lobe-chat/wiki/Add-New-Locale) | [新语种添加指南](https://github.com/lobehub/lobe-chat/wiki/Add-New-Locale.zh-CN)
10
+
9
11
  #### 🤯 Usage
10
12
 
11
- - [Custom Agents Guide](https://github.com/lobehub/lobe-chat/wiki/Usage-Agents) | [中文](https://github.com/lobehub/lobe-chat/wiki/Usage-Agents.zh-CN)
12
- - [Topic Guide](https://github.com/lobehub/lobe-chat/wiki/Usage-Topics) | [中文](https://github.com/lobehub/lobe-chat/wiki/Usage-Topics.zh-CN)
13
+ - [Custom Agents Guide](https://github.com/lobehub/lobe-chat/wiki/Usage-Agents) | [自定义助手指南](https://github.com/lobehub/lobe-chat/wiki/Usage-Agents.zh-CN)
14
+ - [Topic Guide](https://github.com/lobehub/lobe-chat/wiki/Usage-Topics) | [话题指南](https://github.com/lobehub/lobe-chat/wiki/Usage-Topics.zh-CN)
13
15
 
14
16
  #### 🛳 Self-Hosting
15
17
 
16
- - [Data Statistics](https://github.com/lobehub/lobe-chat/wiki/Analytics) | [中文](https://github.com/lobehub/lobe-chat/wiki/Analytics.zh-CN)
17
- - [Deploying with Azure OpenAI](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI) | [中文](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI.zh-CN)
18
- - [Docker Deployment Guide](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment) | [中文](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment.zh-CN)
19
18
  - [Environment Variables](https://github.com/lobehub/lobe-chat/wiki/Environment-Variable) | [中文](https://github.com/lobehub/lobe-chat/wiki/Environment-Variable.zh-CN)
20
- - [Upstream Sync](https://github.com/lobehub/lobe-chat/wiki/Upstream-Sync) | [中文](https://github.com/lobehub/lobe-chat/wiki/Upstream-Sync.zh-CN)
19
+ - [Docker Deployment Guide](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment) | [Docker 部署指引](https://github.com/lobehub/lobe-chat/wiki/Docker-Deployment.zh-CN)
20
+ - [Deploying with Azure OpenAI](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI) | [使用 Azure OpenAI 部署](https://github.com/lobehub/lobe-chat/wiki/Deploy-with-Azure-OpenAI.zh-CN)
21
+ - [Upstream Sync](https://github.com/lobehub/lobe-chat/wiki/Upstream-Sync) | [自部署保持更新](https://github.com/lobehub/lobe-chat/wiki/Upstream-Sync.zh-CN)
22
+ - [Data Statistics](https://github.com/lobehub/lobe-chat/wiki/Analytics) | [数据统计](https://github.com/lobehub/lobe-chat/wiki/Analytics.zh-CN)
21
23
 
22
24
  #### ⌨️ Development
23
25
 
24
- - [Technical Development Getting Started Guide](https://github.com/lobehub/lobe-chat/wiki/index) | [中文](https://github.com/lobehub/lobe-chat/wiki/index.zh-CN)
25
- - [Architecture Design](https://github.com/lobehub/lobe-chat/wiki/Architecture) | [中文](https://github.com/lobehub/lobe-chat/wiki/Architecture.zh-CN)
26
- - [Conversation API Implementation Logic](https://github.com/lobehub/lobe-chat/wiki/Chat-API) | [中文](https://github.com/lobehub/lobe-chat/wiki/Chat-API.zh-CN)
27
- - [Data Store Selector](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors) | [中文](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors.zh-CN)
28
- - [Directory Structure](https://github.com/lobehub/lobe-chat/wiki/Folder-Structure) | [中文](https://github.com/lobehub/lobe-chat/wiki/Folder-Structure.zh-CN)
29
- - [Environment Setup Guide](https://github.com/lobehub/lobe-chat/wiki/Steup-Development) | [中文](https://github.com/lobehub/lobe-chat/wiki/Steup-Development.zh-CN)
30
- - [How to Develop a New Feature](https://github.com/lobehub/lobe-chat/wiki/Feature-Development) | [中文](https://github.com/lobehub/lobe-chat/wiki/Feature-Development.zh-CN)
31
- - [Resources and References](https://github.com/lobehub/lobe-chat/wiki/Resources) | [中文](https://github.com/lobehub/lobe-chat/wiki/Resources.zh-CN)
26
+ - [Technical Development Getting Started Guide](https://github.com/lobehub/lobe-chat/wiki/index) | [技术开发上手指南](https://github.com/lobehub/lobe-chat/wiki/index.zh-CN)
27
+ - [Environment Setup Guide](https://github.com/lobehub/lobe-chat/wiki/Steup-Development) | [开发环境设置](https://github.com/lobehub/lobe-chat/wiki/Steup-Development.zh-CN)
28
+ - [Architecture Design](https://github.com/lobehub/lobe-chat/wiki/Architecture) | [架构设计](https://github.com/lobehub/lobe-chat/wiki/Architecture.zh-CN)
29
+ - [Directory Structure](https://github.com/lobehub/lobe-chat/wiki/Folder-Structure) | [目录架构](https://github.com/lobehub/lobe-chat/wiki/Folder-Structure.zh-CN)
30
+ - [Data Store Selector](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors) | [数据存储取数模块](https://github.com/lobehub/lobe-chat/wiki/Data-Store-Selectors.zh-CN)
31
+ - [Conversation API Implementation Logic](https://github.com/lobehub/lobe-chat/wiki/Chat-API) | [会话 API 实现逻辑](https://github.com/lobehub/lobe-chat/wiki/Chat-API.zh-CN)
32
+ - [How to Develop a New Feature](https://github.com/lobehub/lobe-chat/wiki/Feature-Development) | [如何开发一个新功能](https://github.com/lobehub/lobe-chat/wiki/Feature-Development.zh-CN)
32
33
  - [Testing Guide](https://github.com/lobehub/lobe-chat/wiki/Test) | [中文](https://github.com/lobehub/lobe-chat/wiki/Test.zh-CN)
34
+ - [Resources and References](https://github.com/lobehub/lobe-chat/wiki/Resources) | [资源与参考](https://github.com/lobehub/lobe-chat/wiki/Resources.zh-CN)
33
35
 
34
36
  #### 🤖 Agents
35
37
 
36
- - [Agent Index and Submit](https://github.com/lobehub/lobe-chat-agents) | [中文](https://github.com/lobehub/lobe-chat-agents/blob/main/README.zh-CN.md)
38
+ - [Agent Index and Submit](https://github.com/lobehub/lobe-chat-agents) | [助手市场与提交](https://github.com/lobehub/lobe-chat-agents/blob/main/README.zh-CN.md)
37
39
 
38
40
  #### 🧩 Plugins
39
41
 
40
- - [Plugin Development Guide](https://github.com/lobehub/lobe-chat/wiki/Plugin-Development) | [中文](https://github.com/lobehub/lobe-chat/wiki/Plugin-Development.zh-CN)
41
- - [Plugin Index and Submit](https://github.com/lobehub/lobe-chat-plugins) | [中文](https://github.com/lobehub/lobe-chat-plugins/blob/main/README.zh-CN.md)
42
- - [Plugin SDK Docs](https://chat-plugin-sdk.lobehub.com) | [中文](https://chat-plugin-sdk.lobehub.com)
42
+ - [Plugin Development Guide](https://github.com/lobehub/lobe-chat/wiki/Plugin-Development) | [插件开发指南](https://github.com/lobehub/lobe-chat/wiki/Plugin-Development.zh-CN)
43
+ - [Plugin Index and Submit](https://github.com/lobehub/lobe-chat-plugins) | [插件索引与提交](https://github.com/lobehub/lobe-chat-plugins/blob/main/README.zh-CN.md)
44
+ - [Plugin SDK Docs](https://chat-plugin-sdk.lobehub.com) | [插件 SDK 文档](https://chat-plugin-sdk.lobehub.com)
43
45
 
44
46
  #### 📊 Others
45
47
 
46
- - [Lighthouse Reports](https://github.com/lobehub/lobe-chat/wiki/Lighthouse) | [中文](https://github.com/lobehub/lobe-chat/wiki/Lighthouse.zh-CN)
48
+ - [Lighthouse Reports](https://github.com/lobehub/lobe-chat/wiki/Lighthouse) | [Lighthouse 测试报告](https://github.com/lobehub/lobe-chat/wiki/Lighthouse.zh-CN)
47
49
 
48
50
  <!-- DOCS LIST -->
49
51
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/chat",
3
- "version": "0.118.8",
3
+ "version": "0.118.9",
4
4
  "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.",
5
5
  "keywords": [
6
6
  "framework",
@@ -32,6 +32,7 @@
32
32
  "dev": "next dev -p 3010",
33
33
  "docs": "lobe-i18n md && npm run workflow:docs",
34
34
  "i18n": "npm run workflow:i18n && lobe-i18n",
35
+ "i18n-md": "lobe-i18n md",
35
36
  "lint": "npm run lint:ts && npm run lint:style && npm run type-check && npm run lint:circular",
36
37
  "lint:circular": "dpdm src/**/*.ts --warning false --tree false --exit-code circular:1 -T true",
37
38
  "lint:md": "remark . --quiet --frail --output",
package/src/app/chat/(desktop)/features/ChatInput/index.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import { ActionIcon, ChatInputArea, ChatSendButton } from '@lobehub/ui';
2
2
  import { Maximize2, Minimize2 } from 'lucide-react';
3
- import { memo, useCallback, useMemo } from 'react';
3
+ import { memo, useCallback, useEffect, useMemo } from 'react';
4
4
  import { useTranslation } from 'react-i18next';
5
5
 
6
6
  import {
@@ -78,6 +78,23 @@ const ChatInputDesktopLayout = memo(() => {
78
78
  [expand],
79
79
  );
80
80
 
81
+ const hasValue = !!value;
82
+
83
+ useEffect(() => {
84
+ const fn = (e: BeforeUnloadEvent) => {
85
+ if (hasValue) {
86
+ // set returnValue to trigger alert modal
87
+ // Note: No matter what value is set, the browser will display the standard text
88
+ e.returnValue = '你有正在输入中的内容，确定要离开吗？';
89
+ }
90
+ };
91
+
92
+ window.addEventListener('beforeunload', fn);
93
+ return () => {
94
+ window.removeEventListener('beforeunload', fn);
95
+ };
96
+ }, [hasValue]);
97
+
81
98
  return (
82
99
  <>
83
100
  {canUpload && <DragUpload />}
package/src/store/chat/slices/message/action.test.ts CHANGED
@@ -666,4 +666,75 @@ describe('chatMessage actions', () => {
666
666
  });
667
667
  });
668
668
  });
669
+
670
+ describe('toggleChatLoading', () => {
671
+ it('should set loading state and create an AbortController when loading is true', () => {
672
+ const { result } = renderHook(() => useChatStore());
673
+ const action = 'loading-action';
674
+
675
+ act(() => {
676
+ result.current.toggleChatLoading(true, 'message-id', action);
677
+ });
678
+
679
+ const state = useChatStore.getState();
680
+ expect(state.abortController).toBeInstanceOf(AbortController);
681
+ expect(state.chatLoadingId).toEqual('message-id');
682
+ });
683
+
684
+ it('should clear loading state and abort controller when loading is false', () => {
685
+ const { result } = renderHook(() => useChatStore());
686
+ const action = 'stop-loading-action';
687
+
688
+ // Set initial loading state
689
+ act(() => {
690
+ result.current.toggleChatLoading(true, 'message-id', 'start-loading-action');
691
+ });
692
+
693
+ // Stop loading
694
+ act(() => {
695
+ result.current.toggleChatLoading(false, undefined, action);
696
+ });
697
+
698
+ const state = useChatStore.getState();
699
+ expect(state.abortController).toBeUndefined();
700
+ expect(state.chatLoadingId).toBeUndefined();
701
+ });
702
+
703
+ it('should attach beforeunload event listener when loading starts', () => {
704
+ const { result } = renderHook(() => useChatStore());
705
+ const addEventListenerSpy = vi.spyOn(window, 'addEventListener');
706
+
707
+ act(() => {
708
+ result.current.toggleChatLoading(true, 'message-id', 'loading-action');
709
+ });
710
+
711
+ expect(addEventListenerSpy).toHaveBeenCalledWith('beforeunload', expect.any(Function));
712
+ });
713
+
714
+ it('should remove beforeunload event listener when loading stops', () => {
715
+ const { result } = renderHook(() => useChatStore());
716
+ const removeEventListenerSpy = vi.spyOn(window, 'removeEventListener');
717
+
718
+ // Start and then stop loading to trigger the removal of the event listener
719
+ act(() => {
720
+ result.current.toggleChatLoading(true, 'message-id', 'start-loading-action');
721
+ result.current.toggleChatLoading(false, undefined, 'stop-loading-action');
722
+ });
723
+
724
+ expect(removeEventListenerSpy).toHaveBeenCalledWith('beforeunload', expect.any(Function));
725
+ });
726
+
727
+ it('should not create a new AbortController if one already exists', () => {
728
+ const { result } = renderHook(() => useChatStore());
729
+ const abortController = new AbortController();
730
+
731
+ act(() => {
732
+ useChatStore.setState({ abortController });
733
+ result.current.toggleChatLoading(true, 'message-id', 'loading-action');
734
+ });
735
+
736
+ const state = useChatStore.getState();
737
+ expect(state.abortController).toEqual(abortController);
738
+ });
739
+ });
669
740
  });
package/src/store/chat/slices/message/action.ts CHANGED
@@ -75,6 +75,12 @@ export interface ChatMessageAction {
75
75
 
76
76
  const getAgentConfig = () => agentSelectors.currentAgentConfig(useSessionStore.getState());
77
77
 
78
+ const preventLeavingFn = (e: BeforeUnloadEvent) => {
79
+ // set returnValue to trigger alert modal
80
+ // Note: No matter what value is set, the browser will display the standard text
81
+ e.returnValue = '你有正在生成中的请求，确定要离开吗？';
82
+ };
83
+
78
84
  export const chatMessage: StateCreator<
79
85
  ChatStore,
80
86
  [['zustand/devtools', never]],
@@ -398,11 +404,16 @@ export const chatMessage: StateCreator<
398
404
  },
399
405
  toggleChatLoading: (loading, id, action) => {
400
406
  if (loading) {
407
+ window.addEventListener('beforeunload', preventLeavingFn);
408
+
401
409
  const abortController = new AbortController();
402
410
  set({ abortController, chatLoadingId: id }, false, action);
411
+
403
412
  return abortController;
404
413
  } else {
405
414
  set({ abortController: undefined, chatLoadingId: undefined }, false, action);
415
+
416
+ window.removeEventListener('beforeunload', preventLeavingFn);
406
417
  }
407
418
  },
408
419
  });