merge dev into two_edges

This commit is contained in:
cristhianzl 2024-06-17 10:01:28 -03:00
commit fcf4512210
133 changed files with 2534 additions and 1507 deletions

View file

@ -15,7 +15,7 @@ Please do not try to push directly to this repo unless you are a maintainer.
You can develop Langflow using docker compose, or locally.
We provide a .vscode/launch.json file for debugging the backend in VSCode, which is a lot faster than using docker compose.
We provide a `.vscode/launch.json` file for debugging the backend in VSCode, which is a lot faster than using docker compose.
Setting up hooks:

View file

@ -84,7 +84,7 @@ To debug, hover over the component status to see the outputs.
### Component Parameters
Langflow components can be edited by clicking the component settings button. Hide parameters to reduce complexity and keep the canvas clean and intuitive for experimentation.
Langflow components can be edited by clicking the component settings button.
<div
style={{ marginBottom: "20px", display: "flex", justifyContent: "center" }}
@ -92,6 +92,10 @@ Langflow components can be edited by clicking the component settings button. Hid
<ReactPlayer playing controls url="/videos/langflow_parameters.mp4" />
</div>
Hide parameters with the **SHOW** button to reduce complexity and keep the canvas clean and intuitive for experimentation.
Double-click the component name to rename it.
### Component menu
Each component is a little unique, but they will all have a menu bar on top that looks something like this.

View file

@ -32,49 +32,49 @@ We have a special channel in our Discord server dedicated to Langflow 1.0 migrat
Langflow 1.0 introduces adds the concept of Inputs and Outputs to flows, allowing a clear definition of the data flow between components. Discover how to use Inputs and Outputs to pass data between components and create more dynamic flows.
[Learn more about Inputs and Outputs of Components](../components/inputs-and-outputs)
[Learn more about Inputs and Outputs](../components/inputs-and-outputs.mdx)
## To Compose or Not to Compose: the choice is yours
## To Compose or Not to Compose: The Choice is Yours
Even though composition is still possible in Langflow 1.0, the new standard is getting data moving through the flow. This allows for more flexibility and control over the data flow in your projects.
We will create guides on how to interweave LangChain components with our Core components soon.
[See our example components](../examples/create-record.mdx) for examples of interweaving LangChain components with our Core components.
## Continued Support for LangChain and Multiple Frameworks
Langflow 1.0 continues to support LangChain while also introducing support for multiple frameworks. This is another important boon that adding the paradigm of data flow brings to the table. Find out how to leverage the power of different frameworks in your projects.
**Guide coming soon**
[Learn more about compatibility and updating existing flows](./compatibility.mdx)
## Sidebar Redesign and Customizable Playground
We've expanded on the chat experience by creating a customizable interaction panel that allows you to design a panel that fits your needs and interact with it. The sidebar has also been redesigned to provide a more intuitive and user-friendly experience. Explore the new sidebar and interaction panel features to enhance your workflow.
**Guide coming soon**
[Learn more about the Playground](../administration/playground.mdx)
## New Native Categories and Components
Langflow 1.0 introduces many new native categories, including Inputs, Outputs, Helpers, Experimental, Models, and more. Discover the new components available, such as Chat Input, Prompt, Files, API Request, and others.
**Guide coming soon**
[Learn more about new components](../components/inputs-and-outputs.mdx)
## New Way of Using Langflow: Text and Data (and more to come)
With the introduction of Text and Data types connections between Components are more intuitive and easier to understand. This is the first step in a series of improvements to the way you interact with Langflow. Learn how to use Text, and Data and how they help you build better flows.
[Learn more about Text and Data](../components/text-and-record)
[Learn more about Text and Record](../components/text-and-record.mdx)
## CustomComponent for All Components
Almost all components in Langflow 1.0 are now CustomComponents, allowing you to check and modify the code of each component. Discover how to leverage this feature to customize your components to your specific needs.
**Guide coming soon**
[Learn more about CustomComponents](../components/custom.mdx)
## Compatibility with Previous Versions
To use flows built in previous versions of Langflow, you can utilize the experimental component Runnable Executor along with an Input and Output. **We'd love your feedback on this**. Learn how to adapt your existing flows to work seamlessly in the new version of Langflow.
[Learn more about Compatibility with Previous Versions](../migration/compatibility)
[Learn more about Compatibility with Previous Versions](./compatibility.mdx)
## Multiple Flows in the Canvas
@ -86,25 +86,25 @@ Langflow 1.0 allows you to have more than one flow in the canvas and run them se
Each component now displays its status more clearly, allowing you to quickly identify any issues or errors. Explore how to use the new component status feature to troubleshoot and optimize your flows.
**Guide coming soon**
[Learn more about Component Status](../getting-started/canvas.mdx#component)
## Connecting Output Components
You can now connect Output components to any other component (that has a Text output), providing a better understanding of the data flow. Explore the possibilities of connecting Output components and how it enhances your flow's functionality.
**Guide coming soon**
[Learn more about Inputs and Outputs](../components/inputs-and-outputs.mdx)
## Renaming and Editing Component Descriptions
Langflow 1.0 allows you to rename and edit the description of each component, making it easier to understand and interact with the flow. Learn how to customize your component names and descriptions for improved clarity.
**Guide coming soon**
[Learn more about Component Descriptions](../getting-started/canvas.mdx#component-parameters)
## Passing Tweaks and Inputs in the API
Things got a whole lot easier. You can now pass tweaks and inputs in the API by referencing the Display Name of the component. Discover how to leverage this feature to dynamically control your flow's behavior.
**Guide coming soon**
[Learn more about Tweaks and API inputs](../getting-started/canvas.mdx#tweaks)
## Global Variables for Text Fields
@ -116,11 +116,11 @@ Global Variables can be used in any Text Field across your projects. Learn how t
Explore the experimental components available in Langflow 1.0, such as SubFlow, which allows you to load a flow as a component dynamically, and Flow as Tool, which enables you to use a flow as a tool for an Agent.
**Guide coming soon**
[Learn more about Experimental Components](../components/experimental.mdx)
## Experimental State Management System
We are experimenting with a State Management system for flows that allows components to trigger other components and pass messages between them using the Notify and Listen components. Discover how to leverage this system to create more dynamic and interactive flows.
We are experimenting with a State Management system for flows that allow components to trigger other components and pass messages between them using the Notify and Listen components. Discover how to leverage this system to create more dynamic and interactive flows.
**Guide coming soon**

View file

@ -14,7 +14,7 @@ In this guide, we will use Astra DB as a vector store to store and retrieve the
<Admonition type="tip">
This guide assumes that you have Langflow up and running. If you are new to
Langflow, you can check out the [Getting
Started](../getting-started/install-langflow.mdx) guide.
Started](../getting-started/install-langflow) guide.
</Admonition>
TLDR;
@ -41,7 +41,7 @@ Once you have created an account, you will be taken to the Astra DB dashboard. C
alt="Docusaurus themed image"
sources={{
light: "img/astra-create-database.png",
dark: "img/astra-create-database.png",
dark: "img/astra-create-database.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
@ -54,7 +54,7 @@ After you have configured your database, click on the **Create Database** button
alt="Docusaurus themed image"
sources={{
light: "img/astra-configure-deployment.png",
dark: "img/astra-configure-deployment.png",
dark: "img/astra-configure-deployment.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
@ -65,7 +65,7 @@ Once your database is initialized, to the right of the page, you will see the _D
alt="Docusaurus themed image"
sources={{
light: "img/astra-generate-token.png",
dark: "img/astra-generate-token.png",
dark: "img/astra-generate-token.png"
}}
style={{ width: "50%", margin: "20px auto" }}
/>
@ -97,7 +97,7 @@ The ingestion flow consists of:
alt="Docusaurus themed image"
sources={{
light: "img/astra-ingestion-flow.png",
dark: "img/astra-ingestion-flow.png",
dark: "img/astra-ingestion-flow.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
@ -108,7 +108,7 @@ Now, let's update the **Astra DB** and **Astra DB Search** components with the *
alt="Docusaurus themed image"
sources={{
light: "img/astra-ingestion-fields.png",
dark: "img/astra-ingestion-fields.png",
dark: "img/astra-ingestion-fields.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
@ -119,7 +119,7 @@ And run it! This will ingest the Text data from your file into the Astra DB data
alt="Docusaurus themed image"
sources={{
light: "img/astra-ingestion-run.png",
dark: "img/astra-ingestion-run.png",
dark: "img/astra-ingestion-run.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
@ -141,23 +141,23 @@ The RAG flow is a bit more complex. It consists of:
alt="Docusaurus themed image"
sources={{
light: "img/astra-rag-flow.png",
dark: "img/astra-rag-flow.png",
dark: "img/astra-rag-flow.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
To run it all we have to do is click on the 🤖 _Playground_ button and start interacting with your RAG application.
To run it all we have to do is click on the **![Playground icon](/logos/botmessage.svg)Playground** button and start interacting with your RAG application.
<ZoomableImage
alt="Docusaurus themed image"
sources={{
light: "img/astra-rag-flow-run.png",
dark: "img/astra-rag-flow-run.png",
dark: "img/astra-rag-flow-run.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
This opens the Playground where you can chat your data.
This opens the Playground where you can chat with your data.
Because this flow has a **Chat Input** and a **Text Output** component, the Panel displays a chat input at the bottom and the Extracted Chunks section on the left.
@ -165,7 +165,7 @@ Because this flow has a **Chat Input** and a **Text Output** component, the Pane
alt="Docusaurus themed image"
sources={{
light: "img/astra-rag-flow-interaction-panel.png",
dark: "img/astra-rag-flow-interaction-panel.png",
dark: "img/astra-rag-flow-interaction-panel.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
@ -176,7 +176,7 @@ Once we interact with it we get a response and the Extracted Chunks section is u
alt="Docusaurus themed image"
sources={{
light: "img/astra-rag-flow-interaction-panel-interaction.png",
dark: "img/astra-rag-flow-interaction-panel-interaction.png",
dark: "img/astra-rag-flow-interaction-panel-interaction.png"
}}
style={{ width: "80%", margin: "20px auto" }}
/>
@ -189,13 +189,4 @@ In this guide, we have learned how to run a RAG application using Astra DB and L
We have seen how to create an Astra DB database, import the Astra DB RAG Flows project into Langflow, and run the ingestion and RAG flows.import ThemedImage from "@theme/ThemedImage";
import useBaseUrl from "@docusaurus/useBaseUrl";
import ZoomableImage from "/src/theme/ZoomableImage.js";
import Admonition from "@theme/Admonition";import ThemedImage from "@theme/ThemedImage";
import useBaseUrl from "@docusaurus/useBaseUrl";
import ZoomableImage from "/src/theme/ZoomableImage.js";
import Admonition from "@theme/Admonition";import ThemedImage from "@theme/ThemedImage";
import useBaseUrl from "@docusaurus/useBaseUrl";
import ZoomableImage from "/src/theme/ZoomableImage.js";
import Admonition from "@theme/Admonition";import ThemedImage from "@theme/ThemedImage";
import useBaseUrl from "@docusaurus/useBaseUrl";
import ZoomableImage from "/src/theme/ZoomableImage.js";
import Admonition from "@theme/Admonition";