# AgentFlow Editor

## Overview

**WorkFX AI** offers a streamlined and intuitive **AgentFlow editor panel** to help users build and manage intelligent agent workflows. Key features include:

* **Visual Workflow Design**: A drag-and-drop flowchart interface makes it easy to connect and organize multiple agents.
* **Flexible Collaboration Modes**: Supports peer collaboration, forced handover, and context-based delegation to build efficient multi-agent systems.
* **Tool Integration**: External tools can be linked to agents, enabling capabilities such as data processing, retrieval, or communication.
* **Knowledge Base Support**: Structured knowledge databases can be integrated to boost agents’ reasoning and comprehension capabilities.
* **Conditional Logic**: "If-this-then-that" routing rules allow for adaptive workflows based on inputs or runtime decisions.

## Settings

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FsQ5w3oEoSCS3XEcEGXre%2Fagent_settings.png?alt=media&#x26;token=de871a0a-88d5-4a58-8945-e2c7adb78122" alt=""><figcaption></figcaption></figure>

Click the **Agent Setting** button at the top-left corner to access the Agent settings page.

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FCpSxrWslvKHzA5Vc9IvN%2F16f9c5ce848d886c69c9288bd4403abd.png?alt=media&#x26;token=ba8bd852-fcc9-42cc-9c7b-e0a61eee7412" alt=""><figcaption></figcaption></figure>

On this page, you can:

* Set the Agent’s avatar
* Change the Agent’s name
* Edit the Agent’s description
* Delete the Agent

## Orchestration

* **Add Nodes**

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2Fbke030NA222gEv5f1gKn%2Fdrag%26drop.drawio.png?alt=media&#x26;token=8431f9c4-2d12-4cd4-bf90-c97f43caeb06" alt=""><figcaption></figcaption></figure>

Click to open the **Node list**, then select the desired node and **drag** it onto the canvas to add it.

* **Configure Nodes**

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2F6qOWtldyGoWPTW5BDbB0%2Fnode_config_panel.drawio.png?alt=media&#x26;token=3426c2d0-4f02-4801-8133-ff045e5c2a01" alt=""><figcaption></figcaption></figure>

Click any node to open its configuration panel, where you can adjust parameters and define its behavior.

* **Link Nodes**

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2Fy0wTXNhcz0iWSKEFS8uo%2Fdrag_to_link.drawio.png?alt=media&#x26;token=d836be3b-3c1f-4d47-b073-71a892dc397b" alt=""><figcaption></figcaption></figure>

Drag the connection handle on either side of a node and drop it onto the connection point of another node to establish a link between them.

* **Draft**

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FR6XZgQjRg0eBi45KSwmW%2Fdraft.drawio.png?alt=media&#x26;token=02522ce6-83cc-49ae-a554-674083037caf" alt=""><figcaption></figcaption></figure>

Click **Draft** to save your changes, which will then be reflected in the preview.

* **Preview**

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FU4WQnYSBAQiTVsWXS6tC%2Fpreview.png?alt=media&#x26;token=cf720de6-9ec4-4539-98ef-663451ea93c7" alt=""><figcaption></figcaption></figure>

Click **Preview** to open the preview panel, where you can interact with your agent.

{% columns %}
{% column width="58.333333333333336%" %}

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FMP1ilCkItXi2jZ3PbfwE%2F7df096456eb2607ee1eb084cecf39bfd.png?alt=media&#x26;token=6747d1f0-cbd3-4635-a04d-9db97e9ba740" alt="" width="250"><figcaption></figcaption></figure>
{% endcolumn %}

{% column %}

As shown in the illustration, after each Draft operation, you can interact with your agent in the Preview panel for real-time testing. Key benefits include:

* The system automatically updates the preview panel to reflect the latest changes

* Directly ask questions to the agent to check answer accuracy and logic

* Easily test different scenarios to validate the agent’s responses to varied inputs

* Real-time feedback helps quickly identify issues and adjust strategies

* Improves development efficiency and overall user experience
  {% endcolumn %}
  {% endcolumns %}

* **Add Conversation Variables**

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FdUzxrRKdFhy8lBknflHK%2Fadd_conv_var.png?alt=media&#x26;token=24244edd-8d87-4d5f-a556-30f9a4fb7f08" alt=""><figcaption></figcaption></figure>

You can click the icon in the top-right corner to configure Conversation Variables used for preview. These variables are mapped to input variables with the same names in the Start Node, allowing you to simulate different input scenarios during preview.

* **Publish**

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FNzhFfwbkcCurGnqxhCk0%2Fpublish.png?alt=media&#x26;token=462cb022-7022-4e2d-a31e-cefd2de4f007" alt=""><figcaption></figcaption></figure>

Only after clicking **Publish** will your agent be officially deployed to the production environment. The separation from Draft allows you to debug and make changes without affecting the live version, ensuring stability and reliability for users.

## Tasks

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FdD2jyc87ZqWc939AMYWv%2F58397f0c13ebfe9cb0722cced1fe80f1.png?alt=media&#x26;token=6af035ff-b6a1-4844-8d5f-ad4e57c4b6f3" alt=""><figcaption></figcaption></figure>

In the **Task** panel, you can view the execution status of tasks currently triggered by this agent. Each task displays the following key information:

* **Title**
* **User**
* **Status** (e.g., Pending, Running, Completed)
* **Messages**
* **Workforce Name**
* **Update Time**

## Configuration

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FDqMrebjBHgyFlquuZvAU%2Fbe7cbbfefbbf7015e960cd42774ab62e.png?alt=media&#x26;token=e7894e80-c839-4f60-b80f-825336e5ada6" alt=""><figcaption></figcaption></figure>

In the Configuration panel, you can set the agent’s **Guide for using agent** and **welcome message** to help users better understand its purpose and how to use it effectively.

## Use Agent

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FwFcJNVqpZyBQBTHCGLJp%2Fuse_agent.drawio.png?alt=media&#x26;token=ec010f2f-686e-43c7-98da-20566a88baec" alt=""><figcaption></figcaption></figure>

Click the **Use Agent** button to open the usage configuration panel.

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2FhhuIwcJNjwnhjeWriwqW%2F890caa6bd9cbef00dddaf982c8442adb.png?alt=media&#x26;token=ed1d186e-1ace-43e1-934e-5cee6e0207d8" alt=""><figcaption></figcaption></figure>

In the "Use Agent" panel, you can choose between two usage methods:

* **URL Link Access**:
  * **Public Access**: The agent can be accessed by anyone with the link, no authorization required.
  * **Authorized Access**: Only invited users can access the agent, requiring an invitation-based authorization.
* **API Access**:\
  Integrate and invoke the agent via API. For detailed parameter configuration and usage, please refer to the **API Reference** section of the documentation.

## URL Link Access

<figure><img src="https://4046886348-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYf4L4Z4IuV1CQn3whQYb%2Fuploads%2Fch0YydLYz3U8qsD3kc76%2F80d64a57bdaf8d33ab36fc0feeddce57.png?alt=media&#x26;token=bd83e24b-7727-49c1-884a-df65a3859db2" alt=""><figcaption></figcaption></figure>

This is the panel for URL-based access. Users can directly access and use the published version of the Agent via the provided link without any additional setup.
