ai-agent

agent-chat-ui: Simple Agent Interaction

Name: agent-chat-ui: Simple Agent Interaction
Author: langchain-ai

Interact with LangGraph agents via chat.

3,072 stars673 forksTypeScriptGuide quality 8/10Updated 8/17/2026100% free · open source

What it does

The agent-chat-ui tool allows founders to interact with LangGraph agents via a chat interface, enabling them to harness the capabilities of AI agents in a user-friendly way.

When to use it

•When you need to test and debug LangGraph agents in a conversational format
•When you want to demonstrate the capabilities of your AI agents to non-technical stakeholders
•When you need to integrate LangGraph agents into a web-based application or workflow

Ready-to-paste prompt

Ask your LangGraph agent a question like 'What are the key benefits of using a chat interface for interacting with AI agents?' to see its response

Heads up: Make sure you have the correct version of Node.js installed, as the agent-chat-ui requires a compatible runtime environment to function correctly, and may not work as expected with older or newer versions

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🛠️ Technical setup

Expect 20–40 minutes in a terminal — or let your AI agent drive it.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/agent-chat-ui && curl -fsSL https://workflowstacks.com/api/skills/agent-chat-ui/claude-skill -o ~/.claude/skills/agent-chat-ui/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How agent-chat-ui: Simple Agent Interaction works

Codeflow

Free to inspect

Agent-chat-ui: Simple Agent Interaction is a medium TypeScript project (~5k lines across 57 code files). Expect some technical setup — comfortable with a terminal, or ask a developer. Last commit this month, MIT license, no tests found.

Size

Medium codebase

~5k lines · 57 code files · 42 min skim

Setup

Some technical setup

Comfortable with a terminal? 20–40 min. Otherwise ask a dev.

Runs on

Node.js

Needs API keys (.env)

TypeScript 95%CSS 3%JavaScript 2%

Where to start reading

1
README.md
Start here — what it does and how to install it
2
package.json
Dependencies and the commands it exposes
3
.env.example
The API keys and settings you must provide
4
src/components/thread/index.tsx
Inside src/ — the main logic begins here

What's in each folder

src/Core code — the actual logic54 files

scripts/Helper scripts1 files

.github/CI / automation (GitHub Actions)2 files

READMENo tests foundThin docsCI checksMIT licenseUpdated this month

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🛠️ Technical setup

Expect 20–40 minutes in a terminal — or let your AI agent drive it.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/agent-chat-ui && curl -fsSL https://workflowstacks.com/api/skills/agent-chat-ui/claude-skill -o ~/.claude/skills/agent-chat-ui/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

langchain-ai

Language

TypeScript