@lobehub/chat 1.78.0 → 1.79.0

package/.github/workflows/sync-database-schema.yml

@@ -5,7 +5,7 @@ on:
     branches:
       - main
     paths:
-      - 'docs/developer/database-schema.dbml'
+      - 'docs/development/database-schema.dbml'
 
 jobs:
   build:

package/.github/workflows/wiki-sync.yml

@@ -4,7 +4,7 @@ on:
   workflow_dispatch:
   push:
     paths:
-      - 'contributing/**'
+      - 'docs/wiki/**'
     branches:
       - main
 
@@ -15,5 +15,5 @@ jobs:
     steps:
       - uses: OrlovM/Wiki-Action@v1
         with:
-          path: 'contributing'
+          path: 'docs/wiki'
           token: ${{ secrets.GH_TOKEN }}

package/CHANGELOG.md

@@ -2,6 +2,31 @@
 
 # Changelog
 
+## [Version 1.79.0](https://github.com/lobehub/lobe-chat/compare/v1.78.0...v1.79.0)
+
+<sup>Released on **2025-04-09**</sup>
+
+#### ✨ Features
+
+- **misc**: Add wiki migrate instructions.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's improved
+
+- **misc**: Add wiki migrate instructions ([8279340](https://github.com/lobehub/lobe-chat/commit/8279340))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ## [Version 1.78.0](https://github.com/lobehub/lobe-chat/compare/v1.77.18...v1.78.0)
 
 <sup>Released on **2025-04-09**</sup>

package/changelog/v1.json

@@ -1,4 +1,13 @@
 [
+  {
+    "children": {
+      "features": [
+        "Add wiki migrate instructions."
+      ]
+    },
+    "date": "2025-04-09",
+    "version": "1.79.0"
+  },
   {
     "children": {
       "features": [

package/{contributing/Basic/Add-New-Authentication-Providers.md → docs/development/basic/add-new-authentication-providers.mdx}

@@ -2,16 +2,6 @@
 
 LobeChat uses [Auth.js v5](https://authjs.dev/) as the external authentication service. Auth.js is an open-source authentication library that provides a simple way to implement authentication and authorization features. This document will introduce how to use Auth.js to implement a new authentication provider.
 
-### TOC
-
-- [Add New Authentication Provider](#add-new-authentication-provider)
-  - [Pre-requisites: Check the Official Provider List](#pre-requisites-check-the-official-provider-list)
-  - [Step 1: Add Authenticator Core Code](#step-1-add-authenticator-core-code)
-  - [Step 2: Update Server Configuration Code](#step-2-update-server-configuration-code)
-  - [Step 3: Change Frontend Pages](#step-3-change-frontend-pages)
-  - [Step 4: Configure the Environment Variables](#step-4-configure-the-environment-variables)
-  - [Step 5: Modify server-side user information processing logic](#step-5-modify-server-side-user-information-processing-logic)
-
 ## Add New Authentication Provider
 
 To add a new authentication provider in LobeChat (for example, adding Okta), you need to follow the steps below:

package/{contributing/Basic/Add-New-Authentication-Providers.zh-CN.md → docs/development/basic/add-new-authentication-providers.zh-CN.mdx}

@@ -2,16 +2,6 @@
 
 LobeChat 使用 [Auth.js v5](https://authjs.dev/) 作为外部身份验证服务。Auth.js 是一个开源的身份验证库，它提供了一种简单的方式来实现身份验证和授权功能。本文档将介绍如何使用 Auth.js 来实现新的身份验证方式。
 
-### TOC
-
-- [添加新的身份验证提供者](#添加新的身份验证提供者)
-  - [准备工作：查阅官方的提供者列表](#准备工作查阅官方的提供者列表)
-  - [步骤 1: 新增关键代码](#步骤-1-新增关键代码)
-  - [步骤 2: 更新服务端配置代码](#步骤-2-更新服务端配置代码)
-  - [步骤 3: 修改前端页面](#步骤-3-修改前端页面)
-  - [步骤 4: 配置环境变量](#步骤-4-配置环境变量)
-  - [步骤 5: 修改服务端用户信息处理逻辑](#步骤-5-修改服务端用户信息处理逻辑)
-
 ## 添加新的身份验证提供者
 
 为了在 LobeChat 中添加新的身份验证提供者（例如添加 Okta)，你需要完成以下步骤：

package/{contributing/Basic/Architecture.md → docs/development/basic/architecture.mdx}

@@ -2,16 +2,6 @@
 
 LobeChat is an AI chat application built on the Next.js framework, aiming to provide an AI productivity platform that enables users to interact with AI through natural language. The following is an overview of the architecture design of LobeChat:
 
-#### TOC
-
-- [Application Architecture Overview](#application-architecture-overview)
-- [Frontend Architecture](#frontend-architecture)
-- [Edge Runtime API](#edge-runtime-api)
-- [Agents Market](#agents-market)
-- [Plugin Market](#plugin-market)
-- [Security and Performance Optimization](#security-and-performance-optimization)
-- [Development and Deployment Process](#development-and-deployment-process)
-
 ## Application Architecture Overview
 
 The overall architecture of LobeChat consists of the frontend, EdgeRuntime API, Agents Market, Plugin Market, and independent plugins. These components collaborate to provide a complete AI experience.

package/{contributing/Basic/Architecture.zh-CN.md → docs/development/basic/architecture.zh-CN.mdx}

@@ -2,16 +2,6 @@
 
 LobeChat 是一个基于 Next.js 框架构建的 AI 聊天应用，旨在提供一个 AI 生产力平台，使用户能够与 AI 进行自然语言交互。以下是 LobeChat 的架构设计介稿：
 
-#### TOC
-
-- [应用架构概览](#应用架构概览)
-- [前端架构](#前端架构)
-- [Edge Runtime API](#edge-runtime-api)
-- [Agents 市场](#agents-市场)
-- [插件市场](#插件市场)
-- [安全性和性能优化](#安全性和性能优化)
-- [开发和部署流程](#开发和部署流程)
-
 ## 应用架构概览
 
 LobeChat 的整体架构由前端、EdgeRuntime API、Agents 市场、插件市场和独立插件组成。这些组件相互协作，以提供完整的 AI 体验。

package/{contributing/Basic/Chat-API.md → docs/development/basic/chat-api.mdx}

@@ -2,12 +2,6 @@
 
 This document explains the implementation logic of Lobe Chat API in client-server interactions, including event sequences and core components involved.
 
-## Table of Contents
-
-- [Interaction Sequence Diagram](#interaction-sequence-diagram)
-- [Main Process Steps](#main-process-steps)
-- [AgentRuntime Overview](#agentruntime-overview)
-
 ## Interaction Sequence Diagram
 
 ```mermaid
@@ -129,7 +123,7 @@ sequenceDiagram
 
    Agent avatar auto-generation implementation:
 
-   ```typescript
+   ```ts
    // src/features/AgentSetting/store/action.ts
    autoPickEmoji: async () => {
      const { config, meta, dispatchMeta } = get();
@@ -153,7 +147,7 @@ sequenceDiagram
 
    Translation feature implementation:
 
-   ```typescript
+   ```ts
    // src/store/chat/slices/translate/action.ts
    translateMessage: async (id, targetLang) => {
      // ...omitted code...
@@ -209,7 +203,7 @@ AgentRuntime is a core abstraction layer in Lobe Chat that encapsulates a unifie
 
 4. **Plugin Architecture**: Through the `src/libs/agent-runtime/runtimeMap.ts` mapping table, it implements an extensible plugin architecture, making it easy to add new model providers. Currently, it supports over 40 different model providers:
 
-   ```typescript
+   ```ts
    export const providerRuntimeMap = {
      openai: LobeOpenAI,
      anthropic: LobeAnthropicAI,
@@ -223,7 +217,7 @@ AgentRuntime is a core abstraction layer in Lobe Chat that encapsulates a unifie
 
 5. **Adapter Pattern**: Internally, it uses the adapter pattern to adapt different provider APIs to the unified `src/libs/agent-runtime/BaseAI.ts` interface:
 
-   ```typescript
+   ```ts
    export interface LobeRuntimeAI {
      baseURL?: string;
      chat(payload: ChatStreamPayload, options?: ChatCompetitionOptions): Promise<Response>;
@@ -242,7 +236,7 @@ AgentRuntime is a core abstraction layer in Lobe Chat that encapsulates a unifie
    1. **OpenRouter Adapter**:
       OpenRouter is a unified API that allows access to AI models from multiple providers. Lobe Chat implements support for OpenRouter through an adapter:
 
-      ```typescript
+      ```ts
       // OpenRouter adapter implementation
       class LobeOpenRouterAI implements LobeRuntimeAI {
         client: OpenAI;
@@ -281,7 +275,7 @@ AgentRuntime is a core abstraction layer in Lobe Chat that encapsulates a unifie
    2. **Google Gemini Adapter**:
       Gemini is Google's large language model. Lobe Chat supports Gemini series models through a dedicated adapter:
 
-      ```typescript
+      ```ts
       import { GoogleGenerativeAI } from '@google/generative-ai';
 
       // Gemini adapter implementation

package/{contributing/Basic/Chat-API.zh-CN.md → docs/development/basic/chat-api.zh-CN.mdx}

@@ -2,12 +2,6 @@
 
 本文档说明了 Lobe Chat API 在前后端交互中的实现逻辑，包括事件序列和涉及的核心组件。
 
-#### TOC
-
-- [交互时序图](#交互时序图)
-- [主要步骤说明](#主要步骤说明)
-- [AgentRuntime 说明](#agentruntime-说明)
-
 ## 交互时序图
 
 ```mermaid
@@ -129,7 +123,7 @@ sequenceDiagram
 
    角色头像自动生成实现：
 
-   ```typescript
+   ```ts
    // src/features/AgentSetting/store/action.ts
    autoPickEmoji: async () => {
      const { config, meta, dispatchMeta } = get();
@@ -153,7 +147,7 @@ sequenceDiagram
 
    翻译功能实现：
 
-   ```typescript
+   ```ts
    // src/store/chat/slices/translate/action.ts
    translateMessage: async (id, targetLang) => {
      // ...省略部分代码...
@@ -209,7 +203,7 @@ AgentRuntime 是 Lobe Chat 中的一个核心抽象层，它封装了与不同 A
 
 4. **插件化架构**：通过 `src/libs/agent-runtime/runtimeMap.ts` 映射表，实现了可扩展的插件化架构，方便添加新的模型提供商。目前支持超过 40 个不同的模型提供商：
 
-   ```typescript
+   ```ts
    export const providerRuntimeMap = {
      openai: LobeOpenAI,
      anthropic: LobeAnthropicAI,
@@ -223,7 +217,7 @@ AgentRuntime 是 Lobe Chat 中的一个核心抽象层，它封装了与不同 A
 
 5. **适配器模式**：在内部使用适配器模式，将不同提供商的 API 适配到统一的 `src/libs/agent-runtime/BaseAI.ts` 接口：
 
-   ```typescript
+   ```ts
    export interface LobeRuntimeAI {
      baseURL?: string;
      chat(payload: ChatStreamPayload, options?: ChatCompetitionOptions): Promise<Response>;
@@ -242,7 +236,7 @@ AgentRuntime 是 Lobe Chat 中的一个核心抽象层，它封装了与不同 A
    1. **OpenRouter 适配器**：
       OpenRouter 是一个统一 API，可以通过它访问多个模型提供商的 AI 模型。Lobe Chat 通过适配器实现对 OpenRouter 的支持：
 
-      ```typescript
+      ```ts
       // OpenRouter 适配器实现
       class LobeOpenRouterAI implements LobeRuntimeAI {
         client: OpenAI;
@@ -281,7 +275,7 @@ AgentRuntime 是 Lobe Chat 中的一个核心抽象层，它封装了与不同 A
    2. **Google Gemini 适配器**：
       Gemini 是 Google 的大语言模型，Lobe Chat 通过专门的适配器支持 Gemini 系列模型：
 
-      ```typescript
+      ```ts
       import { GoogleGenerativeAI } from '@google/generative-ai';
 
       // Gemini 适配器实现

package/{contributing/Basic/Contributing-Guidelines.md → docs/development/basic/contributing-guidelines.mdx}

@@ -2,20 +2,6 @@
 
 Welcome to the Code Style and Contribution Guidelines for LobeChat. This guide will help you understand our code standards and contribution process, ensuring code consistency and smooth project progression.
 
-## TOC
-
-- [Code Style](#code-style)
-  - [ESLint](#eslint)
-  - [Prettier](#prettier)
-  - [remarklint](#remarklint)
-  - [stylelint](#stylelint)
-  - [Style Checking](#style-checking)
-- [Contribution Process](#contribution-process)
-  - [Gitmoji](#gitmoji)
-  - [Semantic Release](#semantic-release)
-  - [Commitlint](#commitlint)
-  - [How to Contribute](#how-to-contribute)
-
 ## Code Style
 
 In LobeChat, we use the [@lobehub/lint](https://github.com/lobehub/lobe-lint) package to maintain a unified code style. This package incorporates configurations for `ESLint`, `Prettier`, `remarklint`, and `stylelint` to ensure that our JavaScript, Markdown, and CSS files adhere to the same coding standards.

package/{contributing/Basic/Contributing-Guidelines.zh-CN.md → docs/development/basic/contributing-guidelines.zh-CN.mdx}

@@ -2,20 +2,6 @@
 
 欢迎来到 LobeChat 的代码风格与贡献指南。本指南将帮助您理解我们的代码规范和贡献流程，确保代码的一致性和项目的顺利进行。
 
-## TOC
-
-- [代码风格](#代码风格)
-  - [ESLint](#eslint)
-  - [Prettier](#prettier)
-  - [remarklint](#remarklint)
-  - [stylelint](#stylelint)
-  - [风格检查](#风格检查)
-- [贡献流程](#贡献流程)
-  - [Gitmoji](#gitmoji)
-  - [Semantic Release](#semantic-release)
-  - [Commitlint](#commitlint)
-  - [如何贡献](#如何贡献)
-
 ## 代码风格
 
 在 LobeChat 中，我们使用 [@lobehub/lint](https://github.com/lobehub/lobe-lint) 程序包来统一代码风格。该程序包内置了 `ESLint`、`Prettier`、`remarklint` 和 `stylelint` 的配置，以确保我们的 JavaScript、Markdown 和 CSS 文件遵循相同的编码标准。

package/{contributing/Basic/Feature-Development-Frontend.md → docs/development/basic/feature-development-frontend.mdx}

@@ -10,14 +10,6 @@ LobeChat is built on the Next.js framework and uses TypeScript as the primary de
 
 Taking the "Chat Messages" feature as an example, here are the brief steps to implement this feature:
 
-#### TOC
-
-- [1. Define Routes](#1-define-routes)
-- [2. Define Data Structure](#2-define-data-structure)
-- [3. Create Zustand Store](#3-create-zustand-store)
-- [4. Create Page and Components](#4-create-page-and-components)
-- [5. Function Binding](#5-function-binding)
-
 ## 1. Define Routes
 
 In the `src/app` directory, we need to define a new route to host the "Chat Messages" page. Generally, we would create a new folder under `src/app`, for example, `chat`, and create a `page.tsx` file within this folder to export a React component as the main body of the page.

package/{contributing/Basic/Feature-Development-Frontend.zh-CN.md → docs/development/basic/feature-development-frontend.zh-CN.mdx}

@@ -10,14 +10,6 @@ LobeChat 基于 Next.js 框架构建，使用 TypeScript 作为主要开发语
 
 我们以 "会话消息" 功能为例，以下是实现这个功能的简要步骤：
 
-#### TOC
-
-- [1. 定义路由](#1-定义路由)
-- [2. 定义数据结构](#2-定义数据结构)
-- [3. 创建 Zustand Store](#3-创建-zustand-store)
-- [4. 创建页面与组件](#4-创建页面与组件)
-- [5. 功能绑定](#5-功能绑定)
-
 ## 1. 定义路由
 
 在 `src/app` 目录下，我们需要定义一个新的路由来承载 "会话消息" 页面。一般来说，我们会在 `src/app` 下创建一个新的文件夹，例如 `chat`，并且在这个文件夹中创建 `page.tsx`文件，在该文件中导出 React 组件作为页面的主体。

package/{contributing/Basic/Feature-Development.md → docs/development/basic/feature-development.mdx}

@@ -13,7 +13,7 @@ We will use the implementation of sessionGroup as an example: [✨ feat: add ses
 
 ## 1. Data Model / Database Definition
 
-To implement the Session Group feature, it is necessary to define the relevant data model and indexes at the database level.
+To implementation the Session Group feature, it is necessary to define the relevant data model and indexes at the database level.
 
 Define a new sessionGroup table in 3 steps:
 
@@ -21,7 +21,7 @@ Define a new sessionGroup table in 3 steps:
 
 Define the data model of `DB_SessionGroup` in `src/database/schema/sessionGroup.ts`:
 
-```typescript
+```ts
 import { z } from 'zod';
 
 export const DB_SessionGroupSchema = z.object({
@@ -70,7 +70,7 @@ export const dbSchemaV3 = {
 
 > \[!Important]
 >
-> If you are unfamiliar with the need to create indexes here and the syntax of schema definition, you may need to familiarize yourself with the basics of Dexie.js. You can refer to the [📘 Local Database](./Local-Database.zh-CN) section for relevant information.
+> If you are unfamiliar with the need to create indexes here and the syntax of schema definition, you may need to familiarize yourself with the basics of Dexie.js.
 
 ### 3. Add the sessionGroups Table to the Local DB
 
@@ -127,7 +127,7 @@ When building the LobeChat application, the Model is responsible for interacting
 
 In `src/database/model/sessionGroup.ts`, the `SessionGroupModel` is defined as follows:
 
-```typescript
+```ts
 import { BaseModel } from '@/database/client/core';
 import { DB_SessionGroup, DB_SessionGroupSchema } from '@/database/client/schemas/sessionGroup';
 import { nanoid } from '@/utils/uuid';
@@ -155,7 +155,7 @@ To maintain code maintainability and extensibility, we place the logic related t
 
 `SessionService` implements session group-related request logic by calling methods from `SessionGroupModel`. The following is the implementation of Session Group-related request logic in `sessionService`:
 
-```typescript
+```ts
 class SessionService {
   // ... Omitted session business logic
 
@@ -178,7 +178,7 @@ class SessionService {
 
 ## 3. Frontend Data Flow Store Implementation
 
-In the LobeChat application, the Store module is used to manage the frontend state of the application. The Actions within it are functions that trigger state updates, usually by calling methods in the service layer to perform actual data processing operations and then updating the state in the Store. We use `zustand` as the underlying dependency for the Store module. For a detailed practical introduction to state management, you can refer to [📘 Best Practices for State Management](../State-Management/State-Management-Intro.zh-CN.md).
+In the LobeChat application, the Store module is used to manage the frontend state of the application. The Actions within it are functions that trigger state updates, usually by calling methods in the service layer to perform actual data processing operations and then updating the state in the Store. We use `zustand` as the underlying dependency for the Store module. For a detailed practical introduction to state management, you can refer to [📘 Best Practices for State Management](../state-management/state-management-intro).
 
 ### sessionGroup CRUD
 
@@ -238,7 +238,7 @@ To handle these groups, we need to refactor the implementation logic of `useFetc
 
 This method is defined in `createSessionSlice` as follows:
 
-```typescript
+```ts
 export const createSessionSlice: StateCreator<
   SessionStore,
   [['zustand/devtools', never]],
@@ -271,7 +271,7 @@ After successfully retrieving the data, we use the `set` method to update the `c
 
 The `sessionService.getGroupedSessions` method is responsible for calling the backend API `SessionModel.queryWithGroups()`.
 
-```typescript
+```ts
 class SessionService {
   // ... other SessionGroup related implementations
 
@@ -285,7 +285,7 @@ class SessionService {
 
 This method is the core method called by `sessionService.getGroupedSessions`, and it is responsible for querying and organizing session data. The code is as follows:
 
-```typescript
+```ts
 class _SessionModel extends BaseModel {
   // ... other methods
 
@@ -510,7 +510,6 @@ describe('MigrationV2ToV3', () => {
 ```
 
 ```markdown
-
 ```
 
 Unit tests require the use of `fixtures` to fix the test data. The test cases include verification logic for two parts: 1) the correctness of a single migration (v2 -> v3) and 2) the correctness of a complete migration (v1 -> v3).

package/{contributing/Basic/Feature-Development.zh-CN.md → docs/development/basic/feature-development.zh-CN.mdx}

@@ -21,7 +21,7 @@
 
 在 `src/database/schema/sessionGroup.ts` 中定义 `DB_SessionGroup` 的数据模型：
 
-```typescript
+```ts
 import { z } from 'zod';
 
 export const DB_SessionGroupSchema = z.object({
@@ -70,7 +70,7 @@ export const dbSchemaV3 = {
 
 > \[!Important]
 >
-> 如果你不了解为何此处需要创建索引，以及不了解此处的 schema 的定义语法。你可能需要提前了解下 Dexie.js 相关的基础知识，可以查阅 [📘 本地数据库](./Local-Database.zh-CN) 部分了解相关内容。
+> 如果你不了解为何此处需要创建索引，以及不了解此处的 schema 的定义语法。你可能需要提前了解下 Dexie.js 相关的基础知识。
 
 ### 3. 在本地 DB 中加入 sessionGroups 表
 
@@ -127,7 +127,7 @@ export class LocalDB extends Dexie {
 
 在 `src/database/model/sessionGroup.ts` 中定义 `SessionGroupModel`：
 
-```typescript
+```ts
 import { BaseModel } from '@/database/client/core';
 import { DB_SessionGroup, DB_SessionGroupSchema } from '@/database/client/schemas/sessionGroup';
 import { nanoid } from '@/utils/uuid';
@@ -155,7 +155,7 @@ export const SessionGroupModel = new _SessionGroupModel();
 
 `SessionService` 通过调用 `SessionGroupModel` 的方法来实现对会话分组的管理。 在 `sessionService` 中实现 Session Group 相关的请求逻辑：
 
-```typescript
+```ts
 class SessionService {
   // ... 省略 session 业务逻辑
 
@@ -178,7 +178,7 @@ class SessionService {
 
 ## 三、前端数据流 Store 实现
 
-在 LobeChat 应用中，Store 是用于管理应用前端状态的模块。其中的 Action 是触发状态更新的函数，通常会调用服务层的方法来执行实际的数据处理操作，然后更新 Store 中的状态。我们采用了 `zustand` 作为 Store 模块的底层依赖，对于状态管理的详细实践介绍，可以查阅 [📘 状态管理最佳实践](../State-Management/State-Management-Intro.zh-CN.md)
+在 LobeChat 应用中，Store 是用于管理应用前端状态的模块。其中的 Action 是触发状态更新的函数，通常会调用服务层的方法来执行实际的数据处理操作，然后更新 Store 中的状态。我们采用了 `zustand` 作为 Store 模块的底层依赖，对于状态管理的详细实践介绍，可以查阅 [📘 状态管理最佳实践](/zh/docs/development/state-management/state-management-intro)
 
 ### sessionGroup CRUD
 
@@ -238,7 +238,7 @@ export const createSessionGroupSlice: StateCreator<
 
 该方法在 `createSessionSlice` 中定义，如下所示：
 
-```typescript
+```ts
 export const createSessionSlice: StateCreator<
   SessionStore,
   [['zustand/devtools', never]],
@@ -271,7 +271,7 @@ export const createSessionSlice: StateCreator<
 
 使用 `sessionService.getGroupedSessions` 方法负责调用后端接口 `SessionModel.queryWithGroups()`
 
-```typescript
+```ts
 class SessionService {
   // ... 其他 SessionGroup 相关的实现
 
@@ -285,7 +285,7 @@ class SessionService {
 
 此方法是 `sessionService.getGroupedSessions` 调用的核心方法，它负责查询和组织会话数据，代码如下：
 
-```typescript
+```ts
 class _SessionModel extends BaseModel {
   // ... 其他方法
 
@@ -348,8 +348,7 @@ const customSessionGroups = (s: SessionStore): CustomSessionGroup[] => s.customS
 由于在 UI 中的取数全部是通过 `useSessionStore(sessionSelectors.defaultSessions)` 这样的写法实现的，因此我们只需要修改 `defaultSessions` 的选择器实现，即可完成数据结构的变更。 UI 层的取数代码完全不用变更，可以大大降低重构的成本和风险。
 
 > !\[Important]
->
-> 如果你对 Selectors 的概念和功能不太了解，可以查阅 [📘 数据存储取数模块](../State-Management/State-Management-Selectors.zh-CN.md) 部分了解相关内容。
+> 如果你对 Selectors 的概念和功能不太了解，可以查阅 [📘 数据存储取数模块](/zh/docs/development/state-management/state-management-selectors) 部分了解相关内容。
 
 ## 四、UI 实现与 action 绑定
 
@@ -570,15 +569,15 @@ export class LocalDB extends Dexie {
 
 数据导入导出的核心实现在 `src/service/config.ts` 的 `ConfigService` 中，其中的关键方法如下：
 
-| 方法名称              | 描述             |
-| --------------------- | ---------------- |
-| `importConfigState`   | 导入配置数据     |
+| 方法名称                  | 描述       |
+| --------------------- | -------- |
+| `importConfigState`   | 导入配置数据   |
 | `exportAgents`        | 导出所有助理数据 |
 | `exportSessions`      | 导出所有会话数据 |
 | `exportSingleSession` | 导出单个会话数据 |
 | `exportSingleAgent`   | 导出单个助理数据 |
-| `exportSettings`      | 导出设置数据     |
-| `exportAll`           | 导出所有数据     |
+| `exportSettings`      | 导出设置数据   |
+| `exportAll`           | 导出所有数据   |
 
 ### 数据导出
 

package/{contributing/Basic/Resources.md → docs/development/basic/resources.mdx}

@@ -3,17 +3,11 @@
 The design and development of LobeChat would not have been possible without the excellent projects in the community and ecosystem. We have used or referred to some outstanding resources and guides in the design and development process. Here are some key reference resources for developers to refer to during the development and learning process:
 
 1. **OpenAI API Guide**: We use OpenAI's API to access and process AI conversation data. You can check out the [OpenAI API Guide](https://platform.openai.com/docs/api-reference/introduction) for more details.
-
 2. **OpenAI SDK**: We use OpenAI's Node.js SDK to interact with OpenAI's API. You can view the source code and documentation on the [OpenAI SDK](https://github.com/openai/openai-node) GitHub repository.
-
 3. **AI SDK**: We use Vercel's AI SDK to access and process AI conversation data. You can refer to the documentation of [AI SDK](https://sdk.vercel.ai/docs) for more details.
-
 4. **LangChain**: Our early conversation feature was implemented based on LangChain. You can visit [LangChain](https://langchain.com) to learn more about it.
-
 5. **Chat-Next-Web**: Chat Next Web is an excellent project, and some of LobeChat's features and workflows are referenced from its implementation. You can view the source code and documentation on the [Chat-Next-Web](https://github.com/Yidadaa/ChatGPT-Next-Web) GitHub repository.
-
 6. **Next.js Documentation**: Our project is built on Next.js, and you can refer to the [Next.js Documentation](https://nextjs.org/docs) for more information about Next.js.
-
 7. **FlowGPT**: FlowGPT is currently the world's largest Prompt community, and some of the agents in LobeChat come from active authors in FlowGPT. You can visit [FlowGPT](https://flowgpt.com/) to learn more about it.
 
 We will continue to update and supplement this list to provide developers with more reference resources.

package/{contributing/Basic/Resources.zh-CN.md → docs/development/basic/resources.zh-CN.mdx}

@@ -3,17 +3,11 @@
 LobeChat 的设计和开发离不开社区和生态中的优秀项目。我们在设计和开发过程中使用或参考了一些优秀的资源和指南。以下是一些主要的参考资源，供开发者在开发和学习过程中参考：
 
 1. **OpenAI API 指南**：我们使用 OpenAI 的 API 来获取和处理 AI 的会话数据。你可以查看 [OpenAI API 指南](https://platform.openai.com/docs/api-reference/introduction) 了解更多详情。
-
 2. **OpenAI SDK**：我们使用 OpenAI 的 Node.js SDK 来与 OpenAI 的 API 交互。你可以在 [OpenAI SDK](https://github.com/openai/openai-node) 的 GitHub 仓库中查看源码和文档。
-
 3. **AI SDK**：我们使用 Vercel 的 AI SDK 来获取和处理 AI 的会话数据。你可以查看 [AI SDK](https://sdk.vercel.ai/docs) 的文档来了解更多详情。
-
 4. **LangChain**：我们早期的会话功能是基于 LangChain 实现的。你可以访问 [LangChain](https://langchain.com) 来了解更多关于它的信息。
-
 5. **Chat-Next-Web**：Chat Next Web 是一个优秀的项目，LobeChat 的部分功能、Workflow 等参考了它的实现。你可以在 [Chat-Next-Web](https://github.com/Yidadaa/ChatGPT-Next-Web) 的 GitHub 仓库中查看源码和文档。
-
 6. **Next.js 文档**：我们的项目是基于 Next.js 构建的，你可以查看 [Next.js 文档](https://nextjs.org/docs) 来了解更多关于 Next.js 的信息。
-
 7. **FlowGPT**：FlowGPT 是目前全球最大的 Prompt 社区，LobeChat 中的一些 Agent 来自 FlowGPT 的活跃作者。你可以访问 [FlowGPT](https://flowgpt.com/) 来了解更多关于它的信息。
 
 我们会持续更新和补充这个列表，为开发者提供更多的参考资源。

package/{contributing/Basic/Setup-Development.md → docs/development/basic/setup-development.mdx}

@@ -2,13 +2,6 @@
 
 Welcome to the LobeChat development environment setup guide.
 
-#### TOC
-
-- [Online Development](#online-development)
-- [Local Development](#local-development)
-  - [Development Environment Requirements](#development-environment-requirements)
-  - [Project Setup](#project-setup)
-
 ## Online Development
 
 If you have access to GitHub Codespaces, you can click the button below to enter the online development environment with just one click:

package/{contributing/Basic/Setup-Development.zh-CN.md → docs/development/basic/setup-development.zh-CN.mdx}

@@ -2,13 +2,6 @@
 
 欢迎阅读 LobeChat 的开发环境设置指南。
 
-#### TOC
-
-- [在线开发](#在线开发)
-- [本地开发](#本地开发)
-  - [开发环境需求](#开发环境需求)
-  - [项目设置](#项目设置)
-
 ## 在线开发
 
 如果你有 GitHub Codespaces 的使用权限，可以点击下方按钮一键进入在线开发环境：

package/{contributing/Basic/Test.md → docs/development/basic/test.mdx}

@@ -2,21 +2,13 @@
 
 LobeChat's testing strategy includes unit testing and end-to-end (E2E) testing. Below are detailed explanations of each type of testing:
 
-#### TOC
-
-- [Unit Testing](#unit-testing)
-- [🚧 End-to-End Testing](#-end-to-end-testing)
-- [Development Testing](#development-testing)
-  - [1. Unit Testing](#1-unit-testing)
-- [Testing Strategy](#testing-strategy)
-
 ## Unit Testing
 
 Unit testing is used to test the functionality of independent units in the application, such as components, functions, utility functions, etc. We use [vitest][vitest-url] for unit testing.
 
 To run unit tests, you can use the following command:
 
-```
+```bash
 npm run test
 ```
 
@@ -42,7 +34,7 @@ Before writing unit tests, you need to create a directory with the same name as
 
 In the test file, you can use the `describe` and `it` functions to organize and write test cases. The `describe` function is used to create a test suite, and the `it` function is used to write specific test cases.
 
-```typescript
+```ts
 import { formatNumber } from './formatNumber';
 
 describe('formatNumber', () => {
@@ -64,7 +56,7 @@ In test cases, you can use the `expect` function to assert whether the test resu
 
 Execute unit tests by running the following command:
 
-```
+```bash
 npm run test
 ```