---
title: "LangGraph"
description: "Manually instrument LangGraph in React Native to capture spans for agent compilation and invocation."
url: https://docs.sentry.io/platforms/react-native/integrations/langgraph/
---

# LangGraph | Sentry for React Native

*Import name: `Sentry.instrumentLangGraph`*

The `instrumentLangGraph` helper adds instrumentation for [`@langchain/langgraph`](https://www.npmjs.com/package/@langchain/langgraph) by wrapping a `StateGraph` before compilation and recording AI agent interactions with configurable input/output capture. The OpenTelemetry-based automatic integration available for Node.js does not work in React Native, so calling `instrumentLangGraph` on the graph **before** `.compile()` is the only supported path.

## [Usage](https://docs.sentry.io/platforms/react-native/integrations/langgraph.md#usage)

```javascript
import * as Sentry from "@sentry/react-native";
import { ChatOpenAI } from "@langchain/openai";
import {
  StateGraph,
  MessagesAnnotation,
  START,
  END,
} from "@langchain/langgraph";
import { SystemMessage, HumanMessage } from "@langchain/core/messages";

const llm = new ChatOpenAI({
  modelName: "gpt-4o",
  // Warning: API keys included in your app bundle will be visible to anyone who
  // inspects the bundle. Proxy LLM calls through your own backend whenever possible.
  apiKey: "your-api-key",
});

async function callLLM(state) {
  const response = await llm.invoke(state.messages);
  return {
    messages: [...state.messages, response],
  };
}

const agent = new StateGraph(MessagesAnnotation)
  .addNode("agent", callLLM)
  .addEdge(START, "agent")
  .addEdge("agent", END);

// Instrument the graph BEFORE compiling
Sentry.instrumentLangGraph(agent, {
  recordInputs: true,
  recordOutputs: true,
});

const graph = agent.compile({ name: "my_agent" });

const result = await graph.invoke({
  messages: [
    new SystemMessage("You are a helpful assistant."),
    new HumanMessage("Hello!"),
  ],
});
```

Make sure [tracing is enabled](https://docs.sentry.io/platforms/react-native/tracing.md) for the spans produced by this integration to be captured.

## [Configuration](https://docs.sentry.io/platforms/react-native/integrations/langgraph.md#configuration)

### [Options](https://docs.sentry.io/platforms/react-native/integrations/langgraph.md#options)

The following options control what data is captured from LangGraph operations:

#### [`recordInputs`](https://docs.sentry.io/platforms/react-native/integrations/langgraph.md#recordinputs)

*Type: `boolean` (optional)*

Records inputs to LangGraph operations (such as prompts and messages).

Defaults to `true` if `sendDefaultPii` is `true`.

#### [`recordOutputs`](https://docs.sentry.io/platforms/react-native/integrations/langgraph.md#recordoutputs)

*Type: `boolean` (optional)*

Records outputs from LangGraph operations (such as generated text and responses).

Defaults to `true` if `sendDefaultPii` is `true`.

## [Supported Operations](https://docs.sentry.io/platforms/react-native/integrations/langgraph.md#supported-operations)

By default, tracing support is added to the following LangGraph SDK calls:

* **Agent Creation** (`gen_ai.create_agent`) - Captures spans when compiling a StateGraph into an executable agent
* **Agent Invocation** (`gen_ai.invoke_agent`) - Captures spans for agent execution via `invoke()`

## [Supported Versions](https://docs.sentry.io/platforms/react-native/integrations/langgraph.md#supported-versions)

* `@langchain/langgraph`: `>=0.2.0 <2.0.0`