Supervisor example questions

[atc]

Someone asked a question in the Slack in #langgraph-help here that went unanswered. I thought it was interesting to dig into to learn a bit more about LangGraph Studio. Posting Ricardo’s original questions here along with the original screenshots he provided:

Original questions

I’m trying to run this example locally: langgraphjs/examples/multi_agent/agent_supervisor.ipynb at main · langchain-ai/langgraphjs · GitHub and I have a few questions:

1. Why cant I use the chat tab when I have the following Agent state?

const AgentState = Annotation.Root({
    messages: Annotation<BaseMessage[]>({
        reducer: (x, y) => x.concat(y),
        default: () => [],
    }),
    // The agent node that last performed work
    next: Annotation<string>({
        reducer: (x, y) => y ?? x ?? END,
        default: () => END,
    }),
});

2. What are those extra nodes?
3. Why can’t I just see a way to input a simple HumanMessage?
4. Why do I see this typescript error? I copied the exact code that its in the example
   
   
   
   
   

Proposed answers

1. The AgentState defined in this example has additional fields beyond just messages (e.g. next). The chat tab in LangGraph Studio is only available for graphs where chat is the main interface and the entire state is basically focused on chat history.
2. The researcherAgent and the chartGenAgent are built using the createReactAgent prebuilt and are not normal functions. So when LangGraph Studio runs it sees that these nodes are ReAct agents and tool calls and LLM calls get visualized in the studio because these are ordinary nodes. The “3,” “4,” and “5” nodes are just created during runtime as numbers because they are not explicitly created with .addNode but LangGraph studio still tries to visualize what’s inside these ReAct agents.
3. This goes back to the way AgentState is constructed. It needs both messages and next. In this case, the first message doesn’t require next field but if you were to provide a simple string, the graph wouldn’t know if it should be the content in the HumanMessage or what type it should be. Since this supervisor example isn’t a simple chat experience, the required human input has to be the json object that the state schema requires.
4. Couldn’t figure out the solution for this error.