@langchain/langgraph-sdk 0.0.91 → 0.0.93

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @langchain/langgraph-sdk
 
+## 0.0.93
+
+### Patch Changes
+
+- d53c891: Fix useStream race condition when flushing messages
+
+## 0.0.92
+
+### Patch Changes
+
+- 603daa6: Make history fetching configurable in useStream via `fetchStateHistory`
+
 ## 0.0.91
 
 ### Patch Changes

package/dist/react/stream.cjs

@@ -87,6 +87,17 @@ function findLastIndex(array, predicate) {
 }
 function getBranchSequence(history) {
     const childrenMap = {};
+    // Short circuit if there's only a singular one state
+    // TODO: I think we can make this more generalizable for all `fetchStateHistory` values.
+    if (history.length <= 1) {
+        return {
+            rootSequence: {
+                type: "sequence",
+                items: history.map((value) => ({ type: "node", value, path: [] })),
+            },
+            paths: [],
+        };
+    }
     // First pass - collect nodes for each checkpoint
     history.forEach((state) => {
         const checkpointId = state.parent_checkpoint?.checkpoint_id ?? "$";
@@ -171,10 +182,16 @@ function getBranchView(sequence, paths, branch) {
     }
     return { history, branchByCheckpoint };
 }
-function fetchHistory(client, threadId) {
-    return client.threads.getHistory(threadId, { limit: 1000 });
+function fetchHistory(client, threadId, options) {
+    if (options?.limit === false) {
+        return client.threads
+            .getState(threadId)
+            .then((state) => [state]);
+    }
+    const limit = typeof options?.limit === "number" ? options.limit : 1000;
+    return client.threads.getHistory(threadId, { limit });
 }
-function useThreadHistory(threadId, client, clearCallbackRef, submittingRef) {
+function useThreadHistory(threadId, client, limit, clearCallbackRef, submittingRef) {
     const [history, setHistory] = (0, react_1.useState)([]);
     const clientHash = (0, client_js_1.getClientConfigHash)(client);
     const clientRef = (0, react_1.useRef)(client);
@@ -182,7 +199,9 @@ function useThreadHistory(threadId, client, clearCallbackRef, submittingRef) {
     const fetcher = (0, react_1.useCallback)((threadId) => {
         if (threadId != null) {
             const client = clientRef.current;
-            return fetchHistory(client, threadId).then((history) => {
+            return fetchHistory(client, threadId, {
+                limit,
+            }).then((history) => {
                 setHistory(history);
                 return history;
             });
@@ -190,12 +209,12 @@ function useThreadHistory(threadId, client, clearCallbackRef, submittingRef) {
         setHistory([]);
         clearCallbackRef.current?.();
         return Promise.resolve([]);
-    }, [clearCallbackRef]);
+    }, [clearCallbackRef, limit]);
     (0, react_1.useEffect)(() => {
         if (submittingRef.current)
             return;
         void fetcher(threadId);
-    }, [fetcher, clientHash, submittingRef, threadId]);
+    }, [fetcher, clientHash, limit, submittingRef, threadId]);
     return {
         data: history,
         mutate: (mutateId) => fetcher(mutateId ?? threadId),
@@ -241,8 +260,9 @@ function useStreamValuesState() {
     return [values?.[0] ?? null, setStreamValues, mutate];
 }
 function useStream(options) {
-    // eslint-disable-next-line prefer-const
-    let { assistantId, messagesKey, onCreated, onError, onFinish } = options;
+    let { messagesKey } = options;
+    const { assistantId, fetchStateHistory } = options;
+    const { onCreated, onError, onFinish } = options;
     const reconnectOnMountRef = (0, react_1.useRef)(options.reconnectOnMount);
     const runMetadataStorage = (0, react_1.useMemo)(() => {
         if (typeof window === "undefined")
@@ -309,11 +329,12 @@ function useStream(options) {
     clearCallbackRef.current = () => {
         setStreamError(undefined);
         setStreamValues(null);
+        messageManagerRef.current.clear();
     };
-    // TODO: this should be done on the server to avoid pagination
-    // TODO: should we permit adapter? SWR / React Query?
-    // TODO: make this only when branching is expected
-    const history = useThreadHistory(threadId, client, clearCallbackRef, submittingRef);
+    const historyLimit = typeof fetchStateHistory === "object" && fetchStateHistory != null
+        ? fetchStateHistory.limit ?? true
+        : fetchStateHistory ?? true;
+    const history = useThreadHistory(threadId, client, historyLimit, clearCallbackRef, submittingRef);
     const getMessages = (0, react_1.useMemo)(() => {
         return (value) => Array.isArray(value[messagesKey])
             ? value[messagesKey]
@@ -456,8 +477,6 @@ function useStream(options) {
         }
         finally {
             setIsLoading(false);
-            // Assumption: messages are already handled, we can clear the manager
-            messageManagerRef.current.clear();
             submittingRef.current = false;
             abortRef.current = null;
         }
@@ -606,7 +625,12 @@ function useStream(options) {
         branch,
         setBranch,
         history: flatHistory,
-        experimental_branchTree: rootSequence,
+        get experimental_branchTree() {
+            if (historyLimit === false) {
+                throw new Error("`experimental_branchTree` is not available when `fetchStateHistory` is set to `false`");
+            }
+            return rootSequence;
+        },
         get interrupt() {
             // Don't show the interrupt if the stream is loading
             if (isLoading)

package/dist/react/stream.d.ts

@@ -167,6 +167,15 @@ export interface UseStreamOptions<StateType extends Record<string, unknown> = Re
      * cached UI display without server fetches.
      */
     initialValues?: StateType | null;
+    /**
+     * Whether to fetch the history of the thread.
+     * If true, the history will be fetched from the server. Defaults to 1000 entries.
+     * If false, only the last state will be fetched from the server.
+     * @default true
+     */
+    fetchStateHistory?: boolean | {
+        limit: number;
+    };
 }
 interface RunMetadataStorage {
     getItem(key: `lg:stream:${string}`): string | null;

package/dist/react/stream.js

@@ -83,6 +83,17 @@ function findLastIndex(array, predicate) {
 }
 function getBranchSequence(history) {
     const childrenMap = {};
+    // Short circuit if there's only a singular one state
+    // TODO: I think we can make this more generalizable for all `fetchStateHistory` values.
+    if (history.length <= 1) {
+        return {
+            rootSequence: {
+                type: "sequence",
+                items: history.map((value) => ({ type: "node", value, path: [] })),
+            },
+            paths: [],
+        };
+    }
     // First pass - collect nodes for each checkpoint
     history.forEach((state) => {
         const checkpointId = state.parent_checkpoint?.checkpoint_id ?? "$";
@@ -167,10 +178,16 @@ function getBranchView(sequence, paths, branch) {
     }
     return { history, branchByCheckpoint };
 }
-function fetchHistory(client, threadId) {
-    return client.threads.getHistory(threadId, { limit: 1000 });
+function fetchHistory(client, threadId, options) {
+    if (options?.limit === false) {
+        return client.threads
+            .getState(threadId)
+            .then((state) => [state]);
+    }
+    const limit = typeof options?.limit === "number" ? options.limit : 1000;
+    return client.threads.getHistory(threadId, { limit });
 }
-function useThreadHistory(threadId, client, clearCallbackRef, submittingRef) {
+function useThreadHistory(threadId, client, limit, clearCallbackRef, submittingRef) {
     const [history, setHistory] = useState([]);
     const clientHash = getClientConfigHash(client);
     const clientRef = useRef(client);
@@ -178,7 +195,9 @@ function useThreadHistory(threadId, client, clearCallbackRef, submittingRef) {
     const fetcher = useCallback((threadId) => {
         if (threadId != null) {
             const client = clientRef.current;
-            return fetchHistory(client, threadId).then((history) => {
+            return fetchHistory(client, threadId, {
+                limit,
+            }).then((history) => {
                 setHistory(history);
                 return history;
             });
@@ -186,12 +205,12 @@ function useThreadHistory(threadId, client, clearCallbackRef, submittingRef) {
         setHistory([]);
         clearCallbackRef.current?.();
         return Promise.resolve([]);
-    }, [clearCallbackRef]);
+    }, [clearCallbackRef, limit]);
     useEffect(() => {
         if (submittingRef.current)
             return;
         void fetcher(threadId);
-    }, [fetcher, clientHash, submittingRef, threadId]);
+    }, [fetcher, clientHash, limit, submittingRef, threadId]);
     return {
         data: history,
         mutate: (mutateId) => fetcher(mutateId ?? threadId),
@@ -237,8 +256,9 @@ function useStreamValuesState() {
     return [values?.[0] ?? null, setStreamValues, mutate];
 }
 export function useStream(options) {
-    // eslint-disable-next-line prefer-const
-    let { assistantId, messagesKey, onCreated, onError, onFinish } = options;
+    let { messagesKey } = options;
+    const { assistantId, fetchStateHistory } = options;
+    const { onCreated, onError, onFinish } = options;
     const reconnectOnMountRef = useRef(options.reconnectOnMount);
     const runMetadataStorage = useMemo(() => {
         if (typeof window === "undefined")
@@ -305,11 +325,12 @@ export function useStream(options) {
     clearCallbackRef.current = () => {
         setStreamError(undefined);
         setStreamValues(null);
+        messageManagerRef.current.clear();
     };
-    // TODO: this should be done on the server to avoid pagination
-    // TODO: should we permit adapter? SWR / React Query?
-    // TODO: make this only when branching is expected
-    const history = useThreadHistory(threadId, client, clearCallbackRef, submittingRef);
+    const historyLimit = typeof fetchStateHistory === "object" && fetchStateHistory != null
+        ? fetchStateHistory.limit ?? true
+        : fetchStateHistory ?? true;
+    const history = useThreadHistory(threadId, client, historyLimit, clearCallbackRef, submittingRef);
     const getMessages = useMemo(() => {
         return (value) => Array.isArray(value[messagesKey])
             ? value[messagesKey]
@@ -452,8 +473,6 @@ export function useStream(options) {
         }
         finally {
             setIsLoading(false);
-            // Assumption: messages are already handled, we can clear the manager
-            messageManagerRef.current.clear();
             submittingRef.current = false;
             abortRef.current = null;
         }
@@ -602,7 +621,12 @@ export function useStream(options) {
         branch,
         setBranch,
         history: flatHistory,
-        experimental_branchTree: rootSequence,
+        get experimental_branchTree() {
+            if (historyLimit === false) {
+                throw new Error("`experimental_branchTree` is not available when `fetchStateHistory` is set to `false`");
+            }
+            return rootSequence;
+        },
         get interrupt() {
             // Don't show the interrupt if the stream is loading
             if (isLoading)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@langchain/langgraph-sdk",
-  "version": "0.0.91",
+  "version": "0.0.93",
   "description": "Client library for interacting with the LangGraph API",
   "type": "module",
   "scripts": {