Menu
Language
Theme
Stream interface for ReactAgent instances created with createAgent.
Extends UseGraphStream with tool calling capabilities. Tool calls are automatically typed based on the agent's tools configuration.
Use this interface when streaming from an agent created with createAgent.
For subagent streaming capabilities, use UseDeepAgentStream with createDeepAgent.
This interface is subject to change.
interface UseAgentStreamBaseStream<StateType, ToolCall, Bag>This interface adds tool calling on top of UseGraphStream:
toolCalls - Array of tool calls paired with their resultsgetToolCalls(message) - Get tool calls for a specific AI messageIt does NOT include subagent streaming features. For those, use
UseDeepAgentStream with createDeepAgent.
The ID of the assistant to use.
The current branch of the thread. Used for navigating between different conversation branches.
LangGraph SDK client used to send requests and receive responses.
Last seen error from the stream, if any.
Reset to undefined when a new stream starts.
Tree of all branches for the thread. This API is experimental and subject to change.
Get the metadata for a message, such as first thread state the message was seen in and branch information.
Get tool calls for a specific AI message.
Use this to find which tool calls were initiated by a particular assistant message, useful for rendering tool calls inline with messages.
Flattened history of thread states of a thread. Contains all states in the current branch's history.
Current interrupt, if the stream is interrupted.
Convenience alias for interrupts[0].
For workflows with multiple concurrent interrupts, use interrupts instead.
All current interrupts from the stream. When using Send() fan-out with per-task interrupt() calls, multiple interrupts may be pending simultaneously.
Whether the stream is currently running.
true while streaming, false when idle or completed.
Whether the thread is currently being loaded.
true during initial thread data fetch.
Join an active stream that's already running.
Messages accumulated during the stream. Includes both human and AI messages. AI messages include typed tool calls based on the agent's tools.
Server-side submission queue. Pending runs created via
multitaskStrategy: "enqueue" when submitting while the agent is busy.
Set the branch of the thread.
Stops the currently running stream.
Create and stream a run to the thread.
Switch to a different thread, clearing the current stream state.
Pass null to reset to no thread (a new thread will be created on next submit).
Tool calls paired with their results.
Each entry contains the tool call request and its corresponding result. Useful for rendering tool invocations and their outputs together.
Progress of tool executions during streaming. Populated when stream mode includes "tools" and tools yield or report progress.
The current state values of the stream. Updated as streaming events are received.
import { createAgent, tool } from "@langchain/langgraph";
import { useStream } from "@langchain/langgraph-sdk/react";
import { z } from "zod";
// Define tools with typed schemas
const searchTool = tool(
async ({ query }) => `Results for: ${query}`,
{ name: "search", schema: z.object({ query: z.string() }) }
);
const calculatorTool = tool(
async ({ expression }) => eval(expression).toString(),
{ name: "calculator", schema: z.object({ expression: z.string() }) }
);
// Create the agent
const agent = createAgent({
model: "gpt-4",
tools: [searchTool, calculatorTool],
});
// In React component:
function Chat() {
const stream = useStream<typeof agent>({
assistantId: "my-agent",
apiUrl: "http://localhost:2024",
});
// Tool calls are typed!
stream.toolCalls.forEach(tc => {
if (tc.call.name === "search") {
// tc.call.args is typed as { query: string }
console.log("Searching for:", tc.call.args.query);
} else if (tc.call.name === "calculator") {
// tc.call.args is typed as { expression: string }
console.log("Calculating:", tc.call.args.expression);
}
});
}messages.map(message => {
if (message.type === "ai") {
const calls = stream.getToolCalls(message);
return (
<>
<MessageBubble message={message} />
{calls.map(tc => <ToolCallCard key={tc.call.id} {...tc} />)}
</>
);
}
return <MessageBubble message={message} />;
});stream.toolCalls.map(({ call, result }) => (
<ToolCallCard
name={call.name}
args={call.args}
result={result}
/>
));