docs: Various edits related to style, syntax, and adding more detail to some pages (#9132)
* port unrelated changes from IA PR * few more ports * fix build * edit to try to restart build
This commit is contained in:
April I. Murphy
GitHub
parent
3bb22b29cc
commit
2fa2a43f96
36 changed files with 584 additions and 423 deletions
|
|
@ -31,7 +31,7 @@ Add an agent to your flow that uses a different OpenAI model for a larger contex
|
|||
|
||||
1. Create the [Simple agent starter flow](/simple-agent).
|
||||
2. Add a second agent component to the flow.
|
||||
3. Add your **Open AI API Key** to the **Agent** component.
|
||||
3. Add your **OpenAI API Key** to the **Agent** component.
|
||||
4. In the **Model Name** field, select `gpt-4.1`.
|
||||
5. Click **Tool Mode** to use this new agent as a tool.
|
||||
6. Connect the new agent's **Toolset** port to the previously created agent's **Tools** port.
|
||||
|
|
|
|||
|
|
@ -1,91 +1,157 @@
|
|||
---
|
||||
title: Use Langflow Agents
|
||||
title: Use Langflow agents
|
||||
slug: /agents
|
||||
---
|
||||
|
||||
import Icon from "@site/src/components/icon";
|
||||
|
||||
Agents use LLMs as a brain to autonomously analyze problems and select tools to solve them.
|
||||
Langflow's [**Agent** component](/components-agents) is critical for building agentic flows.
|
||||
This component provides everything you need to create an agent, including multiple Large Language Model (LLM) providers, tool calling, and custom instructions.
|
||||
It simplifies agent configuration so you can focus on application development.
|
||||
|
||||
Langflow's [Agent component](/components-agents#agent-component) simplifies agent configuration so you can focus on application development.
|
||||
<details>
|
||||
<summary>How agents work</summary>
|
||||
|
||||
The Agent component provides everything you need to create an agent, including multiple LLM providers and custom instructions.
|
||||
Agents extend LLMs by integrating _tools_, which are functions that provide additional context and enable autonomous task execution.
|
||||
These integrations make agents more specialized and powerful than standalone LLMs.
|
||||
|
||||
## Agent settings
|
||||
Whereas an LLM might generate acceptable, inert responses to general queries and tasks, an agent can leverage the integrated context and tools to provide more relevant responses and even take action.
|
||||
For example, you might create an agent that can access your company's knowledge base, repositories, and other resources to help your team with tasks that require knowledge of your specific products, customers, and code.
|
||||
|
||||
You can configure the Agent component to use your preferred provider and model, custom instructions, and tools.
|
||||
Agents use LLMs as a reasoning engine to process input, determine which actions to take to address the query, and then generate a response.
|
||||
The response could be a typical text-based LLM response, or it could involve an action, like editing a file, running a script, or calling an external API.
|
||||
|
||||
### Agent models and providers
|
||||
In an agentic context, tools are functions that the agent can run to perform tasks or access external resources.
|
||||
A function is wrapped as a `Tool` object with a common interface that the agent understands.
|
||||
Agents become aware of tools through tool registration, which is when the agent is provided a list of available tools typically at agent initialization.
|
||||
The `Tool` object's description tells the agent what the tool can do so that it can decide whether the tool is appropriate for a given request.
|
||||
|
||||
Use the **Model Provider** and **Model Name** settings to select the LLM that you want the Agent to use.
|
||||
|
||||
You must provide an authentication key for the selected provider, such as an OpenAI API key for OpenAI models.
|
||||
|
||||
### Agent instructions and input
|
||||
|
||||
In the **Agent Instructions** field, you can provide custom instructions that you want the Agent component to use for every conversation.
|
||||
|
||||
These instructions are applied in addition to the **Input**, which is provided at runtime.
|
||||
|
||||
### Agent tools
|
||||
|
||||
Agents are most useful when they have the appropriate tools available to complete requests.
|
||||
|
||||
An Agent component can use any Langflow component as a tool, as long as you attach it to the Agent component.
|
||||
|
||||
:::tip
|
||||
To allow agents to use tools from MCP servers, use the [**MCP Tools** component](/components-tools#mcp-connection).
|
||||
:::
|
||||
|
||||
When you attach a component as a tool, you must configure the component as a tool by enabling **Tool Mode**.
|
||||
|
||||
For more information, see [Configure tools for agents](/agents-tools).
|
||||
</details>
|
||||
|
||||
## Use the Agent component in a flow
|
||||
|
||||
:::tip
|
||||
For a pre-built demonstration, open the **Simple Agent** template flow and follow along.
|
||||
:::
|
||||
|
||||
Create an agent in Langflow, starting with the **Agent** component and working outward.
|
||||
The following steps explain how to create an agentic flow in Langflow from a blank flow.
|
||||
For a prebuilt example, use the [**Simple Agent** template](/simple-agent) or try the [Langflow quickstart](/get-started-quickstart).
|
||||
|
||||
1. Click **New Flow**, and then click **Blank Flow**.
|
||||
2. Add an **Agent** component to your workspace.
|
||||
3. Use the default model or select another provider and model, and then provide credentials for your chosen provider. For example, to use the default model, you must provide an OpenAI API key.
|
||||
4. Add **Chat input** and **Chat output** components to your flow, and connect them to the tool calling agent.
|
||||
2. Add an **Agent** component to the **Workspace**.
|
||||
3. Enter a valid OpenAI API key.
|
||||
|
||||
|
||||
The default model for the **Agent** component is an OpenAI model.
|
||||
If you want to use a different provider, edit the **Model Provider**, **Model Name**, and **API Key** fields accordingly.
|
||||
For more information, see [Agent component parameters](#agent-component-parameters).
|
||||
|
||||
This basic flow allows you to chat with the agent in the **Playground**, but you're only chatting with the OpenAI LLM.
|
||||
To unlock the power of the Agent component, connect some tools.
|
||||
4. Add [**Chat input** and **Chat output** components](/components-io) to your flow, and then connect them to the **Agent** component.
|
||||
|
||||
5. Add the **News Search**, **URL**, and **Calculator** components to your flow.
|
||||
6. Enable **Tool Mode** in the **News Search**, **URL**, and **Calculator** components.
|
||||
In the [component's header menu](/concepts-components#component-menus), enable **Tool Mode** so you can use the component with an agent.
|
||||
At this point, you have created a basic LLM-based chat flow that you can test in the <Icon name="Play" aria-hidden="true" /> **Playground**.
|
||||
However, this flow only chats with the LLM.
|
||||
To enhance this flow and make it truly agentic, add some tools, as explained in the next steps.
|
||||
|
||||
**Tool Mode** makes a component into a tool by modifying the component's inputs to accept requests from the Agent component to use a tool's available actions. A component in tool mode has a **Toolset** port that you must connect to an Agent component's **Tools** port if you want to allow the agent to use the tool's actions.
|
||||
7. Connect the **Toolset** port on the three tool components to the **Tools** port on the Agent component.
|
||||
|
||||
|
||||
|
||||
5. Add **News Search**, **URL**, and **Calculator** components to your flow.
|
||||
6. Enable **Tool Mode** in the **News Search**, **URL**, and **Calculator** components:
|
||||
|
||||
8. Open the <Icon name="Play" aria-hidden="true" /> **Playground**. Ask the agent, `What tools are you using to answer my questions?`
|
||||
The agent should respond with a list of the connected tools.
|
||||
1. Click the **News Search** component to expose the [component's header menu](/concepts-components#component-menus), and then enable **Tool Mode**.
|
||||
2. Repeat for the **URL** and **Calculator** components.
|
||||
3. Connect the **Toolset** port for each tool component to the **Tools** port on the **Agent** component.
|
||||
|
||||
```text
|
||||
I use a combination of my built-in knowledge (up to June 2024) and a set of external tools to answer your questions. Here are the main types of tools I can use:
|
||||
Web Search & Content Fetching: I can fetch and summarize content from web pages, including crawling links recursively.
|
||||
News Search: I can search for recent news articles using Google News via RSS feeds.
|
||||
Calculator: I can perform arithmetic calculations and evaluate mathematical expressions.
|
||||
Date & Time: I can provide the current date and time in various time zones.
|
||||
These tools help me provide up-to-date information, perform calculations, and retrieve specific data from the internet when needed. If you have a specific question, let me know, and I'll use the most appropriate tool(s) to help!
|
||||
```
|
||||
**Tool Mode** makes a component into a tool by modifying the component's inputs.
|
||||
With **Tool Mode** enabled, a component can accept requests from an **Agent** component to use the component's available actions as tools.
|
||||
|
||||
9. Ask the agent, `Summarize today's tech news`.
|
||||
The Playground displays the agent's tool calls, what input was provided, and the raw output the agent received before generating the summary. The agent should call the **News Search** component's `search_news` action.
|
||||
When in **Tool Mode**, a component has a **Toolset** port that you must connect to an **Agent** component's **Tools** port if you want to allow the agent to use that component's actions as tools.
|
||||
|
||||
You've successfully constructed a flow with the Langflow Agent.
|
||||
Connect more tools to solve more specialized problems.
|
||||
For more information, see [Configure tools for agents](/agents-tools).
|
||||
|
||||
## See also
|
||||
|
||||
|
||||
* [Configure tools for agents](/agents-tools)
|
||||
8. Open the <Icon name="Play" aria-hidden="true" /> **Playground**, and then ask the agent, `What tools are you using to answer my questions?`
|
||||
|
||||
The agent should respond with a list of the connected tools.
|
||||
It may also include built-in tools.
|
||||
|
||||
```text
|
||||
I use a combination of my built-in knowledge (up to June 2024) and a set of external tools to answer your questions. Here are the main types of tools I can use:
|
||||
Web Search & Content Fetching: I can fetch and summarize content from web pages, including crawling links recursively.
|
||||
News Search: I can search for recent news articles using Google News via RSS feeds.
|
||||
Calculator: I can perform arithmetic calculations and evaluate mathematical expressions.
|
||||
Date & Time: I can provide the current date and time in various time zones.
|
||||
These tools help me provide up-to-date information, perform calculations, and retrieve specific data from the internet when needed. If you have a specific question, let me know, and I'll use the most appropriate tool(s) to help!
|
||||
```
|
||||
|
||||
9. To test a specific tool, ask the agent a question that uses one of the tools, such as `Summarize today's tech news`.
|
||||
|
||||
To help you debug and test your flows, the **Playground** displays the agent's tool calls, the provided input, and the raw output the agent received before generating the summary.
|
||||
With the given example, the agent should call the **News Search** component's `search_news` action.
|
||||
|
||||
You've successfully created a basic agentic flow that uses some generic tools.
|
||||
|
||||
To continue building on this tutorial, try connecting other tool components or [use Langflow as an MCP client](/mcp-client) to support more complex and specialized tasks.
|
||||
|
||||
For a multi-agent example, see [Use an agent as a tool](/agents-tools#use-an-agent-as-a-tool).
|
||||
|
||||
## Agent component parameters
|
||||
|
||||
You can configure the **Agent** component to use your preferred provider and model, custom instructions, and tools.
|
||||
|
||||
### Provider and model
|
||||
|
||||
Use the **Model Provider** (`agent_llm`) and **Model Name** (`llm_model`) settings to select the model provider and LLM that you want the agent to use.
|
||||
|
||||
The **Agent** component includes many models from several popular model providers.
|
||||
To access other providers and models, set **Model Provider** to **Custom**, and then connect a [**Language Model** component](/components-models).
|
||||
|
||||
:::tip
|
||||
If you need to generate embeddings in your flow, use an [**Embedding Model** component](/components-embedding-models).
|
||||
:::
|
||||
|
||||
### Model provider API key
|
||||
|
||||
In the **API Key** field, enter a valid authentication key for your selected model provider, if you selected one of the built-in providers.
|
||||
For example, to use the default OpenAI model, you must provide a valid OpenAI API key for an OpenAI account that has credits and permission to call OpenAI LLMs.
|
||||
|
||||
You can enter the key directly, but it is recommended that you follow industry best practices for storing and referencing API keys.
|
||||
For example, you can use a <Icon name="Globe" aria-hidden="true"/> [global variable](/configuration-global-variables) or [environment variables](/environment-variables).
|
||||
For more information, see [Add component API keys to Langflow](/configuration-api-keys#add-component-api-keys-to-langflow).
|
||||
|
||||
If you select **Custom** as the model provider, authentication is handled in the incoming **Language Model** component.
|
||||
|
||||
### Agent instructions and input
|
||||
|
||||
In the **Agent Instructions** (`system_prompt`) field, you can provide custom instructions that you want the **Agent** component to use for every conversation.
|
||||
|
||||
These instructions are applied in addition to the **Input** (`input_value`), which can be entered directly or provided through another component, such as a **Chat Input** component.
|
||||
|
||||
### Tools
|
||||
|
||||
Agents are most useful when they have the appropriate tools available to complete requests.
|
||||
|
||||
An **Agent** component can use any Langflow component as a tool, including other agents and MCP servers.
|
||||
|
||||
To attach a component as a tool, you must enable **Tool Mode** on the component that you want to attach, and then attach it to the **Agent** component's **Tools** port.
|
||||
For more information, see [Configure tools for agents](/agents-tools).
|
||||
|
||||
:::tip
|
||||
To allow agents to use tools from MCP servers, use the [**MCP Tools** component](/components-agents#mcp-connection).
|
||||
:::
|
||||
|
||||
### Additional parameters
|
||||
|
||||
Many optional **Agent** component input parameters are hidden by default in the visual editor.
|
||||
You can view and toggle all parameters through the <Icon name="SlidersHorizontal" aria-hidden="true"/> **Controls** in the [component's header menu](/concepts-components#component-menus).
|
||||
|
||||
With the **Agent** component, the available parameters can change depending on the selected provider and model.
|
||||
For example, some models support additional modes, arguments, or features like chat memory and temperature.
|
||||
|
||||
Some additional input parameters include the following:
|
||||
|
||||
* **Current Date** (`add_current_date_tool`): When enabled (`true`), this setting adds a tool to the agent that can retrieve the current date.
|
||||
* **Handle Parse Errors** (`handle_parsing_errors`): When enabled (`true`), this setting allows the agent to fix errors, like typos, when analyzing user input.
|
||||
* **Verbose** (`verbose`): When enabled (`true`), this setting records detailed logging output for debugging and analysis.
|
||||
|
||||
## Agent component output
|
||||
|
||||
The **Agent** component outputs a **Response** (`response`) that is [`Message` data](/data-types#message) containing the agent's raw response to the query.
|
||||
|
||||
Typically, this is passed to a **Chat Output** component to return the response in a human-readable format.
|
||||
It can also be passed to other components if you need to process the response further before, or in addition to, returning it to the user.
|
||||
Loading…
Add table
Add a link
Reference in a new issue