@langgraph-js/sdk 4.0.0 → 4.1.0

package/.turbo/turbo-build.log

@@ -1,5 +0,0 @@
-
-
-> @langgraph-js/sdk@1.6.4 build /Users/konghayao/code/ai/YaoAgent/apps/langgraph-client
-> tsc
-

package/dist/LangGraphClient.d.ts

@@ -107,6 +107,10 @@ export interface LangGraphEvents {
     done: {
         event: "done";
     };
+    /** 中断事件 */
+    interruptChange: {
+        event: "interruptChange";
+    };
 }
 /**
  * @zh LangGraphClient 类是与 LangGraph 后端交互的主要客户端。
@@ -132,7 +136,10 @@ export declare class LangGraphClient<TStateType = unknown> extends EventEmitter<
     /** 代理 assistants 属性到内部 client */
     get assistants(): {
         search(query?: {
-            graphId?: string;
+            graphId? /**
+             * The maximum number of retries that can be made for a single call,
+             * with an exponential backoff between each attempt. Defaults to 6.
+             */: string;
             metadata?: import("@langchain/langgraph-sdk").Metadata;
             limit?: number;
             offset?: number;
@@ -232,6 +239,8 @@ export declare class LangGraphClient<TStateType = unknown> extends EventEmitter<
     }>;
     messagesMetadata: {};
     humanInTheLoop: HumanInTheLoopState | null;
+    /** 此 interruptData 不包括 humanInTheLoop 的数据 */
+    interruptData: any | null;
     /**
      * @zh 发送消息到 LangGraph 后端。
      * @en Sends a message to the LangGraph backend.
@@ -254,6 +263,7 @@ export declare class LangGraphClient<TStateType = unknown> extends EventEmitter<
      */
     private processStreamChunk;
     private runFETool;
+    private getHumanInTheLoopData;
     private responseHumanInTheLoop;
     private callFETool;
     extraParams: Record<string, any>;

package/dist/LangGraphClient.js

@@ -4,6 +4,7 @@ import { createActionRequestID } from "./humanInTheLoop.js";
 import { MessageProcessor } from "./MessageProcessor.js";
 import { revertChatTo } from "./time-travel/index.js";
 import camelcaseKeys from "camelcase-keys";
+import z from "zod";
 /**
  * @zh LangGraphClient 类是与 LangGraph 后端交互的主要客户端。
  * @en The LangGraphClient class is the main client for interacting with the LangGraph backend.
@@ -116,6 +117,8 @@ export class LangGraphClient extends EventEmitter {
             sortBy: options.sortBy || "updated_at",
             offset: options.offset || 0,
             limit: options.limit || 10,
+            /** @ts-ignore: 用于删除不需要的字段 */
+            without_details: true,
         });
     }
     async deleteThread(threadId) {
@@ -212,6 +215,8 @@ export class LangGraphClient extends EventEmitter {
     }
     messagesMetadata = {};
     humanInTheLoop = null;
+    /** 此 interruptData 不包括 humanInTheLoop 的数据 */
+    interruptData = null;
     /**
      * @zh 发送消息到 LangGraph 后端。
      * @en Sends a message to the LangGraph backend.
@@ -229,6 +234,12 @@ export class LangGraphClient extends EventEmitter {
                 },
             });
         }
+        if (this.interruptData) {
+            this.interruptData = null;
+            this.emit("interruptChange", {
+                event: "interruptChange",
+            });
+        }
         const messagesToSend = Array.isArray(input)
             ? input
             : [
@@ -335,30 +346,16 @@ export class LangGraphClient extends EventEmitter {
             const data = chunk.data;
             if (data?.__interrupt__) {
                 this._status = "interrupted";
-                const humanInTheLoop = data?.__interrupt__.map((i) => {
-                    // 修复 python 版本是以下划线命名的，而 js 版本是以驼峰命名的
-                    if (i && "review_configs" in i.value) {
-                        return {
-                            id: i.id,
-                            value: {
-                                /** @ts-ignore */
-                                actionRequests: i.value.action_requests,
-                                reviewConfigs: camelcaseKeys(i.value.review_configs, { deep: true }),
-                            },
-                        };
-                    }
-                    return i;
-                });
-                humanInTheLoop.forEach((i) => {
-                    i.value.actionRequests.forEach((j) => {
-                        j.id = j.id || createActionRequestID(j);
-                    });
-                    return i;
+                const humanInTheLoopData = this.getHumanInTheLoopData(data?.__interrupt__);
+                if (humanInTheLoopData) {
+                    this.humanInTheLoop = humanInTheLoopData;
+                }
+                else {
+                    this.interruptData = data.__interrupt__;
+                }
+                this.emit("interruptChange", {
+                    event: "interruptChange",
                 });
-                this.humanInTheLoop = {
-                    interruptData: humanInTheLoop,
-                    result: {},
-                };
             }
             else if (data?.messages) {
                 const isResume = !!command?.resume;
@@ -401,6 +398,45 @@ export class LangGraphClient extends EventEmitter {
             return Promise.all(result);
         }
     }
+    getHumanInTheLoopData(interruptData) {
+        const humanInTheLoopData = z
+            .array(z.object({
+            id: z.string(),
+            value: z.union([
+                z.object({
+                    review_configs: z.array(z.any()),
+                }),
+                z.object({ reviewConfigs: z.array(z.any()) }),
+            ]),
+        }))
+            .safeParse(interruptData);
+        if (humanInTheLoopData.success) {
+            const humanInTheLoop = interruptData.map((i) => {
+                // 修复 python 版本是以下划线命名的，而 js 版本是以驼峰命名的
+                if (i && "review_configs" in i.value) {
+                    return {
+                        id: i.id,
+                        value: {
+                            /** @ts-ignore */
+                            actionRequests: i.value.action_requests,
+                            reviewConfigs: camelcaseKeys(i.value.review_configs, { deep: true }),
+                        },
+                    };
+                }
+                return i;
+            });
+            humanInTheLoop.forEach((i) => {
+                i.value.actionRequests.forEach((j) => {
+                    j.id = j.id || createActionRequestID(j);
+                });
+                return i;
+            });
+            return {
+                interruptData: humanInTheLoop,
+                result: {},
+            };
+        }
+    }
     async responseHumanInTheLoop() {
         if (this.humanInTheLoop) {
             const humanInTheLoop = this.humanInTheLoop;

package/dist/client/LanggraphServer.js

@@ -1,4 +1,21 @@
 import { Client } from "@langchain/langgraph-sdk";
 export const createLangGraphServerClient = async (config) => {
-    return new Client(config);
+    const client = new Client(config);
+    client.threads.search = function (query) {
+        return this.fetch("/threads/search", {
+            method: "POST",
+            json: {
+                metadata: (query == null ? void 0 : query.metadata) ?? void 0,
+                ids: (query == null ? void 0 : query.ids) ?? void 0,
+                limit: (query == null ? void 0 : query.limit) ?? 10,
+                offset: (query == null ? void 0 : query.offset) ?? 0,
+                status: query == null ? void 0 : query.status,
+                sort_by: query == null ? void 0 : query.sortBy,
+                sort_order: query == null ? void 0 : query.sortOrder,
+                select: (query == null ? void 0 : query.select) ?? void 0,
+                without_details: (query == null ? void 0 : query.without_details) ?? false,
+            },
+        });
+    }.bind(client.threads);
+    return client;
 };

package/dist/react/ChatContext.d.ts

@@ -16,6 +16,8 @@ export declare const useChat: () => UnionStore<{
         currentAgent: import("nanostores").PreinitializedWritableAtom<string> & object;
         currentChatId: import("nanostores").PreinitializedWritableAtom<string | null> & object;
         currentNodeName: import("nanostores").PreinitializedWritableAtom<string> & object;
+        interruptData: import("nanostores").PreinitializedWritableAtom<import("../humanInTheLoop.js").InterruptData | null> & object;
+        isInterrupted: import("nanostores").PreinitializedWritableAtom<boolean> & object;
         tools: import("nanostores").PreinitializedWritableAtom<import("../index.js").UnionTool<any, Object, any>[]> & object;
         collapsedTools: import("nanostores").PreinitializedWritableAtom<string[]> & object;
         showGraph: import("nanostores").PreinitializedWritableAtom<boolean> & object;
@@ -35,7 +37,7 @@ export declare const useChat: () => UnionStore<{
         createNewSession: () => Promise<void>;
         refreshSessionList: () => Promise<void>;
         refreshHistoryList: () => Promise<void>;
-        sendMessage: (message?: import("@langchain/langgraph-sdk").Message[], extraData?: import("../LangGraphClient.js").SendMessageOptions, withoutCheck?: boolean) => Promise<void>;
+        sendMessage: (message?: import("@langchain/langgraph-sdk").Message[], extraData?: import("../LangGraphClient.js").SendMessageOptions, withoutCheck?: boolean, isResume?: boolean) => Promise<void>;
         stopGeneration: () => void;
         setUserInput: (input: string) => void;
         revertChatTo(messageId: string, resend?: boolean, sendOptions?: import("../LangGraphClient.js").SendMessageOptions & import("../time-travel/index.js").RevertChatToOptions): Promise<void>;
@@ -48,6 +50,7 @@ export declare const useChat: () => UnionStore<{
         toggleGraphVisible(): void;
         refreshGraph: () => Promise<void>;
         setCurrentAgent(agent: string): Promise<import("../History.js").History>;
+        resumeFromInterrupt(data: any): Promise<void>;
         addToHistory: (thread: import("@langchain/langgraph-sdk").Thread<{
             messages: import("@langchain/langgraph-sdk").Message[];
         }>) => void;

package/dist/tool/ToolUI.d.ts

@@ -45,7 +45,7 @@ export declare class ToolRenderData<I, D> {
     } | null;
     /** 发送恢复状态的数据 */
     sendResumeData(response: HumanInTheLoopDecision): void;
-    get state(): "idle" | "done" | "loading";
+    get state(): "idle" | "interrupted" | "done" | "loading";
     get input(): I | null;
     get output(): string;
     getJSONOutput(): D;

package/dist/tool/ToolUI.js

@@ -54,7 +54,7 @@ export class ToolRenderData {
             return "done";
         }
         if (this.client.status === "interrupted" && humanInTheLoopData?.actionRequest) {
-            return "done";
+            return "interrupted";
         }
         if (this.message.tool_input) {
             return "loading";

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

@@ -3,6 +3,7 @@ import { AssistantGraph, Message, Thread } from "@langchain/langgraph-sdk";
 import { UnionTool } from "../tool/createTool.js";
 import { RevertChatToOptions } from "../time-travel/index.js";
 import { History, SessionInfo } from "../History.js";
+import { InterruptData } from "../humanInTheLoop.js";
 export declare const formatTime: (date: Date) => string;
 export declare const formatTokens: (tokens: number) => string;
 export declare const getMessageContent: (content: any) => string;
@@ -30,6 +31,8 @@ export declare const createChatStore: (initClientName: string, config: Partial<L
         currentAgent: import("nanostores").PreinitializedWritableAtom<string> & object;
         currentChatId: import("nanostores").PreinitializedWritableAtom<string | null> & object;
         currentNodeName: import("nanostores").PreinitializedWritableAtom<string> & object;
+        interruptData: import("nanostores").PreinitializedWritableAtom<InterruptData | null> & object;
+        isInterrupted: import("nanostores").PreinitializedWritableAtom<boolean> & object;
         tools: import("nanostores").PreinitializedWritableAtom<UnionTool<any, Object, any>[]> & object;
         collapsedTools: import("nanostores").PreinitializedWritableAtom<string[]> & object;
         showGraph: import("nanostores").PreinitializedWritableAtom<boolean> & object;
@@ -49,7 +52,7 @@ export declare const createChatStore: (initClientName: string, config: Partial<L
         createNewSession: () => Promise<void>;
         refreshSessionList: () => Promise<void>;
         refreshHistoryList: () => Promise<void>;
-        sendMessage: (message?: Message[], extraData?: SendMessageOptions, withoutCheck?: boolean) => Promise<void>;
+        sendMessage: (message?: Message[], extraData?: SendMessageOptions, withoutCheck?: boolean, isResume?: boolean) => Promise<void>;
         stopGeneration: () => void;
         setUserInput: (input: string) => void;
         revertChatTo(messageId: string, resend?: boolean, sendOptions?: SendMessageOptions & RevertChatToOptions): Promise<void>;
@@ -62,6 +65,7 @@ export declare const createChatStore: (initClientName: string, config: Partial<L
         toggleGraphVisible(): void;
         refreshGraph: () => Promise<void>;
         setCurrentAgent(agent: string): Promise<History>;
+        resumeFromInterrupt(data: any): Promise<void>;
         addToHistory: (thread: Thread<{
             messages: Message[];
         }>) => void;

package/dist/ui-store/createChatStore.js

@@ -48,6 +48,9 @@ export const createChatStore = (initClientName, config, context = {}) => {
     const currentAgent = atom(initClientName);
     const currentChatId = atom(null);
     const currentNodeName = atom("__start__");
+    // Interrupt 状态
+    const interruptData = atom(null);
+    const isInterrupted = atom(false);
     // 工具和图表
     const tools = atom([]);
     const collapsedTools = atom([]);
@@ -62,7 +65,8 @@ export const createChatStore = (initClientName, config, context = {}) => {
     const updateLoadingFromClientStatus = () => {
         const c = client.get();
         if (c) {
-            loading.set(c.status === "busy");
+            // interrupted 状态也应该被视为 loading，因为用户需要处理中断
+            loading.set(c.status === "busy" || c.status === "interrupted");
         }
     };
     // ============ UI 更新逻辑 ============
@@ -182,12 +186,27 @@ export const createChatStore = (initClientName, config, context = {}) => {
                 updateUI(newClient);
             }
         };
+        const onInterrupted = (event) => {
+            if (!isActiveClient())
+                return;
+            const interruptInfo = newClient.interruptData;
+            if (interruptInfo) {
+                interruptData.set(interruptInfo);
+                isInterrupted.set(true);
+                updateLoadingFromClientStatus();
+            }
+            else {
+                interruptData.set(null);
+                isInterrupted.set(false);
+            }
+        };
         newClient.on("start", onStart);
         newClient.on("thread", onThread);
         newClient.on("done", onDone);
         newClient.on("error", onError);
         newClient.on("message", onMessage);
         newClient.on("value", onValue);
+        newClient.on("interruptChange", onInterrupted);
         return () => {
             newClient.off("start", onStart);
             newClient.off("thread", onThread);
@@ -195,6 +214,7 @@ export const createChatStore = (initClientName, config, context = {}) => {
             newClient.off("error", onError);
             newClient.off("message", onMessage);
             newClient.off("value", onValue);
+            newClient.off("interruptChange", onInterrupted);
         };
     }
     // ============ 会话激活逻辑 ============
@@ -208,6 +228,8 @@ export const createChatStore = (initClientName, config, context = {}) => {
                 cleanupCurrentClient = null;
             }
             inChatError.set(null);
+            interruptData.set(null);
+            isInterrupted.set(false);
             const session = await historyManager.activateSession(sessionId);
             const activeClient = session.client;
             if (activeClient) {
@@ -227,6 +249,14 @@ export const createChatStore = (initClientName, config, context = {}) => {
                 if (currentThread && (currentThread.status === "running" || currentThread.status === "pending")) {
                     await activeClient.resetStream();
                 }
+                // 检查是否处于中断状态
+                if (currentThread?.status === "interrupted") {
+                    const interruptInfo = activeClient.interruptData;
+                    if (interruptInfo) {
+                        interruptData.set(interruptInfo);
+                        isInterrupted.set(true);
+                    }
+                }
             }
         }
         catch (error) {
@@ -235,7 +265,7 @@ export const createChatStore = (initClientName, config, context = {}) => {
         }
     }
     // ============ 消息和交互逻辑 ============
-    async function sendMessage(message, extraData, withoutCheck = false) {
+    async function sendMessage(message, extraData, withoutCheck = false, isResume = false) {
         const c = client.get();
         if ((!withoutCheck && !userInput.get().trim() && !message?.length) || !c)
             return;
@@ -301,6 +331,9 @@ export const createChatStore = (initClientName, config, context = {}) => {
             currentAgent,
             currentChatId,
             currentNodeName,
+            // Interrupt 状态
+            interruptData,
+            isInterrupted,
             // 工具和图表
             tools,
             collapsedTools,
@@ -356,6 +389,13 @@ export const createChatStore = (initClientName, config, context = {}) => {
                 currentAgent.set(agent);
                 return initClient();
             },
+            resumeFromInterrupt(data) {
+                return sendMessage([], {
+                    command: {
+                        resume: data,
+                    },
+                }, true);
+            },
             // 历史记录（兼容旧 API）
             addToHistory,
             createNewChat: createNewSession,

package/dist/vue/ChatContext.d.ts

@@ -59,6 +59,8 @@ export declare const useChatProvider: (props: ChatProviderProps) => {
             currentAgent: PreinitializedWritableAtom<string> & object;
             currentChatId: PreinitializedWritableAtom<string | null> & object;
             currentNodeName: PreinitializedWritableAtom<string> & object;
+            interruptData: PreinitializedWritableAtom<import("../humanInTheLoop.js").InterruptData | null> & object;
+            isInterrupted: PreinitializedWritableAtom<boolean> & object;
             tools: PreinitializedWritableAtom<import("../index.js").UnionTool<any, Object, any>[]> & object;
             collapsedTools: PreinitializedWritableAtom<string[]> & object;
             showGraph: PreinitializedWritableAtom<boolean> & object;
@@ -78,7 +80,7 @@ export declare const useChatProvider: (props: ChatProviderProps) => {
             createNewSession: () => Promise<void>;
             refreshSessionList: () => Promise<void>;
             refreshHistoryList: () => Promise<void>;
-            sendMessage: (message?: import("@langchain/langgraph-sdk").Message[], extraData?: import("../LangGraphClient.js").SendMessageOptions, withoutCheck?: boolean) => Promise<void>;
+            sendMessage: (message?: import("@langchain/langgraph-sdk").Message[], extraData?: import("../LangGraphClient.js").SendMessageOptions, withoutCheck?: boolean, isResume?: boolean) => Promise<void>;
             stopGeneration: () => void;
             setUserInput: (input: string) => void;
             revertChatTo(messageId: string, resend?: boolean, sendOptions?: import("../LangGraphClient.js").SendMessageOptions & import("../time-travel/index.js").RevertChatToOptions): Promise<void>;
@@ -91,6 +93,7 @@ export declare const useChatProvider: (props: ChatProviderProps) => {
             toggleGraphVisible(): void;
             refreshGraph: () => Promise<void>;
             setCurrentAgent(agent: string): Promise<import("../History.js").History>;
+            resumeFromInterrupt(data: any): Promise<void>;
             addToHistory: (thread: import("@langchain/langgraph-sdk").Thread<{
                 messages: import("@langchain/langgraph-sdk").Message[];
             }>) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@langgraph-js/sdk",
-  "version": "4.0.0",
+  "version": "4.1.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

@@ -7,6 +7,7 @@ import { type ILangGraphClient } from "@langgraph-js/pure-graph/dist/types.js";
 import { MessageProcessor } from "./MessageProcessor.js";
 import { revertChatTo, RevertChatToOptions } from "./time-travel/index.js";
 import camelcaseKeys from "camelcase-keys";
+import z from "zod";
 export type RenderMessage = Message & {
     /** 对于 AIMessage 来说是节点名称，对于工具节点来说是工具名称 */
     name?: string;
@@ -91,6 +92,8 @@ export interface LangGraphEvents {
     thread: { event: "thread/create"; data: { thread: Thread } };
     /** 流完成事件 */
     done: { event: "done" };
+    /** 中断事件 */
+    interruptChange: { event: "interruptChange" };
 }
 
 /**
@@ -219,6 +222,8 @@ export class LangGraphClient<TStateType = unknown> extends EventEmitter<LangGrap
             sortBy: options.sortBy || "updated_at",
             offset: options.offset || 0,
             limit: options.limit || 10,
+            /** @ts-ignore: 用于删除不需要的字段 */
+            without_details: true,
         });
     }
     async deleteThread(threadId: string) {
@@ -326,6 +331,8 @@ export class LangGraphClient<TStateType = unknown> extends EventEmitter<LangGrap
     }
     public messagesMetadata = {};
     public humanInTheLoop: HumanInTheLoopState | null = null;
+    /** 此 interruptData 不包括 humanInTheLoop 的数据 */
+    public interruptData: any | null = null;
     /**
      * @zh 发送消息到 LangGraph 后端。
      * @en Sends a message to the LangGraph backend.
@@ -343,7 +350,12 @@ export class LangGraphClient<TStateType = unknown> extends EventEmitter<LangGrap
                 },
             });
         }
-
+        if (this.interruptData) {
+            this.interruptData = null;
+            this.emit("interruptChange", {
+                event: "interruptChange",
+            });
+        }
         const messagesToSend = Array.isArray(input)
             ? input
             : [
@@ -451,33 +463,17 @@ export class LangGraphClient<TStateType = unknown> extends EventEmitter<LangGrap
                       messages: Message[];
                   }
                 | undefined;
-
             if (data?.__interrupt__) {
                 this._status = "interrupted";
-                const humanInTheLoop = data?.__interrupt__.map((i) => {
-                    // 修复 python 版本是以下划线命名的，而 js 版本是以驼峰命名的
-                    if (i && "review_configs" in i.value) {
-                        return {
-                            id: i.id,
-                            value: {
-                                /** @ts-ignore */
-                                actionRequests: i.value.action_requests,
-                                reviewConfigs: camelcaseKeys(i.value.review_configs as any[], { deep: true }),
-                            },
-                        } as InterruptData[number];
-                    }
-                    return i;
-                });
-                humanInTheLoop.forEach((i) => {
-                    i.value.actionRequests.forEach((j) => {
-                        j.id = j.id || createActionRequestID(j);
-                    });
-                    return i;
+                const humanInTheLoopData = this.getHumanInTheLoopData(data?.__interrupt__);
+                if (humanInTheLoopData) {
+                    this.humanInTheLoop = humanInTheLoopData;
+                } else {
+                    this.interruptData = data.__interrupt__;
+                }
+                this.emit("interruptChange", {
+                    event: "interruptChange",
                 });
-                this.humanInTheLoop = {
-                    interruptData: humanInTheLoop,
-                    result: {},
-                };
             } else if (data?.messages) {
                 const isResume = !!command?.resume;
                 const isLongerThanLocal = data.messages.length >= this.messageProcessor.getGraphMessages().length;
@@ -518,6 +514,47 @@ export class LangGraphClient<TStateType = unknown> extends EventEmitter<LangGrap
             return Promise.all(result);
         }
     }
+    private getHumanInTheLoopData(interruptData: any) {
+        const humanInTheLoopData = z
+            .array(
+                z.object({
+                    id: z.string(),
+                    value: z.union([
+                        z.object({
+                            review_configs: z.array(z.any()),
+                        }),
+                        z.object({ reviewConfigs: z.array(z.any()) }),
+                    ]),
+                })
+            )
+            .safeParse(interruptData);
+        if (humanInTheLoopData.success) {
+            const humanInTheLoop: HumanInTheLoopState["interruptData"] = interruptData.map((i: any) => {
+                // 修复 python 版本是以下划线命名的，而 js 版本是以驼峰命名的
+                if (i && "review_configs" in i.value) {
+                    return {
+                        id: i.id,
+                        value: {
+                            /** @ts-ignore */
+                            actionRequests: i.value.action_requests,
+                            reviewConfigs: camelcaseKeys(i.value.review_configs as any[], { deep: true }),
+                        },
+                    } as InterruptData[number];
+                }
+                return i;
+            });
+            humanInTheLoop.forEach((i) => {
+                i.value.actionRequests.forEach((j) => {
+                    j.id = j.id || createActionRequestID(j);
+                });
+                return i;
+            });
+            return {
+                interruptData: humanInTheLoop,
+                result: {},
+            };
+        }
+    }
     private async responseHumanInTheLoop() {
         if (this.humanInTheLoop) {
             const humanInTheLoop = this.humanInTheLoop;

package/src/client/LanggraphServer.ts

@@ -2,5 +2,22 @@ import { LangGraphClientConfig } from "../LangGraphClient.js";
 import { type ILangGraphClient } from "@langgraph-js/pure-graph/dist/types.js";
 import { Client } from "@langchain/langgraph-sdk";
 export const createLangGraphServerClient = async (config: LangGraphClientConfig): Promise<ILangGraphClient> => {
-    return new Client(config) as ILangGraphClient;
+    const client = new Client(config) as ILangGraphClient;
+    client.threads.search = function (this: any, query: any) {
+        return this.fetch("/threads/search", {
+            method: "POST",
+            json: {
+                metadata: (query == null ? void 0 : query.metadata) ?? void 0,
+                ids: (query == null ? void 0 : query.ids) ?? void 0,
+                limit: (query == null ? void 0 : query.limit) ?? 10,
+                offset: (query == null ? void 0 : query.offset) ?? 0,
+                status: query == null ? void 0 : query.status,
+                sort_by: query == null ? void 0 : query.sortBy,
+                sort_order: query == null ? void 0 : query.sortOrder,
+                select: (query == null ? void 0 : query.select) ?? void 0,
+                without_details: (query == null ? void 0 : query.without_details) ?? false,
+            },
+        });
+    }.bind(client.threads);
+    return client;
 };

package/src/tool/ToolUI.ts

@@ -59,7 +59,7 @@ export class ToolRenderData<I, D> {
             return "done";
         }
         if (this.client.status === "interrupted" && humanInTheLoopData?.actionRequest) {
-            return "done";
+            return "interrupted";
         }
         if (this.message.tool_input) {
             return "loading";

package/src/ui-store/createChatStore.ts

@@ -8,6 +8,7 @@ import { createLangGraphServerClient } from "../client/LanggraphServer.js";
 import { useArtifacts } from "../artifacts/index.js";
 import { RevertChatToOptions } from "../time-travel/index.js";
 import { History, SessionInfo } from "../History.js";
+import { InterruptData, InterruptResponse } from "../humanInTheLoop.js";
 
 // ============ 工具函数 ============
 
@@ -68,6 +69,10 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
     const currentChatId = atom<string | null>(null);
     const currentNodeName = atom<string>("__start__");
 
+    // Interrupt 状态
+    const interruptData = atom<InterruptData | null>(null);
+    const isInterrupted = atom<boolean>(false);
+
     // 工具和图表
     const tools = atom<UnionTool<any>[]>([]);
     const collapsedTools = atom<string[]>([]);
@@ -87,7 +92,8 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
     const updateLoadingFromClientStatus = () => {
         const c = client.get();
         if (c) {
-            loading.set(c.status === "busy");
+            // interrupted 状态也应该被视为 loading，因为用户需要处理中断
+            loading.set(c.status === "busy" || c.status === "interrupted");
         }
     };
 
@@ -225,12 +231,27 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
             }
         };
 
+        const onInterrupted = (event: any) => {
+            if (!isActiveClient()) return;
+
+            const interruptInfo = newClient.interruptData;
+            if (interruptInfo) {
+                interruptData.set(interruptInfo);
+                isInterrupted.set(true);
+                updateLoadingFromClientStatus();
+            } else {
+                interruptData.set(null);
+                isInterrupted.set(false);
+            }
+        };
+
         newClient.on("start", onStart);
         newClient.on("thread", onThread);
         newClient.on("done", onDone);
         newClient.on("error", onError);
         newClient.on("message", onMessage);
         newClient.on("value", onValue);
+        newClient.on("interruptChange", onInterrupted);
 
         return () => {
             newClient.off("start", onStart);
@@ -239,6 +260,7 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
             newClient.off("error", onError);
             newClient.off("message", onMessage);
             newClient.off("value", onValue);
+            newClient.off("interruptChange", onInterrupted);
         };
     }
 
@@ -255,6 +277,8 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
             }
 
             inChatError.set(null);
+            interruptData.set(null);
+            isInterrupted.set(false);
 
             const session = await historyManager.activateSession(sessionId);
             const activeClient = session.client;
@@ -280,6 +304,15 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
                 if (currentThread && (currentThread.status === "running" || currentThread.status === "pending")) {
                     await activeClient.resetStream();
                 }
+
+                // 检查是否处于中断状态
+                if (currentThread?.status === "interrupted") {
+                    const interruptInfo = activeClient.interruptData;
+                    if (interruptInfo) {
+                        interruptData.set(interruptInfo);
+                        isInterrupted.set(true);
+                    }
+                }
             }
         } catch (error) {
             console.error("Failed to activate session:", error);
@@ -289,7 +322,7 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
 
     // ============ 消息和交互逻辑 ============
 
-    async function sendMessage(message?: Message[], extraData?: SendMessageOptions, withoutCheck = false) {
+    async function sendMessage(message?: Message[], extraData?: SendMessageOptions, withoutCheck = false, isResume = false) {
         const c = client.get();
         if ((!withoutCheck && !userInput.get().trim() && !message?.length) || !c) return;
 
@@ -361,6 +394,10 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
             currentChatId,
             currentNodeName,
 
+            // Interrupt 状态
+            interruptData,
+            isInterrupted,
+
             // 工具和图表
             tools,
             collapsedTools,
@@ -421,7 +458,17 @@ export const createChatStore = (initClientName: string, config: Partial<LangGrap
                 currentAgent.set(agent);
                 return initClient();
             },
-
+            resumeFromInterrupt(data: any) {
+                return sendMessage(
+                    [],
+                    {
+                        command: {
+                            resume: data,
+                        },
+                    },
+                    true
+                );
+            },
             // 历史记录（兼容旧 API）
             addToHistory,
             createNewChat: createNewSession,