TutorialsMulti-Agent Workflow

To build multi-agent systems, AgentForge uses LangGraphJS. The main workflow demonstrates the Supervisor multi-agent pattern. In this pattern, there is a supervisor agent that decides what needs to happen next based on the current context. It can invoke another agent or finish processing the request.

Step 1: Define the State

To be able to communicate effectively, agents need to store information. This is the role of the state. In our case, the state is defined as an object with a list of messages and a next identifier.

State Definition

1/* eslint-disable no-unused-vars */
2import { BaseMessage } from '@langchain/core/messages';
3
4export interface AgentStateChannels {
5    messages: {
6        value: (x: Array<BaseMessage>, y: Array<BaseMessage>) => Array<BaseMessage>;
7        default: () => Array<BaseMessage>;
8    };
9    next: string;
10}
11
12// This defines the agent state
13export const initialState: Record<string, any> = {
14    messages: {
15        value: (x: Array<BaseMessage>, y: Array<BaseMessage>) => {
16            return x.concat(y);
17        },
18        default: (): Array<BaseMessage> => [],
19    },
20    next: null,
21};
22

Step 2: Create the Workflow

The workflow coordinates the interaction between agents. The main steps are creating the graph, adding nodes, and defining edges.

Workflow Definition

1tsxCopy code
2import { START, END, StateGraph } from '@langchain/langgraph';
3import { initialState, AgentStateChannels } from './state';
4import { createResearcher } from './agents/researcher';
5import { createPresenter } from './agents/presenter';
6import { createSupervisor } from './agents/supervisor';
7import { CompiledStateGraph } from '@langchain/langgraph/dist/graph/state';
8import { Agent } from './agents/base';
9
10export const createWorkflow = async (): Promise<
11    CompiledStateGraph<Record<string, any>, Partial<Record<string, any>>, string>
12> => {
13    // 1. Create the graph
14    const workflow = new StateGraph<Record<string, any>, Partial<Record<string, any>>, string>({
15        channels: initialState,
16    });
17
18    const members = await Promise.all([await createResearcher(), await createPresenter()]);
19
20    // 2. Add the nodes; these will do the work
21    members.forEach((member) => {
22        workflow.addNode(member.name, member.runnable);
23    });
24    workflow.addNode('supervisor', await createSupervisor(members));
25
26    // 3. Define the edges. We will define both regular and conditional ones
27    // After a worker completes, report to supervisor
28    members.forEach((member) => {
29        workflow.addEdge(member.name, 'supervisor');
30    });
31
32    // When the supervisor returns, route to the agent identified in the supervisor's output
33    const conditionalMap: { [key: string]: string } = members.reduce(
34        (acc: { [key: string]: string }, member: Agent) => {
35            acc[member.name] = member.name;
36            return acc;
37        },
38        {}
39    );
40
41    // Or end work if done
42    conditionalMap['FINISH'] = END;
43
44    workflow.addConditionalEdges('supervisor', (x: AgentStateChannels) => x.next, conditionalMap);
45
46    workflow.addEdge(START, 'supervisor');
47
48    return workflow.compile();
49};
50
51

Step 3: Understand the Workflow

Here's a breakdown of the workflow:

Create the Graph: Initialize a new StateGraph with the defined initial state.

Add Nodes: Nodes represent the agents. Add the researcher, presenter, and supervisor agents to the graph.

Define Edges:

Regular Edges: After each agent (node) completes its task, it reports to the supervisor.

Conditional Edges: The supervisor decides the next agent to invoke based on the next value in the state. If the work is done, it ends the workflow.

Conditional Map

The conditionalMap determines the next step:

Each agent returns to the supervisor.

The supervisor decides the next agent to invoke or finishes the process.

Step 4: Run Workflows Through the Command Line

To facilitate quick experimentation with your workflows, AgentForge allows you to run them directly from the command line. This can be particularly useful for testing and debugging your workflows without needing to integrate them into a larger application first.

Running the Workflow

To run your workflow, use the following command:

1npm run workflow

This command will execute the workflow you have defined, allowing you to see the output and behavior of your agents in real-time. Here’s how it works:

Define the Script: Ensure that your package.json file includes a script for running the workflow. Add the following entry if it’s not already present:

1"scripts": {
2    "workflow": "dotenvx run --env-file=.env.local -- ts-node scripts/run --trace-deprecation"
3}

Run the Command: Open your terminal and navigate to the root directory of your project. Run the command npm run workflow.

Observe the Output: The workflow will execute, and you will see the output directly in your terminal. This includes the interactions between agents, the state transitions, and any results generated by the workflow.

Example Output

When you run the workflow, you might see output similar to the following:

1
2> agent-forge-boilerplate@0.0.1 workflow
3> dotenvx run --env-file=.env.local -- ts-node scripts/run
4
5[dotenvx@0.44.5] injecting env (9) from .env.local
6> what is the worlds population?
7supervisor: Researcher
8----
9Researcher: As of 2023, the world's population is approximately 8 billion people. This estimate is based on the latest data from sources such as the United Nations and Worldometer. For the most up-to-date and live population figures, you can refer to resources like the [Worldometer World Population Clock](https://www.worldometers.info/world-population/) or the [Census.gov World Population Clock](https://www.census.gov/popclock/world).
10----
11supervisor: Presenter
12----
13Presenter: <div>
14    <p>As of 2023, the world's population is approximately 8 billion people. This estimate is based on the latest data from sources such as the United Nations and Worldometer. For the most up-to-date and live population figures, you can refer to resources like the <a href="https://www.worldometers.info/world-population/" target="_blank">Worldometer World Population Clock</a> or the <a href="https://www.census.gov/popclock/world" target="_blank">Census.gov World Population Clock</a>.</p>
15</div>
16----
17supervisor: FINISH
18----

This output shows each step of the workflow, providing clear insights into how your agents are performing their tasks and interacting with each other.

Conclusion

By following these steps, you can set up a multi-agent system using AgentForge and LangGraphJS. This tutorial demonstrates the Supervisor multi-agent pattern, where a supervisor agent coordinates tasks among various agents based on the current context.