diff --git a/docs/docs/Agents/_category_.json b/docs/docs/Agents/_category_.json
new file mode 100644
index 000000000000..279ca75eea5e
--- /dev/null
+++ b/docs/docs/Agents/_category_.json
@@ -0,0 +1 @@
+{"position":5, "label":"Agents"}
\ No newline at end of file
diff --git a/docs/docs/Agents/agent-tool-calling-agent-component.md b/docs/docs/Agents/agent-tool-calling-agent-component.md
new file mode 100644
index 000000000000..177f1cb6240b
--- /dev/null
+++ b/docs/docs/Agents/agent-tool-calling-agent-component.md
@@ -0,0 +1,192 @@
+---
+title: Create a problem-solving agent
+sidebar_position: 2
+slug: /agents-tool-calling-agent-component
+---
+
+Developing **agents** in Langchain is complex.
+
+The `AgentComponent` is a component for easily creating an AI agent capable of analyzing tasks using tools you provide.
+
+The component contains all of the elements you'll need for creating an agent. Instead of managing LLM models and providers, pick your model and enter your API key. Instead of connecting a **Prompt** component, enter instructions in the component's **Agent Instruction** fields.
+
+
+
+Learn how to build a flow starting with the **Tool calling agent** component, and see how it can help you solve problems.
+
+## Prerequisites
+
+- [An OpenAI API key](https://platform.openai.com/)
+- [A Search API key](https://www.searchapi.io/)
+
+## Create a problem-solving agent with AgentComponent
+
+Create a problem-solving agent in Langflow, starting with the **Tool calling agent**.
+
+1. Click **New Flow**, and then click **Blank Flow**.
+2. Click and drag an **Agent** component to your workspace.
+The default settings are acceptable for now, so this guide assumes you're using **Open AI** for the LLM.
+3. Add your **Open AI API Key** to the **Agent** component.
+4. Add **Chat input** and **Chat output** components to your flow, and connect them to the tool calling agent.
+
+
+
+This basic flow enables you to chat with the agent with the **Playground** after you've connected some **Tools**.
+
+5. Connect the **Search API** tool component to your agent.
+6. Add your **Search API key** to the component.
+Your agent can now query the Search API for information.
+7. Connect a **Calculator** tool for solving basic math problems.
+8. Connect an **API Request** component to the agent.
+This component is not in the **Tools** category, but the agent can still use it as a tool by enabling **Tool Mode**.
+**Tool Mode** makes a component into a tool by adding a **Toolset** port that can be connected to an agent's **Tools** port.
+To enable **Tool Mode** on the component, click **Tool Mode**.
+The component's fields change dynamically based on the mode it's in.
+
+
+
+## Solve problems with the agent
+
+Your agent now has tools for performing a web search, doing basic math, and performing API requests. You can solve many problems with just these capabilities.
+
+* Your tabletop game group cancelled, and you're stuck at home.
+Point **API Request** to an online rules document, tell your agent `You are a fun game organizer who uses the tools at your disposal`, and play a game.
+* You need to learn a new software language quickly.
+Point **API Request** to some docs, tell your agent `You are a knowledgeable software developer who uses the tools at your disposal`, and start learning.
+
+See what problems you can solve with this flow. As your problem becomes more specialized, add a tool. For example, the [simple agent starter project](/starter-projects-simple-agent) adds a Python REPL component to solve math problems that are too challenging for the calculator.
+
+## Use an agent as a tool
+
+The agent component itself also supports **Tool Mode** for creating multi-agent flows.
+
+Add an agent to your problem-solving flow that uses a different OpenAI model for more specialized problem solving.
+
+1. Click and drag an **Agent** component to your workspace.
+2. Add your **Open AI API Key** to the **Agent** component.
+3. In the **Model Name** field, select `gpt-4o`.
+4. Click **Tool Mode** to use this new agent as a tool.
+5. Connect the new agent's **Toolset** port to the previously created agent's **Tools** port.
+6. Connect **Search API** and **API Request** to the new agent.
+The new agent will use `gpt-4o` for the larger tasks of scraping and searching information that requires large context windows.
+The problem-solving agent will now use this agent as a tool, with its unique LLM and toolset.
+
+
+
+## Add custom components as tools {#components-as-tools}
+
+An agent can use custom components as tools.
+
+1. To add a custom component to the problem-solving agent flow, click **New Custom Component**.
+
+2. Add custom Python code to the custom component.
+Here's an example text analyzer for sentiment analysis.
+
+```python
+from langflow.custom import Component
+from langflow.io import MessageTextInput, Output
+from langflow.schema import Data
+import re
+
+class TextAnalyzerComponent(Component):
+ display_name = "Text Analyzer"
+ description = "Analyzes and transforms input text."
+ documentation: str = "http://docs.langflow.org/components/custom"
+ icon = "chart-bar"
+ name = "TextAnalyzerComponent"
+
+ inputs = [
+ MessageTextInput(
+ name="input_text",
+ display_name="Input Text",
+ info="Enter text to analyze",
+ value="Hello, World!",
+ tool_mode=True,
+ ),
+ ]
+
+ outputs = [
+ Output(display_name="Analysis Result", name="output", method="analyze_text"),
+ ]
+
+ def analyze_text(self) -> Data:
+ text = self.input_text
+
+ # Perform text analysis
+ word_count = len(text.split())
+ char_count = len(text)
+ sentence_count = len(re.findall(r'\w+[.!?]', text))
+
+ # Transform text
+ reversed_text = text[::-1]
+ uppercase_text = text.upper()
+
+ analysis_result = {
+ "original_text": text,
+ "word_count": word_count,
+ "character_count": char_count,
+ "sentence_count": sentence_count,
+ "reversed_text": reversed_text,
+ "uppercase_text": uppercase_text
+ }
+
+ data = Data(value=analysis_result)
+ self.status = data
+ return data
+```
+
+3. To enable the custom component as a tool, click **Tool Mode**.
+4. Connect the tool output to the agent's tools input.
+5. Ask the agent, `What tools are you using to answer my questions?`
+Your response will be similar to the following, and will include your custom component.
+```plain
+I have access to several tools that assist me in answering your questions, including:
+Search API: This allows me to search for recent information or results on the web.
+HTTP Requests: I can make HTTP requests to various URLs to retrieve data or interact with APIs.
+Calculator: I can evaluate basic arithmetic expressions.
+Text Analyzer: I can analyze and transform input text.
+Current Date and Time: I can retrieve the current date and time in various time zones.
+```
+
+4. Click **Check & Save**.
+
+Your component now has a **Tool Mode** button, and can be used by an agent.
+
+## Make any component a tool
+
+These components support **Tool Mode**:
+
+* **URL**
+* **API request**
+* **Calculator**
+* **Current date**
+
+If the component you want to use as a tool doesn't have a **Tool Mode** button, add `tool_mode=True` to the component's code under `MessageTextInput`.
+
+For example, in the [components as tools](#components-as-tools) example above, `tool_mode=True,` is added so the custom component can be used as a tool.
+
+**Tool Mode** supports the `MessageTextInput` type.
+
+```python
+inputs = [
+ MessageTextInput(
+ name="input_text",
+ display_name="Input Text",
+ info="Enter text to analyze",
+ value="Hello, World!",
+ tool_mode=True,
+ ),
+]
+```
+
+## Add flows as tools
+
+An agent can use flows that are saved in your workspace as tools.
+
+1. To add a **Flow as tool** component, click and drag a **Flow as tool** component to your workspace.
+2. Select the flow you want the agent to use as a tool.
+3. Connect the tool output to the agent's tools input.
+4. Ask the agent, `What tools are you using to answer my questions?`
+Your **Flow as tool** flow should be visible in the response.
+
+
diff --git a/docs/docs/Agents/agents-overview.md b/docs/docs/Agents/agents-overview.md
new file mode 100644
index 000000000000..d8901eb76ba0
--- /dev/null
+++ b/docs/docs/Agents/agents-overview.md
@@ -0,0 +1,15 @@
+---
+title: Agents overview
+sidebar_position: 1
+slug: /agents-overview
+---
+
+**Agents** are AI systems that use LLMs as a brain to analyze problems and select external tools.
+
+Instead of developers having to create logical statements to direct every possible path of a program, an agent can operate with autonomy. An agent can leverage external tools and APIs to gather information and take action, demonstrate chain-of-thought reasoning, and generate tailored text for specific purposes.
+
+To simplify the development of agents, Langflow created a custom [Tool calling agent](/components-agents#agent-component) component that simplifies configuration and lets developers focus on solving problems with agents.
+
+
+
+To get started, see [Create a problem solving agent](/agents-tool-calling-agent-component).
\ No newline at end of file
diff --git a/docs/docs/Components/_category_.json b/docs/docs/Components/_category_.json
index fdcf118239bf..62531e49ed92 100644
--- a/docs/docs/Components/_category_.json
+++ b/docs/docs/Components/_category_.json
@@ -1 +1 @@
-{"position":5, "label":"Components"}
\ No newline at end of file
+{"position":6, "label":"Components"}
\ No newline at end of file
diff --git a/docs/docs/Components/components-agents.md b/docs/docs/Components/components-agents.md
index 778e33567c33..ef121cce3869 100644
--- a/docs/docs/Components/components-agents.md
+++ b/docs/docs/Components/components-agents.md
@@ -1,14 +1,38 @@
-# Agents
+---
+title: Types of agents in Langflow
+sidebar_position: 12
+slug: /components-agents
+---
-Agent components are used to define the behavior and capabilities of AI agents in your flow. Agents can interact with APIs, databases, and other services, but can also use LLMs as a reasoning engine to decide which course to take in your flow.
+Agent components are used to define the behavior and capabilities of AI agents in your flow. Agents can interact with APIs, databases, and other services and use LLMs as a reasoning engine to decide which course to take in your flow.
+
+## Agent component {#agent-component}
+
+This component creates an agent that can use tools to answer questions and perform tasks based on given instructions.
+
+For more information on this component, see the [tool calling agent documentation](/agents-tool-calling-agent-component).
+
+### Inputs
+
+| Name | Type | Description |
+|----------------------|----------|-------------------------------------------------------------------------------------------------|
+| agent_llm | Dropdown | The provider of the language model that the agent will use to generate responses. |
+| system_prompt | String | Initial instructions and context provided to guide the agent's behavior. |
+| tools | List | List of tools available for the agent to use. |
+| input_value | String | The input task or question for the agent to process. |
+| add_current_date_tool| Boolean | If true, adds a tool to the agent that returns the current date. |
+
+### Outputs
+
+| Name | Type | Description |
+|----------|---------|-------------------------------------------------|
+| response | Message | The agent's response to the given input task. |
## CSV Agent
This component creates a CSV agent from a CSV file and LLM.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
@@ -16,7 +40,7 @@ This component creates a CSV agent from a CSV file and LLM.
| path | File | Path to the CSV file |
| agent_type | String | Type of agent to create (zero-shot-react-description, openai-functions, or openai-tools) |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -28,9 +52,7 @@ This component represents an Agent of CrewAI, allowing for the creation of speci
For more information, see the [CrewAI documentation](https://docs.crewai.com/core-concepts/Agents/).
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -45,7 +67,7 @@ For more information, see the [CrewAI documentation](https://docs.crewai.com/cor
| allow_code_execution | Allow Code Execution | Whether the agent is allowed to execute code |
| kwargs | kwargs | Additional keyword arguments for the agent |
-#### Outputs
+### Outputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -57,9 +79,7 @@ This component represents a group of agents, managing how they should collaborat
For more information, see the [CrewAI documentation](https://docs.crewai.com/how-to/Hierarchical/).
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -74,7 +94,7 @@ For more information, see the [CrewAI documentation](https://docs.crewai.com/how
| share_crew | Share Crew | Determines if the crew information is shared among agents |
| function_calling_llm | Function Calling LLM | Specifies the language model for function calling |
-#### Outputs
+### Outputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -84,16 +104,14 @@ For more information, see the [CrewAI documentation](https://docs.crewai.com/how
This component creates a JSON agent from a JSON or YAML file and an LLM.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
| llm | LanguageModel | Language model to use for the agent |
| path | File | Path to the JSON or YAML file |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -105,9 +123,7 @@ This component creates an OpenAI Tools Agent using LangChain.
For more information, see the [LangChain documentation](https://python.langchain.com/v0.1/docs/modules/agents/agent_types/openai_tools/).
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
@@ -117,7 +133,7 @@ For more information, see the [LangChain documentation](https://python.langchain
| chat_history | List[Data] | Optional chat history for the agent |
| tools | List[Tool] | List of tools available to the agent |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -129,9 +145,7 @@ This component creates an OpenAPI Agent to interact with APIs defined by OpenAPI
For more information, see the LangChain documentation on OpenAPI Agents.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
@@ -139,7 +153,7 @@ For more information, see the LangChain documentation on OpenAPI Agents.
| path | File | Path to the OpenAPI specification file (JSON or YAML) |
| allow_dangerous_requests | Boolean | Whether to allow potentially dangerous API requests |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -149,9 +163,7 @@ For more information, see the LangChain documentation on OpenAPI Agents.
This component creates a SQL Agent to interact with SQL databases.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
@@ -159,7 +171,7 @@ This component creates a SQL Agent to interact with SQL databases.
| database_uri | String | URI of the SQL database to connect to |
| extra_tools | List[Tool] | Additional tools to provide to the agent (optional) |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -171,9 +183,7 @@ This component represents a group of agents with tasks that are executed sequent
For more information, see the [CrewAI documentation](https://docs.crewai.com/how-to/Sequential/).
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -185,7 +195,7 @@ For more information, see the [CrewAI documentation](https://docs.crewai.com/how
| share_crew | Share Crew | Determines if the crew information is shared among agents |
| function_calling_llm | Function Calling LLM | Specifies the language model for function calling |
-#### Outputs
+### Outputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -197,9 +207,7 @@ This component creates a CrewAI Task and its associated Agent, allowing for the
For more information, see the [CrewAI documentation](https://docs.crewai.com/how-to/Sequential/).
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -218,7 +226,7 @@ For more information, see the [CrewAI documentation](https://docs.crewai.com/how
| async_execution | Async Execution | Boolean flag indicating asynchronous task execution |
| previous_task | Previous Task | The previous task in the sequence (for chaining) |
-#### Outputs
+### Outputs
| Name | Display Name | Info |
|------|--------------|------|
@@ -228,9 +236,7 @@ For more information, see the [CrewAI documentation](https://docs.crewai.com/how
This component creates a Tool Calling Agent using LangChain.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
@@ -240,7 +246,7 @@ This component creates a Tool Calling Agent using LangChain.
| chat_history | List[Data] | Optional chat history for the agent |
| tools | List[Tool] | List of tools available to the agent |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -250,16 +256,14 @@ This component creates a Tool Calling Agent using LangChain.
This component creates a Vector Store Agent using LangChain.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
| llm | LanguageModel | Language model to use for the agent |
| vectorstore | VectorStoreInfo | Vector store information for the agent to use |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -269,16 +273,14 @@ This component creates a Vector Store Agent using LangChain.
This component creates a Vector Store Router Agent using LangChain.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
| llm | LanguageModel | Language model to use for the agent |
| vectorstores | List[VectorStoreInfo] | List of vector store information for the agent to route between |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
@@ -290,9 +292,7 @@ This component creates an XML Agent using LangChain.
The agent uses XML formatting for tool instructions to the Language Model.
-### Parameters
-
-#### Inputs
+### Inputs
| Name | Type | Description |
|------|------|-------------|
@@ -300,7 +300,7 @@ The agent uses XML formatting for tool instructions to the Language Model.
| user_prompt | String | Custom prompt template for the agent (includes XML formatting instructions) |
| tools | List[Tool] | List of tools available to the agent |
-#### Outputs
+### Outputs
| Name | Type | Description |
|------|------|-------------|
diff --git a/docs/docs/Components/components-logic.md b/docs/docs/Components/components-logic.md
new file mode 100644
index 000000000000..6d2cc0d58718
--- /dev/null
+++ b/docs/docs/Components/components-logic.md
@@ -0,0 +1,147 @@
+# Logic components in Langflow
+
+Logic components provide functionalities for routing, conditional processing, and flow management.
+
+## Conditional router
+
+This component routes an input message to a corresponding output based on text comparison.
+
+The ConditionalRouterComponent routes messages based on text comparison. It evaluates a condition by comparing two text inputs using a specified operator and routes the message accordingly.
+
+### Inputs
+
+| Name | Type | Description |
+|----------------|----------|-------------------------------------------------------------------|
+| input_text | String | The primary text input for the operation. |
+| match_text | String | The text input to compare against. |
+| operator | Dropdown | The operator to apply for comparing the texts. |
+| case_sensitive | Boolean | If true, the comparison will be case sensitive. |
+| message | Message | The message to pass through either route. |
+| max_iterations | Integer | The maximum number of iterations for the conditional router. |
+| default_route | Dropdown | The default route to take when max iterations are reached. |
+
+### Outputs
+
+| Name | Type | Description |
+|--------------|---------|--------------------------------------------|
+| true_result | Message | The output when the condition is true. |
+| false_result | Message | The output when the condition is false. |
+
+## Data conditional router
+
+This component routes `Data` objects based on a condition applied to a specified key, including boolean validation.
+
+This component is particularly useful in workflows that require conditional routing of complex data structures, enabling dynamic decision-making based on data content.
+
+### Inputs
+
+| Name | Type | Description |
+|---------------|----------|-----------------------------------------------------------------------------------|
+| data_input | Data | The data object or list of data objects to process. |
+| key_name | String | The name of the key in the data object to check. |
+| operator | Dropdown | The operator to apply for comparing the values. |
+| compare_value | String | The value to compare against (not used for boolean validator). |
+
+### Outputs
+
+| Name | Type | Description |
+|--------------|-------------|------------------------------------------------------|
+| true_output | Data/List | Output when the condition is met. |
+| false_output | Data/List | Output when the condition is not met. |
+
+
+## Flow as Tool
+
+This component constructs a tool from a function that runs a loaded flow.
+
+### Inputs
+
+| Name | Type | Description |
+|------------------|----------|------------------------------------------------------------|
+| flow_name | Dropdown | The name of the flow to run. |
+| tool_name | String | The name of the tool. |
+| tool_description | String | The description of the tool. |
+| return_direct | Boolean | If true, returns the result directly from the tool. |
+
+### Outputs
+
+| Name | Type | Description |
+|----------------|------|----------------------------------------|
+| api_build_tool | Tool | The constructed tool from the flow. |
+
+## Listen
+
+This component listens for a notification and retrieves its associated state.
+
+### Inputs
+
+| Name | Type | Description |
+|------|--------|------------------------------------------------|
+| name | String | The name of the notification to listen for. |
+
+### Outputs
+
+| Name | Type | Description |
+|--------|------|--------------------------------------------|
+| output | Data | The state associated with the notification. |
+
+## Notify
+
+This component generates a notification for the Listen component to use.
+
+### Inputs
+
+| Name | Type | Description |
+|--------|---------|-------------------------------------------------------------------|
+| name | String | The name of the notification. |
+| data | Data | The data to store in the notification. |
+| append | Boolean | If true, the record will be appended to the existing notification.|
+
+### Outputs
+
+| Name | Type | Description |
+|--------|------|-----------------------------------------|
+| output | Data | The data stored in the notification. |
+
+## Run flow
+
+This component allows you to run a specified flow with given inputs and tweaks.
+
+The RunFlowComponent executes a specified flow within a larger workflow. It provides the ability to run a flow with custom inputs and apply tweaks to modify its behavior.
+
+### Inputs
+
+| Name | Type | Description |
+|-------------|--------------|-------------------------------------------------------|
+| input_value | String | The input value for the flow to process. |
+| flow_name | Dropdown | The name of the flow to run. |
+| tweaks | Nested Dict | Tweaks to apply to the flow. |
+
+### Outputs
+
+| Name | Type | Description |
+|-------------|-------------|------------------------------------------------|
+| run_outputs | List[Data] | The results generated from running the flow. |
+
+## Sub Flow
+
+This `SubFlowComponent` generates a component from a flow with all of its inputs and outputs.
+
+This component can integrate entire flows as components within a larger workflow. It dynamically generates inputs based on the selected flow and executes the flow with provided parameters.
+
+### Inputs
+
+| Name | Type | Description |
+|-----------|----------|------------------------------------|
+| flow_name | Dropdown | The name of the flow to run. |
+
+### Outputs
+
+| Name | Type | Description |
+|--------------|-------------|---------------------------------------|
+| flow_outputs | List[Data] | The outputs generated from the flow. |
+
+
+
+
+
diff --git a/docs/docs/Deployment/_category_.json b/docs/docs/Deployment/_category_.json
index 6d03dfaa4f29..41f76d47b9b7 100644
--- a/docs/docs/Deployment/_category_.json
+++ b/docs/docs/Deployment/_category_.json
@@ -1 +1 @@
-{"position":6, "label":"Deployment"}
\ No newline at end of file
+{"position":7, "label":"Deployment"}
\ No newline at end of file
diff --git a/docs/static/img/tool-calling-agent-add-chat.png b/docs/static/img/tool-calling-agent-add-chat.png
new file mode 100644
index 000000000000..2bb08ff68ceb
Binary files /dev/null and b/docs/static/img/tool-calling-agent-add-chat.png differ
diff --git a/docs/static/img/tool-calling-agent-add-tools.png b/docs/static/img/tool-calling-agent-add-tools.png
new file mode 100644
index 000000000000..3e13e7132c47
Binary files /dev/null and b/docs/static/img/tool-calling-agent-add-tools.png differ
diff --git a/docs/static/img/tool-calling-agent-as-tool.png b/docs/static/img/tool-calling-agent-as-tool.png
new file mode 100644
index 000000000000..e3e7d3498228
Binary files /dev/null and b/docs/static/img/tool-calling-agent-as-tool.png differ
diff --git a/docs/static/img/tool-calling-agent-component.png b/docs/static/img/tool-calling-agent-component.png
new file mode 100644
index 000000000000..6b86c4673c60
Binary files /dev/null and b/docs/static/img/tool-calling-agent-component.png differ