Use the code view editor and the visual canvas together to define your agent network. The canvas is read-only and syncs automatically as you make changes to the code. Make all changes in the project files and use the canvas to navigate, verify the shape of your network, and jump back to the lines you need to edit.
|
|
Using the visual canvas is optional. If you prefer a code-only workflow, edit agent-network.yaml, the .agent files under /brokers, and exchange.json directly without ever opening the canvas. Auto-completion menus in Anypoint Code Builder work the same way in both workflows. For more information, see Use Auto-Completion Menus.
|
Open Your Project
Open your agent network project in Anypoint Code Builder and display the canvas alongside the code editor.
-
In Anypoint Code Builder, open your agent network project. By default, agent-network.yaml opens in the editor.
-
In the editor action bar, click Show canvas.
The canvas opens to the right of the code editor, giving you a side-by-side layout.
The canvas renders all graphs in the project from left to right. Each broker appears as its own graph with a header that includes the broker name.
Edit Your Project
With the canvas open beside the code editor, edit your project files. The visual canvas updates with your changes as you save your work.
-
Edit agent-network.yaml to declare assets in the registry section and to define connections and policies in the context section.
-
In the Explorer, navigate to the /brokers directory and open the .agent file for the broker you want to edit (for example, broker1.agent). Edit the .agent file to define the broker, its nodes (trigger, subagent, orchestrator, generator, executor, echo, router), and the transitions between them.
-
Update exchange.json to manage Anypoint Exchange dependencies by using the Add Exchange Assets action rather than editing it by hand. See Add Exchange Assets to Your Agent Network Project.
Navigate Between Canvas and Code View
Use the navigation shortcuts on the canvas to jump straight to the lines you need to edit.
-
To edit a node’s configuration, click the Open in code view icon on the node.
Anypoint Code Builder opens the corresponding .agent file in the code editor and highlights the line that defines the node.
-
To open the full Agent Script for a broker, click the Open in code view button in that broker’s graph header.
-
To zoom into a specific graph, click the graph name in the Project Palette.
-
To switch the canvas to the Project Assets view, use the toggle at the top of the Project Palette.
Adjust the Canvas View
Adjust nodes on the canvas view while you edit your project.