feat: Update sidebar link to Langflow workspace
This commit is contained in:
Rodrigo
Gabriel Luiz Freitas Almeida
parent
b8581581ea
commit
399a651531
17 changed files with 117 additions and 99 deletions
|
|
@ -73,7 +73,7 @@ Você também pode visualizar o Langflow no [HuggingFace Spaces](https://hugging
|
|||
|
||||
# 🎨 Criar Fluxos
|
||||
|
||||
Criar fluxos com Langflow é fácil. Basta arrastar componentes da barra lateral para o canvas e conectá-los para começar a construir sua aplicação.
|
||||
Criar fluxos com Langflow é fácil. Basta arrastar componentes da barra lateral para o workspace e conectá-los para começar a construir sua aplicação.
|
||||
|
||||
Explore editando os parâmetros do prompt, agrupando componentes e construindo seus próprios componentes personalizados (Custom Components).
|
||||
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ You can also preview Langflow in [HuggingFace Spaces](https://huggingface.co/spa
|
|||
|
||||
# 🎨 Create Flows
|
||||
|
||||
Creating flows with Langflow is easy. Simply drag components from the sidebar onto the canvas and connect them to start building your application.
|
||||
Creating flows with Langflow is easy. Simply drag components from the sidebar onto the workspace and connect them to start building your application.
|
||||
|
||||
Explore by editing prompt parameters, grouping components into a single high-level component, and building your own Custom Components.
|
||||
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ As long as you have a flow's environment variables set, you can run it by clicki
|
|||
|
||||
## Playground I/O
|
||||
|
||||
The Playground's appearance changes depending on what components are in your canvas.
|
||||
The Playground's appearance changes depending on what components are in your workspace.
|
||||
|
||||
Adding or removing any of the below components modifies your Playground so you can monitor the inputs and outputs.
|
||||
|
||||
|
|
@ -58,4 +58,3 @@ When you send a message, under **Memories**, you can view a table of previous in
|
|||
Langflow allows every chat message to be stored, and a single flow can have multiple memory sessions. This enables you to create multiple “memories” for agents to store and recall specific information as needed.
|
||||
|
||||
You can edit and remove previous messages to inspect and validate a model’s response behavior.
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ This class is the foundation for creating custom components. It allows users to
|
|||
|
||||
### Methods
|
||||
|
||||
**build:** This method is essential in a `CustomComponent` class. It defines the component's functionality and how it processes input data. The build method is invoked when you click the **Build** button on the canvas.
|
||||
**build:** This method is essential in a `CustomComponent` class. It defines the component's functionality and how it processes input data. The build method is invoked when you click the **Build** button on the workspace.
|
||||
|
||||
The following types are supported in the build method:
|
||||
|
||||
|
|
@ -102,4 +102,4 @@ The `CustomComponent` class also provides helpful methods for specific tasks (e.
|
|||
|
||||
- `status`: Shows values from the `build` method, useful for debugging.
|
||||
- `field_order`: Controls the display order of fields.
|
||||
- `icon`: Sets the canvas display icon.
|
||||
- `icon`: Sets the workspace display icon.
|
||||
|
|
|
|||
|
|
@ -4,33 +4,60 @@ import ZoomableImage from "/src/theme/ZoomableImage.js";
|
|||
import ReactPlayer from "react-player";
|
||||
import Admonition from "@theme/Admonition";
|
||||
|
||||
# 🎨 Langflow Canvas
|
||||
# 🖥️ Langflow Workspace
|
||||
|
||||
The **Langflow canvas** is the central hub of Langflow, where you'll assemble new flows from components, run them, and see the results.
|
||||
# The Langflow Workspace Interface
|
||||
|
||||
To get a feel for the canvas, we'll examine a basic prompting flow.
|
||||
You can either build this flow yourself, or select **New Project** > **Basic prompting** to open a canvas with the flow pre-built.
|
||||
The Langflow Workspace interface is designed to facilitate the creation, management, and execution of flows. It features a minimalistic design with various menus and options that are accessible for building and customizing a chatbot.
|
||||
|
||||
## Flows, components, collections, and projects
|
||||
### Sidebar Menu
|
||||
|
||||
A [flow](#flow) is a pipeline of components connected together in the Langflow canvas.
|
||||
Located on the left, this menu includes several collapsible sections that categorize the different types of pre-built components available in Langflow.
|
||||
|
||||
A [component](#component) is a single building block within a flow. A component has inputs, outputs, and parameters that define its functionality.
|
||||
### Workspace Area
|
||||
|
||||
A [collection](#collection) is a snapshot of the flows available in your database. Collections can be downloaded to local storage and uploaded for future use.
|
||||
The large central area where users can visually assemble and connect components to create flows.
|
||||
|
||||
A [project](#project) can be a component or a flow. Projects are saved as part of your collection.
|
||||
## Top Navigation Bar
|
||||
|
||||
For example, the **OpenAI LLM** is a **component** of the **Basic prompting** flow, and the **flow** is stored in a **collection**.
|
||||
- **Project Options**: Indicates the name of the current project or document. Clicking here allows users to rename the project or access project settings.
|
||||
- **My Collection**: Provides access to saved or user-defined collections of components or flows.
|
||||
- **Store**: Opens the component store where users can browse and add new components to their workspace.
|
||||
|
||||
## Control Panel
|
||||
|
||||
- **Star**: Located in the top-right corner, allowing users to star or favorite the project for easy access.
|
||||
- **Playground**: Button that executes the current flow in the workspace.
|
||||
- **API**: Provides API access details and integration options for the current flow.
|
||||
- **Share**: Allows users to share their project or flow with others, providing options for collaboration and review.
|
||||
|
||||
## Footer
|
||||
|
||||
- **Langflow DataStax**: Displays the branding, indicating that the workspace is part of the Langflow suite, maintained or developed by DataStax.
|
||||
|
||||
## Utility Buttons
|
||||
|
||||
- **Plus (+)**: Located at the bottom of the sidebar, used to add new components to the workspace.
|
||||
- **Settings (gear icon)**: Provides access to settings for the Langflow Workspace, where users can customize their experience or manage account settings.
|
||||
|
||||
The **Langflow Workspace** is where you assemble new flows by connecting components and run them. To get started, click on **New Project**. You can either build a flow from scratch (Blank Flow) or choose from pre-built starter examples.
|
||||
|
||||
## Flows & Components
|
||||
|
||||
A [flow](#flow) is a pipeline of components connected together in the Langflow Workspace.
|
||||
|
||||
A [component](#component) is a single building block within a flow. It has inputs, outputs, and parameters that define its functionality.
|
||||
|
||||
For example, the **OpenAI Model** is a **component** of the **Basic Prompting** flow.
|
||||
|
||||
## Flow
|
||||
|
||||
A **flow** is a pipeline of components connected together in the Langflow canvas.
|
||||
A **Flow** is a sequence of components that are connected to perform a series of operations or tasks. Each flow is essentially a pipeline where data functions travel through various components, each modifying or analyzing the data according to its specific functionality.
|
||||
|
||||
For example, the [Basic prompting](../starter-projects/basic-prompting) flow is a pipeline of four components:
|
||||
For example, the [Basic Prompting](../starter-projects/basic-prompting) flow is a pipeline of four components:
|
||||
|
||||
<ZoomableImage
|
||||
alt="Docusaurus themed image"
|
||||
alt="Basic Prompting Flow"
|
||||
sources={{
|
||||
light: useBaseUrl("img/basic-prompting.png"),
|
||||
dark: useBaseUrl("img/basic-prompting.png"),
|
||||
|
|
@ -38,22 +65,23 @@ For example, the [Basic prompting](../starter-projects/basic-prompting) flow is
|
|||
style={{ width: "100%", maxWidth: "800px", margin: "0 auto" }}
|
||||
/>
|
||||
|
||||
In this flow, the **OpenAI LLM component** receives input (left side) and produces output (right side) - in this case, receiving input from the **Chat Input** and **Prompt** components and producing output to the **Chat Output** component.
|
||||
In this flow, the **OpenAI Model** receives input (left side) and produces output (right side) - in this case, receiving input from the **Chat Input** and **Prompt** components and passing the output to the **Chat Output** component.
|
||||
|
||||
## Component
|
||||
|
||||
Components are the building blocks of flows. They consist of inputs, outputs, and parameters that define their functionality. These elements provide a convenient and straightforward way to compose LLM-based applications. Learn more about components and how they work in the LangChain [documentation](https://python.langchain.com/docs/integrations/components).
|
||||
Components are the building blocks of flows. They consist of inputs, outputs, and parameters that define their functionality. These elements provide a convenient and straightforward way to compose LLM-based applications. Learn more about components and how they work in the [Components Section](../components).
|
||||
|
||||
<div style={{ marginBottom: "20px" }}>
|
||||
During the flow creation process, you will notice handles (colored circles)
|
||||
attached to one or both sides of a component. These handles represent the
|
||||
availability to connect to other components. Hover over a handle to see
|
||||
connection details.
|
||||
attached to one or both sides of a component. These handles use distinct
|
||||
colors to indicate the types of inputs and outputs that can be interconnected.
|
||||
Hover over a handle to see connection details.
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: "20px" }}>
|
||||
For example, if you select a <code>ConversationChain</code> component, you
|
||||
will see orange <span style={{ color: "orange" }}>o</span> and purple{" "}
|
||||
{/\* <div style={{ marginBottom: "20px" }}>
|
||||
For example, if you select a <code>ConversationChain</code> component, you
|
||||
will see orange <span style={{ color: "orange" }}>o</span> and purple{" "}
|
||||
|
||||
<span style={{ color: "purple" }}>o</span> input handles. They indicate that
|
||||
this component accepts an LLM and a Memory component as inputs. The red
|
||||
asterisk <span style={{ color: "red" }}>*</span> means that at least one input
|
||||
|
|
@ -69,11 +97,11 @@ Components are the building blocks of flows. They consist of inputs, outputs, an
|
|||
dark: useBaseUrl("img/single-component-dark.png"),
|
||||
}}
|
||||
style={{ width: "40%", margin: "20px auto" }}
|
||||
/>
|
||||
/> */}
|
||||
|
||||
<div style={{ marginBottom: "20px" }}>
|
||||
In the top right corner of the component, you'll find the component status icon ().
|
||||
Build the flow by clicking the **Playground** at the bottom right of the canvas.
|
||||
Build the flow by clicking the **Playground** at the bottom right of the workspace.
|
||||
|
||||
Once the validation is complete, the status of each validated component should turn green ().
|
||||
To debug, hover over the component status to see the outputs.
|
||||
|
|
@ -107,7 +135,7 @@ Langflow components can be edited by clicking the component settings button.
|
|||
<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.
|
||||
Hide parameters with the **SHOW** button to reduce complexity and keep the workspace clean and intuitive for experimentation.
|
||||
|
||||
Double-click the component name to rename it.
|
||||
|
||||
|
|
@ -162,7 +190,7 @@ This avoids spending tokens when consistent output is expected.
|
|||
### Group multiple components
|
||||
|
||||
Components without input or output nodes can be grouped into a single component for reuse.
|
||||
This is useful for combining large flows into single components (like RAG with a vector database, for example) and saves space in the canvas.
|
||||
This is useful for combining large flows into single components (like RAG with a vector database, for example) and saving space.
|
||||
|
||||
1. Hold **Shift** and drag to select the **Prompt** and **OpenAI** components.
|
||||
2. Select **Group**.
|
||||
|
|
@ -171,11 +199,11 @@ This is useful for combining large flows into single components (like RAG with a
|
|||
|
||||
### Update component version
|
||||
|
||||
Canvas component state is stored in a database, while sidebar components are like starter templates.
|
||||
A component's state is stored in a database, while sidebar components are like starter templates.
|
||||
|
||||
As soon as you drag a component from the sidebar to the canvas, the two components are no longer in parity.
|
||||
As soon as you drag a component from the sidebar to the workspace, the two components are no longer in parity.
|
||||
|
||||
The canvas component will keep the version number it was initilized to the canvas with. Click the **Update Component** icon to bring the component up to the `latest` version.
|
||||
The component will keep the version number it was initilized to the workspace with. Click the **Update Component** icon to bring the component up to the `latest` version.
|
||||
|
||||
## Playground
|
||||
|
||||
|
|
@ -276,11 +304,11 @@ Select **Download Collection** to save your project to your local machine. This
|
|||
|
||||
Select **Upload Collection** to upload a flow or component `.json` file from your local machine.
|
||||
|
||||
Select **New Project** to create a new project. In addition to a blank canvas, [starter projects](../starter-projects/basic-prompting) are also available.
|
||||
Select **New Project** to create a new project. In addition to a blank workspace, [starter projects](../starter-projects/basic-prompting) are also available.
|
||||
|
||||
## Project options menu
|
||||
|
||||
To see options for your project, in the upper left corner of the canvas, select the dropdown menu.
|
||||
To see options for your project, in the upper left corner of the workspace, select the dropdown menu.
|
||||
|
||||
<ZoomableImage
|
||||
alt="Docusaurus themed image"
|
||||
|
|
@ -312,4 +340,3 @@ Create new folders with the **New folder** button. One folder can store multiple
|
|||
You can download folders of projects as a single JSON file, and upload files and flows to your folder.
|
||||
|
||||
Click the **Trash** icon to delete a folder.
|
||||
|
||||
|
|
|
|||
|
|
@ -6,11 +6,12 @@ import Admonition from "@theme/Admonition";
|
|||
# 📦 Install Langflow
|
||||
|
||||
<Admonition type="info">
|
||||
Langflow **requires** Python version 3.10 or greater.
|
||||
Langflow **requires** Python version 3.10 or greater and
|
||||
[pip](https://pypi.org/project/pip/) or
|
||||
[pipx](https://pipx.pypa.io/stable/installation/) to be installed on your
|
||||
system.
|
||||
</Admonition>
|
||||
|
||||
Langflow **requires** [Python >=3.10](https://www.python.org/downloads/release/python-3100/) and [pip](https://pypi.org/project/pip/) or [pipx](https://pipx.pypa.io/stable/installation/) to be installed on your system.
|
||||
|
||||
Install Langflow with pip:
|
||||
|
||||
```bash
|
||||
|
|
@ -23,25 +24,7 @@ Install Langflow with pipx:
|
|||
pipx install langflow --python python3.10 --fetch-missing-python
|
||||
```
|
||||
|
||||
Pipx can fetch the missing Python version for you with `--fetch-missing-python`, but you can also install the Python version manually.
|
||||
|
||||
## Install Langflow pre-release
|
||||
|
||||
To install a pre-release version of Langflow:
|
||||
|
||||
pip:
|
||||
|
||||
```bash
|
||||
python -m pip install langflow --pre --force-reinstall
|
||||
```
|
||||
|
||||
pipx:
|
||||
|
||||
```bash
|
||||
pipx install langflow --python python3.10 --fetch-missing-python --pip-args="--pre --force-reinstall"
|
||||
```
|
||||
|
||||
Use `--force-reinstall` to ensure you have the latest version of Langflow and its dependencies.
|
||||
Pipx can fetch the missing Python version for you with `--fetch-missing-python`, but you can also install the Python version manually. Use `--force-reinstall` to ensure you have the latest version of Langflow and its dependencies.
|
||||
|
||||
## Having a problem?
|
||||
|
||||
|
|
@ -74,14 +57,17 @@ python -m langflow run
|
|||
|
||||
## HuggingFace Spaces
|
||||
|
||||
HuggingFace provides a great alternative for running Langflow in their Spaces environment. This means you can run Langflow without any local installation required.
|
||||
HuggingFace provides a great alternative for running Langflow in their Spaces environment. This means you can run Langflow in the cloud without any local installation required. Here's how you can get Langflow up and running on HuggingFace Spaces:
|
||||
|
||||
In a Chromium-based browser, go to the [Langflow Space](https://huggingface.co/spaces/Langflow/Langflow?duplicate=true) or [Langflow v1.0 alpha Preview Space](https://huggingface.co/spaces/Langflow/Langflow-Preview?duplicate=true).
|
||||
1. **Access Langflow Space**: Open a Chromium-based browser and navigate to the [Langflow Space](https://huggingface.co/spaces/Langflow/Langflow?duplicate=true). This link directs you to a pre-configured environment for Langflow.
|
||||
|
||||
You'll be presented with the following screen:
|
||||
2. **Duplicate the Space**: Upon arrival, you'll encounter an option to duplicate the Langflow space. This step involves a few simple decisions:
|
||||
- **Naming Your Space**: Assign a unique name to your new Space.
|
||||
- **Visibility Settings**: Choose between Public or Private visibility for your Space.
|
||||
- After setting these parameters, click on **Duplicate Space** to initiate the setup.
|
||||
|
||||
<ZoomableImage
|
||||
alt="Docusaurus themed image"
|
||||
alt="Instructions for duplicating Langflow space on HuggingFace"
|
||||
sources={{
|
||||
light: "img/duplicate-space.png",
|
||||
dark: "img/duplicate-space.png",
|
||||
|
|
@ -89,4 +75,6 @@ You'll be presented with the following screen:
|
|||
style={{ width: "80%", maxWidth: "800px", margin: "0 auto" }}
|
||||
/>
|
||||
|
||||
Name your Space, define the visibility (Public or Private), and click on **Duplicate Space** to start the installation process. When installation is finished, you'll be redirected to the Space's main page to start using Langflow right away!
|
||||
3. **Complete Installation**: The duplication and setup process begins immediately after you click **Duplicate Space**. Once completed, you will be automatically redirected to the main page of your new Space.
|
||||
|
||||
4. **Start Exploring Langflow**: With the setup complete, Langflow is now ready for use in your Space and you can start exploring its features and capabilities right away!
|
||||
|
|
|
|||
|
|
@ -27,16 +27,17 @@ This guide demonstrates how to build a basic prompt flow and modify that prompt
|
|||
|
||||
Let's start with a Prompt component to instruct an OpenAI Model.
|
||||
|
||||
Prompts serve as the inputs to a large language model (LLM), acting as the interface between human instructions and computational tasks.
|
||||
Prompts serve as the inputs to a large language model (LLM), acting as the interface between human instructions and computational tasks. By submitting natural language requests in a prompt to an LLM, you can obtain answers, generate text, and solve problems.
|
||||
|
||||
By submitting natural language requests in a prompt to an LLM, you can obtain answers, generate text, and solve problems.
|
||||
<br />
|
||||
|
||||
1. From the Langflow dashboard, click **New Project**.
|
||||
2. Select **Basic Prompting**.
|
||||
3. The **Basic Prompting** flow is created.
|
||||
|
||||
<br />
|
||||
|
||||
<ZoomableImage
|
||||
alt="Docusaurus themed image"
|
||||
alt="Quickstart Guide Screenshot"
|
||||
sources={{
|
||||
light: "img/quickstart.png",
|
||||
dark: "img/quickstart.png",
|
||||
|
|
@ -44,20 +45,25 @@ By submitting natural language requests in a prompt to an LLM, you can obtain an
|
|||
style={{ width: "80%", margin: "20px auto" }}
|
||||
/>
|
||||
|
||||
This flow allows you to chat with the **OpenAI** component via a **Prompt**.
|
||||
This flow allows you to chat with the **OpenAI** model by using a **Prompt** to send instructions.
|
||||
|
||||
Examine the **Prompt** component. The **Template** field instructs the LLM to `Answer the user as if you were a pirate.`
|
||||
This should be interesting...
|
||||
|
||||
4. To create an environment variable for the **OpenAI** component, in the **OpenAI API Key** field, click the **Globe** button, and then click **Add New Variable**.
|
||||
1. In the **Variable Name** field, enter `openai_api_key`.
|
||||
2. In the **Value** field, paste your OpenAI API Key (`sk-...`).
|
||||
3. Click **Save Variable**.
|
||||
To use the **OpenAI** component, you have two options for providing your OpenAI API Key: directly passing it to the component or creating an environment variable. For better security and manageability, creating an environment variable is recommended. Here's how to set it up:
|
||||
|
||||
In the **OpenAI API Key** field, click the **Globe** button to access environment variables, and then click **Add New Variable**.
|
||||
|
||||
1. In the **Variable Name** field, enter `openai_api_key`.
|
||||
2. In the **Value** field, paste your OpenAI API Key (`sk-...`).
|
||||
3. Click **Save Variable**.
|
||||
|
||||
By creating an environment variable, you keep your API key secure and make it easier to manage across different components or projects.
|
||||
|
||||
## Run the basic prompting flow
|
||||
|
||||
1. Click the **Run** button.
|
||||
The **Interaction Panel** opens, where you can chat with your bot.
|
||||
2. Type a message and press Enter.
|
||||
1. Click the **Playground** button. This where you can interact with your bot.
|
||||
2. Type any message and press Enter.
|
||||
And... Ahoy! 🏴☠️
|
||||
The bot responds in a piratical manner!
|
||||
|
||||
|
|
@ -73,10 +79,8 @@ This should be interesting...
|
|||
|
||||
Well done! You've built your first prompt in Langflow. 🎉
|
||||
|
||||
By adding Langflow components to your flow, you can create all sorts of interesting behaviors.
|
||||
By adding Langflow components to your flow, you can create all sorts of interesting behaviors. Here are a couple of examples:
|
||||
|
||||
Here are a couple of examples:
|
||||
|
||||
- [Memory chatbot](/starter-projects/memory-chatbot)
|
||||
- [Blog writer](/starter-projects/blog-writer)
|
||||
- [Document QA](/starter-projects/document-qa)
|
||||
- [Memory Chatbot](/starter-projects/memory-chatbot)
|
||||
- [Blog Writer](/starter-projects/blog-writer)
|
||||
- [Document QA](/starter-projects/document-qa)
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ TLDR;
|
|||
- Duplicate our [Langflow 1.0 Space](https://huggingface.co/spaces/Langflow/Langflow-Preview?duplicate=true)
|
||||
- Create a new database, get a **Token** and the **API Endpoint**
|
||||
- Click on the **New Project** button and look for Vector Store RAG. This will create a new project with the necessary components
|
||||
- Import the project into Langflow by dropping it on the Canvas or My Collection page
|
||||
- Import the project into Langflow by dropping it on the Workspace or My Collection page
|
||||
- Update the **Token** and **API Endpoint** in the **Astra DB** components
|
||||
- Update the OpenAI API key in the **OpenAI** components
|
||||
- Run the ingestion flow which is the one that uses the **Astra DB** component
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ Its intuitive interface allows for easy manipulation of AI building blocks, enab
|
|||
|
||||
- [Quickstart](/getting-started/quickstart) - Create a flow and run it.
|
||||
|
||||
- [Langflow Canvas](/getting-started/canvas) - Learn more about the Langflow canvas.
|
||||
- [Langflow Workspace](/getting-started/workspace) - Learn more about the Langflow workspace.
|
||||
|
||||
<Admonition type="info">
|
||||
Langflow v1.0 alpha is also available in HuggingFace Spaces. [Clone the space
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ The `NotionPageUpdate` component updates the properties of a Notion page. It pro
|
|||
|
||||
To use the `NotionPageUpdate` component in your Langflow flow:
|
||||
|
||||
1. Drag and drop the `NotionPageUpdate` component onto the canvas.
|
||||
1. Drag and drop the `NotionPageUpdate` component onto the workspace.
|
||||
2. Double-click the component to open its configuration.
|
||||
3. Provide the required parameters as defined in the component's `build_config` method.
|
||||
4. Connect the component to other nodes in your flow as needed.
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ We have a special channel in our Discord server dedicated to Langflow 1.0 migrat
|
|||
- Improved user experience with Text and Data modes
|
||||
- CustomComponent for all components
|
||||
- Compatibility with previous versions using Runnable Executor
|
||||
- Multiple flows in the canvas
|
||||
- Multiple flows in the workspace
|
||||
- Improved component status
|
||||
- Ability to connect Output components to any other Component
|
||||
- Rename and edit component descriptions
|
||||
|
|
@ -76,9 +76,9 @@ To use flows built in previous versions of Langflow, you can utilize the experim
|
|||
|
||||
[Learn more about Compatibility with Previous Versions](./compatibility)
|
||||
|
||||
## Multiple Flows in the Canvas
|
||||
## Multiple Flows in the Workspace
|
||||
|
||||
Langflow 1.0 allows you to have more than one flow in the canvas and run them separately. Discover how to create and manage multiple flows within a single project.
|
||||
Langflow 1.0 allows you to have more than one flow in the workspace and run them separately. Discover how to create and manage multiple flows within a single project.
|
||||
|
||||
**Guide coming soon**
|
||||
|
||||
|
|
@ -86,7 +86,7 @@ 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.
|
||||
|
||||
[Learn more about Component Status](../getting-started/canvas#component)
|
||||
[Learn more about Component Status](../getting-started/workspace#component)
|
||||
|
||||
## Connecting Output Components
|
||||
|
||||
|
|
@ -98,13 +98,13 @@ You can now connect Output components to any other component (that has a Text ou
|
|||
|
||||
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.
|
||||
|
||||
[Learn more about Component Descriptions](../getting-started/canvas#component-parameters)
|
||||
[Learn more about Component Descriptions](../getting-started/workspace#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.
|
||||
|
||||
[Learn more about Tweaks and API inputs](../getting-started/canvas#tweaks)
|
||||
[Learn more about Tweaks and API inputs](../getting-started/workspace#tweaks)
|
||||
|
||||
## Global Variables for Text Fields
|
||||
|
||||
|
|
|
|||
|
|
@ -62,7 +62,7 @@ In this guide, we will modify the "Basic Chat with Prompt and History" example,
|
|||
|
||||
16. You should now be able to see and use the defined variables in the chat interface.
|
||||
|
||||
17. Click on 'role' to examine the variable you established in the canvas.
|
||||
17. Click on 'role' to examine the variable you established in the workspace.
|
||||
|
||||
18. Now, let's define the 'behavior' variable.
|
||||
|
||||
|
|
|
|||
|
|
@ -196,7 +196,7 @@ Let's create a custom component that processes a document (_`langchain.schema.Do
|
|||
|
||||
### Pick a display name
|
||||
|
||||
To start, let's choose a name for our component by adding a _`display_name`_ attribute. This name will appear on the canvas. The name of the class is not relevant, but let's call it _`DocumentProcessor`_.
|
||||
To start, let's choose a name for our component by adding a _`display_name`_ attribute. This name will appear on the workspace. The name of the class is not relevant, but let's call it _`DocumentProcessor`_.
|
||||
|
||||
```python
|
||||
from langflow.custom import CustomComponent
|
||||
|
|
@ -267,7 +267,7 @@ class DocumentProcessor(CustomComponent):
|
|||
|
||||
Here, the build method takes two input parameters: _`document`_, representing the input document to be processed, and _`function`_, a string representing the selected text transformation to be applied (either "Uppercase," "Lowercase," or "Titlecase"). The method processes the text content of the input Document based on the selected function.
|
||||
|
||||
The attribute _`repr_value`_ is used to display the result of the component on the canvas. It is optional and can be used to display any string value.
|
||||
The attribute _`repr_value`_ is used to display the result of the component on the workspace. It is optional and can be used to display any string value.
|
||||
|
||||
The return type is _`Document`_.
|
||||
|
||||
|
|
@ -399,6 +399,6 @@ Langflow will attempt to load all of the components found in the specified direc
|
|||
|
||||
### Interact with Custom Components
|
||||
|
||||
Once your custom components have been loaded successfully, they will appear in Langflow's sidebar. From there, you can add them to your Langflow canvas for use. However, please note that components with errors will not be available for addition to the canvas. Always ensure your code is error-free before attempting to load components.
|
||||
Once your custom components have been loaded successfully, they will appear in Langflow's sidebar. From there, you can add them to your Langflow workspace for use. However, please note that components with errors will not be available for addition to the workspace. Always ensure your code is error-free before attempting to load components.
|
||||
|
||||
Remember, creating custom components allows you to extend the functionality of Langflow to better suit your unique needs. Happy coding!
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@ This guide takes you through the process of augmenting the "Basic Chat with Prom
|
|||
|
||||
6. Next, open the search bar and type "web".
|
||||
|
||||
7. Drag and drop a WebBaseLoader (or any other loader of your choice) onto the canvas.
|
||||
7. Drag and drop a WebBaseLoader (or any other loader of your choice) onto the workspace.
|
||||
|
||||
8. Connect this loader to the `{context}` variable that we just added.
|
||||
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ TLDR;
|
|||
- Duplicate our [Langflow 1.0 Space](https://huggingface.co/spaces/Langflow/Langflow-Preview?duplicate=true)
|
||||
- Create a new database, get a **Token** and the **API Endpoint**
|
||||
- Click on the **New Project** button and look for Vector Store RAG. This will create a new project with the necessary components
|
||||
- Import the project into Langflow by dropping it on the Canvas or My Collection page
|
||||
- Import the project into Langflow by dropping it on the Workspace or My Collection page
|
||||
- Update the **Token** and **API Endpoint** in the **Astra DB** components
|
||||
- Update the OpenAI API key in the **OpenAI** components
|
||||
- Run the ingestion flow which is the one that uses the **Astra DB** component
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ It allows you to define the structure of your conversation and the data that flo
|
|||
This makes it easier to understand and control your conversation.
|
||||
|
||||
This change comes with a new way of visualizing your projects. Before 1.0 you would connect Components to ultimately build one final Component that was processed behind the scenes.
|
||||
Now, each step of the process is defined by you, is visible on the canvas, and can be monitored and controlled by you. This makes it so that Composition is now just another way of building in Langflow. **Now data flows through your project more transparently**.
|
||||
Now, each step of the process is defined by you, is visible on the workspace, and can be monitored and controlled by you. This makes it so that Composition is now just another way of building in Langflow. **Now data flows through your project more transparently**.
|
||||
|
||||
The caveat is existing projects may need some new Components to get them back to their full functionality.
|
||||
[We've made this as easy as possible](../migration/compatibility), and there will be improvements to it as we get feedback in our Discord server and on GitHub.
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ module.exports = {
|
|||
"index",
|
||||
"getting-started/install-langflow",
|
||||
"getting-started/quickstart",
|
||||
"getting-started/canvas",
|
||||
"getting-started/workspace",
|
||||
"migration/possible-installation-issues",
|
||||
"getting-started/new-to-llms",
|
||||
],
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue