@langgraph-js/sdk 2.0.1 → 2.2.0

package/dist/LangGraphClient.d.ts

@@ -148,15 +148,13 @@ export declare class LangGraphClient<TStateType = unknown, TUpdateType = TStateT
             supersteps?: Array<{
                 updates: Array<{
                     values: unknown;
-                    command? /** 值更新事件 */: Command;
+                    command?: Command;
                     asNode: string;
                 }>;
             }>;
         }): Promise<Thread<TStateType>>;
         search(query?: {
-            metadata
-            /** Thread 创建事件 */
-            ? /** Thread 创建事件 */: import("@langchain/langgraph-sdk").Metadata;
+            metadata?: import("@langchain/langgraph-sdk").Metadata;
             limit?: number;
             offset?: number;
             status?: import("@langchain/langgraph-sdk").ThreadStatus;
@@ -221,8 +219,9 @@ export declare class LangGraphClient<TStateType = unknown, TUpdateType = TStateT
      * @zh 创建一个新的 Thread。
      * @en Creates a new Thread.
      */
-    createThread({ threadId, }?: {
+    createThread({ threadId, graphId, }?: {
         threadId?: string;
+        graphId?: string;
     }): Promise<Thread<TStateType>>;
     graphVisualize(): Promise<import("@langchain/langgraph-sdk").AssistantGraph>;
     /**
@@ -259,6 +258,13 @@ export declare class LangGraphClient<TStateType = unknown, TUpdateType = TStateT
      * @en Cancels the current Run.
      */
     cancelRun(): void;
+    /**
+     * @zh 回滚到指定的消息。但是不会触发数据的重新更新
+     * @en Reverts to the specified message.
+     */
+    revertChatTo(messageId: string): Promise<{
+        messages: Message[];
+    }>;
     /**
      * @zh 发送消息到 LangGraph 后端。
      * @en Sends a message to the LangGraph backend.

package/dist/LangGraphClient.js

@@ -1,6 +1,7 @@
 import { EventEmitter } from "eventemitter3";
 import { ToolManager } from "./ToolManager.js";
 import { MessageProcessor } from "./MessageProcessor.js";
+import { revertChatTo } from "./time-travel/index.js";
 /**
  * @zh LangGraphClient 类是与 LangGraph 后端交互的主要客户端。
  * @en The LangGraphClient class is the main client for interacting with the LangGraph backend.
@@ -73,10 +74,11 @@ export class LangGraphClient extends EventEmitter {
      * @zh 创建一个新的 Thread。
      * @en Creates a new Thread.
      */
-    async createThread({ threadId, } = {}) {
+    async createThread({ threadId, graphId, } = {}) {
         try {
             this.currentThread = await this.threads.create({
                 threadId,
+                graphId,
             });
             return this.currentThread;
         }
@@ -185,6 +187,17 @@ export class LangGraphClient extends EventEmitter {
             this.runs.cancel(this.currentThread.thread_id, this.currentRun.run_id);
         }
     }
+    /**
+     * @zh 回滚到指定的消息。但是不会触发数据的重新更新
+     * @en Reverts to the specified message.
+     */
+    async revertChatTo(messageId) {
+        const { state, checkpoint } = await revertChatTo(this.client, this.currentThread.thread_id, messageId);
+        this.graphState = state;
+        this.messageProcessor.clearStreamingMessages();
+        this.messageProcessor.setGraphMessages(state.messages);
+        return state;
+    }
     /**
      * @zh 发送消息到 LangGraph 后端。
      * @en Sends a message to the LangGraph backend.
@@ -195,7 +208,7 @@ export class LangGraphClient extends EventEmitter {
             throw new Error("Thread or Assistant not initialized");
         }
         if (!this.currentThread) {
-            await this.createThread();
+            await this.createThread({ graphId: this.currentAssistant.graph_id });
             this.emit("thread", {
                 event: "thread/create",
                 data: {

package/dist/time-travel/index.d.ts

@@ -0,0 +1,11 @@
+import { Client, Message } from "@langchain/langgraph-sdk";
+export declare function revertChatTo(client: Client<{
+    messages: Message[];
+}, {
+    messages: Message[];
+}, unknown>, threadId: string, messageId: string): Promise<{
+    state: {
+        messages: Message[];
+    };
+    checkpoint: Pick<import("@langchain/langgraph-sdk").Config, "configurable">;
+}>;

package/dist/time-travel/index.js

@@ -0,0 +1,30 @@
+export async function revertChatTo(client, threadId, messageId) {
+    const thread = await client.threads.get(threadId);
+    const messages = thread.values.messages;
+    const idx = messages.findIndex((message) => message.id === messageId);
+    if (idx === -1) {
+        throw new Error(`Message id ${messageId} not found`);
+    }
+    const removeMessages = messages.slice(idx + 1);
+    const state = {
+        ...thread.values,
+        messages: removeMessages.map((i) => {
+            // sb langgraph 官方实现都不能正常工作
+            // return new RemoveMessage({ id: i.id! }).toJSON();
+            return {
+                type: "remove",
+                id: i.id,
+            };
+        }),
+    };
+    const res = await client.threads.updateState(threadId, {
+        values: state,
+    });
+    // client.runs.wait();
+    return {
+        state: {
+            messages: messages.slice(0, idx + 1),
+        },
+        checkpoint: res,
+    };
+}

package/dist/types.d.ts

@@ -20,7 +20,7 @@ export type TypedAsyncGenerator<TStateType = unknown, TUpdateType = TStateType,
 /**
  * 兼容 LangGraph SDK 的接口定义，方便进行无侵入式的扩展
  */
-export interface ILangGraphClient<TStateType = unknown, TUpdateType = TStateType> {
+export interface ILangGraphClient<TStateType = {}, TUpdateType = TStateType> {
     assistants: {
         search(query?: {
             graphId?: string;

package/dist/ui-store/createChatStore.d.ts

@@ -53,7 +53,7 @@ export declare const createChatStore: (initClientName: string, config: Partial<L
         setTools(new_tools: UnionTool<any>[]): void;
         isFELocking(): boolean | undefined;
         initClient: () => Promise<LangGraphClient<unknown, unknown>>;
-        sendMessage: (message?: Message[], extraData?: SendMessageOptions) => Promise<void>;
+        sendMessage: (message?: Message[], extraData?: SendMessageOptions, withoutCheck?: boolean) => Promise<void>;
         stopGeneration: () => void;
         toggleToolCollapse: (toolId: string) => void;
         toggleHistoryVisible: () => void;
@@ -61,6 +61,11 @@ export declare const createChatStore: (initClientName: string, config: Partial<L
         addToHistory: (thread: Thread<{
             messages: Message[];
         }>) => void;
+        /**
+         * @zh 回滚到指定的消息。
+         * @en Reverts to the specified message.
+         */
+        revertChatTo(messageId: string, resend?: boolean, sendOptions?: SendMessageOptions): Promise<void>;
         /**
          * @zh 设置用户输入内容。
          * @en Sets the user input content.

package/dist/ui-store/createChatStore.js

@@ -158,15 +158,25 @@ export const createChatStore = (initClientName, config, context = {}) => {
      * @zh 发送消息。
      * @en Sends a message.
      */
-    const sendMessage = async (message, extraData) => {
-        var _a;
-        if ((!userInput.get().trim() && !(message === null || message === void 0 ? void 0 : message.length)) || loading.get() || !client.get())
+    const sendMessage = async (message, extraData, withoutCheck = false) => {
+        var _a, _b;
+        if ((!withoutCheck && !userInput.get().trim() && !(message === null || message === void 0 ? void 0 : message.length)) || loading.get() || !client.get())
             return;
         loading.set(true);
         inChatError.set(null);
-        await ((_a = client.get()) === null || _a === void 0 ? void 0 : _a.sendMessage(message || userInput.get(), extraData));
-        userInput.set("");
-        loading.set(false);
+        try {
+            await ((_a = client.get()) === null || _a === void 0 ? void 0 : _a.sendMessage(message || userInput.get(), extraData));
+        }
+        catch (e) {
+            const isThreadRunning = e.message.includes("422");
+            if (isThreadRunning) {
+                await ((_b = client.get()) === null || _b === void 0 ? void 0 : _b.resetStream());
+            }
+        }
+        finally {
+            userInput.set("");
+            loading.set(false);
+        }
     };
     /**
      * @zh 停止当前的消息生成。
@@ -259,6 +269,20 @@ export const createChatStore = (initClientName, config, context = {}) => {
             toggleHistoryVisible,
             refreshHistoryList,
             addToHistory,
+            /**
+             * @zh 回滚到指定的消息。
+             * @en Reverts to the specified message.
+             */
+            async revertChatTo(messageId, resend = false, sendOptions) {
+                var _a;
+                await ((_a = client.get()) === null || _a === void 0 ? void 0 : _a.revertChatTo(messageId));
+                if (resend) {
+                    return sendMessage([], sendOptions, true);
+                }
+                else {
+                    updateUI(client.get());
+                }
+            },
             /**
              * @zh 设置用户输入内容。
              * @en Sets the user input content.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@langgraph-js/sdk",
-  "version": "2.0.1",
+  "version": "2.2.0",
   "description": "The UI SDK for LangGraph - seamlessly integrate your AI agents with frontend interfaces",
   "main": "dist/index.js",
   "type": "module",

package/src/LangGraphClient.ts

@@ -4,6 +4,7 @@ import { ToolManager } from "./ToolManager.js";
 import { CallToolResult } from "./tool/createTool.js";
 import { ILangGraphClient } from "./types.js";
 import { MessageProcessor } from "./MessageProcessor.js";
+import { revertChatTo } from "./time-travel/index.js";
 
 export type RenderMessage = Message & {
     /** 对于 AIMessage 来说是节点名称，对于工具节点来说是工具名称 */
@@ -164,12 +165,15 @@ export class LangGraphClient<TStateType = unknown, TUpdateType = TStateType> ext
      */
     async createThread({
         threadId,
+        graphId,
     }: {
         threadId?: string;
+        graphId?: string;
     } = {}) {
         try {
             this.currentThread = await this.threads.create({
                 threadId,
+                graphId,
             });
             return this.currentThread;
         } catch (error) {
@@ -284,6 +288,17 @@ export class LangGraphClient<TStateType = unknown, TUpdateType = TStateType> ext
             this.runs.cancel((this.currentThread as any)!.thread_id, this.currentRun.run_id);
         }
     }
+    /**
+     * @zh 回滚到指定的消息。但是不会触发数据的重新更新
+     * @en Reverts to the specified message.
+     */
+    async revertChatTo(messageId: string) {
+        const { state, checkpoint } = await revertChatTo(this.client as any, this.currentThread!.thread_id, messageId);
+        this.graphState = state;
+        this.messageProcessor.clearStreamingMessages();
+        this.messageProcessor.setGraphMessages(state.messages! as RenderMessage[]);
+        return state;
+    }
     /**
      * @zh 发送消息到 LangGraph 后端。
      * @en Sends a message to the LangGraph backend.
@@ -293,7 +308,7 @@ export class LangGraphClient<TStateType = unknown, TUpdateType = TStateType> ext
             throw new Error("Thread or Assistant not initialized");
         }
         if (!this.currentThread) {
-            await this.createThread();
+            await this.createThread({ graphId: this.currentAssistant!.graph_id });
             this.emit("thread", {
                 event: "thread/create",
                 data: {

package/src/time-travel/index.ts

@@ -0,0 +1,33 @@
+import { RemoveMessage } from "@langchain/core/messages";
+import { Client, Message } from "@langchain/langgraph-sdk";
+
+export async function revertChatTo(client: Client<{ messages: Message[] }, { messages: Message[] }, unknown>, threadId: string, messageId: string) {
+    const thread = await client.threads.get(threadId);
+    const messages = thread.values.messages;
+    const idx = messages.findIndex((message) => message.id === messageId);
+    if (idx === -1) {
+        throw new Error(`Message id ${messageId} not found`);
+    }
+    const removeMessages = messages.slice(idx + 1);
+    const state = {
+        ...thread.values,
+        messages: removeMessages.map((i) => {
+            // sb langgraph 官方实现都不能正常工作
+            // return new RemoveMessage({ id: i.id! }).toJSON();
+            return {
+                type: "remove",
+                id: i.id!,
+            };
+        }),
+    };
+    const res = await client.threads.updateState(threadId, {
+        values: state,
+    });
+    // client.runs.wait();
+    return {
+        state: {
+            messages: messages.slice(0, idx + 1),
+        },
+        checkpoint: res,
+    };
+}

package/src/types.ts

@@ -52,7 +52,7 @@ export type TypedAsyncGenerator<TStateType = unknown, TUpdateType = TStateType,
 /**
  * 兼容 LangGraph SDK 的接口定义，方便进行无侵入式的扩展
  */
-export interface ILangGraphClient<TStateType = unknown, TUpdateType = TStateType> {
+export interface ILangGraphClient<TStateType = {}, TUpdateType = TStateType> {
     assistants: {
         search(query?: { graphId?: string; metadata?: Metadata; limit?: number; offset?: number; sortBy?: AssistantSortBy; sortOrder?: SortOrder }): Promise<Assistant[]>;
         getGraph(assistantId: string, options?: { xray?: boolean | number }): Promise<AssistantGraph>;

package/src/ui-store/createChatStore.ts

@@ -167,16 +167,22 @@ export const createChatStore = (
      * @zh 发送消息。
      * @en Sends a message.
      */
-    const sendMessage = async (message?: Message[], extraData?: SendMessageOptions) => {
-        if ((!userInput.get().trim() && !message?.length) || loading.get() || !client.get()) return;
+    const sendMessage = async (message?: Message[], extraData?: SendMessageOptions, withoutCheck = false) => {
+        if ((!withoutCheck && !userInput.get().trim() && !message?.length) || loading.get() || !client.get()) return;
 
         loading.set(true);
         inChatError.set(null);
-
-        await client.get()?.sendMessage(message || userInput.get(), extraData);
-
-        userInput.set("");
-        loading.set(false);
+        try {
+            await client.get()?.sendMessage(message || userInput.get(), extraData);
+        } catch (e) {
+            const isThreadRunning = (e as Error).message.includes("422");
+            if (isThreadRunning) {
+                await client.get()?.resetStream();
+            }
+        } finally {
+            userInput.set("");
+            loading.set(false);
+        }
     };
 
     /**
@@ -270,6 +276,18 @@ export const createChatStore = (
             toggleHistoryVisible,
             refreshHistoryList,
             addToHistory,
+            /**
+             * @zh 回滚到指定的消息。
+             * @en Reverts to the specified message.
+             */
+            async revertChatTo(messageId: string, resend = false, sendOptions?: SendMessageOptions) {
+                await client.get()?.revertChatTo(messageId);
+                if (resend) {
+                    return sendMessage([], sendOptions, true);
+                } else {
+                    updateUI(client.get()!);
+                }
+            },
             /**
              * @zh 设置用户输入内容。
              * @en Sets the user input content.