+ }
+
+ );
+}
+```
+
+### Class 中使用
+
+#### 示例
+
+```jsx
+import { DocumentCommands, LibroView, NotebookCommands } from '@difizen/libro-jupyter';
+import { CommandRegistry, inject, singleton } from '@difizen/mana-app';
+
+@singleton()
+export class LibroCommandDemoService {
+ @inject(CommandRegistry) commandRegistry: CommandRegistry;
+
+ save = (libroView:LibroView|undefined) => {
+ //通过命令进行保存
+ this.commandRegistry.executeCommand(
+ DocumentCommands['Save'].id,
+ undefined,
+ libroView,
+ undefined
+ );
+ };
+
+ selectAll = (libroView:LibroView|undefined) => {
+ //通过命令进行 cell 全选操作
+ this.commandRegistry.executeCommand(
+ NotebookCommands['SelectAll'].id,
+ undefined,
+ libroView,
+ undefined
+ );
+ };
+
+ runAllCells = (libroView:LibroView|undefined) => {
+ //通过命令进行执行全部 cell 操作
+ this.commandRegistry.executeCommand(
+ NotebookCommands['RunAllCells'].id,
+ undefined,
+ libroView,
+ undefined
+ );
+ };
+
+ insertCellBelow = (libroView:LibroView|undefined) => {
+ //通过命令进行向下插入 cell 操作
+ this.commandRegistry.executeCommand(
+ NotebookCommands['InsertCellBelow'].id,
+ libroView?.activeCell,
+ libroView,
+ undefined
+ );
+ };
+}
+```
+
+## 如何注册自定义命令？
+
+在 libro 中，每个模块都可以向命令注册表中添加命令。最基础的命令通常包含这几个部分：
+
+- id: 命令的唯一标识符。
+- label: 命令的描述，用于菜单或命令面板。
+- handler: 命令被触发时的执行函数。
+
+### 命令定义
+
+定义命令主要是为每个命令指定一个唯一的标识符（id）和一个可读的标签（label）。这是命令系统的基础部分，它决定了命令在应用程序中的身份和展示方式。
+
+#### 自定义命令定义示例
+
+```typescript
+export const LibroDemoCommand = {
+ demoCommand1: {
+ id: 'demo:libro-command-1',
+ label: '普通命令demo示例1',
+ },
+ demoCommand2: {
+ id: 'demo:libro-command-2',
+ label: '普通命令demo示例2',
+ },
+};
+```
+
+### 命令实现
+
+1. 实现命令的 handler，handler 是命令的核心部分，负责控制命令的行为。它包含以下三个可选函数：
+
+- execute: 命令执行的具体逻辑，用户触发命令时会调用此函数。
+- isEnabled: 判断命令是否处于可用状态。如果返回 false，命令将不可执行且不可点击。
+- isVisible: 判断命令是否可见。如果返回 false，命令不会显示在菜单或工具栏等 UI 中。
+ 关于 isEnabled、isVisible 的更多内容详情请看：xxx
+
+2. 注册命令。libro 使用依赖注入机制来管理命令的注册，因此你需要创建一个命令扩展类，并在这个类中注册命令。命令扩展类实现了 `CommandContribution` 接口，这个接口提供了 `registerCommands` 方法，专门用于注册命令。此外，提供了 `LibroCommandRegister` 和 `CommandRegistry`两种方式注册命令。
+
+- `LibroCommandRegister`：使用该种方式意味着，当前命令的参数依次是：`CellView`实例、`LibroView` 实例、position（关于该参数的解释详情请看：xxx） ,即使在命令执行时没有传递参数，在命令的 handler 中也能拿到当前上下的文对应的 `CellView` 实例、`LibroView` 实例。
+- `CommandRegistry`：通过该种方式注册则是在命令的 handler 中只能拿到命令执行时传递的参数。
+
+3. 把新增的命令扩展类注册进 mana module 中。
+
+```typescript
+export const LibroCommandDemoModule = ManaModule.create()
+ .register(LibroCommandDemoService, LibroDemoCommandContribution)
+ .dependOn(LibroEditorModule);
+```
+
+#### 自定义命令注册示例
+
+```typescript
+import { LibroCommandRegister } from '@difizen/libro-jupyter';
+import {
+ CommandContribution,
+ CommandRegistry,
+ inject,
+ singleton,
+} from '@difizen/mana-app';
+import { LibroDemoCommand } from './libro-demo-command';
+
+@singleton({ contrib: CommandContribution })
+export class LibroDemoCommandContribution implements CommandContribution {
+ @inject(LibroCommandRegister) protected readonly libroCommand: LibroCommandRegister;
+
+ registerCommands(command: CommandRegistry): void {
+ this.libroCommand.registerLibroCommand(command, LibroDemoCommand['demoCommand1'], {
+ execute: async (cell, libro, path) => {
+ console.log(
+ '使用 LibroCommandRegister 的方式注册的 demoCommand1 被执行',
+ cell,
+ libro,
+ path,
+ );
+ },
+ isEnabled: () => {
+ return true;
+ },
+ });
+ command.registerCommand(LibroDemoCommand['demoCommand2'], {
+ execute: async (args1, args2) => {
+ console.log(
+ '使用 CommandRegistry 的方式注册的 demoCommand2 被执行',
+ args1,
+ args2,
+ );
+ },
+ });
+ }
+}
+```
diff --git a/apps/docs/docs/integration/index.md b/apps/docs/docs/integration/index.md
index c453e7f9..227997c3 100644
--- a/apps/docs/docs/integration/index.md
+++ b/apps/docs/docs/integration/index.md
@@ -1,39 +1,39 @@
---
-title: 快速集成
+title: Quick Integration
order: 0
---
-# 概览
+# Overview
-Libro 提供了前端和服务侧的定制接入能力，本文将手把手教你快速定制接入。
+Libro offers customizable integration capabilities for both frontend and server-side applications. This guide will walk you through the steps to quickly customize and integrate Libro.
-# 前端项目接入
+# Frontend Project Integration
-## Umi 项目接入
+## Umi Project Integration
-在开始运行前，请先保证本地的环境已经安装 node 版本是 18 或以上。
+Before starting, ensure your local environment has Node version 18 or above installed.
-### 安装依赖
+### Install Dependencies
-安装 libro , mana 相关的依赖包，可按照需要安装。
+Install the relevant packages for libro and mana as needed.
```bash
-pnpm add @difizen/libro-lab //集成 lab 研发环境时安装
-pnpm add @difizen/libro-jupyter //集成 libro 编辑器时安装
+pnpm add @difizen/libro-lab // Install for lab development environment integration
+pnpm add @difizen/libro-jupyter // Install for libro editor integration
pnpm add @difizen/mana-app
pnpm add @difizen/umi-plugin-mana -D
```
-### 修改配置
+### Update Configuration
-1. 在 .umirc.ts 中增加 libro 底层依赖框架 mana 相关的配置。
+1. Add the mana-related configuration for libro’s underlying dependency framework in `.umirc.ts`.
```typescript
export default defineConfig({
- // 引入
+ // Import the plugin
plugins: ['@difizen/umi-plugin-mana'],
- // 配置
+ // Configuration
mana: {
decorator: true,
nodenext: true,
@@ -43,7 +43,7 @@ export default defineConfig({
});
```
-在项目根目录中的 tsconfig.json 文件中添加如下配置，从而满足 libro 的底层依赖框架 mana 中的一些编译提示报错。
+In the `tsconfig.json` file at the project root, add the following configuration to address some compile-time errors from mana, libro's underlying dependency framework.
```json
"compilerOptions": {
@@ -52,14 +52,11 @@ export default defineConfig({
},
```
-### 集成 Lab 研发环境
+### Integrate Lab Development Environment
-
+
+
+
+
+
+ {libroView && 
+
-1. 连接 Notebook 服务：这里您可以通过安装 libro-server ，也可以使用 jupyter 的能力，例如 jupyter server 或者 jupyter lab。启动服务，获得对应的服务链接，并可以按照下述方式在前端侧更新服务链接。
+1. Connect to the Notebook Service: You can do this by installing `libro-server` or by using Jupyter’s functionality, such as Jupyter server or Jupyter lab. Start the service, obtain the corresponding service link, and update the link on the frontend as follows:
```typescript
import { ServerConnection, ServerManager } from '@difizen/libro-lab';
@@ -80,7 +77,7 @@ export class LibroApp implements ApplicationContribution {
}
```
-2. 创建并注册 ManaModule。
+2. Create and register a `ManaModule`.
```typescript
import { ManaModule } from '@difizen/mana-app';
@@ -92,7 +89,7 @@ export const LabModule = ManaModule.create()
.dependOn(LibroLabModule);
```
-3. 通过下述方式实现关于 LibroLab 的 React 组件，其中 ManaComponents.Application 为 mana 应用的react 形式的组件，所有的 mana 模块都注册在该上下文中。
+3. Implement the `LibroLab` React component. The `ManaComponents.Application` component wraps the mana application, enabling all mana modules to share the same context.
```typescript
import React from 'react';
@@ -100,7 +97,6 @@ import { ManaAppPreset, ManaComponents } from '@difizen/mana-app';
import { LabModule } from '@/modules/libro-lab/module';
import './index.less'
-
const App = (): JSX.Element => {
return (
@@ -114,32 +110,26 @@ const App = (): JSX.Element => {
};
export default App;
-
```
-### 集成 Notebook 编辑器
+### Integrate Notebook Editor
-
+
-1. 编写 Libro 编辑器的 React 组件，核心是通过 LibroService 创建 LibroView 实例，并通过 ViewRender 渲染构建出的 LibroView 实例。
+1. Create a React component for the Libro editor, using `LibroService` to create a `LibroView` instance and render it through `ViewRender`.
-```jsx
+```typescript
import { DocumentCommands, LibroService, LibroView } from '@difizen/libro-jupyter';
import { CommandRegistry, ViewRender, useInject } from '@difizen/mana-app';
-import React from 'react';
-import { useEffect, useState } from 'react';
+import React, { useEffect, useState } from 'react';
-export const LibroEditor: React.FC = ()=>{
+export const LibroEditor: React.FC = () => {
const libroService = useInject(LibroService);
- const [libroView,setLibroView] = useState();
- const [handle,setHandle] = useState();
+ const [libroView, setLibroView] = useState();
+ const [handle, setHandle] = useState();
const commandRegistry = useInject(CommandRegistry);
const save = () => {
- //通过命令进行保存
commandRegistry.executeCommand(
DocumentCommands['Save'].id,
undefined,
@@ -149,42 +139,39 @@ export const LibroEditor: React.FC = ()=>{
);
};
- const doAutoSave = () =>{
- //设置自动保存逻辑
+ const doAutoSave = () => {
const handle = window.setTimeout(() => {
save();
if (libroView) {
libroView.model.dirty = false;
}
- },1000);
- setHandle(handle)
+ }, 1000);
+ setHandle(handle);
}
useEffect(() => {
- libroService.getOrCreateView({
- //这里可以给每个 libro 编辑器增加标识，用于区分每次打开编辑器里面的内容都不一样
- }).then((libro)=>{
- if(!libro) return;
+ libroService.getOrCreateView().then((libro) => {
+ if (!libro) return;
setLibroView(libro);
libro.model.onChanged(() => {
doAutoSave();
});
- })
+ });
- return ()=>{
+ return () => {
window.clearTimeout(handle);
}
}, []);
return (
-
+
-1. 编写 Libro 编辑器的 React 组件，核心是通过 LibroService 创建 LibroView 实例，并通过 ViewRender 渲染构建出的 LibroView 实例。
+1. Create a React component for the Libro editor, using `LibroService` to create a `LibroView` instance and render it through `ViewRender`.
-```jsx
+```typescript
import { DocumentCommands, LibroService, LibroView } from '@difizen/libro-jupyter';
import { CommandRegistry, ViewRender, useInject } from '@difizen/mana-app';
-import React from 'react';
-import { useEffect, useState } from 'react';
+import React, { useEffect, useState } from 'react';
-export const LibroEditor: React.FC = ()=>{
+export const LibroEditor: React.FC = () => {
const libroService = useInject
- {libroView && }
+
+
+1. 连接 Notebook 服务：这里您可以通过安装 libro-server ，也可以使用 jupyter 的能力，例如 jupyter server 或者 jupyter lab。启动服务，获得对应的服务链接，并可以按照下述方式在前端侧更新服务链接。
+
+```typescript
+import { ServerConnection, ServerManager } from '@difizen/libro-lab';
+import { ApplicationContribution, inject, singleton } from '@difizen/mana-app';
+
+@singleton({ contrib: ApplicationContribution })
+export class LibroApp implements ApplicationContribution {
+ @inject(ServerConnection) serverConnection: ServerConnection;
+ @inject(ServerManager) serverManager: ServerManager;
+
+ async onStart() {
+ this.serverConnection.updateSettings({
+ baseUrl: 'http://localhost:8888/',
+ wsUrl: 'ws://localhost:8888/',
+ });
+ this.serverManager.launch();
+ }
+}
+```
+
+2. 创建并注册 ManaModule。
+
+```typescript
+import { ManaModule } from '@difizen/mana-app';
+import { LibroApp } from './app';
+import { LibroLabModule } from '@difizen/libro-lab';
+
+export const LabModule = ManaModule.create()
+ .register(LibroApp)
+ .dependOn(LibroLabModule);
+```
+
+3. 通过下述方式实现关于 LibroLab 的 React 组件，其中 ManaComponents.Application 为 mana 应用的react 形式的组件，所有的 mana 模块都注册在该上下文中。
+
+```typescript
+import React from 'react';
+import { ManaAppPreset, ManaComponents } from '@difizen/mana-app';
+import { LabModule } from '@/modules/libro-lab/module';
+import './index.less'
+
+
+const App = (): JSX.Element => {
+ return (
+
+
+1. 编写 Libro 编辑器的 React 组件，核心是通过 LibroService 创建 LibroView 实例，并通过 ViewRender 渲染构建出的 LibroView 实例。
+
+```jsx
+import { DocumentCommands, LibroService, LibroView } from '@difizen/libro-jupyter';
+import { CommandRegistry, ViewRender, useInject } from '@difizen/mana-app';
+import React from 'react';
+import { useEffect, useState } from 'react';
+
+export const LibroEditor: React.FC = ()=>{
+ const libroService = useInject(LibroService);
+ const [libroView,setLibroView] = useState();
+ const [handle,setHandle] = useState();
+ const commandRegistry = useInject(CommandRegistry);
+
+ const save = () => {
+ //通过命令进行保存
+ commandRegistry.executeCommand(
+ DocumentCommands['Save'].id,
+ undefined,
+ libroView,
+ undefined,
+ { reason: 'autoSave' },
+ );
+ };
+
+ const doAutoSave = () =>{
+ //设置自动保存逻辑
+ const handle = window.setTimeout(() => {
+ save();
+ if (libroView) {
+ libroView.model.dirty = false;
+ }
+ },1000);
+ setHandle(handle)
+ }
+
+ useEffect(() => {
+ libroService.getOrCreateView({
+ //这里可以给每个 libro 编辑器增加标识，用于区分每次打开编辑器里面的内容都不一样
+ }).then((libro)=>{
+ if(!libro) return;
+ setLibroView(libro);
+ libro.model.onChanged(() => {
+ doAutoSave();
+ });
+ })
+
+ return ()=>{
+ window.clearTimeout(handle);
+ }
+ }, []);
+
+ return (
+ 
+The toolbar in Libro is an important part of the entire Libro UI interface, containing a series of buttons that help users quickly access commonly used features. By default, it is displayed at the top of the editor and to the right of the selected cell.
-### 如何往工具栏中注册自定义工具按钮？
+
-在 libro 中，每个模块都可以向工具注册表中添加工具按钮。最基础的工具按钮通常包含这几个部分：
+### How to Register Custom Toolbar Buttons?
-- id: 工具按钮的唯一标识符。
-- command: 工具按钮绑定的命令 id。
-- tooltip: 可选，鼠标悬停在按钮上时显示的提示文本，用于向用户提供关于按钮功能的简要说明。
-- icon: 可选,按钮的图标显示。
-- order：可选，该属性决定了工具栏按钮的显示顺序。数值越小的按钮将显示在前面，越大的按钮显示在后面。如果不设置，libro 将按默认顺序显示按钮。
-- group：可选，工具栏中的按钮可以通过该属性进行分组，确保相关功能的按钮在视觉上靠近。
+In Libro, each module can add tool buttons to the tool registration table. The basic components of a tool button typically include:
-其中，工具栏的按钮与命令紧密关联。每个按钮都会绑定到一个命令，用户点击工具栏按钮时，会触发绑定命令的执行。
+- **id**: A unique identifier for the tool button.
+- **command**: The command ID that the tool button is bound to.
+- **tooltip**: Optional; the hint text displayed when the mouse hovers over the button, providing a brief description of the button's function.
+- **icon**: Optional; the icon displayed on the button.
+- **order**: Optional; this property determines the display order of the toolbar buttons. Buttons with smaller values will appear first, while larger values will appear later. If not set, Libro will display the buttons in the default order.
+- **group**: Optional; this property can group buttons in the toolbar to ensure that related function buttons are visually close together.
-#### 注册工具栏按钮
+The toolbar buttons are closely linked with commands. Each button is bound to a command, and when the user clicks the toolbar button, it triggers the execution of the bound command.
-1. libro 使用依赖注入机制来管理工具栏按钮的注册，因此你需要创建一个工具栏按钮扩展类，并在这个类中注册工具栏按钮。工具栏扩展类实现了 ToolbarContribution 接口，这个接口提供了 registerToolbarItems 方法，专门用于注册工具栏按钮。
-2. 工具按钮继承来自命令的 icon、label 属性，以及 execute、isVisible、isEnabled 等逻辑控制函数，保证相同的命令在工具栏、菜单等多处可见时的统一，工具栏按钮也可以在注册时自定义 icon、label 等属性。
+#### Registering Toolbar Buttons
-- 更具体的， 在 libro 中，工具栏按钮对应的命令采用 LibroCommandRegister 的方式注册，以保证 execute、isVisible、isEnabled 等逻辑控制函数中可以拿到 CellView 实例、LibroView 实例、path。工具栏按钮的位置选项如下，通过 isVisible 函数中的 path 参数控制位置显示。
+1. Libro uses a dependency injection mechanism to manage the registration of toolbar buttons. Therefore, you need to create a toolbar button extension class and register the toolbar buttons within this class. The toolbar extension class implements the `ToolbarContribution` interface, which provides the `registerToolbarItems` method specifically for registering toolbar buttons.
+2. The tool buttons inherit properties from the command such as `icon`, `label`, as well as logic control functions like `execute`, `isVisible`, and `isEnabled`, ensuring consistency when the same command is visible in the toolbar, menu, and other places. The toolbar buttons can also customize properties like `icon`, `label`, etc., during registration.
-| 位置变量标识 | 具体位置 |
-| :---------------------------- | :-------------- |
-| LibroToolbarArea.HeaderLeft | 顶部左侧工具栏 |
-| LibroToolbarArea.HeaderCenter | 顶部中间工具栏 |
-| LibroToolbarArea.HeaderRight | 顶部右侧工具栏 |
-| LibroToolbarArea.CellTop | cell 顶部工具栏 |
-| LibroToolbarArea.CellRight | cell 右侧工具栏 |
+- More specifically, in Libro, the commands corresponding to the toolbar buttons are registered using `LibroCommandRegister` to ensure that the logic control functions like `execute`, `isVisible`, and `isEnabled` can access instances of `CellView`, `LibroView`, and `path`. The location options for toolbar buttons are as follows, controlled by the `path` parameter in the `isVisible` function.
-3. 把新增的命令扩展类注册进 mana module 中。
+| Location Variable Identifier | Specific Location |
+| :---------------------------- | :----------------- |
+| LibroToolbarArea.HeaderLeft | Top left toolbar |
+| LibroToolbarArea.HeaderCenter | Top center toolbar |
+| LibroToolbarArea.HeaderRight | Top right toolbar |
+| LibroToolbarArea.CellTop | Cell top toolbar |
+| LibroToolbarArea.CellRight | Cell right toolbar |
+
+3. Register the newly added command extension class in the Mana module.
```typescript
import { ManaModule } from '@difizen/mana-app';
@@ -51,7 +49,7 @@ export const LibroToolbarDemoModule = ManaModule.create()
.dependOn(LibroEditorModule);
```
-##### 示例
+##### Example
```typescript
import { LibroCommandRegister, LibroToolbarArea } from '@difizen/libro-jupyter';
@@ -83,7 +81,7 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand1'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部中间工具栏示例');
+ console.log('Toolbar button registered in the top center toolbar example');
},
isEnabled: () => {
return true;
@@ -98,7 +96,9 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand2'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏示例');
+ console.log(
+ 'Toolbar button registered in the top right toolbar and cell right toolbar example',
+ );
},
isEnabled: () => {
return true;
@@ -116,7 +116,9 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand3'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏,并且成组示例');
+ console.log(
+ 'Toolbar button registered in the top right toolbar and cell right toolbar, and grouped example',
+ );
},
isEnabled: () => {
return true;
@@ -133,7 +135,9 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand4'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏，并且成组示例');
+ console.log(
+ 'Toolbar button registered in the top right toolbar and cell right toolbar, and grouped example',
+ );
},
isEnabled: () => {
return true;
diff --git a/apps/docs/docs/integration/toolbar.zh-CN.md b/apps/docs/docs/integration/toolbar.zh-CN.md
new file mode 100644
index 00000000..bf8c8400
--- /dev/null
+++ b/apps/docs/docs/integration/toolbar.zh-CN.md
@@ -0,0 +1,181 @@
+---
+title: 自定义工具栏
+order: 2
+---
+
+# 工具栏
+
+libro 的工具栏（Toolbar）是整个 libro UI 界面中重要的一部分，它包含了一系列的按钮，帮助用户快速访问常用功能，目前在 libro 中默认显示在编辑器的顶部和选中 cell 的右侧。
+
+
+### 如何往工具栏中注册自定义工具按钮？
+
+在 libro 中，每个模块都可以向工具注册表中添加工具按钮。最基础的工具按钮通常包含这几个部分：
+
+- id: 工具按钮的唯一标识符。
+- command: 工具按钮绑定的命令 id。
+- tooltip: 可选，鼠标悬停在按钮上时显示的提示文本，用于向用户提供关于按钮功能的简要说明。
+- icon: 可选,按钮的图标显示。
+- order：可选，该属性决定了工具栏按钮的显示顺序。数值越小的按钮将显示在前面，越大的按钮显示在后面。如果不设置，libro 将按默认顺序显示按钮。
+- group：可选，工具栏中的按钮可以通过该属性进行分组，确保相关功能的按钮在视觉上靠近。
+
+其中，工具栏的按钮与命令紧密关联。每个按钮都会绑定到一个命令，用户点击工具栏按钮时，会触发绑定命令的执行。
+
+#### 注册工具栏按钮
+
+1. libro 使用依赖注入机制来管理工具栏按钮的注册，因此你需要创建一个工具栏按钮扩展类，并在这个类中注册工具栏按钮。工具栏扩展类实现了 ToolbarContribution 接口，这个接口提供了 registerToolbarItems 方法，专门用于注册工具栏按钮。
+2. 工具按钮继承来自命令的 icon、label 属性，以及 execute、isVisible、isEnabled 等逻辑控制函数，保证相同的命令在工具栏、菜单等多处可见时的统一，工具栏按钮也可以在注册时自定义 icon、label 等属性。
+
+- 更具体的， 在 libro 中，工具栏按钮对应的命令采用 LibroCommandRegister 的方式注册，以保证 execute、isVisible、isEnabled 等逻辑控制函数中可以拿到 CellView 实例、LibroView 实例、path。工具栏按钮的位置选项如下，通过 isVisible 函数中的 path 参数控制位置显示。
+
+| 位置变量标识 | 具体位置 |
+| :---------------------------- | :-------------- |
+| LibroToolbarArea.HeaderLeft | 顶部左侧工具栏 |
+| LibroToolbarArea.HeaderCenter | 顶部中间工具栏 |
+| LibroToolbarArea.HeaderRight | 顶部右侧工具栏 |
+| LibroToolbarArea.CellTop | cell 顶部工具栏 |
+| LibroToolbarArea.CellRight | cell 右侧工具栏 |
+
+3. 把新增的命令扩展类注册进 mana module 中。
+
+```typescript
+import { ManaModule } from '@difizen/mana-app';
+import { LibroEditorModule } from '../libro-editor/module';
+import { LibroDemoToolbarContribution } from './libro-demo-toolbar-contribution';
+
+export const LibroToolbarDemoModule = ManaModule.create()
+ .register(LibroDemoToolbarContribution)
+ .dependOn(LibroEditorModule);
+```
+
+##### 示例
+
+```typescript
+import { LibroCommandRegister, LibroToolbarArea } from '@difizen/libro-jupyter';
+import {
+ CommandContribution,
+ CommandRegistry,
+ inject,
+ singleton,
+ ToolbarContribution,
+ ToolbarRegistry,
+} from '@difizen/mana-app';
+import {
+ BellOutlined,
+ BulbOutlined,
+ HeartOutlined,
+ MoonOutlined,
+} from '@ant-design/icons';
+import { LibroDemoToolbarCommand } from './libro-demo-toolbar-commands';
+
+@singleton({ contrib: [ToolbarContribution, CommandContribution] })
+export class LibroDemoToolbarContribution
+ implements ToolbarContribution, CommandContribution
+{
+ @inject(LibroCommandRegister) protected readonly libroCommand: LibroCommandRegister;
+
+ registerCommands(command: CommandRegistry): void {
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand1'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部中间工具栏示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return path === LibroToolbarArea.HeaderCenter;
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand2'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return (
+ path === LibroToolbarArea.HeaderCenter ||
+ path === LibroToolbarArea.CellRight
+ );
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand3'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏,并且成组示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return (
+ path === LibroToolbarArea.HeaderRight || path === LibroToolbarArea.CellRight
+ );
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand4'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏，并且成组示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return (
+ path === LibroToolbarArea.HeaderRight || path === LibroToolbarArea.CellRight
+ );
+ },
+ },
+ );
+ }
+
+ registerToolbarItems(registry: ToolbarRegistry): void {
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand1'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand1'].id,
+ icon: BulbOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand1'].label,
+ });
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand2'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand2'].id,
+ icon: BellOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand2'].label,
+ });
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand3'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand3'].id,
+ icon: HeartOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand3'].label,
+ order: '1',
+ group: ['groupdemo'],
+ });
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand4'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand4'].id,
+ icon: MoonOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand4'].label,
+ order: '2',
+ group: ['groupdemo'],
+ });
+ }
+}
+```
diff --git a/apps/docs/docs/manual/ai-assistant.md b/apps/docs/docs/manual/ai-assistant.md
index 0dfa0604..fe172b45 100644
--- a/apps/docs/docs/manual/ai-assistant.md
+++ b/apps/docs/docs/manual/ai-assistant.md
@@ -1,55 +1,57 @@
---
-title: AI 编程助手指南
+title: AI Programming Assistant Guide
order: 3
---
-## 准备工作
+## Preparation
-在 `~/.libro/libro_config.yaml` 配置大模型相关配置
+Configure large model settings in `~/.libro/libro_config.yaml`.
-其中，目前支持的模型有：
+Currently supported models include:
-- OpenAI 相关：`gpt-4`、`gpt-3.5-turbo`、`text-davinci-003`
-- 通义千问相关：`qwen-max`、`qwen-plus`、`qwen-turbo`
+- OpenAI models: `gpt-4`, `gpt-3.5-turbo`, `text-davinci-003`
+- Qwen-related models: `qwen-max`, `qwen-plus`, `qwen-turbo`
-配置默认的模型和 Key：
+Set the default model and keys:
```yaml
llm:
- DASHSCOPE_API_KEY: xxx # Qwen 相关的模型 key
- OPENAI_API_KEY: xxx # OpenAI 相关的模型 key
+ DASHSCOPE_API_KEY: xxx # Key for Qwen-related models
+ OPENAI_API_KEY: xxx # Key for OpenAI models
default_model: qwen-max
```
-> 💡 **Tip**: 如果使用通义千问作为默认模型，请使用`pip install dashscope --upgrade`安装依赖.
->
+> 💡 **Tip**: If using Qwen as the default model, install the dependencies with `pip install dashscope --upgrade`.
-## 报错修复
+## Error Fixing
-当 Cell 执行出现报错时，点击 “Fix with AI” 按钮，助手会自动分析错误并给出修复建议，点击“取消”按钮退出报错修复模式。
+When a cell execution error occurs, click the "Fix with AI" button. The assistant will automatically analyze the error and provide fix suggestions. Click the "Cancel" button to exit error-fix mode.
-
+
-## AI 对话
+## AI Chat
-### Cell 上下文对话
+### Contextual Cell Chat
-从 Cell 右侧工具栏对话按钮唤起，你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+Accessed via the chat button in the cell's right toolbar, you can interact with the AI directly, obtaining in-depth explanations and optimization advice related to the current code, improving coding efficiency.
-
+
-### 通用对话
+### General Chat
-从顶部右侧工具栏唤起，你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+Accessed from the top right toolbar, allowing for open-ended conversations with the AI to ask programming-related questions, get advice, and enjoy intelligent interaction.
-
+
-### 代码解释
+### Code Explanation
-从 Cell 右侧工具栏的魔法符号唤起，帮助理解 Cell 中代码的功能和逻辑。
-
+Summonable from the magic icon in the cell’s right toolbar to help you understand the function and logic of the code within the cell.
-### 代码优化
+
-从 Cell 右侧工具栏的魔法符号唤起，分析单元格（cell）中的代码，并提供优化建议。
-
+### Code Optimization
+
+Activated from the magic icon in the cell's right toolbar, it analyzes the code in the cell and provides optimization suggestions.
+
+
+```
diff --git a/apps/docs/docs/manual/ai-assistant.zh-CN.md b/apps/docs/docs/manual/ai-assistant.zh-CN.md
new file mode 100644
index 00000000..0dfa0604
--- /dev/null
+++ b/apps/docs/docs/manual/ai-assistant.zh-CN.md
@@ -0,0 +1,55 @@
+---
+title: AI 编程助手指南
+order: 3
+---
+
+## 准备工作
+
+在 `~/.libro/libro_config.yaml` 配置大模型相关配置
+
+其中，目前支持的模型有：
+
+- OpenAI 相关：`gpt-4`、`gpt-3.5-turbo`、`text-davinci-003`
+- 通义千问相关：`qwen-max`、`qwen-plus`、`qwen-turbo`
+
+配置默认的模型和 Key：
+
+```yaml
+llm:
+ DASHSCOPE_API_KEY: xxx # Qwen 相关的模型 key
+ OPENAI_API_KEY: xxx # OpenAI 相关的模型 key
+ default_model: qwen-max
+```
+
+> 💡 **Tip**: 如果使用通义千问作为默认模型，请使用`pip install dashscope --upgrade`安装依赖.
+>
+
+## 报错修复
+
+当 Cell 执行出现报错时，点击 “Fix with AI” 按钮，助手会自动分析错误并给出修复建议，点击“取消”按钮退出报错修复模式。
+
+
+
+## AI 对话
+
+### Cell 上下文对话
+
+从 Cell 右侧工具栏对话按钮唤起，你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+
+
+
+### 通用对话
+
+从顶部右侧工具栏唤起，你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+
+
+
+### 代码解释
+
+从 Cell 右侧工具栏的魔法符号唤起，帮助理解 Cell 中代码的功能和逻辑。
+
+
+### 代码优化
+
+从 Cell 右侧工具栏的魔法符号唤起，分析单元格（cell）中的代码，并提供优化建议。
+
diff --git a/apps/docs/docs/manual/index.md b/apps/docs/docs/manual/index.md
index 8e62e870..43717951 100644
--- a/apps/docs/docs/manual/index.md
+++ b/apps/docs/docs/manual/index.md
@@ -1,298 +1,300 @@
---
-title: 基础指南
+title: Basic Guide
order: 0
---
-# 概述
+# Overview
-Libro 编辑器增强了传统 Notebook 运行的状态监控以及各种交互操作，本文为您介绍 Libro 编辑器的基础界面功能，帮助您了解 Libro 编辑器的基本使用方法。
+The Libro Editor enhances the state monitoring of traditional Notebook operations and various interactive features. This article introduces the basic interface features of the Libro Editor, helping you understand its basic usage.
-## 产品界面介绍
+## Product Interface Introduction
-| 界面模块 | 说明 |
-| ------------- | --------------------------------------------------------------- |
-| 上方工具栏 | 包含内核状态区、操作控制区、快捷键等。 |
-| Cell 操作区 | 罗列针对每一个独立的 Cell 可执行的操作。 |
-| Cell 编辑区 | 代码编辑窗口中的功能区域，如 Cell 衔接区、输出区、底部 Cell等。 |
-| Cell 功能介绍 | 介绍命令态和编辑态 Cell 的功能和快捷键操作。 |
+| Interface Module | Description |
+| ------------------------- | --------------------------------------------------------------------------------------------------------- |
+| Top Toolbar | Contains kernel status area, operation control area, keybinds, etc. |
+| Cell Operation Area | Lists executable operations for each individual Cell. |
+| Cell Editing Area | Functional areas within the code editing window, such as Cell linking area, output area, and bottom Cell. |
+| Cell Feature Introduction | Introduces the functions and keybind operations of command mode and edit mode Cells. |
-### 上方工具栏
+### Top Toolbar
-| 序号 | 名称 | 描述 |
-| ---- | ---------- | -------------------------------------------------------------------- |
-| ① | 内核状态区 | 展示当前服务的内核运行状态，包括正在连接、未知、忙碌、空闲四种状态。 |
-| ② | 操作控制区 | 提供各种控制操作，如对代码执行、Cell 转换的操作等。 |
-| ③ | 快捷键面板 | 查看 Libro 快捷键目录。 |
+| No. | Name | Description |
+| --- | ---------------------- | ---------------------------------------------------------------------------------------------------------- |
+| ① | Kernel Status Area | Displays the current status of the service kernel, including four states: connecting, unknown, busy, idle. |
+| ② | Operation Control Area | Provides various control operations, such as executing code, converting Cells, etc. |
+| ③ | Keybind Panel | View the directory of Libro keybinds. |
-#### 内核状态区
+#### Kernel Status Area
-Libro Notebook 采用 Python3 作为基础内核，负责运行用户输入的代码单元（Cell），管理代码执行的状态。在 Libro 的内核状态区，您可以修改内核和查看内核状态。
+The Libro Notebook uses Python 3 as the base kernel, responsible for executing the user-input code Cells and managing the code execution status. In the Libro kernel status area, you can modify the kernel and view its status.
-● 内核编辑菜单
+- Kernel Edit Menu
-| 菜单选项 | 描述 |
-| --------------------------------- | -------------------------------------------------- |
-| Start Preferred Kernel | 启动设定或之前使用的首选内核。 |
-| Use No Kernel | 选择此选项不会启动任何内核，用于不执行代码的场景。 |
-| Use Kernel from Preferred Session | 使用已开启会话中的内核配置，保持环境一致性。 |
+| Menu Option | Description |
+| --------------------------------- | ------------------------------------------------------------------------------------------------------- |
+| Start Preferred Kernel | Start the preferred kernel set or previously used. |
+| Use No Kernel | Selecting this option will not start any kernel, used for scenarios where code execution is not needed. |
+| Use Kernel from Preferred Session | Use kernel configuration from an active session to maintain environmental consistency. |
-说明：内核（Kernel）是一个执行计算的引擎，它能够运行编程代码并返回结果。
+Note: The kernel is an engine that executes computations, capable of running programming code and returning results.
-● 内核状态
-Libro 的内核状态分为正在连接、未知、忙碌、空闲。
+- Kernel Status
+ The kernel status in Libro can be connecting, unknown, busy, or idle.
-
Libro Notebook 正在与内核建立连接，发生在启动内核或者内核失去响应后尝试连接的情况。
+ The Libro Notebook is connecting to the kernel, which occurs when starting the kernel or attempting to connect after the kernel becomes unresponsive.
-
当前内核的状态不能确定，可能是由于通信问题或内部错误导致状态信息无法获取。
+ The current status of the kernel is uncertain, possibly due to communication issues or internal errors preventing status information retrieval.
-
当前内核正在执行代码处理任务，您提交的新代码或指令将等待当前任务完成后才会被执行。
+ The current kernel is processing code execution tasks, and your newly submitted code or commands will wait until the current task is complete before execution.
-
表示内核当前没有执行任何任务，已经准备好接受新的命令和代码执行。
+ Indicates that the kernel is currently not executing any tasks and is ready to accept new commands and code execution.
-#### 操作控制区
+#### Operation Control Area
-| 图标 | 描述 |
-| -------------------------------------------------------------------- | ------------------------------------------------------------------------ |
-| 
| 保存当前 Notebook 中 Cell 内容的改动。 |
-| 
| 按照子菜单选项，执行选中范围的 Cell，如执行全部 Cell、执行当前 Cell 等。 |
-| 
| 定位正在执行的 Cell。 |
-| 
| 中断正在执行的 Cell 代码。 |
-| 
| 重启并清空所有 Cell 的输出。 |
-| 
| 撤销上一步操作。 |
-| 
| 重做上一步被撤销的操作。 |
-| 
| 固定 Output 展示高度。 |
-| 
| 根据子菜单选项，隐藏或显示代码和 Output。 |
-| 
| 清空选中 Cell 的输出。 |
-| 
| 更改 Cell 类型，如 Python、Markdown 等 |
+| Icon | Description |
+| -------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------- |
+| | Save changes made to the Cell contents in the current Notebook. |
+| | Execute the selected range of Cells according to submenu options, such as executing all Cells, executing the current Cell, etc. |
+| | Locate the currently executing Cell. |
+| | Interrupt the code of the currently executing Cell. |
+| | Restart and clear all Cell outputs. |
+| | Undo the last action. |
+| | Redo the last undone action. |
+| | Fix the height of the Output display. |
+| | Hide or show code and Output based on submenu options. |
+| | Clear the output of the selected Cell. |
+| | Change Cell types, such as Python, Markdown, etc. |
-#### 分享和快捷键
+#### Sharing and Keybind
-| 图标 | 区域图 | 说明 |
-| -------------------------------------------------------------- | --------------------------------------------------------------------- | ------------------------------------------------------ |
-| 
| 
| 展示命令态和编辑态 Libro 的快捷键操作，提供 Magic 命令 |
+| Icon | Area Diagram | Description |
+| -------------------------------------------------------------- | --------------------------------------------------------------------- | --------------------------------------------------------------------------------------------- |
+| | | Display keybind operations for command mode and edit mode in Libro, providing Magic commands. |
-### Cell 操作栏
+### Cell Operation Bar
-Notebook 支持针对单元格便捷执行 Cell 操作。在 Cell 右侧的操作栏中，从上至下分别是运行、上移、下移、增加、删除、更多菜单。
+The Notebook supports convenient execution of Cell operations. In the operation bar to the right of each Cell, from top to bottom, there are options to run, move up, move down, add, delete, and access more menus.
-| 图标/按钮 | 描述 |
-| ------------------------------------------------------------- | -------------------------------------------- |
-| | 运行当前选中的代码单元或重新运行代码单元。 |
-| 
| 将当前选中的代码单元上移一个位置。 |
-| 
| 将当前选中的代码单元下移一个位置。 |
-| 
| 在下方增加选中类型的单元格。 |
-| 
| 删除当前选中的代码单元。 |
-| 
| 提供隐藏代码和输出、复制、剪切、粘贴的功能。 |
+| Icon/Button | Description |
+| ------------------------------------------------------------- | ---------------------------------------------------------------- |
+| | Run the currently selected code Cell or re-run the code Cell. |
+| | Move the currently selected code Cell up one position. |
+| | Move the currently selected code Cell down one position. |
+| | Add a Cell of the selected type below. |
+| | Delete the currently selected code Cell. |
+| | Provide functions to hide code and output, copy, cut, and paste. |
-### Cell 编辑区
+### Cell Editing Area
-在 Notebook 代码编辑窗口中，您可以添加多个 Cell 来组织您的项目。Cell 之间的区域为衔接区，Cell 执行完毕产生的输出窗格为输出区，最后一个 Cell 底部称为 Cell 底部区。
+In the Notebook's code editing window, you can add multiple Cells to organize your project. The area between Cells is called the linking area, and the output pane generated after executing a Cell is referred to as the output area. The bottom of the last Cell is called the bottom Cell area.
-#### Cell 衔接区
+#### Cell Linking Area
-您可以在该区域自由添加指定类型的单元格。
+You can freely add specified types of Cells in this area.
-说明：如果您选中的 Cell 后无其他单元格，可以直接在底部通过指定按钮添加对应类型的单元格。详情请参见底部 Cell。
+Note: If you select a Cell without other Cells below it, you can directly add the corresponding type of Cell through the specified button at the bottom. For more details, refer to the bottom Cell section.
-#### Cell 输出区
+#### Cell Output Area
-支持在单元格下方查看执行此 Cell 后的运行时间和运行结果。
+You can view the execution time and results after executing this Cell below it.
-注意：目前仅支持执行 Python Cell 和 Prompt Cell 并产生输出内容，其余均为说明性、展示性 Cell。
+Note: Currently, only Python Cells and Prompt Cells support output content, while others are for illustrative and display purposes.
-#### Cell 固定 Output 高度
+#### Fixed Output Height for Cells
-如果输出内容较长，您可以选择固定或取消输出窗口的高度，以获取最佳视图体验。
+If the output content is lengthy, you can choose to fix or unfix the height of the output window for an optimal viewing experience.
-#### 底部 Cell
+#### Bottom Cell
-实验文件中最后一个 Cell 的底部提供显式添加指定类型单元格的按钮。
+The bottom of the last Cell in the experiment file provides an explicit button to add a Cell of the specified type.
-说明：同时，支持在 Cell 衔接区或 Cell 操作栏添加单元格，通过 Cell 控制区的类型转换来切换单元格类型。
+Note: Additionally, you can add Cells in the Cell linking area or the Cell operation bar, and switch Cell types through the Cell control area.
-## 交互操作介绍
+## Introduction to Interactive Operations
-支持在上方工具栏右侧，通过查看快捷键，查看或搜索产品内所有快捷键功能和 Notebook Magic 命令，以下为您介绍几种常用的操作：
+On the right side of the top toolbar, you can view keybinds to see or search for all keybind functions and Notebook Magic commands within the product. Here are a few common operations:
-### 命令态 | 编辑态
+### Command Mode | Edit Mode
-Notebook 将针对操作功能分为命令态和编辑态。
+The Notebook distinguishes between command mode and edit mode based on operation functions.
-● 在编辑态下单击代码编辑页面空白处或快捷键 Esc 进入命令态，当前选中的 Cell 边框为蓝色。
+- In edit mode, clicking in a blank area of the code editing page or using the Esc key enters command mode, where the border of the currently selected Cell is blue.
-● 在命令态时通过快捷键 Enter 进入编辑态或直接单击 Cell 编辑框。当前选中的 Cell 边框为蓝色高亮显示。
+- In command mode, you can enter edit mode by using the Enter key or directly clicking the Cell editing box. The border of the currently selected Cell is highlighted in blue.
-注意：Markdown 类型的 Cell 由命令态进入编辑态需要双击鼠标左键。
+Note: For Markdown type Cells, double-clicking with the left mouse button is required to enter edit mode from command mode.
-### 命令态
+### Command Mode
-在命令态下，支持以下常见功能。
+In command mode, the following common functionalities are supported.
-#### 多选 Cell
+#### Multi-select Cells
-被选中的 Cell 背景为蓝色阴影，支持选中多个单元格以进行批量操作，如批量执行（Ctrl/Command+Enter）和批量复制(C)、粘贴(V)等，您可以自由搭配使用。
+Selected Cells are highlighted in blue. You can select multiple Cells for batch operations, such as batch execution (Ctrl/Command+Enter) and batch copying (C), pasting (V), etc., allowing for flexible combinations.
-| 快捷键 | 效果 |
-| ------------------ | ---------------------------------------------------------- |
-| Shift+Up/Shift+K | 向上选中多个 Cell，单击 Up/K N 次，则向上选中 N 个 Cell。 |
-| Shift+Down/Shift+J | 向下选中多个 Cell，单击 Down/J N次，则向下选中 N 个 Cell。 |
+| Keybind | Description |
+| ------------------ | ---------------------------------------------------------------------------------- |
+| Shift+Up/Shift+K | Select multiple Cells upwards; click Up/K N times to select N Cells upwards. |
+| Shift+Down/Shift+J | Select multiple Cells downwards; click Down/J N times to select N Cells downwards. |
-说明：另外，您可以按住 shift，选中一个 Cell 并以此为基准，单击另一个目标 Cell 的左侧区域，即可向上或向下选中该范围内的所有 Cell。
+Here’s the translation of your text:
-#### 转换 Cell
+---
+
+#### Converting Cells
-在命令态下，选中单元格，通过快捷键可以实现 Markdown 到 Python 类型的互相转换。
+In command mode, you can use keyboard keybinds to convert cells between Markdown and Python types.
-| 快捷键 | 效果 |
-| ------ | ------------------------------------------------------------------------ |
-| M | 将 Cell 转换为 Markdown 类型，快捷键1/2/3/4/5/6分别支持标题1/2/3/4/5/6。 |
-| Y | 将 Cell 转换为 Python 类型。 |
+| Keybind | Description |
+| ------- | ------------------------------------------------------------------------------------------- |
+| M | Convert the cell to Markdown type; keybinds 1/2/3/4/5/6 correspond to headings 1/2/3/4/5/6. |
+| Y | Convert the cell to Python type. |
-#### 合并 Cell
+#### Merging Cells
-在命令态下，支持通过快捷键合并当前选中 Cell 和相邻上一个或下一个 Cell 的内容。
+In command mode, you can merge the contents of the currently selected cell with the adjacent previous or next cell using keyboard keybinds.
-| 快捷键 | 效果 |
-| -------------------- | ----------------------- |
-| Ctrl/Command+Shift+M | 合并相邻的下一个 Cell。 |
+| Keybind | Description |
+| -------------------- | ---------------------------------- |
+| Ctrl/Command+Shift+M | Merge with the next adjacent cell. |
-说明：支持多选 Cell，并通过shift + m 进行批量合并。
+Note: Multiple cells can be selected, and you can perform bulk merges using Shift + M.
-#### 执行 Cell
+#### Executing Cells
-在命令态下，您可以通过快捷键启动 Cell 执行，支持以下执行方式：
+In command mode, you can execute cells using the following keybinds:
-| 快捷键 | 效果 |
-| ------------------ | -------------------------------------- |
-| Ctrl/Command+Enter | 执行当前 Cell。 |
-| Shift+Enter | 执行当前 Cell 并选中下一个单元格。 |
-| Alt/Opt+Enter | 执行当前 Cell 并向下插入同类型单元格。 |
+| Keybind | Description |
+| ------------------ | --------------------------------------------------------------------------------- |
+| Ctrl/Command+Enter | Execute the currently selected cell. |
+| Shift+Enter | Execute the currently selected cell and select the next cell. |
+| Alt/Opt+Enter | Execute the currently selected cell and insert a new cell of the same type below. |
-#### 拖拽 Cell
+#### Dragging Cells
-说明：拖拽时，蓝色横条作为定位标记，表示拖拽至蓝色横条下方。
+Note: During dragging, the blue horizontal bar serves as a positioning marker, indicating where you are dragging to, below the blue bar.
-- 拖拽多个 Cell
- 在命令态下，多选 Cell 后，当您将鼠标移至 Cell 框左侧，出现样式时，可以同时拖拽多个 Cell。
+- **Dragging Multiple Cells**
+ In command mode, after selecting multiple cells, when you move your mouse to the left side of the cell box and the style appears, you can drag multiple cells simultaneously.
-### 编辑态
+### Edit Mode
-在编辑态下，支持以下常见功能。
+In edit mode, the following common functionalities are supported.
-#### 切分 Cell
+#### Splitting Cells
-支持将一个单元格中的内容切分为不同的段，分别放入不同的单元格中。
+You can split the contents of a cell into different sections, placing them into separate cells.
-#### 光标移动
+#### Cursor Movement
-| 快捷键 | 功能 |
-| -------------------- | ------------------------------- |
-| Ctrl/Command + Left | 光标移至当前行的行首 |
-| Ctrl/Command + Right | 光标移至当前行的行尾 |
-| Ctrl/Command + Up | 光标移至文件的开始处（文件首） |
-| Ctrl/Command + Down | 光标移至文件的结束处（文件尾）} |
+| Keybind | Description |
+| -------------------- | ------------------------------------------------- |
+| Ctrl/Command + Left | Move the cursor to the start of the current line. |
+| Ctrl/Command + Right | Move the cursor to the end of the current line. |
+| Ctrl/Command + Up | Move the cursor to the start of the file. |
+| Ctrl/Command + Down | Move the cursor to the end of the file. |
-### 左侧长条
+### Left Sidebar
-单击 Cell 左侧的长条支持隐藏与显示长条所对应的 Cell 区域部分。
+Clicking on the long bar to the left of the cell allows you to hide or show the corresponding cell area.
-#### 隐藏与显示 Cell 输入部分
+#### Hiding and Showing Cell Input Sections
-#### 隐藏与显示 Cell 输出部分
+#### Hiding and Showing Cell Output Sections
-## Cell 介绍
+## Introduction to Cells
### Python Cell
-Python Cell 是 Notebook 中编辑和调试 Python 代码的最小单元，主要包含以下使用功能：
+A Python cell is the smallest unit for editing and debugging Python code in the notebook, primarily featuring the following functionalities:
-| 功能 | 说明 |
-| ------------ | ---------------------------------------------------------------- |
-| 代码编写 | 提供用于编写源代码的编辑区域，支持语法高亮和自动代码补全等。 |
-| 单元调试 | 允许逐单元(cell)逐行调试代码，帮助识别代码中的逻辑错误和异常。 |
-| 输出调试窗格 | 显示代码执行的输出结果，包括打印的文本、图形、错误信息等。 |
-| 代码生成 | 根据用户输入自动生成代码片段，提高开发效率。 |
-| 使用框架和库 | 内置丰富类库，支持导入和使用多种 Python 框架和库，扩展代码功能。 |
+| Function | Description |
+| ------------------------------ | ---------------------------------------------------------------------------------------------------------------------------- |
+| Code Writing | Provides an area for writing source code, supporting syntax highlighting and auto-completion. |
+| Cell Debugging | Allows line-by-line debugging of code within a cell, helping to identify logical errors and exceptions. |
+| Output Debugging Window | Displays the output results of code execution, including printed text, graphics, error messages, etc. |
+| Code Generation | Automatically generates code snippets based on user input to enhance development efficiency. |
+| Using Frameworks and Libraries | Built-in rich libraries support the import and use of various Python frameworks and libraries, expanding code functionality. |
### Markdown Cell
-| 功能 | 说明 |
-| ---------- | ---------------------------------------------------------- |
-| 文本编辑 | 提供文本输入区域，用于编写 Markdown 格式的文本内容。 |
-| 格式化展示 | 在编辑完成后，支持渲染 Markdown 为格式化的 HTML 展示。 |
-| 插入元素 | 支持插入链接、图片、表格、列表等 Markdown 元素。 |
-| 文档结构化 | 使用 Markdown 语法创建有结构的文档，如标题、子标题、段落。 |
-| 代码块支持 | 支持插入代码块，并对不同编程语言进行语法高亮。 |
+| Function | Description |
+| -------------------- | --------------------------------------------------------------------------------------------------- |
+| Text Editing | Provides an input area for writing Markdown-formatted text. |
+| Formatted Display | Supports rendering Markdown into formatted HTML after editing. |
+| Element Insertion | Supports inserting links, images, tables, lists, and other Markdown elements. |
+| Document Structuring | Uses Markdown syntax to create structured documents, such as headings, subheadings, and paragraphs. |
+| Code Block Support | Supports inserting code blocks with syntax highlighting for different programming languages. |
-说明：此外，支持基于标题的 Markdown Cell 进行隐藏与现实，帮助您更好的组织与查看 Notebook
+Note: Additionally, support for hiding and revealing Markdown cells based on headings helps you better organize and view the notebook.
diff --git a/apps/docs/docs/manual/index.zh-CN.md b/apps/docs/docs/manual/index.zh-CN.md
new file mode 100644
index 00000000..5eebeb09
--- /dev/null
+++ b/apps/docs/docs/manual/index.zh-CN.md
@@ -0,0 +1,298 @@
+---
+title: 基础指南
+order: 0
+---
+
+# 概述
+
+Libro 编辑器增强了传统 Notebook 运行的状态监控以及各种交互操作，本文为您介绍 Libro 编辑器的基础界面功能，帮助您了解 Libro 编辑器的基本使用方法。
+
+## 产品界面介绍
+
+| 界面模块 | 说明 |
+| ------------- | --------------------------------------------------------------- |
+| 上方工具栏 | 包含内核状态区、操作控制区、快捷键等。 |
+| Cell 操作区 | 罗列针对每一个独立的 Cell 可执行的操作。 |
+| Cell 编辑区 | 代码编辑窗口中的功能区域，如 Cell 衔接区、输出区、底部 Cell等。 |
+| Cell 功能介绍 | 介绍命令态和编辑态 Cell 的功能和快捷键操作。 |
+
+### 上方工具栏
+
+
+
+| 序号 | 名称 | 描述 |
+| ---- | ---------- | -------------------------------------------------------------------- |
+| ① | 内核状态区 | 展示当前服务的内核运行状态，包括正在连接、未知、忙碌、空闲四种状态。 |
+| ② | 操作控制区 | 提供各种控制操作，如对代码执行、Cell 转换的操作等。 |
+| ③ | 快捷键面板 | 查看 Libro 快捷键目录。 |
+
+#### 内核状态区
+
+Libro Notebook 采用 Python3 作为基础内核，负责运行用户输入的代码单元（Cell），管理代码执行的状态。在 Libro 的内核状态区，您可以修改内核和查看内核状态。
+
+- 内核编辑菜单
+
+
+
+| 菜单选项 | 描述 |
+| --------------------------------- | -------------------------------------------------- |
+| Start Preferred Kernel | 启动设定或之前使用的首选内核。 |
+| Use No Kernel | 选择此选项不会启动任何内核，用于不执行代码的场景。 |
+| Use Kernel from Preferred Session | 使用已开启会话中的内核配置，保持环境一致性。 |
+
+说明：内核（Kernel）是一个执行计算的引擎，它能够运行编程代码并返回结果。
+
+- 内核状态
+ Libro 的内核状态分为正在连接、未知、忙碌、空闲。
+
+ Libro Notebook 正在与内核建立连接，发生在启动内核或者内核失去响应后尝试连接的情况。
+
+ 当前内核的状态不能确定，可能是由于通信问题或内部错误导致状态信息无法获取。
+
+ 当前内核正在执行代码处理任务，您提交的新代码或指令将等待当前任务完成后才会被执行。
+
+ 表示内核当前没有执行任何任务，已经准备好接受新的命令和代码执行。
+
+#### 操作控制区
+
+| 图标 | 描述 |
+| -------------------------------------------------------------------- | ------------------------------------------------------------------------ |
+| | 保存当前 Notebook 中 Cell 内容的改动。 |
+| | 按照子菜单选项，执行选中范围的 Cell，如执行全部 Cell、执行当前 Cell 等。 |
+| | 定位正在执行的 Cell。 |
+| | 中断正在执行的 Cell 代码。 |
+| | 重启并清空所有 Cell 的输出。 |
+| | 撤销上一步操作。 |
+| | 重做上一步被撤销的操作。 |
+| | 固定 Output 展示高度。 |
+| | 根据子菜单选项，隐藏或显示代码和 Output。 |
+| | 清空选中 Cell 的输出。 |
+| | 更改 Cell 类型，如 Python、Markdown 等 |
+
+#### 分享和快捷键
+
+| 图标 | 区域图 | 说明 |
+| -------------------------------------------------------------- | --------------------------------------------------------------------- | ------------------------------------------------------ |
+| | | 展示命令态和编辑态 Libro 的快捷键操作，提供 Magic 命令 |
+
+### Cell 操作栏
+
+Notebook 支持针对单元格便捷执行 Cell 操作。在 Cell 右侧的操作栏中，从上至下分别是运行、上移、下移、增加、删除、更多菜单。
+
+| 图标/按钮 | 描述 |
+| ------------------------------------------------------------- | -------------------------------------------- |
+| | 运行当前选中的代码单元或重新运行代码单元。 |
+| | 将当前选中的代码单元上移一个位置。 |
+| | 将当前选中的代码单元下移一个位置。 |
+| | 在下方增加选中类型的单元格。 |
+| | 删除当前选中的代码单元。 |
+| | 提供隐藏代码和输出、复制、剪切、粘贴的功能。 |
+
+### Cell 编辑区
+
+在 Notebook 代码编辑窗口中，您可以添加多个 Cell 来组织您的项目。Cell 之间的区域为衔接区，Cell 执行完毕产生的输出窗格为输出区，最后一个 Cell 底部称为 Cell 底部区。
+
+#### Cell 衔接区
+
+您可以在该区域自由添加指定类型的单元格。
+
+
+
+
+
+说明：如果您选中的 Cell 后无其他单元格，可以直接在底部通过指定按钮添加对应类型的单元格。详情请参见底部 Cell。
+
+#### Cell 输出区
+
+支持在单元格下方查看执行此 Cell 后的运行时间和运行结果。
+
+
+
+注意：目前仅支持执行 Python Cell 和 Prompt Cell 并产生输出内容，其余均为说明性、展示性 Cell。
+
+#### Cell 固定 Output 高度
+
+如果输出内容较长，您可以选择固定或取消输出窗口的高度，以获取最佳视图体验。
+
+
+
+#### 底部 Cell
+
+实验文件中最后一个 Cell 的底部提供显式添加指定类型单元格的按钮。
+
+
+
+说明：同时，支持在 Cell 衔接区或 Cell 操作栏添加单元格，通过 Cell 控制区的类型转换来切换单元格类型。
+
+## 交互操作介绍
+
+支持在上方工具栏右侧，通过查看快捷键，查看或搜索产品内所有快捷键功能和 Notebook Magic 命令，以下为您介绍几种常用的操作：
+
+
+
+ +
+
+### 命令态 | 编辑态
+
+Notebook 将针对操作功能分为命令态和编辑态。
+
+● 在编辑态下单击代码编辑页面空白处或快捷键 Esc 进入命令态，当前选中的 Cell 边框为蓝色。
+
+
+
+● 在命令态时通过快捷键 Enter 进入编辑态或直接单击 Cell 编辑框。当前选中的 Cell 边框为蓝色高亮显示。
+
+
+
+注意：Markdown 类型的 Cell 由命令态进入编辑态需要双击鼠标左键。
+
+### 命令态
+
+在命令态下，支持以下常见功能。
+
+
+
+#### 多选 Cell
+
+被选中的 Cell 背景为蓝色阴影，支持选中多个单元格以进行批量操作，如批量执行（Ctrl/Command+Enter）和批量复制(C)、粘贴(V)等，您可以自由搭配使用。
+
+| 快捷键 | 效果 |
+| ------------------ | ---------------------------------------------------------- |
+| Shift+Up/Shift+K | 向上选中多个 Cell，单击 Up/K N 次，则向上选中 N 个 Cell。 |
+| Shift+Down/Shift+J | 向下选中多个 Cell，单击 Down/J N次，则向下选中 N 个 Cell。 |
+
+说明：另外，您可以按住 shift，选中一个 Cell 并以此为基准，单击另一个目标 Cell 的左侧区域，即可向上或向下选中该范围内的所有 Cell。
+
+#### 转换 Cell
+
+在命令态下，选中单元格，通过快捷键可以实现 Markdown 到 Python 类型的互相转换。
+
+| 快捷键 | 效果 |
+| ------ | ------------------------------------------------------------------------ |
+| M | 将 Cell 转换为 Markdown 类型，快捷键1/2/3/4/5/6分别支持标题1/2/3/4/5/6。 |
+| Y | 将 Cell 转换为 Python 类型。 |
+
+#### 合并 Cell
+
+在命令态下，支持通过快捷键合并当前选中 Cell 和相邻上一个或下一个 Cell 的内容。
+
+| 快捷键 | 效果 |
+| -------------------- | ----------------------- |
+| Ctrl/Command+Shift+M | 合并相邻的下一个 Cell。 |
+
+说明：支持多选 Cell，并通过shift + m 进行批量合并。
+
+#### 执行 Cell
+
+在命令态下，您可以通过快捷键启动 Cell 执行，支持以下执行方式：
+
+| 快捷键 | 效果 |
+| ------------------ | -------------------------------------- |
+| Ctrl/Command+Enter | 执行当前 Cell。 |
+| Shift+Enter | 执行当前 Cell 并选中下一个单元格。 |
+| Alt/Opt+Enter | 执行当前 Cell 并向下插入同类型单元格。 |
+
+#### 拖拽 Cell
+
+
+
+
+
+说明：拖拽时，蓝色横条作为定位标记，表示拖拽至蓝色横条下方。
+
+- 拖拽多个 Cell
+ 在命令态下，多选 Cell 后，当您将鼠标移至 Cell 框左侧，出现样式时，可以同时拖拽多个 Cell。
+
+### 编辑态
+
+在编辑态下，支持以下常见功能。
+
+
+
+#### 切分 Cell
+
+支持将一个单元格中的内容切分为不同的段，分别放入不同的单元格中。
+
+
+
+
+
+#### 光标移动
+
+| 快捷键 | 功能 |
+| -------------------- | ------------------------------- |
+| Ctrl/Command + Left | 光标移至当前行的行首 |
+| Ctrl/Command + Right | 光标移至当前行的行尾 |
+| Ctrl/Command + Up | 光标移至文件的开始处（文件首） |
+| Ctrl/Command + Down | 光标移至文件的结束处（文件尾）} |
+
+### 左侧长条
+
+单击 Cell 左侧的长条支持隐藏与显示长条所对应的 Cell 区域部分。
+
+#### 隐藏与显示 Cell 输入部分
+
+
+
+#### 隐藏与显示 Cell 输出部分
+
+
+
+## Cell 介绍
+
+### Python Cell
+
+Python Cell 是 Notebook 中编辑和调试 Python 代码的最小单元，主要包含以下使用功能：
+
+
+
+| 功能 | 说明 |
+| ------------ | ---------------------------------------------------------------- |
+| 代码编写 | 提供用于编写源代码的编辑区域，支持语法高亮和自动代码补全等。 |
+| 单元调试 | 允许逐单元(cell)逐行调试代码，帮助识别代码中的逻辑错误和异常。 |
+| 输出调试窗格 | 显示代码执行的输出结果，包括打印的文本、图形、错误信息等。 |
+| 代码生成 | 根据用户输入自动生成代码片段，提高开发效率。 |
+| 使用框架和库 | 内置丰富类库，支持导入和使用多种 Python 框架和库，扩展代码功能。 |
+
+### Markdown Cell
+
+
+
+| 功能 | 说明 |
+| ---------- | ---------------------------------------------------------- |
+| 文本编辑 | 提供文本输入区域，用于编写 Markdown 格式的文本内容。 |
+| 格式化展示 | 在编辑完成后，支持渲染 Markdown 为格式化的 HTML 展示。 |
+| 插入元素 | 支持插入链接、图片、表格、列表等 Markdown 元素。 |
+| 文档结构化 | 使用 Markdown 语法创建有结构的文档，如标题、子标题、段落。 |
+| 代码块支持 | 支持插入代码块，并对不同编程语言进行语法高亮。 |
+
+说明：此外，支持基于标题的 Markdown Cell 进行隐藏与现实，帮助您更好的组织与查看 Notebook
+
+
diff --git a/apps/docs/docs/manual/prompt-cell.md b/apps/docs/docs/manual/prompt-cell.md
index 59d6fac7..307fbffb 100644
--- a/apps/docs/docs/manual/prompt-cell.md
+++ b/apps/docs/docs/manual/prompt-cell.md
@@ -1,28 +1,27 @@
---
-title: prompt cell 指南
+title: Prompt Cell Guide
order: 2
---
-## 什么是 Prompt Cell？
+## What is a Prompt Cell?
-Prompt Cell 是一种特殊的 notebook cell，通过这个 cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中，尤其是在需要频繁与 AI 进行交互的场景中。
-目前 libro 的 Prompt Cell：
+A Prompt Cell is a specialized notebook cell that allows users to input natural language instructions to invoke large models for inference and obtain desired output. It minimizes the need to write complex code and integrates flexibly into existing workflows, especially in scenarios requiring frequent AI interactions. Currently, libro’s Prompt Cell:
-- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展自己的模型～
- - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
- - 基于 libro-ai 扩展自己的模型。
-- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
-- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage.
+- Comes with built-in models like ChatGPT, GPT-4, and DALL-E 3. You can also expand your own models by:
+ - Defining `llm`, `agent`, and other interactive variables based on LangChain, which can be directly used in a Prompt Cell.
+ - Extending your model using libro-ai.
+- Supports selecting a chat identifier, allowing all Prompt Cells with the same chat identifier to be within one chat context.
+- Allows saving a Prompt Cell as a variable, where the variable represents LangChain's `AIMessage`.
-接下来我们将展示一个实际案例，如何通过 Prompt Cell 和 Python 变量的结合连接模型、生成代码、保存分析结果，并将这些分析结果通过对话历史进行传递。
+Next, we’ll showcase a practical example that demonstrates how to connect models, generate code, save analysis results, and pass them through conversation history using Prompt Cells combined with Python variables.
-## 场景：全球 CO2 排放数据分析与未来预测
+## Scenario: Global CO2 Emissions Analysis and Future Prediction
-这个案例中，我们将通过 Prompt Cell，连接大模型执行对未来 20 年全球 CO2 排放的预测，同时生成相应的 Python 代码进行可视化分析。
+In this example, we’ll use a Prompt Cell to connect a large model for predicting global CO2 emissions over the next 20 years, while also generating Python code for visualization analysis.
-### 准备工作
+### Preparation
-1. 在 `~/.libro/libro_config.yaml` 配置大模型 key，并且启用 libro-ai 扩展。
+1. Configure your model keys and enable the libro-ai extension in `~/.libro/libro_config.yaml`.
```yaml
llm:
@@ -31,42 +30,44 @@ jpserver_extensions:
libro_ai: True
```
-2. 在终端中运行命令 `libro` 启动 libro
+2. Run the `libro` command in the terminal to start libro.
-### 步骤 1: 分析 CO2 排放趋势
+### Step 1: Analyze CO2 Emission Trends
-1. 定义时间范围以及数据集地址变量的 Python 变量，注意这些变量必须是字符串类型：
+1. Define Python variables for the time range and dataset URL, ensuring these variables are of string type:
-
-2. 在 Prompt Cell 中通过自然语言输入连接模型进行加载数据集，可视化排放趋势的代码生成操作
-① 增加新的聊天标识，使得后续选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
-② 整个 Prompt Cell 消息保存为一个变量，该变量即为 langchain 的 AIMessage.
+
-
+2. Use natural language in the Prompt Cell to load the dataset and generate code for visualizing emission trends:
+ ① Add a new chat identifier, so that subsequent Prompt Cells with the same identifier are in one chat context.
+ ② Save the entire Prompt Cell message as a variable, which represents LangChain's `AIMessage`.
-
-3. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+
-
+
-### 步骤 2: 预测未来 CO2 排放量
+3. Clicking “Insert and Run” will automatically add a Python Cell with model-generated code, and execute it.
-1. 使用 Prompt Cell 生成预测未来 CO2 排放量的代码，并选择与前一个 Prompt Cell 同一个聊天标识，同时保存变量。
+
-
+### Step 2: Predict Future CO2 Emissions
-2. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+1. Use the Prompt Cell to generate code predicting future CO2 emissions. Select the same chat identifier as the previous Prompt Cell and save the variable.
-
+
-### 步骤 3: 基于 Langchain 消息提出应对 CO2 排放的建议
+2. Clicking “Insert and Run” will automatically add a Python Cell with model-generated code, and execute it.
-1. 此外，我们也可以配合着 langchain 一起使用，例如，基于前面保存的 co2_predict变量，生成应对气候变化的行动建议。
+
-
+### Step 3: Suggest Actions Based on LangChain Messages to Address CO2 Emissions
-
+1. Additionally, you can use LangChain, such as generating actionable recommendations for climate change based on the previously saved `co2_predict` variable.
-2. 同时，您可以看到，此时新增一个 Prompt Cell，此时模型选项中，包含对应的 langchain 变量对象 chat_prompt、llm、summary_chain。
+
-
+
+
+2. You’ll also see a new Prompt Cell with model options, including LangChain variable objects like `chat_prompt`, `llm`, and `summary_chain`.
+
+
diff --git a/apps/docs/docs/manual/prompt-cell.zh-CN.md b/apps/docs/docs/manual/prompt-cell.zh-CN.md
new file mode 100644
index 00000000..59d6fac7
--- /dev/null
+++ b/apps/docs/docs/manual/prompt-cell.zh-CN.md
@@ -0,0 +1,72 @@
+---
+title: prompt cell 指南
+order: 2
+---
+
+## 什么是 Prompt Cell？
+
+Prompt Cell 是一种特殊的 notebook cell，通过这个 cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中，尤其是在需要频繁与 AI 进行交互的场景中。
+目前 libro 的 Prompt Cell：
+
+- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展自己的模型～
+ - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
+ - 基于 libro-ai 扩展自己的模型。
+- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
+- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage.
+
+接下来我们将展示一个实际案例，如何通过 Prompt Cell 和 Python 变量的结合连接模型、生成代码、保存分析结果，并将这些分析结果通过对话历史进行传递。
+
+## 场景：全球 CO2 排放数据分析与未来预测
+
+这个案例中，我们将通过 Prompt Cell，连接大模型执行对未来 20 年全球 CO2 排放的预测，同时生成相应的 Python 代码进行可视化分析。
+
+### 准备工作
+
+1. 在 `~/.libro/libro_config.yaml` 配置大模型 key，并且启用 libro-ai 扩展。
+
+```yaml
+llm:
+ OPENAI_API_KEY: sk-xxx
+jpserver_extensions:
+ libro_ai: True
+```
+
+2. 在终端中运行命令 `libro` 启动 libro
+
+### 步骤 1: 分析 CO2 排放趋势
+
+1. 定义时间范围以及数据集地址变量的 Python 变量，注意这些变量必须是字符串类型：
+
+
+2. 在 Prompt Cell 中通过自然语言输入连接模型进行加载数据集，可视化排放趋势的代码生成操作
+① 增加新的聊天标识，使得后续选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
+② 整个 Prompt Cell 消息保存为一个变量，该变量即为 langchain 的 AIMessage.
+
+
+
+
+3. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+
+
+
+### 步骤 2: 预测未来 CO2 排放量
+
+1. 使用 Prompt Cell 生成预测未来 CO2 排放量的代码，并选择与前一个 Prompt Cell 同一个聊天标识，同时保存变量。
+
+
+
+2. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+
+
+
+### 步骤 3: 基于 Langchain 消息提出应对 CO2 排放的建议
+
+1. 此外，我们也可以配合着 langchain 一起使用，例如，基于前面保存的 co2_predict变量，生成应对气候变化的行动建议。
+
+
+
+
+
+2. 同时，您可以看到，此时新增一个 Prompt Cell，此时模型选项中，包含对应的 langchain 变量对象 chat_prompt、llm、summary_chain。
+
+
diff --git a/apps/docs/docs/manual/sql-cell.md b/apps/docs/docs/manual/sql-cell.md
index f78e9229..1e780e71 100644
--- a/apps/docs/docs/manual/sql-cell.md
+++ b/apps/docs/docs/manual/sql-cell.md
@@ -1,29 +1,29 @@
---
-title: sql cell 指南
+title: SQL Cell Guide
order: 1
---
-# 概述
+# Overview
-libro 支持使用 SQL Cell 来简化数据库交互，通过在 libro 中结合 SQL 和 Python，你可以：
+Libro supports using SQL Cells to simplify database interactions. By combining SQL and Python in Libro, you can:
-- 直接查询数据库，快速获取数据，支持把结果保存为 dataframe。
-- 使用 Python 对查询结果进行进一步的处理和可视化。
-- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+- Query databases directly to quickly retrieve data and save the results as a DataFrame.
+- Further process and visualize query results using Python.
+- Integrate SQL’s powerful querying capabilities with the dynamic nature of notebooks, improving development efficiency.
-下面我们通过一个完整的例子展示如何在 libro 中使用 SQL Cell 来操作数据库，并结合 Python 进行数据分析。
+The following example demonstrates how to use SQL Cells in Libro to interact with a database and analyze data using Python.
-## 📍场景：电子商务平台的销售数据分析
+## 📍 Scenario: Sales Data Analysis for an E-commerce Platform
-假设我们管理一个电子商务平台，并且希望通过分析销售数据来优化业务策略。数据库中包含多个表，比如 orders（订单表）、customers（客户表）、products（产品表）和 order_items（订单项表），记录了客户的订单和购买情况。我们将通过在 libro 中使用 SQL Cell 来解决以下几个常见问题：
+Imagine we manage an e-commerce platform and want to analyze sales data to optimize business strategies. The database includes multiple tables, such as `orders` (order table), `customers` (customer table), `products` (product table), and `order_items` (order item table), which record customer orders and purchase details. We’ll use SQL Cells in Libro to address several common questions:
-1. 分析不同产品的销量：统计每个产品的销售数量和收入。
-2. 分析客户购买行为：找出每个客户的购买总额和平均订单金额。
-3. 找出平台的最佳销售月份：通过时间维度分析平台的销售表现。
+1. Analyze product sales: Calculate the sales quantity and revenue for each product.
+2. Analyze customer purchasing behavior: Identify each customer’s total spend and average order value.
+3. Determine the best sales month for the platform: Analyze sales performance over time.
-### 准备工作
+### Preparation
-1. 配置数据库的连接信息，在 `~/.libro/libro_config.yaml` 中添加数据库的连接配置,并且启用 libro-sql 扩展。
+1. Configure the database connection details by adding them to the `~/.libro/libro_config.yaml` file and enable the `libro-sql` extension.
```yaml
db:
@@ -37,8 +37,8 @@ jpserver_extensions:
libro_sql: True
```
-> 💡 **Tip**: 如果没有上述 libro 的配置文件可通过在终端中运行命令 `libro config generate` 生成.
-> 此外，mysql、sqlite 的配置示例如下: +> 💡 **Tip**: If the configuration file doesn’t already exist, generate it by running the command `libro config generate` in the terminal. +> Additionally, here are configuration examples for MySQL and SQLite: > > ```yaml > - db_type: mysql @@ -53,49 +53,47 @@ jpserver_extensions: > password: '' > host: '' > port: 0 -> database: sql_demo.db #.db 文件相较于 libro 启动路径的位置 +> database: sql_demo.db # relative to the libro startup path > ``` -> -> -2. 在终端中运行命令libro启动 libro，如果已经启动 libro ，则配置完成之后重启内核。 +2. Start Libro by running the command `libro` in the terminal. If Libro is already running, restart the kernel after configuring. -### 案例 1：分析不同产品的销量 +### Example 1: Analyzing Product Sales -1. 查询不同产品的销量 - 我们首先通过 SQL 查询来统计每个产品的销量和总收入。这个查询将返回每个产品的销售数量以及它所产生的总收入，同时把查询结果保存到 Pandas DataFrame 中。 +1. Query product sales + We start by using SQL to calculate the sales quantity and total revenue for each product. This query returns the sales quantity and total revenue for each product, with the results saved in a Pandas DataFrame.
-2. 可视化产品销售表现
- 我们可以使用 Python 的可视化工具（如 Matplotlib 或 Seaborn）对产品销量进行直观展示，通过这个直方图，我们可以快速了解哪些产品是平台上最畅销的。
+2. Visualize product sales performance
+ We can visualize product sales using Python visualization tools such as Matplotlib or Seaborn. This histogram provides a quick overview of the platform’s best-selling products.
-### 案例 2：分析客户的购买行为
+### Example 2: Analyzing Customer Purchasing Behavior
-1. 统计每个客户的订单数量、总消费金额和平均订单金额
- 我们首先通过 SQL 查询来统计他们的总购买金额和平均订单金额。这个查询将返回每个客户的订单数量、总消费金额和平均订单金额。通过这些数据，我们可以了解哪些客户是平台的忠实用户，以及他们的消费习惯。
+1. Calculate the number of orders, total spend, and average order value for each customer
+ Using SQL, we calculate each customer’s total spending and average order value. This query returns the number of orders, total spend, and average order value for each customer, allowing us to identify loyal customers and understand their purchasing habits.
-2. 数据分析
- 通过 Python，可以进一步处理这些数据，找出不同客户的消费模式，例如哪些客户属于高价值客户。
+2. Data Analysis
+ We can further analyze this data in Python to identify customer spending patterns, such as identifying high-value customers.
-案例 3：找出最佳销售月份
+### Example 3: Identifying the Best Sales Month
-1. 查询每个月的总销售额
- 我们通过时间维度分析平台的最佳销售月份，这个查询会返回每个月的总销售额，并按降序排列，以便你了解哪几个月份的销售额最高。
+1. Query total sales by month
+ We analyze the platform’s best sales month over time. This query returns the total monthly sales, sorted in descending order, allowing you to see which months had the highest sales.
-2. 可视化每月销售额趋势
- 我们可以将每个月的销售数据可视化为折线图，通过这个折线图，可以轻松地看到不同月份的销售趋势，帮助调整库存和营销策略。
+2. Visualize monthly sales trends
+ We can visualize the monthly sales data as a line chart. This line chart helps you easily see the monthly sales trend, providing insights to adjust inventory and marketing strategies.
-# 最后
+# Conclusion
-通过这个电子商务平台的销售数据分析案例，我们展示了如何在 libro 中使用 SQL Cell 来解决实际问题，包括产品销量分析、客户行为分析以及销售趋势分析。你可以根据自己的需求扩展这些分析方法，在 libro 中结合 SQL 和 Python 的强大能力，进行个性化的数据分析。
+Through this sales data analysis case for an e-commerce platform, we demonstrated how to use SQL Cells in Libro to address real-world problems, including product sales analysis, customer behavior analysis, and sales trend analysis. You can extend these methods to suit your needs, leveraging the powerful combination of SQL and Python in Libro for personalized data analysis.
diff --git a/apps/docs/docs/manual/sql-cell.zh-CN.md b/apps/docs/docs/manual/sql-cell.zh-CN.md
new file mode 100644
index 00000000..f78e9229
--- /dev/null
+++ b/apps/docs/docs/manual/sql-cell.zh-CN.md
@@ -0,0 +1,101 @@
+---
+title: sql cell 指南
+order: 1
+---
+
+# 概述
+
+libro 支持使用 SQL Cell 来简化数据库交互，通过在 libro 中结合 SQL 和 Python，你可以：
+
+- 直接查询数据库，快速获取数据，支持把结果保存为 dataframe。
+- 使用 Python 对查询结果进行进一步的处理和可视化。
+- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+
+下面我们通过一个完整的例子展示如何在 libro 中使用 SQL Cell 来操作数据库，并结合 Python 进行数据分析。
+
+## 📍场景：电子商务平台的销售数据分析
+
+假设我们管理一个电子商务平台，并且希望通过分析销售数据来优化业务策略。数据库中包含多个表，比如 orders（订单表）、customers（客户表）、products（产品表）和 order_items（订单项表），记录了客户的订单和购买情况。我们将通过在 libro 中使用 SQL Cell 来解决以下几个常见问题：
+
+1. 分析不同产品的销量：统计每个产品的销售数量和收入。
+2. 分析客户购买行为：找出每个客户的购买总额和平均订单金额。
+3. 找出平台的最佳销售月份：通过时间维度分析平台的销售表现。
+
+### 准备工作
+
+1. 配置数据库的连接信息，在 `~/.libro/libro_config.yaml` 中添加数据库的连接配置,并且启用 libro-sql 扩展。
+
+```yaml
+db:
+ - db_type: postgresql
+ username: 'libro'
+ password: '12345678'
+ host: '127.0.0.1'
+ port: 5432
+ database: libro
+jpserver_extensions:
+ libro_sql: True
+```
+
+> 💡 **Tip**: 如果没有上述 libro 的配置文件可通过在终端中运行命令 `libro config generate` 生成.
+> 此外，mysql、sqlite 的配置示例如下: +> +> ```yaml +> - db_type: mysql +> username: 'root' +> password: '12345678' +> host: '127.0.0.1' +> port: 3306 +> database: sql_demo +> +> - db_type: sqlite +> username: '' +> password: '' +> host: '' +> port: 0 +> database: sql_demo.db #.db 文件相较于 libro 启动路径的位置 +> ``` +> +> + +2. 在终端中运行命令libro启动 libro，如果已经启动 libro ，则配置完成之后重启内核。 + +### 案例 1：分析不同产品的销量 + +1. 查询不同产品的销量 + 我们首先通过 SQL 查询来统计每个产品的销量和总收入。这个查询将返回每个产品的销售数量以及它所产生的总收入，同时把查询结果保存到 Pandas DataFrame 中。 + +
+
+2. 可视化产品销售表现
+ 我们可以使用 Python 的可视化工具（如 Matplotlib 或 Seaborn）对产品销量进行直观展示，通过这个直方图，我们可以快速了解哪些产品是平台上最畅销的。
+
+
+
+### 案例 2：分析客户的购买行为
+
+1. 统计每个客户的订单数量、总消费金额和平均订单金额
+ 我们首先通过 SQL 查询来统计他们的总购买金额和平均订单金额。这个查询将返回每个客户的订单数量、总消费金额和平均订单金额。通过这些数据，我们可以了解哪些客户是平台的忠实用户，以及他们的消费习惯。
+
+
+
+2. 数据分析
+ 通过 Python，可以进一步处理这些数据，找出不同客户的消费模式，例如哪些客户属于高价值客户。
+
+
+
+案例 3：找出最佳销售月份
+
+1. 查询每个月的总销售额
+ 我们通过时间维度分析平台的最佳销售月份，这个查询会返回每个月的总销售额，并按降序排列，以便你了解哪几个月份的销售额最高。
+
+
+
+2. 可视化每月销售额趋势
+ 我们可以将每个月的销售数据可视化为折线图，通过这个折线图，可以轻松地看到不同月份的销售趋势，帮助调整库存和营销策略。
+
+
+
+# 最后
+
+通过这个电子商务平台的销售数据分析案例，我们展示了如何在 libro 中使用 SQL Cell 来解决实际问题，包括产品销量分析、客户行为分析以及销售趋势分析。你可以根据自己的需求扩展这些分析方法，在 libro 中结合 SQL 和 Python 的强大能力，进行个性化的数据分析。
diff --git a/apps/docs/docs/updates/update20241014.md b/apps/docs/docs/updates/update20241014.md
index 9d53436b..97cb7b7a 100644
--- a/apps/docs/docs/updates/update20241014.md
+++ b/apps/docs/docs/updates/update20241014.md
@@ -1,69 +1,62 @@
---
-title: 2024-10-14 更新
+title: Update on 2024-10-14
order: 9999
---
# 2024-10-14
-🎉🎉🎉 近期，我们聚焦于提升产品的灵活性和智能化体验，推出了多个实用的新功能。这些功能不仅使配置管理更加便捷，还极大地优化了与 AI 和数据库的交互流程。以下是本次更新的核心亮点，欢迎大家使用反馈～
+🎉🎉🎉 Recently, we have focused on enhancing the flexibility and intelligent experience of our product, launching several practical new features. These features not only make configuration management more convenient but also significantly optimize interactions with AI and databases. Below are the key highlights of this update, and we welcome your feedback!
-🌟 GitHub：https://github.com/difizen/libro
+🌟 GitHub: [https://github.com/difizen/libro](https://github.com/difizen/libro)
-🌟 官网：https://libro.difizen.net/
+🌟 Official Website: [https://libro.difizen.net/](https://libro.difizen.net/)
-## 1. 支持 Prompt Cell
+## 1. Support for Prompt Cell
-Prompt Cell 是一种特殊的 notebook cell，通过这个 Cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中。
+The Prompt Cell is a special type of notebook cell that allows users to input natural language commands to invoke large models for inference and obtain the desired output. Its introduction reduces the need to write complex code and can be flexibly integrated into existing workflows.
-目前 libro 的 Prompt Cell：
+Currently, the Prompt Cell in Libro:
-- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展模型～
- - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
- - 基于 libro-ai 扩展自己的模型。
-- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中。
-- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage。
+- Includes built-in models such as ChatGPT, GPT-4, and DALL-E 3, and you can extend models in the following ways:
+ - Define variables for conversational objects like LLMs and agents based on Langchain, which can be used directly in the Prompt Cell.
+ - Expand your own models based on Libro-AI.
+- Supports the selection of chat identifiers, so that all Prompt Cells with the selected identifier are within the same chat context.
+- Allows saving the Prompt Cell as a variable, which is an AIMessage from Langchain.
-详情可看：[Prompt Cell 使用指南](../manual/prompt-cell.md)。
+For more details, please see the [Prompt Cell User Guide](../manual/prompt-cell.md).
-
+
-## 2. 支持 SQL Cell
+## 2. Support for SQL Cell
-我们引入了 SQL Cell 支持，用户可以直接在 notebook 环境中编写并执行 SQL 查询，访问和操作数据库。这一功能为数据分析、可视化、以及数据库驱动型应用开发带来了无缝的集成体验。
+We have introduced SQL Cell support, enabling users to write and execute SQL queries directly in the notebook environment, accessing and manipulating databases. This feature provides a seamless integration experience for data analysis, visualization, and database-driven application development.
-通过在 libro 中结合 SQL 和 Python，您可以：
+By combining SQL and Python in Libro, you can:
-- 直接配置内置支持 mysql、sqlite、postgresql 数据库连接。
-- 查询数据库，快速获取数据，支持把结果保存为 dataframe。
-- 使用 Python 对查询结果进行进一步的处理和可视化。
-- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+- Configure built-in support for connections to MySQL, SQLite, and PostgreSQL databases.
+- Query databases to quickly retrieve data, supporting the saving of results as dataframes.
+- Use Python for further processing and visualization of query results.
+- Combine SQL’s powerful querying capabilities with the dynamism of notebooks, enhancing development efficiency.
-详情可看：[SQL Cell 使用指南](../manual/sql-cell.md)。
+For more details, please see the [SQL Cell User Guide](../manual/sql-cell.md).
-
+
-## 3. 文件级别的配置能力
+## 3. File-Level Configuration Capabilities
-配置管理不再繁琐！我们引入了文件级别的配置功能，用户可以通过运行简单的一条命令 libro config generate，自动在用户目录下生成配置文件模板。目前支持数据库连接配置和大模型密钥配置。
+Configuration management is no longer cumbersome! We have introduced file-level configuration features, allowing users to automatically generate configuration file templates in their user directory by running the simple command `libro config generate`. Currently, it supports database connection configuration and large model key configuration.
-不仅如此，系统支持从多种路径中加载配置文件，提升了灵活性与适应性，包括：
+## 4. Support for Language Switching Between Chinese and English
-- 用户目录
-- 当前工作目录
-- 项目根目录
-- 环境变量
+We have also launched a language switching feature between Chinese and English. Users can easily switch to their preferred language interface, achieving localization of the development environment.
-## 4. 支持中英文语言切换
+
-我们还推出了中英文语言切换功能。用户可以在切换选择所需的语言界面，轻松实现开发环境的本地化。
+# Summary
-
+This version update brings comprehensive enhancements to several features. The file-level configuration capability greatly improves flexibility, while the Prompt Cell and SQL Cell enhance the usability of AI and database operations, respectively. The language switching feature provides users with a better localization experience. We will continue to iterate and introduce more features to enhance development efficiency, so stay tuned!
-# 总结
-
-这次版本更新带来了多项功能的全面提升，文件级别的配置能力大幅提高了灵活性，Prompt Cell 和 SQL Cell 分别加强了 AI 与数据库操作的易用性，语言切换功能则为用户提供了更好的本地化体验。未来我们将持续迭代，推出更多有助于提升开发效率的功能，敬请期待！
-
-如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+If you have any questions or suggestions about these new features, feel free to contact us or discuss them in the community.
💬 [Chat with us on Discord](https://discord.gg/RbZ9aEKK)
diff --git a/apps/docs/docs/updates/update20241014.zh-CN.md b/apps/docs/docs/updates/update20241014.zh-CN.md
new file mode 100644
index 00000000..fe7fe00f
--- /dev/null
+++ b/apps/docs/docs/updates/update20241014.zh-CN.md
@@ -0,0 +1,63 @@
+---
+title: 2024-10-14 更新
+order: 9999
+---
+
+# 2024-10-14
+
+🎉🎉🎉 近期，我们聚焦于提升产品的灵活性和智能化体验，推出了多个实用的新功能。这些功能不仅使配置管理更加便捷，还极大地优化了与 AI 和数据库的交互流程。以下是本次更新的核心亮点，欢迎大家使用反馈～
+
+🌟 GitHub: [https://github.com/difizen/libro](https://github.com/difizen/libro)
+
+🌟 官网：[https://libro.difizen.net/](https://libro.difizen.net/)
+
+## 1. 支持 Prompt Cell
+
+Prompt Cell 是一种特殊的 notebook cell，通过这个 Cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中。
+
+目前 libro 的 Prompt Cell：
+
+- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展模型～
+ - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
+ - 基于 libro-ai 扩展自己的模型。
+- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中。
+- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage。
+
+详情可看：[Prompt Cell 使用指南](../manual/prompt-cell.md)。
+
+
+
+## 2. 支持 SQL Cell
+
+我们引入了 SQL Cell 支持，用户可以直接在 notebook 环境中编写并执行 SQL 查询，访问和操作数据库。这一功能为数据分析、可视化、以及数据库驱动型应用开发带来了无缝的集成体验。
+
+通过在 libro 中结合 SQL 和 Python，您可以：
+
+- 直接配置内置支持 mysql、sqlite、postgresql 数据库连接。
+- 查询数据库，快速获取数据，支持把结果保存为 dataframe。
+- 使用 Python 对查询结果进行进一步的处理和可视化。
+- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+
+详情可看：[SQL Cell 使用指南](../manual/sql-cell.md)。
+
+
+
+## 3. 文件级别的配置能力
+
+配置管理不再繁琐！我们引入了文件级别的配置功能，用户可以通过运行简单的一条命令 libro config generate，自动在用户目录下生成配置文件模板。目前支持数据库连接配置和大模型密钥配置。
+
+## 4. 支持中英文语言切换
+
+我们还推出了中英文语言切换功能。用户可以在切换选择所需的语言界面，轻松实现开发环境的本地化。
+
+
+
+# 总结
+
+这次版本更新带来了多项功能的全面提升，文件级别的配置能力大幅提高了灵活性，Prompt Cell 和 SQL Cell 分别加强了 AI 与数据库操作的易用性，语言切换功能则为用户提供了更好的本地化体验。未来我们将持续迭代，推出更多有助于提升开发效率的功能，敬请期待！
+
+如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+
+💬 [Chat with us on Discord](https://discord.gg/RbZ9aEKK)
+
+🤗 [Join our DingTalk Q&A group](https://qr.dingtalk.com/action/joingroup?code=v1,k1,52f1gKWwsZBMrWjXHcQFlOJEQIbbrMO86Iulu3T3ePY=&_dt_no_comment=1&origin=11)
diff --git a/apps/docs/docs/updates/update20241101.md b/apps/docs/docs/updates/update20241101.md
index e73f9c54..2cf7c618 100644
--- a/apps/docs/docs/updates/update20241101.md
+++ b/apps/docs/docs/updates/update20241101.md
@@ -1,66 +1,66 @@
---
-title: 2024-11-01 更新
+title: Update on 2024-11-01
order: 9998
---
# 2024-11-01
-# 🚀 全新上线！AI 编程助手助力你的 Notebook 体验！
+# 🚀 Brand New Launch! AI Programming Assistant Enhances Your Notebook Experience!
-Libro AI 编程助手正式上线！集成了多种智能功能，旨在提升你的编程效率和学习体验，以下是本次更新的核心内容，快来体验，让你的编程之旅更轻松、高效！
+The Libro AI Programming Assistant is officially live! It integrates various intelligent features designed to improve your programming efficiency and learning experience. Here are the key highlights of this update—come and experience it to make your programming journey easier and more efficient!
-- 错误修复：修复代码中的错误，助你轻松解决编程难题。
-- AI 对话：与 AI 进行智能对话，获取实时反馈和建议，让编程变得更加顺畅。
-- 代码解释：对复杂代码提供详细解释，帮助你深入理解每一行代码的含义。
-- 代码优化：根据最佳实践提供优化建议，提升代码的性能与可读性。
+- **Error Fixing**: Fix errors in your code to help you easily resolve programming challenges.
+- **AI Chat**: Engage in intelligent conversations with AI to receive real-time feedback and suggestions, making coding smoother.
+- **Code Explanation**: Get detailed explanations for complex code, helping you understand the meaning of each line.
+- **Code Optimization**: Receive optimization suggestions based on best practices to enhance your code’s performance and readability.
-🌟 GitHub：https://github.com/difizen/libro
+🌟 GitHub: [https://github.com/difizen/libro](https://github.com/difizen/libro)
-🌟 官网：https://libro.difizen.net/
+🌟 Official Website: [https://libro.difizen.net/](https://libro.difizen.net/)
-## 新特性
+## New Features
-### 错误修复
+### Error Fixing
-当 Cell 执行出现报错时，只需一键点击 “AI 修复” 按钮，助手会自动分析错误并给出修复建议，帮助你快速解决问题，恢复顺利的编程体验。
+When a Cell execution results in an error, simply click the “AI Fix” button. The assistant will automatically analyze the error and provide repair suggestions, helping you quickly resolve the issue and restore a smooth programming experience.
-
+
-### AI 对话
+### AI Chat
-**Cell 上下文对话**：你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+**Cell Context Chat**: You can interact directly with AI to receive in-depth answers and optimization suggestions related to the current code, boosting your programming efficiency.
-
+
-**通用 AI 对话**：你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+**General AI Chat**: Engage in open conversations with AI to ask programming-related questions and receive advice and information, enjoying the fun of intelligent interaction.
-
+
-### 代码解释
+### Code Explanation
-AI 编程助手帮助你理解 Cell 中代码的功能和逻辑，让编程学习变得更加轻松。
+The AI Programming Assistant helps you understand the functions and logic of the code in the Cell, making programming learning much easier.
-
+
-### 代码优化
+### Code Optimization
-AI 编程助手能够分析单元格（cell）中的代码，并提供优化建议。它将帮助你识别潜在的性能瓶颈和改进点，让你的代码更加高效、可读，提升整体编程体验。
+The AI Programming Assistant can analyze the code within cells and provide optimization suggestions. It will help you identify potential performance bottlenecks and improvement points, making your code more efficient and readable, enhancing your overall programming experience.
-
+
-## 历史修复
+## History of Fixes
-1. Sql Cell 高亮问题
-2. 折叠 Markdown Cell 后新建单元格错位
-3. tqdm 进度条完成后无法及时清除
-4. `libro config generate` 生成配置文件失效
-5. 浏览器旧版的缓存问题
+1. SQL Cell highlighting issue
+2. New cells misalignment after collapsing Markdown Cells
+3. `tqdm` progress bar not clearing promptly after completion
+4. `libro config generate` generating configuration files not working
+5. Cache issues with older browser versions
-## 总结
+## Summary
-这次版本带来全新的编程助手，通过智能错误修复、AI 对话、代码解释和优化功能，为你的 Notebook 编程体验提供全方位支持，助力你高效、轻松地实现编程目标！未来我们将持续迭代，推出更多实用的功能，敬请期待！
+This version brings a brand-new programming assistant, providing comprehensive support for your Notebook programming experience through intelligent error fixing, AI chat, code explanation, and optimization features, helping you achieve your programming goals efficiently and easily! We will continue to iterate and introduce more practical features in the future, so stay tuned!
-如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+If you have any questions or suggestions about these new features, feel free to contact us or discuss them in the community.
💬 [Chat with us on Discord](https://discord.gg/B4V7AWy4)
diff --git a/apps/docs/docs/updates/update20241101.zh-CN.md b/apps/docs/docs/updates/update20241101.zh-CN.md
new file mode 100644
index 00000000..e73f9c54
--- /dev/null
+++ b/apps/docs/docs/updates/update20241101.zh-CN.md
@@ -0,0 +1,67 @@
+---
+title: 2024-11-01 更新
+order: 9998
+---
+
+# 2024-11-01
+
+# 🚀 全新上线！AI 编程助手助力你的 Notebook 体验！
+
+Libro AI 编程助手正式上线！集成了多种智能功能，旨在提升你的编程效率和学习体验，以下是本次更新的核心内容，快来体验，让你的编程之旅更轻松、高效！
+
+- 错误修复：修复代码中的错误，助你轻松解决编程难题。
+- AI 对话：与 AI 进行智能对话，获取实时反馈和建议，让编程变得更加顺畅。
+- 代码解释：对复杂代码提供详细解释，帮助你深入理解每一行代码的含义。
+- 代码优化：根据最佳实践提供优化建议，提升代码的性能与可读性。
+
+🌟 GitHub：https://github.com/difizen/libro
+
+🌟 官网：https://libro.difizen.net/
+
+## 新特性
+
+### 错误修复
+
+当 Cell 执行出现报错时，只需一键点击 “AI 修复” 按钮，助手会自动分析错误并给出修复建议，帮助你快速解决问题，恢复顺利的编程体验。
+
+
+
+### AI 对话
+
+**Cell 上下文对话**：你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+
+
+
+**通用 AI 对话**：你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+
+
+
+### 代码解释
+
+AI 编程助手帮助你理解 Cell 中代码的功能和逻辑，让编程学习变得更加轻松。
+
+
+
+### 代码优化
+
+AI 编程助手能够分析单元格（cell）中的代码，并提供优化建议。它将帮助你识别潜在的性能瓶颈和改进点，让你的代码更加高效、可读，提升整体编程体验。
+
+
+
+## 历史修复
+
+1. Sql Cell 高亮问题
+2. 折叠 Markdown Cell 后新建单元格错位
+3. tqdm 进度条完成后无法及时清除
+4. `libro config generate` 生成配置文件失效
+5. 浏览器旧版的缓存问题
+
+## 总结
+
+这次版本带来全新的编程助手，通过智能错误修复、AI 对话、代码解释和优化功能，为你的 Notebook 编程体验提供全方位支持，助力你高效、轻松地实现编程目标！未来我们将持续迭代，推出更多实用的功能，敬请期待！
+
+如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+
+💬 [Chat with us on Discord](https://discord.gg/B4V7AWy4)
+
+🤗 [Join our DingTalk Q&A group](https://qr.dingtalk.com/action/joingroup?code=v1,k1,52f1gKWwsZBMrWjXHcQFlOJEQIbbrMO86Iulu3T3ePY=&_dt_no_comment=1&origin=11)
+ {libroView &&
);
-}
+};
```
-2. 设置编辑器数据源，详情参考：todo
+2. Configure the editor's data source. For more details, see the documentation.
```typescript
import type {
@@ -198,13 +185,11 @@ import { singleton } from '@difizen/mana-app';
@singleton({ contrib: ContentContribution })
export class LibroEditorContentContribution implements ContentContribution {
- canHandle = () => {
- return 10;
- };
+ canHandle = () => 10;
async loadContent(options: NotebookOption, model: LibroJupyterModel) {
- let notebookContent: INotebookContent = require('./libro-demo.json');
- let currentFileContents: IContentsModel = {
+ const notebookContent: INotebookContent = require('./libro-demo.json');
+ const currentFileContents: IContentsModel = {
name: 'libro-demo.ipynb',
path: '/libro-demo.ipynb',
type: 'notebook',
@@ -225,7 +210,7 @@ export class LibroEditorContentContribution implements ContentContribution {
}
```
-3. 创建并注册 mana module。
+3. Create and register a `mana` module.
```typescript
import { ManaModule } from '@difizen/mana-app';
@@ -238,18 +223,17 @@ export const LibroEditorModule = ManaModule.create()
.dependOn(LibroJupyterModule);
```
-4. 消费 Libro 编辑器的 React 组件，在使用 LibroEditor 的最外层包上 ManaComponents.Application ，使得多个 LibroView 的实例可以共享上下文。
+4. Use the `LibroEditor` React component. Wrap it with `ManaComponents.Application` to enable shared context for multiple `LibroView` instances.
-注意：由于此时 ManaComponents.Application中包裹了 LibroEditor组件，需要单独增加 renderChildren用于渲染。
+> Note: Add `renderChildren` to render the children components within `ManaComponents.Application`.
-```jsx
+```typescript
import React from 'react';
import { ManaAppPreset, ManaComponents } from '@difizen/mana-app';
-import './index.less'
+import './index.less';
import { LibroEditorModule } from '@/modules/libro-editor/module';
import { LibroEditor } from './libro-editor';
-
const App = (): JSX.Element => {
return (
@@ -258,8 +242,8 @@ const App = (): JSX.Element => {
modules={[ManaAppPreset, LibroEditorModule]}
renderChildren
asChild={true}
- >
-
);
diff --git a/apps/docs/docs/integration/index.zh-CN.md b/apps/docs/docs/integration/index.zh-CN.md
new file mode 100644
index 00000000..c453e7f9
--- /dev/null
+++ b/apps/docs/docs/integration/index.zh-CN.md
@@ -0,0 +1,269 @@
+---
+title: 快速集成
+order: 0
+---
+
+# 概览
+
+Libro 提供了前端和服务侧的定制接入能力，本文将手把手教你快速定制接入。
+
+# 前端项目接入
+
+## Umi 项目接入
+
+在开始运行前，请先保证本地的环境已经安装 node 版本是 18 或以上。
+
+### 安装依赖
+
+安装 libro , mana 相关的依赖包，可按照需要安装。
+
+```bash
+pnpm add @difizen/libro-lab //集成 lab 研发环境时安装
+pnpm add @difizen/libro-jupyter //集成 libro 编辑器时安装
+pnpm add @difizen/mana-app
+
+pnpm add @difizen/umi-plugin-mana -D
+```
+
+### 修改配置
+
+1. 在 .umirc.ts 中增加 libro 底层依赖框架 mana 相关的配置。
+
+```typescript
+export default defineConfig({
+ // 引入
+ plugins: ['@difizen/umi-plugin-mana'],
+ // 配置
+ mana: {
+ decorator: true,
+ nodenext: true,
+ routerBase: true,
+ runtime: true,
+ },
+});
+```
+
+在项目根目录中的 tsconfig.json 文件中添加如下配置，从而满足 libro 的底层依赖框架 mana 中的一些编译提示报错。
+
+```json
+"compilerOptions": {
+ "strictPropertyInitialization": false,
+ "experimentalDecorators": true,
+},
+```
+
+### 集成 Lab 研发环境
+
+
+
+1. 连接 Notebook 服务：这里您可以通过安装 libro-server ，也可以使用 jupyter 的能力，例如 jupyter server 或者 jupyter lab。启动服务，获得对应的服务链接，并可以按照下述方式在前端侧更新服务链接。
+
+```typescript
+import { ServerConnection, ServerManager } from '@difizen/libro-lab';
+import { ApplicationContribution, inject, singleton } from '@difizen/mana-app';
+
+@singleton({ contrib: ApplicationContribution })
+export class LibroApp implements ApplicationContribution {
+ @inject(ServerConnection) serverConnection: ServerConnection;
+ @inject(ServerManager) serverManager: ServerManager;
+
+ async onStart() {
+ this.serverConnection.updateSettings({
+ baseUrl: 'http://localhost:8888/',
+ wsUrl: 'ws://localhost:8888/',
+ });
+ this.serverManager.launch();
+ }
+}
+```
+
+2. 创建并注册 ManaModule。
+
+```typescript
+import { ManaModule } from '@difizen/mana-app';
+import { LibroApp } from './app';
+import { LibroLabModule } from '@difizen/libro-lab';
+
+export const LabModule = ManaModule.create()
+ .register(LibroApp)
+ .dependOn(LibroLabModule);
+```
+
+3. 通过下述方式实现关于 LibroLab 的 React 组件，其中 ManaComponents.Application 为 mana 应用的react 形式的组件，所有的 mana 模块都注册在该上下文中。
+
+```typescript
+import React from 'react';
+import { ManaAppPreset, ManaComponents } from '@difizen/mana-app';
+import { LabModule } from '@/modules/libro-lab/module';
+import './index.less'
+
+
+const App = (): JSX.Element => {
+ return (
+
+
+ );
+};
+
+export default App;
+
+```
+
+### 集成 Notebook 编辑器
+
+
+
+1. 编写 Libro 编辑器的 React 组件，核心是通过 LibroService 创建 LibroView 实例，并通过 ViewRender 渲染构建出的 LibroView 实例。
+
+```jsx
+import { DocumentCommands, LibroService, LibroView } from '@difizen/libro-jupyter';
+import { CommandRegistry, ViewRender, useInject } from '@difizen/mana-app';
+import React from 'react';
+import { useEffect, useState } from 'react';
+
+export const LibroEditor: React.FC = ()=>{
+ const libroService = useInject
+ {libroView && }
+
+ );
+}
+```
+
+2. 设置编辑器数据源，详情参考：todo
+
+```typescript
+import type {
+ IContentsModel,
+ INotebookContent,
+ LibroJupyterModel,
+ NotebookOption,
+} from '@difizen/libro-jupyter';
+import { ContentContribution } from '@difizen/libro-jupyter';
+import { singleton } from '@difizen/mana-app';
+
+@singleton({ contrib: ContentContribution })
+export class LibroEditorContentContribution implements ContentContribution {
+ canHandle = () => {
+ return 10;
+ };
+
+ async loadContent(options: NotebookOption, model: LibroJupyterModel) {
+ let notebookContent: INotebookContent = require('./libro-demo.json');
+ let currentFileContents: IContentsModel = {
+ name: 'libro-demo.ipynb',
+ path: '/libro-demo.ipynb',
+ type: 'notebook',
+ writable: true,
+ created: 'libro',
+ last_modified: 'libro',
+ content: notebookContent,
+ };
+ currentFileContents.content.nbformat_minor = 5;
+ model.currentFileContents = currentFileContents;
+ model.filePath = currentFileContents.path;
+ model.lastModified = model.currentFileContents.last_modified;
+ if (model.executable) {
+ model.startKernelConnection();
+ }
+ return notebookContent;
+ }
+}
+```
+
+3. 创建并注册 mana module。
+
+```typescript
+import { ManaModule } from '@difizen/mana-app';
+import { LibroApp } from './app';
+import { LibroJupyterModule } from '@difizen/libro-lab';
+import { LibroEditorContentContribution } from './libro-content-contribution';
+
+export const LibroEditorModule = ManaModule.create()
+ .register(LibroApp, LibroEditorContentContribution)
+ .dependOn(LibroJupyterModule);
+```
+
+4. 消费 Libro 编辑器的 React 组件，在使用 LibroEditor 的最外层包上 ManaComponents.Application ，使得多个 LibroView 的实例可以共享上下文。
+
+注意：由于此时 ManaComponents.Application中包裹了 LibroEditor组件，需要单独增加 renderChildren用于渲染。
+
+```jsx
+import React from 'react';
+import { ManaAppPreset, ManaComponents } from '@difizen/mana-app';
+import './index.less'
+import { LibroEditorModule } from '@/modules/libro-editor/module';
+import { LibroEditor } from './libro-editor';
+
+
+const App = (): JSX.Element => {
+ return (
+
+
+
+
+ );
+};
+
+export default App;
+```
diff --git a/apps/docs/docs/integration/keybind.md b/apps/docs/docs/integration/keybind.md
index af4622c9..9c490e6a 100644
--- a/apps/docs/docs/integration/keybind.md
+++ b/apps/docs/docs/integration/keybind.md
@@ -1,57 +1,57 @@
---
-title: 自定义快捷键
+title: Custom Keyboard Shortcuts
order: 3
---
-# 快捷键
+# Keyboard Shortcuts
-快捷键在开发者的工作流中非常重要，它们可以大大提高生产力。libro 作为一款交互式笔记本程序, 有着丰富的快捷键来帮助用户完成工作。本篇文章将给您介绍如何开发自定义的快捷键。
+Keyboard shortcuts are crucial in a developer's workflow, significantly enhancing productivity. As an interactive notebook application, libro offers a rich set of keyboard shortcuts to assist users in their tasks. This article will guide you on how to develop custom keyboard shortcuts.
-## 支持的快捷键
+## Supported Keyboard Shortcuts
-快捷键由修饰键和实际键位组成。以下在 libro 中自定义开发快捷键时所支持的修饰键和按键列表。
+Keyboard shortcuts consist of modifier keys and actual key presses. Below is a list of supported modifier keys and keys when developing custom keyboard shortcuts in libro.
-### 支持的修饰键
+### Supported Modifier Keys
-| 平台 | 修饰键 |
-| :------ | :------------------------- |
-| macOS | Ctrl+, Shift+, Alt+, Cmd+ |
-| Windows | Ctrl+, Shift+, Alt+, Win+ |
-| Linux | Ctrl+, Shift+, Alt+, Meta+ |
+| Platform | Modifier Keys |
+| :------- | :------------------------- |
+| macOS | Ctrl+, Shift+, Alt+, Cmd+ |
+| Windows | Ctrl+, Shift+, Alt+, Win+ |
+| Linux | Ctrl+, Shift+, Alt+, Meta+ |
-### 支持的按键
+### Supported Keys
-除了修饰键之外，以下实际按键也被支持：
+In addition to modifier keys, the following actual keys are also supported:
-- 功能键：f1-f19
-- 字母键：a-z
-- 数字键：0-9
-- 符号键：` `, `-`, `=`, `[`, `]`, `\`, `;`, `'`, `,`, `.`, `/`
-- 方向键：left, up, right, down
-- 导航键：pageup, pagedown, end, home
-- 其他常用键：tab, enter, escape, space, backspace, delete
-- 其他功能键：pausebreak, capslock, insert
-- 数字键盘：numpad0-numpad9, numpad_multiply, numpad_add, numpad_separator, numpad_subtract, numpad_decimal, numpad_divide
+- Function keys: f1-f19
+- Letter keys: a-z
+- Number keys: 0-9
+- Symbol keys: ` `, `-`, `=`, `[`, `]`, `\`, `;`, `'`, `,`, `.`, `/`
+- Arrow keys: left, up, right, down
+- Navigation keys: pageup, pagedown, end, home
+- Other common keys: tab, enter, escape, space, backspace, delete
+- Other function keys: pausebreak, capslock, insert
+- Numeric keypad: numpad0-numpad9, numpad_multiply, numpad_add, numpad_separator, numpad_subtract, numpad_decimal, numpad_divide
-这些按键和修饰键可以组合在一起，用于创建自定义快捷键组合。
+These keys and modifier keys can be combined to create custom keyboard shortcut combinations.
-## 如何注册自定义快捷键
+## How to Register Custom Keyboard Shortcuts
-在 libro 中，快捷键是通过命令系统来实现的。每个快捷键都绑定到一个命令，按下快捷键时，对应的命令就会被执行。
+In libro, keyboard shortcuts are implemented through a command system. Each keyboard shortcut is bound to a command, which is executed when the shortcut is pressed.
-### 快捷键定义
+### Keyboard Shortcut Definition
-默认注册快捷键与注册命令关联, 最基础的有快捷键定义的命令包含这几个部分：
+The default registered keyboard shortcuts are associated with commands, with the basic components of a keyboard shortcut definition including:
-- id: 命令的唯一标识符。
-- keybind: 命令绑定的快捷键,提供如下几种方式：
- - 单一按键：`keybind: 'd'`，单一按键触发生效。
- - 组合按键：`keybind: 'ctrlcmd+shift+d'`，多个按键同时触发生效。
- - 多组按键：`keybind: ['shift+q', 'shift+w']`，一个命令同时绑定多组按键，其中一组按键触发即可生效。
- - 连续按键：`keybind: 'j j'`，按键连续间断触发时生效。
-- when: 当命令绑定了快捷键时，该字段用于判断命令快捷键生效的条件，如果命令定义中包含 when: 'commandMode'表示该命令的快捷键只在命令模式下生效，编辑模式下不生效；反之，如果命令定义中不包含该字段，则没有命令模式下生效的条件限制。这里的命令模式快捷键生效的条件设计主要考虑避免用户编辑时也触发快捷键。
+- **id**: A unique identifier for the command.
+- **keybind**: The keyboard shortcut bound to the command, provided in the following ways:
+ - Single key: `keybind: 'd'`, a single key activates the shortcut.
+ - Combination keys: `keybind: 'ctrlcmd+shift+d'`, multiple keys activate the shortcut simultaneously.
+ - Multiple sets of keys: `keybind: ['shift+q', 'shift+w']`, one command can be bound to multiple sets of keys, and activating any one set will trigger the command.
+ - Consecutive keys: `keybind: 'j j'`, keys must be pressed consecutively to activate.
+- **when**: When a command is bound to a keyboard shortcut, this field is used to determine the conditions under which the shortcut is active. If the command definition includes `when: 'commandMode'`, it means the shortcut only works in command mode and not in edit mode; conversely, if this field is not included, there are no conditions limiting the shortcut's activation in command mode. This design primarily considers preventing unintended activation of shortcuts during editing.
-#### 示例
+#### Example
```typescript
export const LibroDemoKeybindCommand = {
@@ -75,11 +75,11 @@ export const LibroDemoKeybindCommand = {
};
```
-### 快捷键注册实现
+### Keyboard Shortcut Registration Implementation
-1. 实现命令的 handler (execute、isEnabled)，用于控制快捷键对应的命令的行为。
-2. 注册快捷键。libro 使用依赖注入机制来管理快捷键的注册，因此你需要创建一个快捷键扩展类，并在这个类中注册快捷键。快捷键扩展类实现了 `KeybindingContribution` 接口，这个接口提供了`registerKeybindings`方法，专门用于注册快捷键。同时需要通过`LibroCommandRegister`中的`registerKeybinds`方法进行注册，以保证只有当焦点聚焦于当前的 libro 编辑器内以及命令模式的逻辑判断的生效。
-3. 把新增的快捷键扩展类注册进 mana module 中。
+1. Implement the command's handler (`execute`, `isEnabled`) to control the behavior of the command associated with the shortcut.
+2. Register the keyboard shortcut. libro uses a dependency injection mechanism to manage the registration of shortcuts, so you need to create a keyboard shortcut extension class and register the shortcuts within this class. The keyboard shortcut extension class implements the `KeybindingContribution` interface, which provides the `registerKeybindings` method specifically for registering shortcuts. You also need to use the `registerKeybinds` method from `LibroCommandRegister` to ensure that the shortcut is only active when the focus is on the current libro editor and under the logical condition of command mode.
+3. Register the newly added keyboard shortcut extension class in the mana module.
```typescript
import { ManaModule } from '@difizen/mana-app';
@@ -91,7 +91,7 @@ export const LibroKeybindDemoModule = ManaModule.create()
.dependOn(LibroEditorModule);
```
-#### 示例
+#### Example
```typescript
import { LibroCommandRegister } from '@difizen/libro-jupyter';
@@ -121,7 +121,7 @@ export class LibroDemoKeybindingContribution
LibroDemoKeybindCommand['demokeybindCommand1'],
{
execute: async () => {
- console.log('快捷键demo示例1被触发执行');
+ console.log('Shortcut demo example 1 executed');
},
},
);
@@ -130,7 +130,7 @@ export class LibroDemoKeybindingContribution
LibroDemoKeybindCommand['demokeybindCommand2'],
{
execute: async () => {
- console.log('快捷键demo示例2被触发执行');
+ console.log('Shortcut demo example 2 executed');
},
},
);
@@ -139,7 +139,7 @@ export class LibroDemoKeybindingContribution
LibroDemoKeybindCommand['demokeybindCommand3'],
{
execute: async () => {
- console.log('快捷键demo示例3被触发执行');
+ console.log('Shortcut demo example 3 executed');
},
},
);
@@ -148,7 +148,7 @@ export class LibroDemoKeybindingContribution
LibroDemoKeybindCommand['demokeybindCommand4'],
{
execute: async () => {
- console.log('快捷键demo示例4被触发执行');
+ console.log('Shortcut demo example 4 executed');
},
},
);
diff --git a/apps/docs/docs/integration/keybind.zh-CN.md b/apps/docs/docs/integration/keybind.zh-CN.md
new file mode 100644
index 00000000..af4622c9
--- /dev/null
+++ b/apps/docs/docs/integration/keybind.zh-CN.md
@@ -0,0 +1,157 @@
+---
+title: 自定义快捷键
+order: 3
+---
+
+# 快捷键
+
+快捷键在开发者的工作流中非常重要，它们可以大大提高生产力。libro 作为一款交互式笔记本程序, 有着丰富的快捷键来帮助用户完成工作。本篇文章将给您介绍如何开发自定义的快捷键。
+
+## 支持的快捷键
+
+快捷键由修饰键和实际键位组成。以下在 libro 中自定义开发快捷键时所支持的修饰键和按键列表。
+
+### 支持的修饰键
+
+| 平台 | 修饰键 |
+| :------ | :------------------------- |
+| macOS | Ctrl+, Shift+, Alt+, Cmd+ |
+| Windows | Ctrl+, Shift+, Alt+, Win+ |
+| Linux | Ctrl+, Shift+, Alt+, Meta+ |
+
+### 支持的按键
+
+除了修饰键之外，以下实际按键也被支持：
+
+- 功能键：f1-f19
+- 字母键：a-z
+- 数字键：0-9
+- 符号键：` `, `-`, `=`, `[`, `]`, `\`, `;`, `'`, `,`, `.`, `/`
+- 方向键：left, up, right, down
+- 导航键：pageup, pagedown, end, home
+- 其他常用键：tab, enter, escape, space, backspace, delete
+- 其他功能键：pausebreak, capslock, insert
+- 数字键盘：numpad0-numpad9, numpad_multiply, numpad_add, numpad_separator, numpad_subtract, numpad_decimal, numpad_divide
+
+这些按键和修饰键可以组合在一起，用于创建自定义快捷键组合。
+
+## 如何注册自定义快捷键
+
+在 libro 中，快捷键是通过命令系统来实现的。每个快捷键都绑定到一个命令，按下快捷键时，对应的命令就会被执行。
+
+### 快捷键定义
+
+默认注册快捷键与注册命令关联, 最基础的有快捷键定义的命令包含这几个部分：
+
+- id: 命令的唯一标识符。
+- keybind: 命令绑定的快捷键,提供如下几种方式：
+ - 单一按键：`keybind: 'd'`，单一按键触发生效。
+ - 组合按键：`keybind: 'ctrlcmd+shift+d'`，多个按键同时触发生效。
+ - 多组按键：`keybind: ['shift+q', 'shift+w']`，一个命令同时绑定多组按键，其中一组按键触发即可生效。
+ - 连续按键：`keybind: 'j j'`，按键连续间断触发时生效。
+- when: 当命令绑定了快捷键时，该字段用于判断命令快捷键生效的条件，如果命令定义中包含 when: 'commandMode'表示该命令的快捷键只在命令模式下生效，编辑模式下不生效；反之，如果命令定义中不包含该字段，则没有命令模式下生效的条件限制。这里的命令模式快捷键生效的条件设计主要考虑避免用户编辑时也触发快捷键。
+
+#### 示例
+
+```typescript
+export const LibroDemoKeybindCommand = {
+ demokeybindCommand1: {
+ id: 'demo:libro-keybind-command-1',
+ keybind: 'ctrlcmd+shift+d',
+ },
+ demokeybindCommand2: {
+ id: 'demo:libro-keybind-command-2',
+ keybind: 'shift+d',
+ when: 'commandMode',
+ },
+ demokeybindCommand3: {
+ id: 'demo:libro-keybind-command-3',
+ keybind: ['shift+q', 'shift+w'],
+ },
+ demokeybindCommand4: {
+ id: 'demo:libro-keybind-command-4',
+ keybind: 'w w',
+ },
+};
+```
+
+### 快捷键注册实现
+
+1. 实现命令的 handler (execute、isEnabled)，用于控制快捷键对应的命令的行为。
+2. 注册快捷键。libro 使用依赖注入机制来管理快捷键的注册，因此你需要创建一个快捷键扩展类，并在这个类中注册快捷键。快捷键扩展类实现了 `KeybindingContribution` 接口，这个接口提供了`registerKeybindings`方法，专门用于注册快捷键。同时需要通过`LibroCommandRegister`中的`registerKeybinds`方法进行注册，以保证只有当焦点聚焦于当前的 libro 编辑器内以及命令模式的逻辑判断的生效。
+3. 把新增的快捷键扩展类注册进 mana module 中。
+
+```typescript
+import { ManaModule } from '@difizen/mana-app';
+import { LibroEditorModule } from '../libro-editor/module';
+import { LibroDemoKeybindingContribution } from './libro-demo-keybind-contribution';
+
+export const LibroKeybindDemoModule = ManaModule.create()
+ .register(LibroDemoKeybindingContribution)
+ .dependOn(LibroEditorModule);
+```
+
+#### 示例
+
+```typescript
+import { LibroCommandRegister } from '@difizen/libro-jupyter';
+import {
+ inject,
+ KeybindingRegistry,
+ singleton,
+ KeybindingContribution,
+ CommandContribution,
+ CommandRegistry,
+} from '@difizen/mana-app';
+import { LibroDemoKeybindCommand } from './libro-demo-keybind-command';
+
+@singleton({ contrib: [KeybindingContribution, CommandContribution] })
+export class LibroDemoKeybindingContribution
+ implements KeybindingContribution, CommandContribution
+{
+ @inject(LibroCommandRegister) protected readonly libroCommand: LibroCommandRegister;
+
+ registerKeybindings(keybindings: KeybindingRegistry) {
+ this.libroCommand.registerKeybinds(keybindings, LibroDemoKeybindCommand);
+ }
+
+ registerCommands(command: CommandRegistry): void {
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoKeybindCommand['demokeybindCommand1'],
+ {
+ execute: async () => {
+ console.log('快捷键demo示例1被触发执行');
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoKeybindCommand['demokeybindCommand2'],
+ {
+ execute: async () => {
+ console.log('快捷键demo示例2被触发执行');
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoKeybindCommand['demokeybindCommand3'],
+ {
+ execute: async () => {
+ console.log('快捷键demo示例3被触发执行');
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoKeybindCommand['demokeybindCommand4'],
+ {
+ execute: async () => {
+ console.log('快捷键demo示例4被触发执行');
+ },
+ },
+ );
+ }
+}
+```
diff --git a/apps/docs/docs/integration/lsp.md b/apps/docs/docs/integration/lsp.md
index a865e719..6a50861b 100644
--- a/apps/docs/docs/integration/lsp.md
+++ b/apps/docs/docs/integration/lsp.md
@@ -1,28 +1,25 @@
---
-title: 编辑器接入 LSP
+title: Integrating LSP with the Editor
order: 10
---
-# 编辑器接入 LSP
+# Integrating LSP with the Editor
-Libro可以在多种环境运行，当使用Libro-server的模式来部署时，代码编辑器需要一些配置接入LSP来支持高级功能（代码补全、提示、校验、格式化等）。
+Libro can run in various environments, and when deploying in Libro-server mode, the code editor requires some configuration to integrate with LSP to support advanced features (such as code completion, suggestions, validation, formatting, etc.).
-## 编辑器基本架构
+## Basic Architecture of the Editor
-Libro 在编辑器层面提供了[IEditor](https://github.com/difizen/libro/blob/ea46403edaa99488a59b0f94554c22b7115b3d6f/packages/libro-code-editor/src/code-editor-protocol.ts#L207)抽象，来提供代码编辑能力。
-代码编辑(python\md\sql等)、全局搜索等场景会依赖`IEditor`接口。IEditor的具体实现有多种，包括code mirror 6、Cofine Editor等。
-Cofine Editor基于monaco editor实现，编辑器本身支持丰富的语言服务接口（如代码提示、代码跳转、格式化等）。我们提供了[LibroLanguageClient](https://github.com/difizen/libro/blob/ea46403edaa99488a59b0f94554c22b7115b3d6f/packages/libro-language-client/src/libro-language-client.ts#L29)来对接LSP server，获取语言服务信息。LSP server作为独立进程部署在服务端，由jupyter-lsp进行元数据管理。
+Libro provides an abstraction called [IEditor](https://github.com/difizen/libro/blob/ea46403edaa99488a59b0f94554c22b7115b3d6f/packages/libro-code-editor/src/code-editor-protocol.ts#L207) at the editor level to offer code editing capabilities. Scenarios such as code editing (Python, Markdown, SQL, etc.) and global search rely on the `IEditor` interface. There are several implementations of IEditor, including CodeMirror 6 and Cofine Editor. The Cofine Editor is based on the Monaco Editor and supports a rich set of language service interfaces (such as code suggestions, code navigation, formatting, etc.). We provide the [LibroLanguageClient](https://github.com/difizen/libro/blob/ea46403edaa99488a59b0f94554c22b7115b3d6f/packages/libro-language-client/src/libro-language-client.ts#L29) to interface with the LSP server and retrieve language service information. The LSP server runs as an independent process on the server side and is managed by Jupyter-LSP.
-## LSP server 配置
+## LSP Server Configuration
-LSP server 需要支持LSP协议的Notebook部分的能力，才能在Libro正常工作。当前支持的server包括Ruff和Pylez（之前叫libro-analyzer）。
+The LSP server needs to support the capabilities of the Notebook section of the LSP protocol to function properly with Libro. Currently supported servers include Ruff and Pylez (previously known as libro-analyzer).
-Ruff LSP server运行在python环境，已在libro-server中自带。
-Pylez运行在nodejs环境，需要服务器安装npm和nodejs。使用 `npm install @difizen/libro-analyzer`安装依赖，并在Libro-server配置文件中提供以下配置项：
+The Ruff LSP server runs in a Python environment and is included with the libro-server. Pylez runs in a Node.js environment and requires the server to have npm and Node.js installed. Use `npm install @difizen/libro-analyzer` to install the dependency and provide the following configuration in the Libro-server configuration file:
```python
c.LanguageServerManager.language_servers = {
@@ -40,7 +37,7 @@ c.LanguageServerManager.language_servers = {
# if installed as a binary
"argv": [
"node",
- "node_modules/@difizen/libro-analyzer/index.js", # 填写 Libro-analyzer 的实际安装地址
+ "node_modules/@difizen/libro-analyzer/index.js", # Provide the actual installation path of Libro-analyzer
"--stdio",
],
"languages": ["python"],
diff --git a/apps/docs/docs/integration/lsp.zh-CN.md b/apps/docs/docs/integration/lsp.zh-CN.md
new file mode 100644
index 00000000..a865e719
--- /dev/null
+++ b/apps/docs/docs/integration/lsp.zh-CN.md
@@ -0,0 +1,52 @@
+---
+title: 编辑器接入 LSP
+order: 10
+---
+
+# 编辑器接入 LSP
+
+Libro可以在多种环境运行，当使用Libro-server的模式来部署时，代码编辑器需要一些配置接入LSP来支持高级功能（代码补全、提示、校验、格式化等）。
+
+## 编辑器基本架构
+
+
+
+Libro 在编辑器层面提供了[IEditor](https://github.com/difizen/libro/blob/ea46403edaa99488a59b0f94554c22b7115b3d6f/packages/libro-code-editor/src/code-editor-protocol.ts#L207)抽象，来提供代码编辑能力。
+代码编辑(python\md\sql等)、全局搜索等场景会依赖`IEditor`接口。IEditor的具体实现有多种，包括code mirror 6、Cofine Editor等。
+Cofine Editor基于monaco editor实现，编辑器本身支持丰富的语言服务接口（如代码提示、代码跳转、格式化等）。我们提供了[LibroLanguageClient](https://github.com/difizen/libro/blob/ea46403edaa99488a59b0f94554c22b7115b3d6f/packages/libro-language-client/src/libro-language-client.ts#L29)来对接LSP server，获取语言服务信息。LSP server作为独立进程部署在服务端，由jupyter-lsp进行元数据管理。
+
+
+
+## LSP server 配置
+
+LSP server 需要支持LSP协议的Notebook部分的能力，才能在Libro正常工作。当前支持的server包括Ruff和Pylez（之前叫libro-analyzer）。
+
+Ruff LSP server运行在python环境，已在libro-server中自带。
+Pylez运行在nodejs环境，需要服务器安装npm和nodejs。使用 `npm install @difizen/libro-analyzer`安装依赖，并在Libro-server配置文件中提供以下配置项：
+
+```python
+c.LanguageServerManager.language_servers = {
+ "ruff-lsp": {
+ # if installed as a binary
+ "argv": [
+ "ruff-lsp",
+ ],
+ "languages": ["python"],
+ "version": 2,
+ "mime_types": ["text/x-python"],
+ "display_name": "ruff-lsp",
+ },
+ "libro-analyzer": {
+ # if installed as a binary
+ "argv": [
+ "node",
+ "node_modules/@difizen/libro-analyzer/index.js", # 填写 Libro-analyzer 的实际安装地址
+ "--stdio",
+ ],
+ "languages": ["python"],
+ "version": 2,
+ "mime_types": ["text/x-python"],
+ "display_name": "libro-analyzer",
+ },
+}
+```
diff --git a/apps/docs/docs/integration/toolbar.md b/apps/docs/docs/integration/toolbar.md
index bf8c8400..31b392bb 100644
--- a/apps/docs/docs/integration/toolbar.md
+++ b/apps/docs/docs/integration/toolbar.md
@@ -1,45 +1,43 @@
---
-title: 自定义工具栏
+title: Custom Toolbar
order: 2
---
-# 工具栏
+# Toolbar
-libro 的工具栏（Toolbar）是整个 libro UI 界面中重要的一部分，它包含了一系列的按钮，帮助用户快速访问常用功能，目前在 libro 中默认显示在编辑器的顶部和选中 cell 的右侧。
-
+The toolbar in Libro is an important part of the entire Libro UI interface, containing a series of buttons that help users quickly access commonly used features. By default, it is displayed at the top of the editor and to the right of the selected cell.
-### 如何往工具栏中注册自定义工具按钮？
+
-在 libro 中，每个模块都可以向工具注册表中添加工具按钮。最基础的工具按钮通常包含这几个部分：
+### How to Register Custom Toolbar Buttons?
-- id: 工具按钮的唯一标识符。
-- command: 工具按钮绑定的命令 id。
-- tooltip: 可选，鼠标悬停在按钮上时显示的提示文本，用于向用户提供关于按钮功能的简要说明。
-- icon: 可选,按钮的图标显示。
-- order：可选，该属性决定了工具栏按钮的显示顺序。数值越小的按钮将显示在前面，越大的按钮显示在后面。如果不设置，libro 将按默认顺序显示按钮。
-- group：可选，工具栏中的按钮可以通过该属性进行分组，确保相关功能的按钮在视觉上靠近。
+In Libro, each module can add tool buttons to the tool registration table. The basic components of a tool button typically include:
-其中，工具栏的按钮与命令紧密关联。每个按钮都会绑定到一个命令，用户点击工具栏按钮时，会触发绑定命令的执行。
+- **id**: A unique identifier for the tool button.
+- **command**: The command ID that the tool button is bound to.
+- **tooltip**: Optional; the hint text displayed when the mouse hovers over the button, providing a brief description of the button's function.
+- **icon**: Optional; the icon displayed on the button.
+- **order**: Optional; this property determines the display order of the toolbar buttons. Buttons with smaller values will appear first, while larger values will appear later. If not set, Libro will display the buttons in the default order.
+- **group**: Optional; this property can group buttons in the toolbar to ensure that related function buttons are visually close together.
-#### 注册工具栏按钮
+The toolbar buttons are closely linked with commands. Each button is bound to a command, and when the user clicks the toolbar button, it triggers the execution of the bound command.
-1. libro 使用依赖注入机制来管理工具栏按钮的注册，因此你需要创建一个工具栏按钮扩展类，并在这个类中注册工具栏按钮。工具栏扩展类实现了 ToolbarContribution 接口，这个接口提供了 registerToolbarItems 方法，专门用于注册工具栏按钮。
-2. 工具按钮继承来自命令的 icon、label 属性，以及 execute、isVisible、isEnabled 等逻辑控制函数，保证相同的命令在工具栏、菜单等多处可见时的统一，工具栏按钮也可以在注册时自定义 icon、label 等属性。
+#### Registering Toolbar Buttons
-- 更具体的， 在 libro 中，工具栏按钮对应的命令采用 LibroCommandRegister 的方式注册，以保证 execute、isVisible、isEnabled 等逻辑控制函数中可以拿到 CellView 实例、LibroView 实例、path。工具栏按钮的位置选项如下，通过 isVisible 函数中的 path 参数控制位置显示。
+1. Libro uses a dependency injection mechanism to manage the registration of toolbar buttons. Therefore, you need to create a toolbar button extension class and register the toolbar buttons within this class. The toolbar extension class implements the `ToolbarContribution` interface, which provides the `registerToolbarItems` method specifically for registering toolbar buttons.
+2. The tool buttons inherit properties from the command such as `icon`, `label`, as well as logic control functions like `execute`, `isVisible`, and `isEnabled`, ensuring consistency when the same command is visible in the toolbar, menu, and other places. The toolbar buttons can also customize properties like `icon`, `label`, etc., during registration.
-| 位置变量标识 | 具体位置 |
-| :---------------------------- | :-------------- |
-| LibroToolbarArea.HeaderLeft | 顶部左侧工具栏 |
-| LibroToolbarArea.HeaderCenter | 顶部中间工具栏 |
-| LibroToolbarArea.HeaderRight | 顶部右侧工具栏 |
-| LibroToolbarArea.CellTop | cell 顶部工具栏 |
-| LibroToolbarArea.CellRight | cell 右侧工具栏 |
+- More specifically, in Libro, the commands corresponding to the toolbar buttons are registered using `LibroCommandRegister` to ensure that the logic control functions like `execute`, `isVisible`, and `isEnabled` can access instances of `CellView`, `LibroView`, and `path`. The location options for toolbar buttons are as follows, controlled by the `path` parameter in the `isVisible` function.
-3. 把新增的命令扩展类注册进 mana module 中。
+| Location Variable Identifier | Specific Location |
+| :---------------------------- | :----------------- |
+| LibroToolbarArea.HeaderLeft | Top left toolbar |
+| LibroToolbarArea.HeaderCenter | Top center toolbar |
+| LibroToolbarArea.HeaderRight | Top right toolbar |
+| LibroToolbarArea.CellTop | Cell top toolbar |
+| LibroToolbarArea.CellRight | Cell right toolbar |
+
+3. Register the newly added command extension class in the Mana module.
```typescript
import { ManaModule } from '@difizen/mana-app';
@@ -51,7 +49,7 @@ export const LibroToolbarDemoModule = ManaModule.create()
.dependOn(LibroEditorModule);
```
-##### 示例
+##### Example
```typescript
import { LibroCommandRegister, LibroToolbarArea } from '@difizen/libro-jupyter';
@@ -83,7 +81,7 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand1'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部中间工具栏示例');
+ console.log('Toolbar button registered in the top center toolbar example');
},
isEnabled: () => {
return true;
@@ -98,7 +96,9 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand2'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏示例');
+ console.log(
+ 'Toolbar button registered in the top right toolbar and cell right toolbar example',
+ );
},
isEnabled: () => {
return true;
@@ -116,7 +116,9 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand3'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏,并且成组示例');
+ console.log(
+ 'Toolbar button registered in the top right toolbar and cell right toolbar, and grouped example',
+ );
},
isEnabled: () => {
return true;
@@ -133,7 +135,9 @@ export class LibroDemoToolbarContribution
LibroDemoToolbarCommand['demoToolbarCommand4'],
{
execute: async (cell, libro, path) => {
- console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏，并且成组示例');
+ console.log(
+ 'Toolbar button registered in the top right toolbar and cell right toolbar, and grouped example',
+ );
},
isEnabled: () => {
return true;
diff --git a/apps/docs/docs/integration/toolbar.zh-CN.md b/apps/docs/docs/integration/toolbar.zh-CN.md
new file mode 100644
index 00000000..bf8c8400
--- /dev/null
+++ b/apps/docs/docs/integration/toolbar.zh-CN.md
@@ -0,0 +1,181 @@
+---
+title: 自定义工具栏
+order: 2
+---
+
+# 工具栏
+
+libro 的工具栏（Toolbar）是整个 libro UI 界面中重要的一部分，它包含了一系列的按钮，帮助用户快速访问常用功能，目前在 libro 中默认显示在编辑器的顶部和选中 cell 的右侧。
+
+
+### 如何往工具栏中注册自定义工具按钮？
+
+在 libro 中，每个模块都可以向工具注册表中添加工具按钮。最基础的工具按钮通常包含这几个部分：
+
+- id: 工具按钮的唯一标识符。
+- command: 工具按钮绑定的命令 id。
+- tooltip: 可选，鼠标悬停在按钮上时显示的提示文本，用于向用户提供关于按钮功能的简要说明。
+- icon: 可选,按钮的图标显示。
+- order：可选，该属性决定了工具栏按钮的显示顺序。数值越小的按钮将显示在前面，越大的按钮显示在后面。如果不设置，libro 将按默认顺序显示按钮。
+- group：可选，工具栏中的按钮可以通过该属性进行分组，确保相关功能的按钮在视觉上靠近。
+
+其中，工具栏的按钮与命令紧密关联。每个按钮都会绑定到一个命令，用户点击工具栏按钮时，会触发绑定命令的执行。
+
+#### 注册工具栏按钮
+
+1. libro 使用依赖注入机制来管理工具栏按钮的注册，因此你需要创建一个工具栏按钮扩展类，并在这个类中注册工具栏按钮。工具栏扩展类实现了 ToolbarContribution 接口，这个接口提供了 registerToolbarItems 方法，专门用于注册工具栏按钮。
+2. 工具按钮继承来自命令的 icon、label 属性，以及 execute、isVisible、isEnabled 等逻辑控制函数，保证相同的命令在工具栏、菜单等多处可见时的统一，工具栏按钮也可以在注册时自定义 icon、label 等属性。
+
+- 更具体的， 在 libro 中，工具栏按钮对应的命令采用 LibroCommandRegister 的方式注册，以保证 execute、isVisible、isEnabled 等逻辑控制函数中可以拿到 CellView 实例、LibroView 实例、path。工具栏按钮的位置选项如下，通过 isVisible 函数中的 path 参数控制位置显示。
+
+| 位置变量标识 | 具体位置 |
+| :---------------------------- | :-------------- |
+| LibroToolbarArea.HeaderLeft | 顶部左侧工具栏 |
+| LibroToolbarArea.HeaderCenter | 顶部中间工具栏 |
+| LibroToolbarArea.HeaderRight | 顶部右侧工具栏 |
+| LibroToolbarArea.CellTop | cell 顶部工具栏 |
+| LibroToolbarArea.CellRight | cell 右侧工具栏 |
+
+3. 把新增的命令扩展类注册进 mana module 中。
+
+```typescript
+import { ManaModule } from '@difizen/mana-app';
+import { LibroEditorModule } from '../libro-editor/module';
+import { LibroDemoToolbarContribution } from './libro-demo-toolbar-contribution';
+
+export const LibroToolbarDemoModule = ManaModule.create()
+ .register(LibroDemoToolbarContribution)
+ .dependOn(LibroEditorModule);
+```
+
+##### 示例
+
+```typescript
+import { LibroCommandRegister, LibroToolbarArea } from '@difizen/libro-jupyter';
+import {
+ CommandContribution,
+ CommandRegistry,
+ inject,
+ singleton,
+ ToolbarContribution,
+ ToolbarRegistry,
+} from '@difizen/mana-app';
+import {
+ BellOutlined,
+ BulbOutlined,
+ HeartOutlined,
+ MoonOutlined,
+} from '@ant-design/icons';
+import { LibroDemoToolbarCommand } from './libro-demo-toolbar-commands';
+
+@singleton({ contrib: [ToolbarContribution, CommandContribution] })
+export class LibroDemoToolbarContribution
+ implements ToolbarContribution, CommandContribution
+{
+ @inject(LibroCommandRegister) protected readonly libroCommand: LibroCommandRegister;
+
+ registerCommands(command: CommandRegistry): void {
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand1'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部中间工具栏示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return path === LibroToolbarArea.HeaderCenter;
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand2'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return (
+ path === LibroToolbarArea.HeaderCenter ||
+ path === LibroToolbarArea.CellRight
+ );
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand3'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏,并且成组示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return (
+ path === LibroToolbarArea.HeaderRight || path === LibroToolbarArea.CellRight
+ );
+ },
+ },
+ );
+ this.libroCommand.registerLibroCommand(
+ command,
+ LibroDemoToolbarCommand['demoToolbarCommand4'],
+ {
+ execute: async (cell, libro, path) => {
+ console.log('工具栏按钮注册在顶部右侧工具栏和 cell 右侧工具栏，并且成组示例');
+ },
+ isEnabled: () => {
+ return true;
+ },
+ isVisible: (cell, libro, path) => {
+ return (
+ path === LibroToolbarArea.HeaderRight || path === LibroToolbarArea.CellRight
+ );
+ },
+ },
+ );
+ }
+
+ registerToolbarItems(registry: ToolbarRegistry): void {
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand1'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand1'].id,
+ icon: BulbOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand1'].label,
+ });
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand2'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand2'].id,
+ icon: BellOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand2'].label,
+ });
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand3'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand3'].id,
+ icon: HeartOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand3'].label,
+ order: '1',
+ group: ['groupdemo'],
+ });
+ registry.registerItem({
+ id: LibroDemoToolbarCommand['demoToolbarCommand4'].id,
+ command: LibroDemoToolbarCommand['demoToolbarCommand4'].id,
+ icon: MoonOutlined,
+ tooltip: LibroDemoToolbarCommand['demoToolbarCommand4'].label,
+ order: '2',
+ group: ['groupdemo'],
+ });
+ }
+}
+```
diff --git a/apps/docs/docs/manual/ai-assistant.md b/apps/docs/docs/manual/ai-assistant.md
index 0dfa0604..fe172b45 100644
--- a/apps/docs/docs/manual/ai-assistant.md
+++ b/apps/docs/docs/manual/ai-assistant.md
@@ -1,55 +1,57 @@
---
-title: AI 编程助手指南
+title: AI Programming Assistant Guide
order: 3
---
-## 准备工作
+## Preparation
-在 `~/.libro/libro_config.yaml` 配置大模型相关配置
+Configure large model settings in `~/.libro/libro_config.yaml`.
-其中，目前支持的模型有：
+Currently supported models include:
-- OpenAI 相关：`gpt-4`、`gpt-3.5-turbo`、`text-davinci-003`
-- 通义千问相关：`qwen-max`、`qwen-plus`、`qwen-turbo`
+- OpenAI models: `gpt-4`, `gpt-3.5-turbo`, `text-davinci-003`
+- Qwen-related models: `qwen-max`, `qwen-plus`, `qwen-turbo`
-配置默认的模型和 Key：
+Set the default model and keys:
```yaml
llm:
- DASHSCOPE_API_KEY: xxx # Qwen 相关的模型 key
- OPENAI_API_KEY: xxx # OpenAI 相关的模型 key
+ DASHSCOPE_API_KEY: xxx # Key for Qwen-related models
+ OPENAI_API_KEY: xxx # Key for OpenAI models
default_model: qwen-max
```
-> 💡 **Tip**: 如果使用通义千问作为默认模型，请使用`pip install dashscope --upgrade`安装依赖.
->
+> 💡 **Tip**: If using Qwen as the default model, install the dependencies with `pip install dashscope --upgrade`.
-## 报错修复
+## Error Fixing
-当 Cell 执行出现报错时，点击 “Fix with AI” 按钮，助手会自动分析错误并给出修复建议，点击“取消”按钮退出报错修复模式。
+When a cell execution error occurs, click the "Fix with AI" button. The assistant will automatically analyze the error and provide fix suggestions. Click the "Cancel" button to exit error-fix mode.
-
+
-## AI 对话
+## AI Chat
-### Cell 上下文对话
+### Contextual Cell Chat
-从 Cell 右侧工具栏对话按钮唤起，你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+Accessed via the chat button in the cell's right toolbar, you can interact with the AI directly, obtaining in-depth explanations and optimization advice related to the current code, improving coding efficiency.
-
+
-### 通用对话
+### General Chat
-从顶部右侧工具栏唤起，你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+Accessed from the top right toolbar, allowing for open-ended conversations with the AI to ask programming-related questions, get advice, and enjoy intelligent interaction.
-
+
-### 代码解释
+### Code Explanation
-从 Cell 右侧工具栏的魔法符号唤起，帮助理解 Cell 中代码的功能和逻辑。
-
+Summonable from the magic icon in the cell’s right toolbar to help you understand the function and logic of the code within the cell.
-### 代码优化
+
-从 Cell 右侧工具栏的魔法符号唤起，分析单元格（cell）中的代码，并提供优化建议。
-
+### Code Optimization
+
+Activated from the magic icon in the cell's right toolbar, it analyzes the code in the cell and provides optimization suggestions.
+
+
+```
diff --git a/apps/docs/docs/manual/ai-assistant.zh-CN.md b/apps/docs/docs/manual/ai-assistant.zh-CN.md
new file mode 100644
index 00000000..0dfa0604
--- /dev/null
+++ b/apps/docs/docs/manual/ai-assistant.zh-CN.md
@@ -0,0 +1,55 @@
+---
+title: AI 编程助手指南
+order: 3
+---
+
+## 准备工作
+
+在 `~/.libro/libro_config.yaml` 配置大模型相关配置
+
+其中，目前支持的模型有：
+
+- OpenAI 相关：`gpt-4`、`gpt-3.5-turbo`、`text-davinci-003`
+- 通义千问相关：`qwen-max`、`qwen-plus`、`qwen-turbo`
+
+配置默认的模型和 Key：
+
+```yaml
+llm:
+ DASHSCOPE_API_KEY: xxx # Qwen 相关的模型 key
+ OPENAI_API_KEY: xxx # OpenAI 相关的模型 key
+ default_model: qwen-max
+```
+
+> 💡 **Tip**: 如果使用通义千问作为默认模型，请使用`pip install dashscope --upgrade`安装依赖.
+>
+
+## 报错修复
+
+当 Cell 执行出现报错时，点击 “Fix with AI” 按钮，助手会自动分析错误并给出修复建议，点击“取消”按钮退出报错修复模式。
+
+
+
+## AI 对话
+
+### Cell 上下文对话
+
+从 Cell 右侧工具栏对话按钮唤起，你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+
+
+
+### 通用对话
+
+从顶部右侧工具栏唤起，你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+
+
+
+### 代码解释
+
+从 Cell 右侧工具栏的魔法符号唤起，帮助理解 Cell 中代码的功能和逻辑。
+
+
+### 代码优化
+
+从 Cell 右侧工具栏的魔法符号唤起，分析单元格（cell）中的代码，并提供优化建议。
+
diff --git a/apps/docs/docs/manual/index.md b/apps/docs/docs/manual/index.md
index 8e62e870..43717951 100644
--- a/apps/docs/docs/manual/index.md
+++ b/apps/docs/docs/manual/index.md
@@ -1,298 +1,300 @@
---
-title: 基础指南
+title: Basic Guide
order: 0
---
-# 概述
+# Overview
-Libro 编辑器增强了传统 Notebook 运行的状态监控以及各种交互操作，本文为您介绍 Libro 编辑器的基础界面功能，帮助您了解 Libro 编辑器的基本使用方法。
+The Libro Editor enhances the state monitoring of traditional Notebook operations and various interactive features. This article introduces the basic interface features of the Libro Editor, helping you understand its basic usage.
-## 产品界面介绍
+## Product Interface Introduction
-| 界面模块 | 说明 |
-| ------------- | --------------------------------------------------------------- |
-| 上方工具栏 | 包含内核状态区、操作控制区、快捷键等。 |
-| Cell 操作区 | 罗列针对每一个独立的 Cell 可执行的操作。 |
-| Cell 编辑区 | 代码编辑窗口中的功能区域，如 Cell 衔接区、输出区、底部 Cell等。 |
-| Cell 功能介绍 | 介绍命令态和编辑态 Cell 的功能和快捷键操作。 |
+| Interface Module | Description |
+| ------------------------- | --------------------------------------------------------------------------------------------------------- |
+| Top Toolbar | Contains kernel status area, operation control area, keybinds, etc. |
+| Cell Operation Area | Lists executable operations for each individual Cell. |
+| Cell Editing Area | Functional areas within the code editing window, such as Cell linking area, output area, and bottom Cell. |
+| Cell Feature Introduction | Introduces the functions and keybind operations of command mode and edit mode Cells. |
-### 上方工具栏
+### Top Toolbar
-| 序号 | 名称 | 描述 |
-| ---- | ---------- | -------------------------------------------------------------------- |
-| ① | 内核状态区 | 展示当前服务的内核运行状态，包括正在连接、未知、忙碌、空闲四种状态。 |
-| ② | 操作控制区 | 提供各种控制操作，如对代码执行、Cell 转换的操作等。 |
-| ③ | 快捷键面板 | 查看 Libro 快捷键目录。 |
+| No. | Name | Description |
+| --- | ---------------------- | ---------------------------------------------------------------------------------------------------------- |
+| ① | Kernel Status Area | Displays the current status of the service kernel, including four states: connecting, unknown, busy, idle. |
+| ② | Operation Control Area | Provides various control operations, such as executing code, converting Cells, etc. |
+| ③ | Keybind Panel | View the directory of Libro keybinds. |
-#### 内核状态区
+#### Kernel Status Area
-Libro Notebook 采用 Python3 作为基础内核，负责运行用户输入的代码单元（Cell），管理代码执行的状态。在 Libro 的内核状态区，您可以修改内核和查看内核状态。
+The Libro Notebook uses Python 3 as the base kernel, responsible for executing the user-input code Cells and managing the code execution status. In the Libro kernel status area, you can modify the kernel and view its status.
-● 内核编辑菜单
+- Kernel Edit Menu
-| 菜单选项 | 描述 |
-| --------------------------------- | -------------------------------------------------- |
-| Start Preferred Kernel | 启动设定或之前使用的首选内核。 |
-| Use No Kernel | 选择此选项不会启动任何内核，用于不执行代码的场景。 |
-| Use Kernel from Preferred Session | 使用已开启会话中的内核配置，保持环境一致性。 |
+| Menu Option | Description |
+| --------------------------------- | ------------------------------------------------------------------------------------------------------- |
+| Start Preferred Kernel | Start the preferred kernel set or previously used. |
+| Use No Kernel | Selecting this option will not start any kernel, used for scenarios where code execution is not needed. |
+| Use Kernel from Preferred Session | Use kernel configuration from an active session to maintain environmental consistency. |
-说明：内核（Kernel）是一个执行计算的引擎，它能够运行编程代码并返回结果。
+Note: The kernel is an engine that executes computations, capable of running programming code and returning results.
-● 内核状态
-Libro 的内核状态分为正在连接、未知、忙碌、空闲。
+- Kernel Status
+ The kernel status in Libro can be connecting, unknown, busy, or idle.
- Libro Notebook 正在与内核建立连接，发生在启动内核或者内核失去响应后尝试连接的情况。
+ The Libro Notebook is connecting to the kernel, which occurs when starting the kernel or attempting to connect after the kernel becomes unresponsive.
- 当前内核的状态不能确定，可能是由于通信问题或内部错误导致状态信息无法获取。
+ The current status of the kernel is uncertain, possibly due to communication issues or internal errors preventing status information retrieval.
- 当前内核正在执行代码处理任务，您提交的新代码或指令将等待当前任务完成后才会被执行。
+ The current kernel is processing code execution tasks, and your newly submitted code or commands will wait until the current task is complete before execution.
- 表示内核当前没有执行任何任务，已经准备好接受新的命令和代码执行。
+ Indicates that the kernel is currently not executing any tasks and is ready to accept new commands and code execution.
-#### 操作控制区
+#### Operation Control Area
-| 图标 | 描述 |
-| -------------------------------------------------------------------- | ------------------------------------------------------------------------ |
-| | 保存当前 Notebook 中 Cell 内容的改动。 |
-| | 按照子菜单选项，执行选中范围的 Cell，如执行全部 Cell、执行当前 Cell 等。 |
-| | 定位正在执行的 Cell。 |
-| | 中断正在执行的 Cell 代码。 |
-| | 重启并清空所有 Cell 的输出。 |
-| | 撤销上一步操作。 |
-| | 重做上一步被撤销的操作。 |
-| | 固定 Output 展示高度。 |
-| | 根据子菜单选项，隐藏或显示代码和 Output。 |
-| | 清空选中 Cell 的输出。 |
-| | 更改 Cell 类型，如 Python、Markdown 等 |
+| Icon | Description |
+| -------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------- |
+| | Save changes made to the Cell contents in the current Notebook. |
+| | Execute the selected range of Cells according to submenu options, such as executing all Cells, executing the current Cell, etc. |
+| | Locate the currently executing Cell. |
+| | Interrupt the code of the currently executing Cell. |
+| | Restart and clear all Cell outputs. |
+| | Undo the last action. |
+| | Redo the last undone action. |
+| | Fix the height of the Output display. |
+| | Hide or show code and Output based on submenu options. |
+| | Clear the output of the selected Cell. |
+| | Change Cell types, such as Python, Markdown, etc. |
-#### 分享和快捷键
+#### Sharing and Keybind
-| 图标 | 区域图 | 说明 |
-| -------------------------------------------------------------- | --------------------------------------------------------------------- | ------------------------------------------------------ |
-| | | 展示命令态和编辑态 Libro 的快捷键操作，提供 Magic 命令 |
+| Icon | Area Diagram | Description |
+| -------------------------------------------------------------- | --------------------------------------------------------------------- | --------------------------------------------------------------------------------------------- |
+| | | Display keybind operations for command mode and edit mode in Libro, providing Magic commands. |
-### Cell 操作栏
+### Cell Operation Bar
-Notebook 支持针对单元格便捷执行 Cell 操作。在 Cell 右侧的操作栏中，从上至下分别是运行、上移、下移、增加、删除、更多菜单。
+The Notebook supports convenient execution of Cell operations. In the operation bar to the right of each Cell, from top to bottom, there are options to run, move up, move down, add, delete, and access more menus.
-| 图标/按钮 | 描述 |
-| ------------------------------------------------------------- | -------------------------------------------- |
-| | 运行当前选中的代码单元或重新运行代码单元。 |
-| | 将当前选中的代码单元上移一个位置。 |
-| | 将当前选中的代码单元下移一个位置。 |
-| | 在下方增加选中类型的单元格。 |
-| | 删除当前选中的代码单元。 |
-| | 提供隐藏代码和输出、复制、剪切、粘贴的功能。 |
+| Icon/Button | Description |
+| ------------------------------------------------------------- | ---------------------------------------------------------------- |
+| | Run the currently selected code Cell or re-run the code Cell. |
+| | Move the currently selected code Cell up one position. |
+| | Move the currently selected code Cell down one position. |
+| | Add a Cell of the selected type below. |
+| | Delete the currently selected code Cell. |
+| | Provide functions to hide code and output, copy, cut, and paste. |
-### Cell 编辑区
+### Cell Editing Area
-在 Notebook 代码编辑窗口中，您可以添加多个 Cell 来组织您的项目。Cell 之间的区域为衔接区，Cell 执行完毕产生的输出窗格为输出区，最后一个 Cell 底部称为 Cell 底部区。
+In the Notebook's code editing window, you can add multiple Cells to organize your project. The area between Cells is called the linking area, and the output pane generated after executing a Cell is referred to as the output area. The bottom of the last Cell is called the bottom Cell area.
-#### Cell 衔接区
+#### Cell Linking Area
-您可以在该区域自由添加指定类型的单元格。
+You can freely add specified types of Cells in this area.
-说明：如果您选中的 Cell 后无其他单元格，可以直接在底部通过指定按钮添加对应类型的单元格。详情请参见底部 Cell。
+Note: If you select a Cell without other Cells below it, you can directly add the corresponding type of Cell through the specified button at the bottom. For more details, refer to the bottom Cell section.
-#### Cell 输出区
+#### Cell Output Area
-支持在单元格下方查看执行此 Cell 后的运行时间和运行结果。
+You can view the execution time and results after executing this Cell below it.
-注意：目前仅支持执行 Python Cell 和 Prompt Cell 并产生输出内容，其余均为说明性、展示性 Cell。
+Note: Currently, only Python Cells and Prompt Cells support output content, while others are for illustrative and display purposes.
-#### Cell 固定 Output 高度
+#### Fixed Output Height for Cells
-如果输出内容较长，您可以选择固定或取消输出窗口的高度，以获取最佳视图体验。
+If the output content is lengthy, you can choose to fix or unfix the height of the output window for an optimal viewing experience.
-#### 底部 Cell
+#### Bottom Cell
-实验文件中最后一个 Cell 的底部提供显式添加指定类型单元格的按钮。
+The bottom of the last Cell in the experiment file provides an explicit button to add a Cell of the specified type.
-说明：同时，支持在 Cell 衔接区或 Cell 操作栏添加单元格，通过 Cell 控制区的类型转换来切换单元格类型。
+Note: Additionally, you can add Cells in the Cell linking area or the Cell operation bar, and switch Cell types through the Cell control area.
-## 交互操作介绍
+## Introduction to Interactive Operations
-支持在上方工具栏右侧，通过查看快捷键，查看或搜索产品内所有快捷键功能和 Notebook Magic 命令，以下为您介绍几种常用的操作：
+On the right side of the top toolbar, you can view keybinds to see or search for all keybind functions and Notebook Magic commands within the product. Here are a few common operations:
-### 命令态 | 编辑态
+### Command Mode | Edit Mode
-Notebook 将针对操作功能分为命令态和编辑态。
+The Notebook distinguishes between command mode and edit mode based on operation functions.
-● 在编辑态下单击代码编辑页面空白处或快捷键 Esc 进入命令态，当前选中的 Cell 边框为蓝色。
+- In edit mode, clicking in a blank area of the code editing page or using the Esc key enters command mode, where the border of the currently selected Cell is blue.
-● 在命令态时通过快捷键 Enter 进入编辑态或直接单击 Cell 编辑框。当前选中的 Cell 边框为蓝色高亮显示。
+- In command mode, you can enter edit mode by using the Enter key or directly clicking the Cell editing box. The border of the currently selected Cell is highlighted in blue.
-注意：Markdown 类型的 Cell 由命令态进入编辑态需要双击鼠标左键。
+Note: For Markdown type Cells, double-clicking with the left mouse button is required to enter edit mode from command mode.
-### 命令态
+### Command Mode
-在命令态下，支持以下常见功能。
+In command mode, the following common functionalities are supported.
-#### 多选 Cell
+#### Multi-select Cells
-被选中的 Cell 背景为蓝色阴影，支持选中多个单元格以进行批量操作，如批量执行（Ctrl/Command+Enter）和批量复制(C)、粘贴(V)等，您可以自由搭配使用。
+Selected Cells are highlighted in blue. You can select multiple Cells for batch operations, such as batch execution (Ctrl/Command+Enter) and batch copying (C), pasting (V), etc., allowing for flexible combinations.
-| 快捷键 | 效果 |
-| ------------------ | ---------------------------------------------------------- |
-| Shift+Up/Shift+K | 向上选中多个 Cell，单击 Up/K N 次，则向上选中 N 个 Cell。 |
-| Shift+Down/Shift+J | 向下选中多个 Cell，单击 Down/J N次，则向下选中 N 个 Cell。 |
+| Keybind | Description |
+| ------------------ | ---------------------------------------------------------------------------------- |
+| Shift+Up/Shift+K | Select multiple Cells upwards; click Up/K N times to select N Cells upwards. |
+| Shift+Down/Shift+J | Select multiple Cells downwards; click Down/J N times to select N Cells downwards. |
-说明：另外，您可以按住 shift，选中一个 Cell 并以此为基准，单击另一个目标 Cell 的左侧区域，即可向上或向下选中该范围内的所有 Cell。
+Here’s the translation of your text:
-#### 转换 Cell
+---
+
+#### Converting Cells
-在命令态下，选中单元格，通过快捷键可以实现 Markdown 到 Python 类型的互相转换。
+In command mode, you can use keyboard keybinds to convert cells between Markdown and Python types.
-| 快捷键 | 效果 |
-| ------ | ------------------------------------------------------------------------ |
-| M | 将 Cell 转换为 Markdown 类型，快捷键1/2/3/4/5/6分别支持标题1/2/3/4/5/6。 |
-| Y | 将 Cell 转换为 Python 类型。 |
+| Keybind | Description |
+| ------- | ------------------------------------------------------------------------------------------- |
+| M | Convert the cell to Markdown type; keybinds 1/2/3/4/5/6 correspond to headings 1/2/3/4/5/6. |
+| Y | Convert the cell to Python type. |
-#### 合并 Cell
+#### Merging Cells
-在命令态下，支持通过快捷键合并当前选中 Cell 和相邻上一个或下一个 Cell 的内容。
+In command mode, you can merge the contents of the currently selected cell with the adjacent previous or next cell using keyboard keybinds.
-| 快捷键 | 效果 |
-| -------------------- | ----------------------- |
-| Ctrl/Command+Shift+M | 合并相邻的下一个 Cell。 |
+| Keybind | Description |
+| -------------------- | ---------------------------------- |
+| Ctrl/Command+Shift+M | Merge with the next adjacent cell. |
-说明：支持多选 Cell，并通过shift + m 进行批量合并。
+Note: Multiple cells can be selected, and you can perform bulk merges using Shift + M.
-#### 执行 Cell
+#### Executing Cells
-在命令态下，您可以通过快捷键启动 Cell 执行，支持以下执行方式：
+In command mode, you can execute cells using the following keybinds:
-| 快捷键 | 效果 |
-| ------------------ | -------------------------------------- |
-| Ctrl/Command+Enter | 执行当前 Cell。 |
-| Shift+Enter | 执行当前 Cell 并选中下一个单元格。 |
-| Alt/Opt+Enter | 执行当前 Cell 并向下插入同类型单元格。 |
+| Keybind | Description |
+| ------------------ | --------------------------------------------------------------------------------- |
+| Ctrl/Command+Enter | Execute the currently selected cell. |
+| Shift+Enter | Execute the currently selected cell and select the next cell. |
+| Alt/Opt+Enter | Execute the currently selected cell and insert a new cell of the same type below. |
-#### 拖拽 Cell
+#### Dragging Cells
- 当您将鼠标移至 Cell 框左侧，出现样式
- 
- 时，可以对当前 Cell 进行拖拽。
+ When you move your mouse to the left side of the cell box, the following style appears:
+
+ You can then drag the current cell.
-- 拖拽单个 Cell（不区分命令态和编辑态）
- 当您将鼠标移至目标 Cell 框左侧，出现样式时，即可进行拖拽。
+- **Dragging a Single Cell** (regardless of command or edit mode)
+ When you move your mouse to the left side of the target cell and the style appears, you can drag it.
- 时，可以对当前 Cell 进行拖拽。
+ When you move your mouse to the left side of the cell box, the following style appears:
+
+ You can then drag the current cell.
-说明：拖拽时，蓝色横条作为定位标记，表示拖拽至蓝色横条下方。
+Note: During dragging, the blue horizontal bar serves as a positioning marker, indicating where you are dragging to, below the blue bar.
-- 拖拽多个 Cell
- 在命令态下，多选 Cell 后，当您将鼠标移至 Cell 框左侧，出现样式时，可以同时拖拽多个 Cell。
+- **Dragging Multiple Cells**
+ In command mode, after selecting multiple cells, when you move your mouse to the left side of the cell box and the style appears, you can drag multiple cells simultaneously.
-### 编辑态
+### Edit Mode
-在编辑态下，支持以下常见功能。
+In edit mode, the following common functionalities are supported.
-#### 切分 Cell
+#### Splitting Cells
-支持将一个单元格中的内容切分为不同的段，分别放入不同的单元格中。
+You can split the contents of a cell into different sections, placing them into separate cells.
| 快捷键 | -支持方式 | -效果 | +Keybind | +Support Method | +Description |
|---|---|---|---|---|---|
| Ctrl/Command+Shift+- | -通过光标定位分割点 | -光标前后的内容被分割开来，分别放入两个单元格中。 | +Split at the cursor's position | +The contents before and after the cursor are split into two separate cells. | |
| 选中内容的前后作为分割点 | -选中内容的前后都作为分割点，原单元格内容被切分为三段，分别放入三个单元格。 | +Use the selected content's boundaries as split points | +The boundaries around the selected content are used as split points, splitting the original cell's content into three segments, which are placed into three separate cells. |
-#### 隐藏与显示 Cell 输出部分
+#### Hiding and Showing Cell Output Sections
-## Cell 介绍
+## Introduction to Cells
### Python Cell
-Python Cell 是 Notebook 中编辑和调试 Python 代码的最小单元，主要包含以下使用功能：
+A Python cell is the smallest unit for editing and debugging Python code in the notebook, primarily featuring the following functionalities:
-| 功能 | 说明 |
-| ------------ | ---------------------------------------------------------------- |
-| 代码编写 | 提供用于编写源代码的编辑区域，支持语法高亮和自动代码补全等。 |
-| 单元调试 | 允许逐单元(cell)逐行调试代码，帮助识别代码中的逻辑错误和异常。 |
-| 输出调试窗格 | 显示代码执行的输出结果，包括打印的文本、图形、错误信息等。 |
-| 代码生成 | 根据用户输入自动生成代码片段，提高开发效率。 |
-| 使用框架和库 | 内置丰富类库，支持导入和使用多种 Python 框架和库，扩展代码功能。 |
+| Function | Description |
+| ------------------------------ | ---------------------------------------------------------------------------------------------------------------------------- |
+| Code Writing | Provides an area for writing source code, supporting syntax highlighting and auto-completion. |
+| Cell Debugging | Allows line-by-line debugging of code within a cell, helping to identify logical errors and exceptions. |
+| Output Debugging Window | Displays the output results of code execution, including printed text, graphics, error messages, etc. |
+| Code Generation | Automatically generates code snippets based on user input to enhance development efficiency. |
+| Using Frameworks and Libraries | Built-in rich libraries support the import and use of various Python frameworks and libraries, expanding code functionality. |
### Markdown Cell
-| 功能 | 说明 |
-| ---------- | ---------------------------------------------------------- |
-| 文本编辑 | 提供文本输入区域，用于编写 Markdown 格式的文本内容。 |
-| 格式化展示 | 在编辑完成后，支持渲染 Markdown 为格式化的 HTML 展示。 |
-| 插入元素 | 支持插入链接、图片、表格、列表等 Markdown 元素。 |
-| 文档结构化 | 使用 Markdown 语法创建有结构的文档，如标题、子标题、段落。 |
-| 代码块支持 | 支持插入代码块，并对不同编程语言进行语法高亮。 |
+| Function | Description |
+| -------------------- | --------------------------------------------------------------------------------------------------- |
+| Text Editing | Provides an input area for writing Markdown-formatted text. |
+| Formatted Display | Supports rendering Markdown into formatted HTML after editing. |
+| Element Insertion | Supports inserting links, images, tables, lists, and other Markdown elements. |
+| Document Structuring | Uses Markdown syntax to create structured documents, such as headings, subheadings, and paragraphs. |
+| Code Block Support | Supports inserting code blocks with syntax highlighting for different programming languages. |
-说明：此外，支持基于标题的 Markdown Cell 进行隐藏与现实，帮助您更好的组织与查看 Notebook
+Note: Additionally, support for hiding and revealing Markdown cells based on headings helps you better organize and view the notebook.
diff --git a/apps/docs/docs/manual/index.zh-CN.md b/apps/docs/docs/manual/index.zh-CN.md
new file mode 100644
index 00000000..5eebeb09
--- /dev/null
+++ b/apps/docs/docs/manual/index.zh-CN.md
@@ -0,0 +1,298 @@
+---
+title: 基础指南
+order: 0
+---
+
+# 概述
+
+Libro 编辑器增强了传统 Notebook 运行的状态监控以及各种交互操作，本文为您介绍 Libro 编辑器的基础界面功能，帮助您了解 Libro 编辑器的基本使用方法。
+
+## 产品界面介绍
+
+| 界面模块 | 说明 |
+| ------------- | --------------------------------------------------------------- |
+| 上方工具栏 | 包含内核状态区、操作控制区、快捷键等。 |
+| Cell 操作区 | 罗列针对每一个独立的 Cell 可执行的操作。 |
+| Cell 编辑区 | 代码编辑窗口中的功能区域，如 Cell 衔接区、输出区、底部 Cell等。 |
+| Cell 功能介绍 | 介绍命令态和编辑态 Cell 的功能和快捷键操作。 |
+
+### 上方工具栏
+
+
+
+| 序号 | 名称 | 描述 |
+| ---- | ---------- | -------------------------------------------------------------------- |
+| ① | 内核状态区 | 展示当前服务的内核运行状态，包括正在连接、未知、忙碌、空闲四种状态。 |
+| ② | 操作控制区 | 提供各种控制操作，如对代码执行、Cell 转换的操作等。 |
+| ③ | 快捷键面板 | 查看 Libro 快捷键目录。 |
+
+#### 内核状态区
+
+Libro Notebook 采用 Python3 作为基础内核，负责运行用户输入的代码单元（Cell），管理代码执行的状态。在 Libro 的内核状态区，您可以修改内核和查看内核状态。
+
+- 内核编辑菜单
+
+
+
+| 菜单选项 | 描述 |
+| --------------------------------- | -------------------------------------------------- |
+| Start Preferred Kernel | 启动设定或之前使用的首选内核。 |
+| Use No Kernel | 选择此选项不会启动任何内核，用于不执行代码的场景。 |
+| Use Kernel from Preferred Session | 使用已开启会话中的内核配置，保持环境一致性。 |
+
+说明：内核（Kernel）是一个执行计算的引擎，它能够运行编程代码并返回结果。
+
+- 内核状态
+ Libro 的内核状态分为正在连接、未知、忙碌、空闲。
+
+ Libro Notebook 正在与内核建立连接，发生在启动内核或者内核失去响应后尝试连接的情况。
+
+ 当前内核的状态不能确定，可能是由于通信问题或内部错误导致状态信息无法获取。
+
+ 当前内核正在执行代码处理任务，您提交的新代码或指令将等待当前任务完成后才会被执行。
+
+ 表示内核当前没有执行任何任务，已经准备好接受新的命令和代码执行。
+
+#### 操作控制区
+
+| 图标 | 描述 |
+| -------------------------------------------------------------------- | ------------------------------------------------------------------------ |
+| | 保存当前 Notebook 中 Cell 内容的改动。 |
+| | 按照子菜单选项，执行选中范围的 Cell，如执行全部 Cell、执行当前 Cell 等。 |
+| | 定位正在执行的 Cell。 |
+| | 中断正在执行的 Cell 代码。 |
+| | 重启并清空所有 Cell 的输出。 |
+| | 撤销上一步操作。 |
+| | 重做上一步被撤销的操作。 |
+| | 固定 Output 展示高度。 |
+| | 根据子菜单选项，隐藏或显示代码和 Output。 |
+| | 清空选中 Cell 的输出。 |
+| | 更改 Cell 类型，如 Python、Markdown 等 |
+
+#### 分享和快捷键
+
+| 图标 | 区域图 | 说明 |
+| -------------------------------------------------------------- | --------------------------------------------------------------------- | ------------------------------------------------------ |
+| | | 展示命令态和编辑态 Libro 的快捷键操作，提供 Magic 命令 |
+
+### Cell 操作栏
+
+Notebook 支持针对单元格便捷执行 Cell 操作。在 Cell 右侧的操作栏中，从上至下分别是运行、上移、下移、增加、删除、更多菜单。
+
+| 图标/按钮 | 描述 |
+| ------------------------------------------------------------- | -------------------------------------------- |
+| | 运行当前选中的代码单元或重新运行代码单元。 |
+| | 将当前选中的代码单元上移一个位置。 |
+| | 将当前选中的代码单元下移一个位置。 |
+| | 在下方增加选中类型的单元格。 |
+| | 删除当前选中的代码单元。 |
+| | 提供隐藏代码和输出、复制、剪切、粘贴的功能。 |
+
+### Cell 编辑区
+
+在 Notebook 代码编辑窗口中，您可以添加多个 Cell 来组织您的项目。Cell 之间的区域为衔接区，Cell 执行完毕产生的输出窗格为输出区，最后一个 Cell 底部称为 Cell 底部区。
+
+#### Cell 衔接区
+
+您可以在该区域自由添加指定类型的单元格。
+
+
+
+
+
+说明：如果您选中的 Cell 后无其他单元格，可以直接在底部通过指定按钮添加对应类型的单元格。详情请参见底部 Cell。
+
+#### Cell 输出区
+
+支持在单元格下方查看执行此 Cell 后的运行时间和运行结果。
+
+
+
+注意：目前仅支持执行 Python Cell 和 Prompt Cell 并产生输出内容，其余均为说明性、展示性 Cell。
+
+#### Cell 固定 Output 高度
+
+如果输出内容较长，您可以选择固定或取消输出窗口的高度，以获取最佳视图体验。
+
+
+
+#### 底部 Cell
+
+实验文件中最后一个 Cell 的底部提供显式添加指定类型单元格的按钮。
+
+
+
+说明：同时，支持在 Cell 衔接区或 Cell 操作栏添加单元格，通过 Cell 控制区的类型转换来切换单元格类型。
+
+## 交互操作介绍
+
+支持在上方工具栏右侧，通过查看快捷键，查看或搜索产品内所有快捷键功能和 Notebook Magic 命令，以下为您介绍几种常用的操作：
+
+
++ +
+
+### 命令态 | 编辑态
+
+Notebook 将针对操作功能分为命令态和编辑态。
+
+● 在编辑态下单击代码编辑页面空白处或快捷键 Esc 进入命令态，当前选中的 Cell 边框为蓝色。
+
+
+
+● 在命令态时通过快捷键 Enter 进入编辑态或直接单击 Cell 编辑框。当前选中的 Cell 边框为蓝色高亮显示。
+
+
+
+注意：Markdown 类型的 Cell 由命令态进入编辑态需要双击鼠标左键。
+
+### 命令态
+
+在命令态下，支持以下常见功能。
+
+
+
+#### 多选 Cell
+
+被选中的 Cell 背景为蓝色阴影，支持选中多个单元格以进行批量操作，如批量执行（Ctrl/Command+Enter）和批量复制(C)、粘贴(V)等，您可以自由搭配使用。
+
+| 快捷键 | 效果 |
+| ------------------ | ---------------------------------------------------------- |
+| Shift+Up/Shift+K | 向上选中多个 Cell，单击 Up/K N 次，则向上选中 N 个 Cell。 |
+| Shift+Down/Shift+J | 向下选中多个 Cell，单击 Down/J N次，则向下选中 N 个 Cell。 |
+
+说明：另外，您可以按住 shift，选中一个 Cell 并以此为基准，单击另一个目标 Cell 的左侧区域，即可向上或向下选中该范围内的所有 Cell。
+
+#### 转换 Cell
+
+在命令态下，选中单元格，通过快捷键可以实现 Markdown 到 Python 类型的互相转换。
+
+| 快捷键 | 效果 |
+| ------ | ------------------------------------------------------------------------ |
+| M | 将 Cell 转换为 Markdown 类型，快捷键1/2/3/4/5/6分别支持标题1/2/3/4/5/6。 |
+| Y | 将 Cell 转换为 Python 类型。 |
+
+#### 合并 Cell
+
+在命令态下，支持通过快捷键合并当前选中 Cell 和相邻上一个或下一个 Cell 的内容。
+
+| 快捷键 | 效果 |
+| -------------------- | ----------------------- |
+| Ctrl/Command+Shift+M | 合并相邻的下一个 Cell。 |
+
+说明：支持多选 Cell，并通过shift + m 进行批量合并。
+
+#### 执行 Cell
+
+在命令态下，您可以通过快捷键启动 Cell 执行，支持以下执行方式：
+
+| 快捷键 | 效果 |
+| ------------------ | -------------------------------------- |
+| Ctrl/Command+Enter | 执行当前 Cell。 |
+| Shift+Enter | 执行当前 Cell 并选中下一个单元格。 |
+| Alt/Opt+Enter | 执行当前 Cell 并向下插入同类型单元格。 |
+
+#### 拖拽 Cell
+
+
+ 当您将鼠标移至 Cell 框左侧，出现样式
+
+ 时，可以对当前 Cell 进行拖拽。
+
+
+- 拖拽单个 Cell（不区分命令态和编辑态）
+ 当您将鼠标移至目标 Cell 框左侧，出现样式时，即可进行拖拽。
+
+
+ 时，可以对当前 Cell 进行拖拽。
+
++
+
+说明：拖拽时，蓝色横条作为定位标记，表示拖拽至蓝色横条下方。
+
+- 拖拽多个 Cell
+ 在命令态下，多选 Cell 后，当您将鼠标移至 Cell 框左侧，出现样式时，可以同时拖拽多个 Cell。
+
+### 编辑态
+
+在编辑态下，支持以下常见功能。
+
+
+
+#### 切分 Cell
+
+支持将一个单元格中的内容切分为不同的段，分别放入不同的单元格中。
+
+| 快捷键 | +支持方式 | +效果 | +
|---|---|---|
| Ctrl/Command+Shift+- | +通过光标定位分割点 | +光标前后的内容被分割开来，分别放入两个单元格中。 | +
| 选中内容的前后作为分割点 | +选中内容的前后都作为分割点，原单元格内容被切分为三段，分别放入三个单元格。 | +
+
+#### 隐藏与显示 Cell 输出部分
+
+
+
+## Cell 介绍
+
+### Python Cell
+
+Python Cell 是 Notebook 中编辑和调试 Python 代码的最小单元，主要包含以下使用功能：
+
+
+
+| 功能 | 说明 |
+| ------------ | ---------------------------------------------------------------- |
+| 代码编写 | 提供用于编写源代码的编辑区域，支持语法高亮和自动代码补全等。 |
+| 单元调试 | 允许逐单元(cell)逐行调试代码，帮助识别代码中的逻辑错误和异常。 |
+| 输出调试窗格 | 显示代码执行的输出结果，包括打印的文本、图形、错误信息等。 |
+| 代码生成 | 根据用户输入自动生成代码片段，提高开发效率。 |
+| 使用框架和库 | 内置丰富类库，支持导入和使用多种 Python 框架和库，扩展代码功能。 |
+
+### Markdown Cell
+
+
+
+| 功能 | 说明 |
+| ---------- | ---------------------------------------------------------- |
+| 文本编辑 | 提供文本输入区域，用于编写 Markdown 格式的文本内容。 |
+| 格式化展示 | 在编辑完成后，支持渲染 Markdown 为格式化的 HTML 展示。 |
+| 插入元素 | 支持插入链接、图片、表格、列表等 Markdown 元素。 |
+| 文档结构化 | 使用 Markdown 语法创建有结构的文档，如标题、子标题、段落。 |
+| 代码块支持 | 支持插入代码块，并对不同编程语言进行语法高亮。 |
+
+说明：此外，支持基于标题的 Markdown Cell 进行隐藏与现实，帮助您更好的组织与查看 Notebook
+
+
diff --git a/apps/docs/docs/manual/prompt-cell.md b/apps/docs/docs/manual/prompt-cell.md
index 59d6fac7..307fbffb 100644
--- a/apps/docs/docs/manual/prompt-cell.md
+++ b/apps/docs/docs/manual/prompt-cell.md
@@ -1,28 +1,27 @@
---
-title: prompt cell 指南
+title: Prompt Cell Guide
order: 2
---
-## 什么是 Prompt Cell？
+## What is a Prompt Cell?
-Prompt Cell 是一种特殊的 notebook cell，通过这个 cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中，尤其是在需要频繁与 AI 进行交互的场景中。
-目前 libro 的 Prompt Cell：
+A Prompt Cell is a specialized notebook cell that allows users to input natural language instructions to invoke large models for inference and obtain desired output. It minimizes the need to write complex code and integrates flexibly into existing workflows, especially in scenarios requiring frequent AI interactions. Currently, libro’s Prompt Cell:
-- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展自己的模型～
- - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
- - 基于 libro-ai 扩展自己的模型。
-- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
-- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage.
+- Comes with built-in models like ChatGPT, GPT-4, and DALL-E 3. You can also expand your own models by:
+ - Defining `llm`, `agent`, and other interactive variables based on LangChain, which can be directly used in a Prompt Cell.
+ - Extending your model using libro-ai.
+- Supports selecting a chat identifier, allowing all Prompt Cells with the same chat identifier to be within one chat context.
+- Allows saving a Prompt Cell as a variable, where the variable represents LangChain's `AIMessage`.
-接下来我们将展示一个实际案例，如何通过 Prompt Cell 和 Python 变量的结合连接模型、生成代码、保存分析结果，并将这些分析结果通过对话历史进行传递。
+Next, we’ll showcase a practical example that demonstrates how to connect models, generate code, save analysis results, and pass them through conversation history using Prompt Cells combined with Python variables.
-## 场景：全球 CO2 排放数据分析与未来预测
+## Scenario: Global CO2 Emissions Analysis and Future Prediction
-这个案例中，我们将通过 Prompt Cell，连接大模型执行对未来 20 年全球 CO2 排放的预测，同时生成相应的 Python 代码进行可视化分析。
+In this example, we’ll use a Prompt Cell to connect a large model for predicting global CO2 emissions over the next 20 years, while also generating Python code for visualization analysis.
-### 准备工作
+### Preparation
-1. 在 `~/.libro/libro_config.yaml` 配置大模型 key，并且启用 libro-ai 扩展。
+1. Configure your model keys and enable the libro-ai extension in `~/.libro/libro_config.yaml`.
```yaml
llm:
@@ -31,42 +30,44 @@ jpserver_extensions:
libro_ai: True
```
-2. 在终端中运行命令 `libro` 启动 libro
+2. Run the `libro` command in the terminal to start libro.
-### 步骤 1: 分析 CO2 排放趋势
+### Step 1: Analyze CO2 Emission Trends
-1. 定义时间范围以及数据集地址变量的 Python 变量，注意这些变量必须是字符串类型：
+1. Define Python variables for the time range and dataset URL, ensuring these variables are of string type:
-
-2. 在 Prompt Cell 中通过自然语言输入连接模型进行加载数据集，可视化排放趋势的代码生成操作
-① 增加新的聊天标识，使得后续选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
-② 整个 Prompt Cell 消息保存为一个变量，该变量即为 langchain 的 AIMessage.
+
-
+2. Use natural language in the Prompt Cell to load the dataset and generate code for visualizing emission trends:
+ ① Add a new chat identifier, so that subsequent Prompt Cells with the same identifier are in one chat context.
+ ② Save the entire Prompt Cell message as a variable, which represents LangChain's `AIMessage`.
-
-3. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+
-
+
-### 步骤 2: 预测未来 CO2 排放量
+3. Clicking “Insert and Run” will automatically add a Python Cell with model-generated code, and execute it.
-1. 使用 Prompt Cell 生成预测未来 CO2 排放量的代码，并选择与前一个 Prompt Cell 同一个聊天标识，同时保存变量。
+
-
+### Step 2: Predict Future CO2 Emissions
-2. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+1. Use the Prompt Cell to generate code predicting future CO2 emissions. Select the same chat identifier as the previous Prompt Cell and save the variable.
-
+
-### 步骤 3: 基于 Langchain 消息提出应对 CO2 排放的建议
+2. Clicking “Insert and Run” will automatically add a Python Cell with model-generated code, and execute it.
-1. 此外，我们也可以配合着 langchain 一起使用，例如，基于前面保存的 co2_predict变量，生成应对气候变化的行动建议。
+
-
+### Step 3: Suggest Actions Based on LangChain Messages to Address CO2 Emissions
-
+1. Additionally, you can use LangChain, such as generating actionable recommendations for climate change based on the previously saved `co2_predict` variable.
-2. 同时，您可以看到，此时新增一个 Prompt Cell，此时模型选项中，包含对应的 langchain 变量对象 chat_prompt、llm、summary_chain。
+
-
+
+
+2. You’ll also see a new Prompt Cell with model options, including LangChain variable objects like `chat_prompt`, `llm`, and `summary_chain`.
+
+
diff --git a/apps/docs/docs/manual/prompt-cell.zh-CN.md b/apps/docs/docs/manual/prompt-cell.zh-CN.md
new file mode 100644
index 00000000..59d6fac7
--- /dev/null
+++ b/apps/docs/docs/manual/prompt-cell.zh-CN.md
@@ -0,0 +1,72 @@
+---
+title: prompt cell 指南
+order: 2
+---
+
+## 什么是 Prompt Cell？
+
+Prompt Cell 是一种特殊的 notebook cell，通过这个 cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中，尤其是在需要频繁与 AI 进行交互的场景中。
+目前 libro 的 Prompt Cell：
+
+- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展自己的模型～
+ - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
+ - 基于 libro-ai 扩展自己的模型。
+- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
+- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage.
+
+接下来我们将展示一个实际案例，如何通过 Prompt Cell 和 Python 变量的结合连接模型、生成代码、保存分析结果，并将这些分析结果通过对话历史进行传递。
+
+## 场景：全球 CO2 排放数据分析与未来预测
+
+这个案例中，我们将通过 Prompt Cell，连接大模型执行对未来 20 年全球 CO2 排放的预测，同时生成相应的 Python 代码进行可视化分析。
+
+### 准备工作
+
+1. 在 `~/.libro/libro_config.yaml` 配置大模型 key，并且启用 libro-ai 扩展。
+
+```yaml
+llm:
+ OPENAI_API_KEY: sk-xxx
+jpserver_extensions:
+ libro_ai: True
+```
+
+2. 在终端中运行命令 `libro` 启动 libro
+
+### 步骤 1: 分析 CO2 排放趋势
+
+1. 定义时间范围以及数据集地址变量的 Python 变量，注意这些变量必须是字符串类型：
+
+
+2. 在 Prompt Cell 中通过自然语言输入连接模型进行加载数据集，可视化排放趋势的代码生成操作
+① 增加新的聊天标识，使得后续选择该聊天标识的 Prompt Cell 都在一个聊天上下文中.
+② 整个 Prompt Cell 消息保存为一个变量，该变量即为 langchain 的 AIMessage.
+
+
+
+
+3. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+
+
+
+### 步骤 2: 预测未来 CO2 排放量
+
+1. 使用 Prompt Cell 生成预测未来 CO2 排放量的代码，并选择与前一个 Prompt Cell 同一个聊天标识，同时保存变量。
+
+
+
+2. 点击 “插入并运行选项” 会自动新增一个内容对应为模型生成代码的 Python Cell，并且运行。
+
+
+
+### 步骤 3: 基于 Langchain 消息提出应对 CO2 排放的建议
+
+1. 此外，我们也可以配合着 langchain 一起使用，例如，基于前面保存的 co2_predict变量，生成应对气候变化的行动建议。
+
+
+
+
+
+2. 同时，您可以看到，此时新增一个 Prompt Cell，此时模型选项中，包含对应的 langchain 变量对象 chat_prompt、llm、summary_chain。
+
+
diff --git a/apps/docs/docs/manual/sql-cell.md b/apps/docs/docs/manual/sql-cell.md
index f78e9229..1e780e71 100644
--- a/apps/docs/docs/manual/sql-cell.md
+++ b/apps/docs/docs/manual/sql-cell.md
@@ -1,29 +1,29 @@
---
-title: sql cell 指南
+title: SQL Cell Guide
order: 1
---
-# 概述
+# Overview
-libro 支持使用 SQL Cell 来简化数据库交互，通过在 libro 中结合 SQL 和 Python，你可以：
+Libro supports using SQL Cells to simplify database interactions. By combining SQL and Python in Libro, you can:
-- 直接查询数据库，快速获取数据，支持把结果保存为 dataframe。
-- 使用 Python 对查询结果进行进一步的处理和可视化。
-- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+- Query databases directly to quickly retrieve data and save the results as a DataFrame.
+- Further process and visualize query results using Python.
+- Integrate SQL’s powerful querying capabilities with the dynamic nature of notebooks, improving development efficiency.
-下面我们通过一个完整的例子展示如何在 libro 中使用 SQL Cell 来操作数据库，并结合 Python 进行数据分析。
+The following example demonstrates how to use SQL Cells in Libro to interact with a database and analyze data using Python.
-## 📍场景：电子商务平台的销售数据分析
+## 📍 Scenario: Sales Data Analysis for an E-commerce Platform
-假设我们管理一个电子商务平台，并且希望通过分析销售数据来优化业务策略。数据库中包含多个表，比如 orders（订单表）、customers（客户表）、products（产品表）和 order_items（订单项表），记录了客户的订单和购买情况。我们将通过在 libro 中使用 SQL Cell 来解决以下几个常见问题：
+Imagine we manage an e-commerce platform and want to analyze sales data to optimize business strategies. The database includes multiple tables, such as `orders` (order table), `customers` (customer table), `products` (product table), and `order_items` (order item table), which record customer orders and purchase details. We’ll use SQL Cells in Libro to address several common questions:
-1. 分析不同产品的销量：统计每个产品的销售数量和收入。
-2. 分析客户购买行为：找出每个客户的购买总额和平均订单金额。
-3. 找出平台的最佳销售月份：通过时间维度分析平台的销售表现。
+1. Analyze product sales: Calculate the sales quantity and revenue for each product.
+2. Analyze customer purchasing behavior: Identify each customer’s total spend and average order value.
+3. Determine the best sales month for the platform: Analyze sales performance over time.
-### 准备工作
+### Preparation
-1. 配置数据库的连接信息，在 `~/.libro/libro_config.yaml` 中添加数据库的连接配置,并且启用 libro-sql 扩展。
+1. Configure the database connection details by adding them to the `~/.libro/libro_config.yaml` file and enable the `libro-sql` extension.
```yaml
db:
@@ -37,8 +37,8 @@ jpserver_extensions:
libro_sql: True
```
-> 💡 **Tip**: 如果没有上述 libro 的配置文件可通过在终端中运行命令 `libro config generate` 生成.-> 此外，mysql、sqlite 的配置示例如下: +> 💡 **Tip**: If the configuration file doesn’t already exist, generate it by running the command `libro config generate` in the terminal. +> Additionally, here are configuration examples for MySQL and SQLite: > > ```yaml > - db_type: mysql @@ -53,49 +53,47 @@ jpserver_extensions: > password: '' > host: '' > port: 0 -> database: sql_demo.db #.db 文件相较于 libro 启动路径的位置 +> database: sql_demo.db # relative to the libro startup path > ``` -> -> -2. 在终端中运行命令libro启动 libro，如果已经启动 libro ，则配置完成之后重启内核。 +2. Start Libro by running the command `libro` in the terminal. If Libro is already running, restart the kernel after configuring. -### 案例 1：分析不同产品的销量 +### Example 1: Analyzing Product Sales -1. 查询不同产品的销量 - 我们首先通过 SQL 查询来统计每个产品的销量和总收入。这个查询将返回每个产品的销售数量以及它所产生的总收入，同时把查询结果保存到 Pandas DataFrame 中。 +1. Query product sales + We start by using SQL to calculate the sales quantity and total revenue for each product. This query returns the sales quantity and total revenue for each product, with the results saved in a Pandas DataFrame.
-2. 可视化产品销售表现
- 我们可以使用 Python 的可视化工具（如 Matplotlib 或 Seaborn）对产品销量进行直观展示，通过这个直方图，我们可以快速了解哪些产品是平台上最畅销的。
+2. Visualize product sales performance
+ We can visualize product sales using Python visualization tools such as Matplotlib or Seaborn. This histogram provides a quick overview of the platform’s best-selling products.
-### 案例 2：分析客户的购买行为
+### Example 2: Analyzing Customer Purchasing Behavior
-1. 统计每个客户的订单数量、总消费金额和平均订单金额
- 我们首先通过 SQL 查询来统计他们的总购买金额和平均订单金额。这个查询将返回每个客户的订单数量、总消费金额和平均订单金额。通过这些数据，我们可以了解哪些客户是平台的忠实用户，以及他们的消费习惯。
+1. Calculate the number of orders, total spend, and average order value for each customer
+ Using SQL, we calculate each customer’s total spending and average order value. This query returns the number of orders, total spend, and average order value for each customer, allowing us to identify loyal customers and understand their purchasing habits.
-2. 数据分析
- 通过 Python，可以进一步处理这些数据，找出不同客户的消费模式，例如哪些客户属于高价值客户。
+2. Data Analysis
+ We can further analyze this data in Python to identify customer spending patterns, such as identifying high-value customers.
-案例 3：找出最佳销售月份
+### Example 3: Identifying the Best Sales Month
-1. 查询每个月的总销售额
- 我们通过时间维度分析平台的最佳销售月份，这个查询会返回每个月的总销售额，并按降序排列，以便你了解哪几个月份的销售额最高。
+1. Query total sales by month
+ We analyze the platform’s best sales month over time. This query returns the total monthly sales, sorted in descending order, allowing you to see which months had the highest sales.
-2. 可视化每月销售额趋势
- 我们可以将每个月的销售数据可视化为折线图，通过这个折线图，可以轻松地看到不同月份的销售趋势，帮助调整库存和营销策略。
+2. Visualize monthly sales trends
+ We can visualize the monthly sales data as a line chart. This line chart helps you easily see the monthly sales trend, providing insights to adjust inventory and marketing strategies.
-# 最后
+# Conclusion
-通过这个电子商务平台的销售数据分析案例，我们展示了如何在 libro 中使用 SQL Cell 来解决实际问题，包括产品销量分析、客户行为分析以及销售趋势分析。你可以根据自己的需求扩展这些分析方法，在 libro 中结合 SQL 和 Python 的强大能力，进行个性化的数据分析。
+Through this sales data analysis case for an e-commerce platform, we demonstrated how to use SQL Cells in Libro to address real-world problems, including product sales analysis, customer behavior analysis, and sales trend analysis. You can extend these methods to suit your needs, leveraging the powerful combination of SQL and Python in Libro for personalized data analysis.
diff --git a/apps/docs/docs/manual/sql-cell.zh-CN.md b/apps/docs/docs/manual/sql-cell.zh-CN.md
new file mode 100644
index 00000000..f78e9229
--- /dev/null
+++ b/apps/docs/docs/manual/sql-cell.zh-CN.md
@@ -0,0 +1,101 @@
+---
+title: sql cell 指南
+order: 1
+---
+
+# 概述
+
+libro 支持使用 SQL Cell 来简化数据库交互，通过在 libro 中结合 SQL 和 Python，你可以：
+
+- 直接查询数据库，快速获取数据，支持把结果保存为 dataframe。
+- 使用 Python 对查询结果进行进一步的处理和可视化。
+- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+
+下面我们通过一个完整的例子展示如何在 libro 中使用 SQL Cell 来操作数据库，并结合 Python 进行数据分析。
+
+## 📍场景：电子商务平台的销售数据分析
+
+假设我们管理一个电子商务平台，并且希望通过分析销售数据来优化业务策略。数据库中包含多个表，比如 orders（订单表）、customers（客户表）、products（产品表）和 order_items（订单项表），记录了客户的订单和购买情况。我们将通过在 libro 中使用 SQL Cell 来解决以下几个常见问题：
+
+1. 分析不同产品的销量：统计每个产品的销售数量和收入。
+2. 分析客户购买行为：找出每个客户的购买总额和平均订单金额。
+3. 找出平台的最佳销售月份：通过时间维度分析平台的销售表现。
+
+### 准备工作
+
+1. 配置数据库的连接信息，在 `~/.libro/libro_config.yaml` 中添加数据库的连接配置,并且启用 libro-sql 扩展。
+
+```yaml
+db:
+ - db_type: postgresql
+ username: 'libro'
+ password: '12345678'
+ host: '127.0.0.1'
+ port: 5432
+ database: libro
+jpserver_extensions:
+ libro_sql: True
+```
+
+> 💡 **Tip**: 如果没有上述 libro 的配置文件可通过在终端中运行命令 `libro config generate` 生成.+> 此外，mysql、sqlite 的配置示例如下: +> +> ```yaml +> - db_type: mysql +> username: 'root' +> password: '12345678' +> host: '127.0.0.1' +> port: 3306 +> database: sql_demo +> +> - db_type: sqlite +> username: '' +> password: '' +> host: '' +> port: 0 +> database: sql_demo.db #.db 文件相较于 libro 启动路径的位置 +> ``` +> +> + +2. 在终端中运行命令libro启动 libro，如果已经启动 libro ，则配置完成之后重启内核。 + +### 案例 1：分析不同产品的销量 + +1. 查询不同产品的销量 + 我们首先通过 SQL 查询来统计每个产品的销量和总收入。这个查询将返回每个产品的销售数量以及它所产生的总收入，同时把查询结果保存到 Pandas DataFrame 中。 + +
+
+2. 可视化产品销售表现
+ 我们可以使用 Python 的可视化工具（如 Matplotlib 或 Seaborn）对产品销量进行直观展示，通过这个直方图，我们可以快速了解哪些产品是平台上最畅销的。
+
+
+
+### 案例 2：分析客户的购买行为
+
+1. 统计每个客户的订单数量、总消费金额和平均订单金额
+ 我们首先通过 SQL 查询来统计他们的总购买金额和平均订单金额。这个查询将返回每个客户的订单数量、总消费金额和平均订单金额。通过这些数据，我们可以了解哪些客户是平台的忠实用户，以及他们的消费习惯。
+
+
+
+2. 数据分析
+ 通过 Python，可以进一步处理这些数据，找出不同客户的消费模式，例如哪些客户属于高价值客户。
+
+
+
+案例 3：找出最佳销售月份
+
+1. 查询每个月的总销售额
+ 我们通过时间维度分析平台的最佳销售月份，这个查询会返回每个月的总销售额，并按降序排列，以便你了解哪几个月份的销售额最高。
+
+
+
+2. 可视化每月销售额趋势
+ 我们可以将每个月的销售数据可视化为折线图，通过这个折线图，可以轻松地看到不同月份的销售趋势，帮助调整库存和营销策略。
+
+
+
+# 最后
+
+通过这个电子商务平台的销售数据分析案例，我们展示了如何在 libro 中使用 SQL Cell 来解决实际问题，包括产品销量分析、客户行为分析以及销售趋势分析。你可以根据自己的需求扩展这些分析方法，在 libro 中结合 SQL 和 Python 的强大能力，进行个性化的数据分析。
diff --git a/apps/docs/docs/updates/update20241014.md b/apps/docs/docs/updates/update20241014.md
index 9d53436b..97cb7b7a 100644
--- a/apps/docs/docs/updates/update20241014.md
+++ b/apps/docs/docs/updates/update20241014.md
@@ -1,69 +1,62 @@
---
-title: 2024-10-14 更新
+title: Update on 2024-10-14
order: 9999
---
# 2024-10-14
-🎉🎉🎉 近期，我们聚焦于提升产品的灵活性和智能化体验，推出了多个实用的新功能。这些功能不仅使配置管理更加便捷，还极大地优化了与 AI 和数据库的交互流程。以下是本次更新的核心亮点，欢迎大家使用反馈～
+🎉🎉🎉 Recently, we have focused on enhancing the flexibility and intelligent experience of our product, launching several practical new features. These features not only make configuration management more convenient but also significantly optimize interactions with AI and databases. Below are the key highlights of this update, and we welcome your feedback!
-🌟 GitHub：https://github.com/difizen/libro
+🌟 GitHub: [https://github.com/difizen/libro](https://github.com/difizen/libro)
-🌟 官网：https://libro.difizen.net/
+🌟 Official Website: [https://libro.difizen.net/](https://libro.difizen.net/)
-## 1. 支持 Prompt Cell
+## 1. Support for Prompt Cell
-Prompt Cell 是一种特殊的 notebook cell，通过这个 Cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中。
+The Prompt Cell is a special type of notebook cell that allows users to input natural language commands to invoke large models for inference and obtain the desired output. Its introduction reduces the need to write complex code and can be flexibly integrated into existing workflows.
-目前 libro 的 Prompt Cell：
+Currently, the Prompt Cell in Libro:
-- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展模型～
- - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
- - 基于 libro-ai 扩展自己的模型。
-- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中。
-- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage。
+- Includes built-in models such as ChatGPT, GPT-4, and DALL-E 3, and you can extend models in the following ways:
+ - Define variables for conversational objects like LLMs and agents based on Langchain, which can be used directly in the Prompt Cell.
+ - Expand your own models based on Libro-AI.
+- Supports the selection of chat identifiers, so that all Prompt Cells with the selected identifier are within the same chat context.
+- Allows saving the Prompt Cell as a variable, which is an AIMessage from Langchain.
-详情可看：[Prompt Cell 使用指南](../manual/prompt-cell.md)。
+For more details, please see the [Prompt Cell User Guide](../manual/prompt-cell.md).
-
+
-## 2. 支持 SQL Cell
+## 2. Support for SQL Cell
-我们引入了 SQL Cell 支持，用户可以直接在 notebook 环境中编写并执行 SQL 查询，访问和操作数据库。这一功能为数据分析、可视化、以及数据库驱动型应用开发带来了无缝的集成体验。
+We have introduced SQL Cell support, enabling users to write and execute SQL queries directly in the notebook environment, accessing and manipulating databases. This feature provides a seamless integration experience for data analysis, visualization, and database-driven application development.
-通过在 libro 中结合 SQL 和 Python，您可以：
+By combining SQL and Python in Libro, you can:
-- 直接配置内置支持 mysql、sqlite、postgresql 数据库连接。
-- 查询数据库，快速获取数据，支持把结果保存为 dataframe。
-- 使用 Python 对查询结果进行进一步的处理和可视化。
-- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+- Configure built-in support for connections to MySQL, SQLite, and PostgreSQL databases.
+- Query databases to quickly retrieve data, supporting the saving of results as dataframes.
+- Use Python for further processing and visualization of query results.
+- Combine SQL’s powerful querying capabilities with the dynamism of notebooks, enhancing development efficiency.
-详情可看：[SQL Cell 使用指南](../manual/sql-cell.md)。
+For more details, please see the [SQL Cell User Guide](../manual/sql-cell.md).
-
+
-## 3. 文件级别的配置能力
+## 3. File-Level Configuration Capabilities
-配置管理不再繁琐！我们引入了文件级别的配置功能，用户可以通过运行简单的一条命令 libro config generate，自动在用户目录下生成配置文件模板。目前支持数据库连接配置和大模型密钥配置。
+Configuration management is no longer cumbersome! We have introduced file-level configuration features, allowing users to automatically generate configuration file templates in their user directory by running the simple command `libro config generate`. Currently, it supports database connection configuration and large model key configuration.
-不仅如此，系统支持从多种路径中加载配置文件，提升了灵活性与适应性，包括：
+## 4. Support for Language Switching Between Chinese and English
-- 用户目录
-- 当前工作目录
-- 项目根目录
-- 环境变量
+We have also launched a language switching feature between Chinese and English. Users can easily switch to their preferred language interface, achieving localization of the development environment.
-## 4. 支持中英文语言切换
+
-我们还推出了中英文语言切换功能。用户可以在切换选择所需的语言界面，轻松实现开发环境的本地化。
+# Summary
-
+This version update brings comprehensive enhancements to several features. The file-level configuration capability greatly improves flexibility, while the Prompt Cell and SQL Cell enhance the usability of AI and database operations, respectively. The language switching feature provides users with a better localization experience. We will continue to iterate and introduce more features to enhance development efficiency, so stay tuned!
-# 总结
-
-这次版本更新带来了多项功能的全面提升，文件级别的配置能力大幅提高了灵活性，Prompt Cell 和 SQL Cell 分别加强了 AI 与数据库操作的易用性，语言切换功能则为用户提供了更好的本地化体验。未来我们将持续迭代，推出更多有助于提升开发效率的功能，敬请期待！
-
-如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+If you have any questions or suggestions about these new features, feel free to contact us or discuss them in the community.
💬 [Chat with us on Discord](https://discord.gg/RbZ9aEKK)
diff --git a/apps/docs/docs/updates/update20241014.zh-CN.md b/apps/docs/docs/updates/update20241014.zh-CN.md
new file mode 100644
index 00000000..fe7fe00f
--- /dev/null
+++ b/apps/docs/docs/updates/update20241014.zh-CN.md
@@ -0,0 +1,63 @@
+---
+title: 2024-10-14 更新
+order: 9999
+---
+
+# 2024-10-14
+
+🎉🎉🎉 近期，我们聚焦于提升产品的灵活性和智能化体验，推出了多个实用的新功能。这些功能不仅使配置管理更加便捷，还极大地优化了与 AI 和数据库的交互流程。以下是本次更新的核心亮点，欢迎大家使用反馈～
+
+🌟 GitHub: [https://github.com/difizen/libro](https://github.com/difizen/libro)
+
+🌟 官网：[https://libro.difizen.net/](https://libro.difizen.net/)
+
+## 1. 支持 Prompt Cell
+
+Prompt Cell 是一种特殊的 notebook cell，通过这个 Cell，用户只需要输入自然语言指令，就可以调用大模型进行推理，得到所需的输出结果。它的出现减少了编写复杂代码的需求，并且可以灵活地融入现有的工作流中。
+
+目前 libro 的 Prompt Cell：
+
+- 内置了 chatgpt、gpt4、dalle-3 模型，您还可以通过以下方式扩展模型～
+ - 基于 langchain 定义 llm、agent 等可对话对象的变量，他们可以直接用在 Prompt cell 中。
+ - 基于 libro-ai 扩展自己的模型。
+- 支持选择聊天标识，使得选择该聊天标识的 Prompt Cell 都在一个聊天上下文中。
+- 支持 Prompt Cell 保存为一个变量，该变量即为 langchain 的 AIMessage。
+
+详情可看：[Prompt Cell 使用指南](../manual/prompt-cell.md)。
+
+
+
+## 2. 支持 SQL Cell
+
+我们引入了 SQL Cell 支持，用户可以直接在 notebook 环境中编写并执行 SQL 查询，访问和操作数据库。这一功能为数据分析、可视化、以及数据库驱动型应用开发带来了无缝的集成体验。
+
+通过在 libro 中结合 SQL 和 Python，您可以：
+
+- 直接配置内置支持 mysql、sqlite、postgresql 数据库连接。
+- 查询数据库，快速获取数据，支持把结果保存为 dataframe。
+- 使用 Python 对查询结果进行进一步的处理和可视化。
+- 将 SQL 的强大查询能力与 Notebook 的动态性结合，提升开发效率。
+
+详情可看：[SQL Cell 使用指南](../manual/sql-cell.md)。
+
+
+
+## 3. 文件级别的配置能力
+
+配置管理不再繁琐！我们引入了文件级别的配置功能，用户可以通过运行简单的一条命令 libro config generate，自动在用户目录下生成配置文件模板。目前支持数据库连接配置和大模型密钥配置。
+
+## 4. 支持中英文语言切换
+
+我们还推出了中英文语言切换功能。用户可以在切换选择所需的语言界面，轻松实现开发环境的本地化。
+
+
+
+# 总结
+
+这次版本更新带来了多项功能的全面提升，文件级别的配置能力大幅提高了灵活性，Prompt Cell 和 SQL Cell 分别加强了 AI 与数据库操作的易用性，语言切换功能则为用户提供了更好的本地化体验。未来我们将持续迭代，推出更多有助于提升开发效率的功能，敬请期待！
+
+如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+
+💬 [Chat with us on Discord](https://discord.gg/RbZ9aEKK)
+
+🤗 [Join our DingTalk Q&A group](https://qr.dingtalk.com/action/joingroup?code=v1,k1,52f1gKWwsZBMrWjXHcQFlOJEQIbbrMO86Iulu3T3ePY=&_dt_no_comment=1&origin=11)
diff --git a/apps/docs/docs/updates/update20241101.md b/apps/docs/docs/updates/update20241101.md
index e73f9c54..2cf7c618 100644
--- a/apps/docs/docs/updates/update20241101.md
+++ b/apps/docs/docs/updates/update20241101.md
@@ -1,66 +1,66 @@
---
-title: 2024-11-01 更新
+title: Update on 2024-11-01
order: 9998
---
# 2024-11-01
-# 🚀 全新上线！AI 编程助手助力你的 Notebook 体验！
+# 🚀 Brand New Launch! AI Programming Assistant Enhances Your Notebook Experience!
-Libro AI 编程助手正式上线！集成了多种智能功能，旨在提升你的编程效率和学习体验，以下是本次更新的核心内容，快来体验，让你的编程之旅更轻松、高效！
+The Libro AI Programming Assistant is officially live! It integrates various intelligent features designed to improve your programming efficiency and learning experience. Here are the key highlights of this update—come and experience it to make your programming journey easier and more efficient!
-- 错误修复：修复代码中的错误，助你轻松解决编程难题。
-- AI 对话：与 AI 进行智能对话，获取实时反馈和建议，让编程变得更加顺畅。
-- 代码解释：对复杂代码提供详细解释，帮助你深入理解每一行代码的含义。
-- 代码优化：根据最佳实践提供优化建议，提升代码的性能与可读性。
+- **Error Fixing**: Fix errors in your code to help you easily resolve programming challenges.
+- **AI Chat**: Engage in intelligent conversations with AI to receive real-time feedback and suggestions, making coding smoother.
+- **Code Explanation**: Get detailed explanations for complex code, helping you understand the meaning of each line.
+- **Code Optimization**: Receive optimization suggestions based on best practices to enhance your code’s performance and readability.
-🌟 GitHub：https://github.com/difizen/libro
+🌟 GitHub: [https://github.com/difizen/libro](https://github.com/difizen/libro)
-🌟 官网：https://libro.difizen.net/
+🌟 Official Website: [https://libro.difizen.net/](https://libro.difizen.net/)
-## 新特性
+## New Features
-### 错误修复
+### Error Fixing
-当 Cell 执行出现报错时，只需一键点击 “AI 修复” 按钮，助手会自动分析错误并给出修复建议，帮助你快速解决问题，恢复顺利的编程体验。
+When a Cell execution results in an error, simply click the “AI Fix” button. The assistant will automatically analyze the error and provide repair suggestions, helping you quickly resolve the issue and restore a smooth programming experience.
-
+
-### AI 对话
+### AI Chat
-**Cell 上下文对话**：你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+**Cell Context Chat**: You can interact directly with AI to receive in-depth answers and optimization suggestions related to the current code, boosting your programming efficiency.
-
+
-**通用 AI 对话**：你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+**General AI Chat**: Engage in open conversations with AI to ask programming-related questions and receive advice and information, enjoying the fun of intelligent interaction.
-
+
-### 代码解释
+### Code Explanation
-AI 编程助手帮助你理解 Cell 中代码的功能和逻辑，让编程学习变得更加轻松。
+The AI Programming Assistant helps you understand the functions and logic of the code in the Cell, making programming learning much easier.
-
+
-### 代码优化
+### Code Optimization
-AI 编程助手能够分析单元格（cell）中的代码，并提供优化建议。它将帮助你识别潜在的性能瓶颈和改进点，让你的代码更加高效、可读，提升整体编程体验。
+The AI Programming Assistant can analyze the code within cells and provide optimization suggestions. It will help you identify potential performance bottlenecks and improvement points, making your code more efficient and readable, enhancing your overall programming experience.
-
+
-## 历史修复
+## History of Fixes
-1. Sql Cell 高亮问题
-2. 折叠 Markdown Cell 后新建单元格错位
-3. tqdm 进度条完成后无法及时清除
-4. `libro config generate` 生成配置文件失效
-5. 浏览器旧版的缓存问题
+1. SQL Cell highlighting issue
+2. New cells misalignment after collapsing Markdown Cells
+3. `tqdm` progress bar not clearing promptly after completion
+4. `libro config generate` generating configuration files not working
+5. Cache issues with older browser versions
-## 总结
+## Summary
-这次版本带来全新的编程助手，通过智能错误修复、AI 对话、代码解释和优化功能，为你的 Notebook 编程体验提供全方位支持，助力你高效、轻松地实现编程目标！未来我们将持续迭代，推出更多实用的功能，敬请期待！
+This version brings a brand-new programming assistant, providing comprehensive support for your Notebook programming experience through intelligent error fixing, AI chat, code explanation, and optimization features, helping you achieve your programming goals efficiently and easily! We will continue to iterate and introduce more practical features in the future, so stay tuned!
-如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+If you have any questions or suggestions about these new features, feel free to contact us or discuss them in the community.
💬 [Chat with us on Discord](https://discord.gg/B4V7AWy4)
diff --git a/apps/docs/docs/updates/update20241101.zh-CN.md b/apps/docs/docs/updates/update20241101.zh-CN.md
new file mode 100644
index 00000000..e73f9c54
--- /dev/null
+++ b/apps/docs/docs/updates/update20241101.zh-CN.md
@@ -0,0 +1,67 @@
+---
+title: 2024-11-01 更新
+order: 9998
+---
+
+# 2024-11-01
+
+# 🚀 全新上线！AI 编程助手助力你的 Notebook 体验！
+
+Libro AI 编程助手正式上线！集成了多种智能功能，旨在提升你的编程效率和学习体验，以下是本次更新的核心内容，快来体验，让你的编程之旅更轻松、高效！
+
+- 错误修复：修复代码中的错误，助你轻松解决编程难题。
+- AI 对话：与 AI 进行智能对话，获取实时反馈和建议，让编程变得更加顺畅。
+- 代码解释：对复杂代码提供详细解释，帮助你深入理解每一行代码的含义。
+- 代码优化：根据最佳实践提供优化建议，提升代码的性能与可读性。
+
+🌟 GitHub：https://github.com/difizen/libro
+
+🌟 官网：https://libro.difizen.net/
+
+## 新特性
+
+### 错误修复
+
+当 Cell 执行出现报错时，只需一键点击 “AI 修复” 按钮，助手会自动分析错误并给出修复建议，帮助你快速解决问题，恢复顺利的编程体验。
+
+
+
+### AI 对话
+
+**Cell 上下文对话**：你可以直接与 AI 进行互动，获得与当前代码相关的深入解答和优化建议，提升编程效率。
+
+
+
+**通用 AI 对话**：你可以与 AI 进行开放式对话，询问编程相关问题，获取建议和信息，享受智能互动的乐趣。
+
+
+
+### 代码解释
+
+AI 编程助手帮助你理解 Cell 中代码的功能和逻辑，让编程学习变得更加轻松。
+
+
+
+### 代码优化
+
+AI 编程助手能够分析单元格（cell）中的代码，并提供优化建议。它将帮助你识别潜在的性能瓶颈和改进点，让你的代码更加高效、可读，提升整体编程体验。
+
+
+
+## 历史修复
+
+1. Sql Cell 高亮问题
+2. 折叠 Markdown Cell 后新建单元格错位
+3. tqdm 进度条完成后无法及时清除
+4. `libro config generate` 生成配置文件失效
+5. 浏览器旧版的缓存问题
+
+## 总结
+
+这次版本带来全新的编程助手，通过智能错误修复、AI 对话、代码解释和优化功能，为你的 Notebook 编程体验提供全方位支持，助力你高效、轻松地实现编程目标！未来我们将持续迭代，推出更多实用的功能，敬请期待！
+
+如果您对这些新功能有任何问题或建议，欢迎联系我们或在社区中讨论。
+
+💬 [Chat with us on Discord](https://discord.gg/B4V7AWy4)
+
+🤗 [Join our DingTalk Q&A group](https://qr.dingtalk.com/action/joingroup?code=v1,k1,52f1gKWwsZBMrWjXHcQFlOJEQIbbrMO86Iulu3T3ePY=&_dt_no_comment=1&origin=11)