Agent Inbox banner
langchain-ai langchain-ai

Agent Inbox

Design community

Description

📥 An inbox UX for interacting with human-in-the-loop agents.

Installation

This entry records only its repository, not the path inside it, so there is no exact command to give. Open the source below and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

README

Agent Inbox

![Agent Inbox Screenshot](./public/inbox_screenshot.png)

[!NOTE] Want to use the Agent Inbox without deploying it yourself? Check out the hosted version here: [dev.agentinbox.ai](https://dev.agentinbox.ai/)

Prerequisites

Before getting started, ensure you have:

  • Node.js, and yarn installed
  • A LangGraph deployment set up and running (locally, or in production through LangGraph Platform)
  • Your LangGraph API key

Setup

[!NOTE] 🎥 Prefer a video walkthrough? Checkout [this video](https://youtu.be/gF341XMN8cY) for a step-by-step guide.

[!TIP] You can also view a minimum working version of a LangGraph agent using the Agent Inbox in [Python here](https://github.com/langchain-ai/agent-inbox-langgraph-example), and [TypeScript here](https://github.com/langchain-ai/agent-inbox-langgraphjs-example).

![Agent Inbox Diagram](./public/agent_inbox_diagram.png)

To start running the Agent Inbox, first clone the repository and install dependencies:

git clone https://github.com/langchain-ai/agent-inbox.git
cd agent-inbox
yarn install

Configuration

Once up and running, you'll need to take two actions so that the Agent Inbox can connect to your LangGraph deployment.

  1. Add your LangSmith API key: Click the "Settings" button in the sidebar, and enter your LangSmith API key.

  2. Create your first inbox by opening the settings popover (bottom left, inside the sidebar), and clicking "Add Inbox". This will open a dialog with three fields:

  • Assistant/Graph ID: (required) The name of your LangGraph graph, or an assistant ID. This will be used when sending human responses to your graph.
  • Deployment URL: (required) The URL of your LangGraph deployment. This is how the Agent Inbox will connect to your LangGraph deployment for fetching interrupts, and sending human responses.
  • Name: (optional) A name for your inbox. This will be used as a label for the inbox.

These values are stored in your browser's local sto