@lobehub/chat 0.139.0 → 0.139.2

package/.github/workflows/release.yml

@@ -13,6 +13,8 @@ jobs:
 
       - name: Install bun
         uses: oven-sh/setup-bun@v1
+        with:
+            bun-version: ${{ secrets.BUN_VERSION }}
 
       - name: Install deps
         run: bun i

package/.github/workflows/test.yml

@@ -9,6 +9,8 @@ jobs:
 
       - name: Install bun
         uses: oven-sh/setup-bun@v1
+        with:
+            bun-version: ${{ secrets.BUN_VERSION }}
 
       - name: Install deps
         run: bun i
@@ -20,4 +22,4 @@ jobs:
         run: bun run test:coverage
 
       - name: Upload coverage to Codecov
-        uses: codecov/codecov-action@v3
+        uses: codecov/codecov-action@v4

package/CHANGELOG.md

@@ -2,6 +2,64 @@
 
 # Changelog
 
+### [Version 0.139.2](https://github.com/lobehub/lobe-chat/compare/v0.139.1...v0.139.2)
+
+<sup>Released on **2024-03-22**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Fix code block display issue.
+
+#### 💄 Styles
+
+- **misc**: The bottom safe area height of iOS.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Fix code block display issue, closes [#1675](https://github.com/lobehub/lobe-chat/issues/1675) ([7707dda](https://github.com/lobehub/lobe-chat/commit/7707dda))
+
+#### Styles
+
+- **misc**: The bottom safe area height of iOS, closes [#1637](https://github.com/lobehub/lobe-chat/issues/1637) [#1181](https://github.com/lobehub/lobe-chat/issues/1181) ([44fae5e](https://github.com/lobehub/lobe-chat/commit/44fae5e))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
+### [Version 0.139.1](https://github.com/lobehub/lobe-chat/compare/v0.139.0...v0.139.1)
+
+<sup>Released on **2024-03-17**</sup>
+
+#### 💄 Styles
+
+- **misc**: Improve model tags.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Styles
+
+- **misc**: Improve model tags ([11cd5f4](https://github.com/lobehub/lobe-chat/commit/11cd5f4))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ## [Version 0.139.0](https://github.com/lobehub/lobe-chat/compare/v0.138.2...v0.139.0)
 
 <sup>Released on **2024-03-16**</sup>

package/README.md

@@ -255,14 +255,14 @@ Our marketplace is not just a showcase platform but also a collaborative space.
 
 <!-- AGENT LIST -->
 
-| Recent Submits                                                                                                                                                                               | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |
-| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| [Amazon Seller Support Agent](https://chat-preview.lobehub.com/market?agent=amazon-seller-support-agent)<br/><sup>By **[etnperlong](https://github.com/etnperlong)** on **2024-03-15**</sup> | AI assistant that assists Amazon sellers in responding to customer service replies, providing detailed and cogent responses towards a satisfactory resolution.<br/>`amazon` `seller` `writing`                                                                                                                                                                                                                                                                                                                                |
-| [TikTok Script Writer](https://chat-preview.lobehub.com/market?agent=tiktok-script-writer)<br/><sup>By **[sdhjn19dj1m](https://github.com/sdhjn19dj1m)** on **2024-03-12**</sup>             | This script is tailored for TikTok's short video format, designed to engage and entertain the specified target audience. It incorporates trending elements and best practices for content virality, ensuring the video captures attention from the start. The script is structured to include a captivating opening, concise and impactful message body, and a compelling call-to-action, all while reflecting the user's desired tone and theme.<br/>`tik-tok` `short-video` `viral-content` `trending-hashtag` `engagement` |
-| [Gen Z Engagement Specialist](https://chat-preview.lobehub.com/market?agent=gen-z)<br/><sup>By **[MYSeaIT](https://github.com/MYSeaIT)** on **2024-03-09**</sup>                             | Specializes in engaging Gen Z users with tailored interactions reflecting their preferences and values.<br/>`engagement` `gen-z` `communication` `advice` `interaction`                                                                                                                                                                                                                                                                                                                                                       |
-| [Schedule Management Assistant](https://chat-preview.lobehub.com/market?agent=calendar-manager)<br/><sup>By **[ccdanpian](https://github.com/ccdanpian)** on **2024-03-07**</sup>            | Schedule Management Assistant, calls the time plugin to handle requests for adding, querying, and deleting schedules, supports multiple operations and reminders.<br/>`schedule-management` `time-plugin` `add-schedule` `query-schedule` `delete-schedule`                                                                                                                                                                                                                                                                   |
-
-> 📊 Total agents: [<kbd>**202**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
+| Recent Submits                                                                                                                                                                                 | Description                                                                                                                                                                                                        |
+| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| [Electronic Tutor](https://chat-preview.lobehub.com/market?agent=elec-circuit-tutor-prompt)<br/><sup>By **[XUANJI233](https://github.com/XUANJI233)** on **2024-03-22**</sup>                  | Specializes in explaining the principles of digital and analog circuits, providing fundamental guidance in electronics.<br/>`electronics` `tutor` `explanation` `circuits` `principles`                            |
+| [Game Text Translator](https://chat-preview.lobehub.com/market?agent=translation-tutor-prompt)<br/><sup>By **[XUANJI233](https://github.com/XUANJI233)** on **2024-03-22**</sup>               | Translation of game text including puns and slang explanations (please use claude). Wrap special symbols with \`\`\`.<br/>`game` `text` `translation` `assistance`                                                 |
+| [Amazon Listing Copywriter](https://chat-preview.lobehub.com/market?agent=amazon-listing-copywriter)<br/><sup>By **[SpeedupMaster](https://github.com/SpeedupMaster)** on **2024-03-19**</sup> | Expert in writing persuasive Amazon listings with optimized keywords.<br/>`copywriting` `amazon-product-detail-pages` `seo` `keywords`                                                                             |
+| [Collaborative Logical Thinking Team](https://chat-preview.lobehub.com/market?agent=gpt-tot)<br/><sup>By **[luciouskami](https://github.com/luciouskami)** on **2024-03-19**</sup>             | Using the mind map method, three logical thinking experts collaborate to solve a problem, and present their detailed thought processes in Markdown table format.<br/>`collaboration` `logical-thinking` `solution` |
+
+> 📊 Total agents: [<kbd>**213**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
 
  <!-- AGENT LIST -->
 

package/README.zh-CN.md

@@ -86,7 +86,7 @@
 我们是一群充满热情的设计工程师，希望为 AIGC 提供现代化的设计组件和工具，并以开源的方式分享。
 同时通过 Bootstrapping 的方式，我们希望能够为开发者和用户提供一个更加开放、更加透明友好的产品生态。
 
-不论普通用户与专业开发者 LobeHub 旨在成为所有人的 AI Agent 实验场，LobeChat 目前正在积极开发中，有需求或者问题，欢迎提交 [issues][issues-link]
+不论普通用户与专业开发者，LobeHub 旨在成为所有人的 AI Agent 实验场。LobeChat 目前正在积极开发中，有任何需求或者问题，欢迎提交 [issues][issues-link]
 
 | [![][vercel-shield-badge]][vercel-link]   | 无需安装或注册！访问我们的网站，快速体验                                     |
 | :---------------------------------------- | :--------------------------------------------------------------------------- |
@@ -167,7 +167,7 @@ LobeChat 已经支持 OpenAI 最新的 [`gpt-4-vision`](https://platform.openai.
 
 ### `4` [TTS & STT 语音会话][docs-feat-tts]
 
-LobeChat 支持文字转语音（Text-to-Speech，TTS）和语音转文字（Speech-to-Text，STT）技术，我们的应用能够将文本信息转化为清晰的语音输出，用户可以像与真人交谈一样与我们的对话代理进行交流。
+LobeChat 支持文字转语音（Text-to-Speech，TTS）和语音转文字（Speech-to-Text，STT）技术，这使得我们的应用能够将文本信息转化为清晰的语音输出，用户可以像与真人交谈一样与我们的对话助手进行交流。
 用户可以从多种声音中选择，给助手搭配合适的音源。 同时，对于那些倾向于听觉学习或者想要在忙碌中获取信息的用户来说，TTS 提供了一个极佳的解决方案。
 
 在 LobeChat 中，我们精心挑选了一系列高品质的声音选项 (OpenAI Audio, Microsoft Edge Speech)，以满足不同地域和文化背景用户的需求。用户可以根据个人喜好或者特定场景来选择合适的语音，从而获得个性化的交流体验。
@@ -182,9 +182,9 @@ LobeChat 支持文字转语音（Text-to-Speech，TTS）和语音转文字（Spe
 
 ### `5` [Text to Image 文生图][docs-feat-t2i]
 
-支持最新的文本到图片生成技术，LobeChat 现在能够让用户在与助手对话中直接调用文成图工具进行创作。
+支持最新的文本到图片生成技术，LobeChat 现在能够让用户在与助手对话中直接调用文生图工具进行创作。
 通过利用 [`DALL-E 3`](https://openai.com/dall-e-3)、[`MidJourney`](https://www.midjourney.com/) 和 [`Pollinations`](https://pollinations.ai/) 等 AI 工具的能力， 助手们现在可以将你的想法转化为图像。
-同时可以更私密和沉浸式的完成你的创造过程。
+同时可以更私密和沉浸式地完成你的创作过程。
 
 <div align="right">
 
@@ -202,7 +202,7 @@ LobeChat 的插件生态系统是其核心功能的重要扩展，它极大地
 
 通过利用插件，ChatGPT 能够实现实时信息的获取和处理，例如自动获取最新新闻头条，为用户提供即时且相关的资讯。
 
-此外，这些插件不仅局限于新闻聚合，还可以扩展到其他实用的功能，如快速检索文档、获取电商平台数据、以及其他各式各样的第三方服务。
+此外，这些插件不仅局限于新闻聚合，还可以扩展到其他实用的功能，如快速检索文档、生成图象、获取电商平台数据，以及其他各式各样的第三方服务。
 
 > 通过文档了解更多 [📘 插件使用][docs-usage-plugin]
 
@@ -243,14 +243,14 @@ LobeChat 的插件生态系统是其核心功能的重要扩展，它极大地
 
 <!-- AGENT LIST -->
 
-| 最近新增                                                                                                                                                                            | 助手说明                                                                                                                                                                                                                                                                                                                         |
-| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| [亚马逊卖家支持代理](https://chat-preview.lobehub.com/market?agent=amazon-seller-support-agent)<br/><sup>By **[etnperlong](https://github.com/etnperlong)** on **2024-03-15**</sup> | AI 助手，协助亚马逊卖家回复客户服务回复，提供详细和有力的回复，以达到令人满意的解决方案。<br/>`亚马逊` `卖家` `写作`                                                                                                                                                                                                             |
-| [TikTok 脚本撰写器](https://chat-preview.lobehub.com/market?agent=tiktok-script-writer)<br/><sup>By **[sdhjn19dj1m](https://github.com/sdhjn19dj1m)** on **2024-03-12**</sup>       | 此脚本专为 TikTok 的短视频格式量身定制，旨在吸引和娱乐特定目标受众。它融入了流行元素和内容病毒传播的最佳实践，确保视频从一开始就吸引注意力。脚本结构包括引人入胜的开场、简洁而有影响力的主体信息和引人注目的行动号召，同时反映用户期望的语气和主题。<br/>`tik-tok` `short-video` `viral-content` `trending-hashtag` `engagement` |
-| [Gen Z Engagement Specialist](https://chat-preview.lobehub.com/market?agent=gen-z)<br/><sup>By **[MYSeaIT](https://github.com/MYSeaIT)** on **2024-03-09**</sup>                    | 专注于通过定制互动反映他们的偏好和价值观，与 Gen Z 用户进行互动。<br/>`engagement` `gen-z` `communication` `advice` `interaction`                                                                                                                                                                                                |
-| [日程管理助手](https://chat-preview.lobehub.com/market?agent=calendar-manager)<br/><sup>By **[ccdanpian](https://github.com/ccdanpian)** on **2024-03-07**</sup>                    | 日程管理助手，调用时间插件，处理新增、查询、删除日程请求，支持多种操作和提醒。<br/>`日程管理` `时间插件` `新增日程` `查询日程` `删除日程`                                                                                                                                                                                        |
+| 最近新增                                                                                                                                                                                  | 助手说明                                                                                                         |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
+| [电子学导师](https://chat-preview.lobehub.com/market?agent=elec-circuit-tutor-prompt)<br/><sup>By **[XUANJI233](https://github.com/XUANJI233)** on **2024-03-22**</sup>                   | 擅长数字和模拟电路原理解释，提供电子学基础指导。<br/>`电子学` `导师` `解释` `电路` `原理`                        |
+| [游戏文本翻译师](https://chat-preview.lobehub.com/market?agent=translation-tutor-prompt)<br/><sup>By **[XUANJI233](https://github.com/XUANJI233)** on **2024-03-22**</sup>                | 游戏文本的翻译与双关、俚语解释 (请使用 claude)，如果有特殊符号请使用 \`\`\` 包裹<br/>`游戏` `文本` `翻译` `辅助` |
+| [亚马逊清单文案撰稿员](https://chat-preview.lobehub.com/market?agent=amazon-listing-copywriter)<br/><sup>By **[SpeedupMaster](https://github.com/SpeedupMaster)** on **2024-03-19**</sup> | 擅长撰写具有优化关键词的有说服力的亚马逊清单的专家。<br/>`撰稿` `亚马逊产品详情页` `搜索引擎优化` `关键词`       |
+| [协作逻辑思维团队](https://chat-preview.lobehub.com/market?agent=gpt-tot)<br/><sup>By **[luciouskami](https://github.com/luciouskami)** on **2024-03-19**</sup>                           | 使用思维树方法，三位逻辑思维专家协作解答问题，以 Markdown 表格展示。<br/>`协作` `逻辑思维` `解答`                |
 
-> 📊 Total agents: [<kbd>**202**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
+> 📊 Total agents: [<kbd>**213**</kbd> ](https://github.com/lobehub/lobe-chat-agents)
 
  <!-- AGENT LIST -->
 
@@ -264,7 +264,7 @@ LobeChat 的插件生态系统是其核心功能的重要扩展，它极大地
 
 ### `8` [渐进式 Web 应用 (PWA)][docs-feat-pwa]
 
-我们利深知在当今多设备环境下为用户提供无缝体验的重要性。为此，我们采用了渐进式 Web 应用 [PWA](https://support.google.com/chrome/answer/9658361) 技术，
+我们深知在当今多设备环境下为用户提供无缝体验的重要性。为此，我们采用了渐进式 Web 应用 [PWA](https://support.google.com/chrome/answer/9658361) 技术，
 这是一种能够将网页应用提升至接近原生应用体验的现代 Web 技术。通过 PWA，LobeChat 能够在桌面和移动设备上提供高度优化的用户体验，同时保持轻量级和高性能的特点。
 在视觉和感觉上，我们也经过精心设计，以确保它的界面与原生应用无差别，提供流畅的动画、响应式布局和适配不同设备的屏幕分辨率。
 
@@ -299,7 +299,7 @@ LobeChat 的插件生态系统是其核心功能的重要扩展，它极大地
 
 ### `10` [自定义主题][docs-feat-theme]
 
-作为设计工程师出身 LobeChat 在界面设计上十分考虑用户的个性化体验，因此引入了灵活多变的主题模式，其中包括日间的亮色模式和夜间的深色模式。
+作为设计工程师出身，LobeChat 在界面设计上充分考虑用户的个性化体验，因此引入了灵活多变的主题模式，其中包括日间的亮色模式和夜间的深色模式。
 除了主题模式的切换，还提供了一系列的颜色定制选项，允许用户根据自己的喜好来调整应用的主题色彩。无论是想要沉稳的深蓝，还是希望活泼的桃粉，或者是专业的灰白，用户都能够在 LobeChat 中找到匹配自己风格的颜色选择。
 
 > \[!TIP]
@@ -314,7 +314,7 @@ LobeChat 的插件生态系统是其核心功能的重要扩展，它极大地
 
 ### 更多特性
 
-除了上述功能特性以外，我们的所具有的设计和技术能力将为你带来了更多使用保障：
+除了上述功能特性以外，LobeChat 所具有的设计和技术能力将为你带来更多使用保障：
 
 - [x] 💎 **精致 UI 设计**：经过精心设计的界面，具有优雅的外观和流畅的交互效果，支持亮暗色主题，适配移动端。支持 PWA，提供更加接近原生应用的体验。
 - [x] 🗣️ **流畅的对话体验**：流式响应带来流畅的对话体验，并且支持完整的 Markdown 渲染，包括代码高亮、LaTex 公式、Mermaid 流程图等。
@@ -468,8 +468,7 @@ API Key 是使用 LobeChat 进行大语言模型会话的必要信息，本节
 
 #### `B` 通过 OpenAI 第三方代理商
 
-如果你发现注册 OpenAI 账户或者绑定外币信用卡比较麻烦，可以考虑借助一些知名的 OpenAI 第三方代理商来获取 API Key，
-这可以有效降低获取 OpenAI API Key 的门槛。但与此同时，一旦使用三方服务，你可能也需要承担潜在的风险，
+如果你发现注册 OpenAI 账户或者绑定外币信用卡比较麻烦，可以考虑借助一些知名的 OpenAI 第三方代理商来获取 API Key，这可以有效降低获取 OpenAI API Key 的门槛。但与此同时，一旦使用三方服务，你可能也需要承担潜在的风险，
 请根据你自己的实际情况自行决策。以下是常见的第三方模型代理商列表，供你参考：
 
 |                                                                                                                                                   | 服务商       | 特性说明                                                       | Proxy 代理地址            | 链接                            |

package/docs/self-hosting/advanced/analytics.mdx

@@ -1,5 +1,3 @@
-import { Callout } from 'nextra/components';
-
 # Data Analysis
 
 To better help analyze the usage of LobeChat users, we have integrated several free/open-source data analytics services in LobeChat for collecting user usage data, which you can enable as needed.

package/docs/self-hosting/advanced/analytics.zh-CN.mdx

@@ -1,5 +1,3 @@
-import { Callout } from 'nextra/components';
-
 # 数据分析
 
 为更好地帮助分析 LobeChat 的用户使用情况，我们在 LobeChat 中集成了若干免费 / 开源的数据统计服务，用于收集用户的使用情况，你可以按需开启。

package/docs/self-hosting/advanced/authentication.mdx

@@ -15,10 +15,10 @@ To simultaneously enable multiple identity verification sources, please set the
 
 The order corresponds to the display order of the SSO providers.
 
-| SSO Provider       | Value    |
-| ------------------ | -------- |
-| Auth0              | auth0    |
-| Microsoft Entra ID | azure-ad |
+| SSO Provider       | Value      |
+| ------------------ | ---------- |
+| Auth0              | `auth0`    |
+| Microsoft Entra ID | `azure-ad` |
 
 ## Other SSO Providers
 

package/docs/self-hosting/advanced/authentication.zh-CN.mdx

@@ -15,10 +15,10 @@ LobeChat 支持配置外部身份验证服务，供企业 / 组织内部使用
 
 顺序为 SSO 提供商的显示顺序。
 
-| SSO 提供商            | 值        |
-| ------------------ | -------- |
-| Auth0              | auth0    |
-| Microsoft Entra ID | azure-ad |
+| SSO 提供商            | 值          |
+| ------------------ | ---------- |
+| Auth0              | `auth0`    |
+| Microsoft Entra ID | `azure-ad` |
 
 ## 其他 SSO 提供商
 

package/docs/self-hosting/advanced/sso-providers/auth0.mdx

@@ -1,5 +1,3 @@
-import { Callout, Steps } from 'nextra/components';
-
 # Configure Auth0 Identity Verification Service
 
 <Steps>
@@ -7,15 +5,15 @@ import { Callout, Steps } from 'nextra/components';
 
   Register and log in to [Auth0][auth0-client-page], click on the "Applications" in the left navigation bar to switch to the application management interface, and click "Create Application" in the upper right corner to create an application.
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/1b405347-f4c3-4c55-82f6-47116f2210d0)
+  <Image alt="Create Auth0 Application S1" inStep src="hhttps://github.com/CloudPassenger/lobe-chat/assets/30863298/1b405347-f4c3-4c55-82f6-47116f2210d0" />
 
   Fill in the application name you want to display to the organization users, choose any application type, and click "Create".
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/75c92f85-3ad3-4473-a9c6-e667e28d428d)
+  <Image alt="Create Auth0 Application S2" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/75c92f85-3ad3-4473-a9c6-e667e28d428d" />
 
   After successful creation, click on the corresponding application to enter the application details page, switch to the "Settings" tab, and you can see the corresponding configuration information.
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/a1ed996b-95ef-4b7d-a50d-b4666eccfecb)
+  <Image alt="Create Auth0 Application S3" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/a1ed996b-95ef-4b7d-a50d-b4666eccfecb" />
 
   In the application configuration page, you also need to configure Allowed Callback URLs, where you should fill in:
 
@@ -23,9 +21,9 @@ import { Callout, Steps } from 'nextra/components';
   http(s)://your-domain/api/auth/callback/auth0
   ```
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/575f46aa-f485-49bd-8b90-dbb1ce1a5c1b)
+  <Image alt="Create Auth0 Application S4" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/575f46aa-f485-49bd-8b90-dbb1ce1a5c1b" />
 
-  <Callout type={'info'}>
+  <Callout type={'important'}>
     You can fill in or modify Allowed Callback URLs after deployment, but make sure the filled URL is
     consistent with the deployed URL.
   </Callout>
@@ -34,7 +32,7 @@ import { Callout, Steps } from 'nextra/components';
 
   Click on the "Users Management" in the left navigation bar to enter the user management interface, where you can create users for your organization to log in to LobeChat.
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/3b8127ab-dc4f-4ff9-a4cb-dec3ef0295cc)
+  <Image alt="Add Users" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/3b8127ab-dc4f-4ff9-a4cb-dec3ef0295cc" />
 
   ### Configure Environment Variables
 
@@ -51,7 +49,9 @@ import { Callout, Steps } from 'nextra/components';
   | `ACCESS_CODE`         | Required | Add a password to access this service. You can set a sufficiently long random password to "disable" access code authorization.                                                                      |
   | `NEXTAUTH_URL`        | Optional | The URL is used to specify the callback address for the execution of OAuth authentication in Auth.js. It needs to be set only when the default address is incorrect. `https://example.com/api/auth` |
 
-  <Callout type={'info'}>You can refer to the related variable details at [📘Environment Variables](/en/self-hosting/environment-variable#auth0).</Callout>
+  <Callout type={'tip'}>
+    You can refer to the related variable details at [📘Environment Variables](/en/self-hosting/environment-variable#auth0).
+  </Callout>
 </Steps>
 
 <Callout>
@@ -67,13 +67,13 @@ If your enterprise or organization already has a unified identity authentication
 
 Auth0 supports single sign-on services such as Azure Active Directory, Slack, Google Workspace, Office 365, Zoom, and more. For a detailed list of supported services, please refer to [this link][auth0-sso-integrations].
 
-![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/32650f4f-d0b0-4843-b26d-d35bad11d8a3)
+<Image alt="Connecting to an Existing Single Sign-On Service" src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/32650f4f-d0b0-4843-b26d-d35bad11d8a3" />
 
 ### Configuring Social Login
 
 If your enterprise or organization needs to support external user logins, you can configure social login services in Authentication -> Social.
 
-![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/7b6f6a6c-2686-49d8-9dbd-0516053f1efa)
+<Image alt="Configuring Social Login" src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/7b6f6a6c-2686-49d8-9dbd-0516053f1efa" />
 
 <Callout type={'warning'}>
   Configuring social login services by default allows anyone to authenticate, which may lead to

package/docs/self-hosting/advanced/sso-providers/auth0.zh-CN.mdx

@@ -1,5 +1,3 @@
-import { Callout, Steps } from 'nextra/components';
-
 # 配置 Auth0 身份验证服务
 
 <Steps>
@@ -7,15 +5,15 @@ import { Callout, Steps } from 'nextra/components';
 
   注册并登录 [Auth0][auth0-client-page]，点击左侧导航栏的「Applications」，切换到应用管理界面，点击右上角「Create Application」以创建应用。
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/1b405347-f4c3-4c55-82f6-47116f2210d0)
+  <Image alt="创建 Auth0 应用 S1" inStep src="hhttps://github.com/CloudPassenger/lobe-chat/assets/30863298/1b405347-f4c3-4c55-82f6-47116f2210d0" />
 
   填写你想向组织用户显示的应用名称，可选择任意应用类型，点击「Create」。
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/75c92f85-3ad3-4473-a9c6-e667e28d428d)
+  <Image alt="创建 Auth0 应用 S2" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/75c92f85-3ad3-4473-a9c6-e667e28d428d" />
 
   创建成功后，点击相应的应用，进入应用详情页，切换到「Settings」标签页，就可以看到相应的配置信息
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/a1ed996b-95ef-4b7d-a50d-b4666eccfecb)
+  <Image alt="创建 Auth0 应用 S3" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/a1ed996b-95ef-4b7d-a50d-b4666eccfecb" />
 
   在应用配置页面中，还需要配置 Allowed Callback URLs，在此处填写:
 
@@ -23,9 +21,9 @@ import { Callout, Steps } from 'nextra/components';
   http(s)://your-domain/api/auth/callback/auth0
   ```
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/575f46aa-f485-49bd-8b90-dbb1ce1a5c1b)
+  <Image alt="创建 Auth0 应用 S4" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/575f46aa-f485-49bd-8b90-dbb1ce1a5c1b" />
 
-  <Callout type={'info'}>
+  <Callout type={'important'}>
     可以在部署后再填写或修改 Allowed Callback URLs，但是务必保证填写的 URL 与部署的 URL 一致
   </Callout>
 
@@ -33,7 +31,7 @@ import { Callout, Steps } from 'nextra/components';
 
   点击左侧导航栏的「Users Management」，进入用户管理界面，可以为你的组织新建用户，用以登录 LobeChat
 
-  ![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/3b8127ab-dc4f-4ff9-a4cb-dec3ef0295cc)
+  <Image alt="新增用户" inStep src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/3b8127ab-dc4f-4ff9-a4cb-dec3ef0295cc" />
 
   ### 配置环境变量
 
@@ -50,7 +48,9 @@ import { Callout, Steps } from 'nextra/components';
   | `ACCESS_CODE`         | 必选 | 添加访问此服务的密码，你可以设置一个足够长的随机密码以 “禁用” 访问码授权                                                      |
   | `NEXTAUTH_URL`        | 可选 | 该 URL 用于指定 Auth.js 在执行 OAuth 验证时的回调地址，当默认生成的重定向地址发生不正确时才需要设置。`https://example.com/api/auth` |
 
-  <Callout type={'info'}> 前往 [📘 环境变量](/zh/self-hosting/environment-variable#auth0) 可查阅相关变量详情。</Callout>
+  <Callout type={'tip'}>
+    前往 [📘 环境变量](/zh/self-hosting/environment-variable#auth0) 可查阅相关变量详情。
+  </Callout>
 </Steps>
 
 <Callout type={'info'}>部署成功后，用户将可以使用 Auth0 中配置的用户通过身份认证并使用 LobeChat。</Callout>
@@ -63,13 +63,13 @@ import { Callout, Steps } from 'nextra/components';
 
 Auth0 支持 Azure Active Directory / Slack / Google Workspace / Office 365 / Zoom 等单点登录服务，详细支持列表可参考 [这里][auth0-sso-integrations]
 
-![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/32650f4f-d0b0-4843-b26d-d35bad11d8a3)
+<Image alt="Connecting to an Existing Single Sign-On Service" src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/32650f4f-d0b0-4843-b26d-d35bad11d8a3" />
 
 ### 配置社交登录
 
 如果你的企业或组织需要支持外部人员登录，可以在 Authentication -> Social 中，配置社交登录服务。
 
-![](https://github.com/CloudPassenger/lobe-chat/assets/30863298/7b6f6a6c-2686-49d8-9dbd-0516053f1efa)
+<Image alt="Configuring Social Login" src="https://github.com/CloudPassenger/lobe-chat/assets/30863298/7b6f6a6c-2686-49d8-9dbd-0516053f1efa" />
 
 <Callout type={'warning'}>
   配置社交登录服务默认会允许所有人通过认证，这可能会导致 LobeChat 被外部人员滥用。

package/docs/self-hosting/advanced/sso-providers/microsoft-entra-id.mdx

@@ -10,7 +10,7 @@
   In the `Redirect URI (optional)` section, for the application type, select `Web`, and in the Callback URL, enter:
 
   ```bash
-  https://<your-domain>/api/auth/callback/azure-ad
+  https://your-domain/api/auth/callback/azure-ad
   ```
 
   <Callout type={'info'}>
@@ -18,19 +18,19 @@
     - Please replace "your-domain" with your own domain.
   </Callout>
 
-  ![App Register](https://github.com/lobehub/lobe-chat/assets/13883964/4f9d83bd-b3fc-4abc-bcf4-ccbad65c219d)
+  <Image alt="App Register" inStep src="https://github.com/lobehub/lobe-chat/assets/13883964/4f9d83bd-b3fc-4abc-bcf4-ccbad65c219d" />
 
   Click on "Register".
 
   After successfully creating the application, click on the corresponding application to enter the application details page, and switch to the "Overview" tab to view the corresponding configuration information.
 
-  ![App Overview](https://github.com/lobehub/lobe-chat/assets/13883964/48a0b702-05bd-4ce4-a007-a8ad00a36e5a)
+  <Image alt="App Overview" inStep src="https://github.com/lobehub/lobe-chat/assets/13883964/48a0b702-05bd-4ce4-a007-a8ad00a36e5a" />
 
   Go to "Certificates & secrets", select the "Client secrets" tab, click on "New client secret", fill in the description, select the expiration time, and click on "Add" to create a new client secret.
 
-  ![Create App Client Secret](https://github.com/lobehub/lobe-chat/assets/13883964/c9d66fa0-158c-4bd3-a1fa-969e638259d2)
+  <Image alt="Create App Client Secret" inStep src="https://github.com/lobehub/lobe-chat/assets/13883964/c9d66fa0-158c-4bd3-a1fa-969e638259d2" />
 
-  <Callout type={'info'}>Please make sure to save your client secret as this is your only chance to view it.</Callout>
+  <Callout type={'important'}>Please make sure to save your client secret as this is your only chance to view it.</Callout>
 
   ### Add Users
 
@@ -51,7 +51,10 @@
   | `ACCESS_CODE`            | Required | Add a password for accessing this service, you can set a sufficiently long random password to "disable" access code authorization.                                                                                         |
   | `NEXTAUTH_URL`           | Optional | This URL is used to specify the callback address for Auth.js when performing OAuth authentication. It is only necessary to set it when the default generated redirect address is incorrect. `https://example.com/api/auth` |
 
-  <Callout type={'info'}>You can refer to [📘 environment variables](/en/self-hosting/environment-variable#microsoft-entra-id) for details on related variables.</Callout>
+  <Callout type={'tip'}>
+    You can refer to [📘 environment variables](/en/self-hosting/environment-variable#microsoft-entra-id) for details on related variables.
+  </Callout>
+
 </Steps>
 
 <Callout>After successful deployment, users will be able to authenticate and use LobeChat using the users configured in Microsoft Entra ID.</Callout>

package/docs/self-hosting/advanced/sso-providers/microsoft-entra-id.zh-CN.mdx

@@ -1,5 +1,3 @@
-import { Callout, Steps } from 'nextra/components';
-
 # 配置 Microsoft Entra ID 身份验证服务
 
 ## Microsoft Entra ID 配置流程
@@ -7,55 +5,57 @@ import { Callout, Steps } from 'nextra/components';
 <Steps>
   ### 创建 Microsoft Entra ID 应用
 
-在你的 [Microsoft Azure Portal][microsoft-azure-portal] 进入 Microsoft Entra ID -> App registrations -> New registration 创建一个新的应用。
+  在你的 [Microsoft Azure Portal][microsoft-azure-portal] 进入 Microsoft Entra ID -> App registrations -> New registration 创建一个新的应用。
 
-填写你想向组织用户显示的应用名称，选择你期望支持的账户类型，如果只支持内部用户请选择 `Accounts in this organizational directory only (Default Directory only - Single tenant)`。
+  填写你想向组织用户显示的应用名称，选择你期望支持的账户类型，如果只支持内部用户请选择 `Accounts in this organizational directory only (Default Directory only - Single tenant)`。
 
-在 `Redirect URI (optional)` 中，应用类型选择 `Web`，Callback URL, 处填写：
+  在 `Redirect URI (optional)` 中，应用类型选择 `Web`，Callback URL, 处填写：
 
-```bash
-https://your-domain/api/auth/callback/azure-ad
-```
+  ```bash
+  https://your-domain/api/auth/callback/azure-ad
+  ```
 
-<Callout type={'info'}>
-  - 可以在 Register 后再填写或修改 Redirect URIs，但是务必保证填写的 URL 与部署的 URL 一致。
-  - your-domain 请填写自己的域名
-</Callout>
+  <Callout type={'info'}>
+    - 可以在 Register 后再填写或修改 Redirect URIs，但是务必保证填写的 URL 与部署的 URL 一致。
+    - your-domain 请填写自己的域名
+  </Callout>
 
-![App Register](https://github.com/lobehub/lobe-chat/assets/13883964/4f9d83bd-b3fc-4abc-bcf4-ccbad65c219d)
+  <Image alt="App Register" inStep src="https://github.com/lobehub/lobe-chat/assets/13883964/4f9d83bd-b3fc-4abc-bcf4-ccbad65c219d" />
 
-点击「Register」
+  点击「Register」
 
-创建成功后，点击相应的应用，进入应用详情页，切换到「Overview」标签页，就可以看到相应的配置信息。
+  创建成功后，点击相应的应用，进入应用详情页，切换到「Overview」标签页，就可以看到相应的配置信息。
 
-![App Overview](https://github.com/lobehub/lobe-chat/assets/13883964/48a0b702-05bd-4ce4-a007-a8ad00a36e5a)
+  <Image alt="App Overview" inStep src="https://github.com/lobehub/lobe-chat/assets/13883964/48a0b702-05bd-4ce4-a007-a8ad00a36e5a" />
 
-进入「Certificates & secrets」，选择「Client secrets」标签，点击「New client secret」，填写描述，选择过期时间，点击「Add」，创建一个新的客户端密钥。
+  进入「Certificates & secrets」，选择「Client secrets」标签，点击「New client secret」，填写描述，选择过期时间，点击「Add」，创建一个新的客户端密钥。
 
-![Create App Client Secret](https://github.com/lobehub/lobe-chat/assets/13883964/c9d66fa0-158c-4bd3-a1fa-969e638259d2)
+  <Image alt="Create App Client Secret" inStep src="https://github.com/lobehub/lobe-chat/assets/13883964/c9d66fa0-158c-4bd3-a1fa-969e638259d2" />
 
-=<Callout type={'info'}>请务必保存好你的客户端密钥，因为这是你唯一的机会查看它。</Callout>
+  <Callout type={'important'}>请务必保存好你的客户端密钥，因为这是你唯一的机会查看它。</Callout>
 
-### 新增用户
+  ### 新增用户
 
-回到「Microsoft Entra ID」界面，进入「Users」，点击「New user」，填写用户信息，点击「Create」，创建用户以使用 LobeChat。
+  回到「Microsoft Entra ID」界面，进入「Users」，点击「New user」，填写用户信息，点击「Create」，创建用户以使用 LobeChat。
 
-### 配置环境变量
+  ### 配置环境变量
 
-在部署 LobeChat 时，你需要配置以下环境变量：
+  在部署 LobeChat 时，你需要配置以下环境变量：
 
-| 环境变量 | 类型 | 描述 |
-| --- | --- | --- |
-| `ENABLE_OAUTH_SSO` | 必选 | 为 LobeChat 启用单点登录 (SSO)。设置为 `1` 以启用单点登录。 |
-| `NEXTAUTH_SECRET` | 必选 | 用于加密 Auth.js 会话令牌的密钥。您可以使用以下命令生成秘钥： `openssl rand -base64 32` |
-| `SSO_PROVIDERS` | 必选 | 选择 LoboChat 的单点登录提供商。使用 Microsoft Entra ID 请填写 `azure-ad`。 |
-| `AZURE_AD_CLIENT_ID` | 必选 | Microsoft Entra ID 应用程序的 Client ID |
-| `AZURE_AD_CLIENT_SECRET` | 必选 | Microsoft Entra ID 应用程序的 Client Secret |
-| `AZURE_AD_TENANT_ID` | 必选 | Microsoft Entra ID 应用程序的 Tenant ID |
-| `ACCESS_CODE` | 必选 | 添加访问此服务的密码，你可以设置一个足够长的随机密码以 “禁用” 访问码授权 |
-| `NEXTAUTH_URL` | 可选 | 该 URL 用于指定 Auth.js 在执行 OAuth 验证时的回调地址，当默认生成的重定向地址发生不正确时才需要设置。`https://example.com/api/auth` |
+  | 环境变量                     | 类型 | 描述                                                                                          |
+  | ------------------------ | -- | ------------------------------------------------------------------------------------------- |
+  | `ENABLE_OAUTH_SSO`       | 必选 | 为 LobeChat 启用单点登录 (SSO)。设置为 `1` 以启用单点登录。                                                    |
+  | `NEXTAUTH_SECRET`        | 必选 | 用于加密 Auth.js 会话令牌的密钥。您可以使用以下命令生成秘钥： `openssl rand -base64 32`                               |
+  | `SSO_PROVIDERS`          | 必选 | 选择 LoboChat 的单点登录提供商。使用 Microsoft Entra ID 请填写 `azure-ad`。                                  |
+  | `AZURE_AD_CLIENT_ID`     | 必选 | Microsoft Entra ID 应用程序的 Client ID                                                          |
+  | `AZURE_AD_CLIENT_SECRET` | 必选 | Microsoft Entra ID 应用程序的 Client Secret                                                      |
+  | `AZURE_AD_TENANT_ID`     | 必选 | Microsoft Entra ID 应用程序的 Tenant ID                                                          |
+  | `ACCESS_CODE`            | 必选 | 添加访问此服务的密码，你可以设置一个足够长的随机密码以 “禁用” 访问码授权                                                      |
+  | `NEXTAUTH_URL`           | 可选 | 该 URL 用于指定 Auth.js 在执行 OAuth 验证时的回调地址，当默认生成的重定向地址发生不正确时才需要设置。`https://example.com/api/auth` |
 
-  <Callout type={'info'}>  前往 [📘 环境变量](/zh/self-hosting/environment-variable#microsoft-entra-id) 可查阅相关变量详情。</Callout>
+  <Callout type={'tip'}>
+    前往 [📘 环境变量](/zh/self-hosting/environment-variable#microsoft-entra-id) 可查阅相关变量详情。
+  </Callout>
 </Steps>
 
 <Callout type={'info'}>

package/docs/self-hosting/advanced/upstream-sync.mdx

@@ -1,4 +1,4 @@
-import { Callout, Steps } from 'nextra/components';
+# Upstream Sync
 
 ## `A` Vercel / Zeabur Deployment
 
@@ -16,7 +16,9 @@ If you deployed your project according to the one-click deployment steps in the
 
 After forking the project, due to Github's limitations, you need to manually enable Workflows on the Actions page of your forked project and start the Upstream Sync Action. Once enabled, you can set up automatic updates to occur every hour.
 
-![](https://github-production-user-asset-6210df.s3.amazonaws.com/17870709/266985117-4d48fe7b-0412-4667-8129-b25ebcf2c9de.png) ![](https://github-production-user-asset-6210df.s3.amazonaws.com/17870709/266985177-7677b4ce-c348-4145-9f60-829d448d5be6.png)
+<Image alt="Enable Automatic Updates S1" src="https://github-production-user-asset-6210df.s3.amazonaws.com/17870709/266985117-4d48fe7b-0412-4667-8129-b25ebcf2c9de.png" />
+
+<Image alt="Enable Automatic Updates S2" src="https://github-production-user-asset-6210df.s3.amazonaws.com/17870709/266985177-7677b4ce-c348-4145-9f60-829d448d5be6.png" />
 
 ## `B` Docker Deployment
 
@@ -56,7 +58,7 @@ Upgrading the Docker deployment version is very simple, you just need to redeplo
 
 Ensure that you have sufficient permissions to stop and remove the container before executing these commands, and that Docker has sufficient permissions to pull the new image.
 
-<Callout type={'info'}>
+<Callout type={'tip'}>
   **If I redeploy, will I lose my local chat records?**
 
   No need to worry, you won't. All of LobeChat's chat records are stored in your local browser. Therefore, when redeploying LobeChat using Docker, your chat records will not be lost.