Function useStream

Example

// In your agent file (e.g., agent.ts)
import { createAgent, tool } from "@langchain/langgraph";
import { z } from "zod";

const getWeather = tool(
  async ({ location }) => `Weather in ${location}`,
  { name: "get_weather", schema: z.object({ location: z.string() }) }
);

export const agent = createAgent({
  model: "openai:gpt-4o",
  tools: [getWeather],
});

// In your React component
import { agent } from "./agent";

function Chat() {
  // Tool calls are automatically typed from the agent's tools!
  const stream = useStream<typeof agent>({
    assistantId: "agent",
    apiUrl: "http://localhost:2024",
  });

  // stream.toolCalls[0].call.name is typed as "get_weather"
  // stream.toolCalls[0].call.args is typed as { location: string }
}
Copy

Usage with StateGraph (for custom LangGraph applications)

When building custom graphs with StateGraph, embed your tool call types directly in your state's messages property using Message<MyToolCalls>:

Example

import { Message } from "@langchain/langgraph-sdk";

// Define your tool call types as a discriminated union
type MyToolCalls =
  | { name: "search"; args: { query: string }; id?: string }
  | { name: "calculate"; args: { expression: string }; id?: string };

// Embed tool call types in your state's messages
interface MyGraphState {
  messages: Message<MyToolCalls>[];
  context?: string;
}

function Chat() {
  const stream = useStream<MyGraphState>({
    assistantId: "my-graph",
    apiUrl: "http://localhost:2024",
  });

  // stream.values is typed as MyGraphState
  // stream.toolCalls[0].call.name is typed as "search" | "calculate"
}
Copy

Example

// With additional type configuration (interrupts, configurable)
interface MyGraphState {
  messages: Message<MyToolCalls>[];
}

function Chat() {
  const stream = useStream<MyGraphState, {
    InterruptType: { question: string };
    ConfigurableType: { userId: string };
  }>({
    assistantId: "my-graph",
    apiUrl: "http://localhost:2024",
  });

  // stream.interrupt is typed as { question: string } | undefined
}
Copy