From f83e29f22ee8c67f1d2e23e1be0baee29beeca60 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Tue, 4 Jun 2024 17:17:53 -0400 Subject: [PATCH 01/61] spacing --- docs/docs/administration/api.mdx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/docs/docs/administration/api.mdx b/docs/docs/administration/api.mdx index 103c43f81..115cdc666 100644 --- a/docs/docs/administration/api.mdx +++ b/docs/docs/administration/api.mdx @@ -10,8 +10,7 @@ Langflow provides an API key functionality that allows users to access their ind The default user and password are set using the LANGFLOW_SUPERUSER and LANGFLOW_SUPERUSER_PASSWORD environment variables. -The default values are -langflow and langflow, respectively. +The default values are `langflow` and `langflow`, respectively. From c6659606c660fa728207db154003e3f73179694f Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Tue, 4 Jun 2024 17:18:00 -0400 Subject: [PATCH 02/61] more-cli-commands --- docs/docs/administration/cli.mdx | 36 ++++++++++++++++++++++++++++---- 1 file changed, 32 insertions(+), 4 deletions(-) diff --git a/docs/docs/administration/cli.mdx b/docs/docs/administration/cli.mdx index a2a41adcd..19adeea46 100644 --- a/docs/docs/administration/cli.mdx +++ b/docs/docs/administration/cli.mdx @@ -12,6 +12,16 @@ python -m langflow run --help python -m langflow run ``` +The available commands are below. Navigate to their individual sections of this page to see the parameters. + +langflow run +langflow superuser +langflow migration + +langflow copy-db + +## langflow run + Each option for `run` command are detailed below: - `--help`: Displays all available options. @@ -35,7 +45,13 @@ Each option for `run` command are detailed below: These parameters are important for users who need to customize the behavior of Langflow, especially in development or specialized deployment scenarios. -### API Key Command +### Environment Variables + +You can configure many of the CLI options using environment variables. These can be exported in your operating system or added to a `.env` file and loaded using the `--env-file` option. + +A sample `.env` file named `.env.example` is included with the project. Copy this file to a new file named `.env` and replace the example values with your actual settings. If you're setting values in both your OS and the `.env` file, the `.env` settings will take precedence. + +### langflow api-key The `api-key` command allows you to create an API key for accessing Langflow's API when `LANGFLOW_AUTO_LOGIN` is set to `True`. @@ -70,8 +86,20 @@ python -m langflow api-key ╰─────────────────────────────────────────────────────────────────────╯ ``` -### Environment Variables -You can configure many of the CLI options using environment variables. These can be exported in your operating system or added to a `.env` file and loaded using the `--env-file` option. -A sample `.env` file named `.env.example` is included with the project. Copy this file to a new file named `.env` and replace the example values with your actual settings. If you're setting values in both your OS and the `.env` file, the `.env` settings will take precedence. +### Copy db to current directory + +### langflow migration + +Options: +* `--test, --no-test`: Run migrations in test mode. [default: test] +* `--fix, --no-fix`: Fix migrations. This is a destructive operation, and should only be used if you know what you are doing. [default: no-fix] +* `--help`: Show this message and exit. + +### langflow superuser + +Options: +* `--username`: Username for the superuser. [default: None] [required] +* `--password`: Password for the superuser. [default: None] [required] +* `--log-level`: Logging level. [env var: LANGFLOW_LOG_LEVEL] [default: error] From f23ac7da1ec89ece8a9abd4dc6e7831f11b18cbd Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Tue, 4 Jun 2024 17:18:12 -0400 Subject: [PATCH 03/61] more-deployments --- docs/docs/deployment/backend-only.md | 3 ++ docs/docs/deployment/docker.md | 65 +++++++++++++++++++++++++ docs/docs/deployment/jina-deployment.md | 0 3 files changed, 68 insertions(+) create mode 100644 docs/docs/deployment/backend-only.md create mode 100644 docs/docs/deployment/docker.md delete mode 100644 docs/docs/deployment/jina-deployment.md diff --git a/docs/docs/deployment/backend-only.md b/docs/docs/deployment/backend-only.md new file mode 100644 index 000000000..7ad2754d2 --- /dev/null +++ b/docs/docs/deployment/backend-only.md @@ -0,0 +1,3 @@ +# Backend-only Deployment + +You can run a flow in `--backend-only` mode to \ No newline at end of file diff --git a/docs/docs/deployment/docker.md b/docs/docs/deployment/docker.md new file mode 100644 index 000000000..1ebb5746e --- /dev/null +++ b/docs/docs/deployment/docker.md @@ -0,0 +1,65 @@ +# Docker + +This guide will help you get LangFlow up and running using Docker and Docker Compose. + +## Prerequisites + +- Docker +- Docker Compose + +## Steps + +1. Clone the LangFlow repository: + + ```sh + git clone https://github.com/langflow-ai/langflow.git + ``` + +2. Navigate to the `docker_example` directory: + + ```sh + cd langflow/docker_example + ``` + +3. Run the Docker Compose file: + + ```sh + docker compose up + ``` + +LangFlow will now be accessible at [http://localhost:7860/](http://localhost:7860/). + +## Docker Compose Configuration + +The Docker Compose configuration spins up two services: `langflow` and `postgres`. + +### LangFlow Service + +The `langflow` service uses the `langflowai/langflow:latest` Docker image and exposes port 7860. It depends on the `postgres` service. + +Environment variables: + +- `LANGFLOW_DATABASE_URL`: The connection string for the PostgreSQL database. +- `LANGFLOW_CONFIG_DIR`: The directory where LangFlow stores logs, file storage, monitor data, and secret keys. + +Volumes: + +- `langflow-data`: This volume is mapped to `/var/lib/langflow` in the container. + +### PostgreSQL Service + +The `postgres` service uses the `postgres:16` Docker image and exposes port 5432. + +Environment variables: + +- `POSTGRES_USER`: The username for the PostgreSQL database. +- `POSTGRES_PASSWORD`: The password for the PostgreSQL database. +- `POSTGRES_DB`: The name of the PostgreSQL database. + +Volumes: + +- `langflow-postgres`: This volume is mapped to `/var/lib/postgresql/data` in the container. + +## Switching to a Specific LangFlow Version + +If you want to use a specific version of LangFlow, you can modify the `image` field under the `langflow` service in the Docker Compose file. For example, to use version 1.0-alpha, change `langflowai/langflow:latest` to `langflowai/langflow:1.0-alpha`. diff --git a/docs/docs/deployment/jina-deployment.md b/docs/docs/deployment/jina-deployment.md deleted file mode 100644 index e69de29bb..000000000 From f4217c4134e5842ed8f90ed8e01fb52b0619f64b Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 11:02:39 -0400 Subject: [PATCH 04/61] typo --- docs/docs/contributing/community.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/contributing/community.md b/docs/docs/contributing/community.md index 604487133..5c95718ec 100644 --- a/docs/docs/contributing/community.md +++ b/docs/docs/contributing/community.md @@ -10,7 +10,7 @@ Langflow [Discord](https://discord.gg/EqksyE2EX9) server. --- -## 🐦 Stay tunned for **Langflow** on Twitter +## 🐦 Stay tuned for **Langflow** on Twitter Follow [@langflow_ai](https://twitter.com/langflow_ai) on **Twitter** to get the latest news about **Langflow**. From 8e9e2875cdc5af184069523f670e3e8ee60d5541 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 11:13:49 -0400 Subject: [PATCH 05/61] replace-twitter-logo --- docs/static/logos/twitter.svg | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/static/logos/twitter.svg b/docs/static/logos/twitter.svg index 027488d3c..b03ce05a4 100644 --- a/docs/static/logos/twitter.svg +++ b/docs/static/logos/twitter.svg @@ -1,3 +1,3 @@ - - - + + + \ No newline at end of file From 199459f6458ae8f6e2b8ef3f6b066a30e4f82c6b Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 11:15:43 -0400 Subject: [PATCH 06/61] better-twitter-svg --- docs/static/logos/twitter.svg | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/static/logos/twitter.svg b/docs/static/logos/twitter.svg index b03ce05a4..437e2bfdd 100644 --- a/docs/static/logos/twitter.svg +++ b/docs/static/logos/twitter.svg @@ -1,3 +1,3 @@ - - - \ No newline at end of file + + + From e605b69aac9645dc8ec53d4cf6ebee12aabe5acb Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 13:46:25 -0400 Subject: [PATCH 07/61] cli --- docs/docs/administration/cli.mdx | 198 +++++++++++++++++++------------ 1 file changed, 125 insertions(+), 73 deletions(-) diff --git a/docs/docs/administration/cli.mdx b/docs/docs/administration/cli.mdx index 19adeea46..cd418708d 100644 --- a/docs/docs/administration/cli.mdx +++ b/docs/docs/administration/cli.mdx @@ -1,78 +1,53 @@ # Command Line Interface (CLI) -## Overview - Langflow's Command Line Interface (CLI) is a powerful tool that allows you to interact with the Langflow server from the command line. The CLI provides a wide range of commands to help you shape Langflow to your needs. -Running the CLI without any arguments will display a list of available commands and options. - -```bash -python -m langflow run --help -# or -python -m langflow run -``` - The available commands are below. Navigate to their individual sections of this page to see the parameters. -langflow run -langflow superuser -langflow migration +* [langflow](#overview) +* [langflow api-key](#langflow-api-key) +* [langflow copy-db](#langflow-copy-db) +* [langflow migration](#langflow-migration) +* [langflow run](#langflow-run) +* [langflow superuser](#langflow-superuser) -langflow copy-db +## Overview -## langflow run - -Each option for `run` command are detailed below: - -- `--help`: Displays all available options. -- `--host`: Defines the host to bind the server to. Can be set using the `LANGFLOW_HOST` environment variable. The default is `127.0.0.1`. -- `--workers`: Sets the number of worker processes. Can be set using the `LANGFLOW_WORKERS` environment variable. The default is `1`. -- `--timeout`: Sets the worker timeout in seconds. The default is `60`. -- `--port`: Sets the port to listen on. Can be set using the `LANGFLOW_PORT` environment variable. The default is `7860`. -- `--env-file`: Specifies the path to the .env file containing environment variables. The default is `.env`. -- `--log-level`: Defines the logging level. Can be set using the `LANGFLOW_LOG_LEVEL` environment variable. The default is `critical`. -- `--components-path`: Specifies the path to the directory containing custom components. Can be set using the `LANGFLOW_COMPONENTS_PATH` environment variable. The default is `langflow/components`. -- `--log-file`: Specifies the path to the log file. Can be set using the `LANGFLOW_LOG_FILE` environment variable. The default is `logs/langflow.log`. -- `--cache`: Select the type of cache to use. Options are `InMemoryCache` and `SQLiteCache`. Can be set using the `LANGFLOW_LANGCHAIN_CACHE` environment variable. The default is `SQLiteCache`. -- `--dev/--no-dev`: Toggles the development mode. The default is `no-dev`. -- `--path`: Specifies the path to the frontend directory containing build files. This option is for development purposes only. Can be set using the `LANGFLOW_FRONTEND_PATH` environment variable. -- `--open-browser/--no-open-browser`: Toggles the option to open the browser after starting the server. Can be set using the `LANGFLOW_OPEN_BROWSER` environment variable. The default is `open-browser`. -- `--remove-api-keys/--no-remove-api-keys`: Toggles the option to remove API keys from the projects saved in the database. Can be set using the `LANGFLOW_REMOVE_API_KEYS` environment variable. The default is `no-remove-api-keys`. -- `--install-completion [bash|zsh|fish|powershell|pwsh]`: Installs completion for the specified shell. -- `--show-completion [bash|zsh|fish|powershell|pwsh]`: Shows completion for the specified shell, allowing you to copy it or customize the installation. -- `--backend-only`: This parameter, with a default value of `False`, allows running only the backend server without the frontend. It can also be set using the `LANGFLOW_BACKEND_ONLY` environment variable. -- `--store`: This parameter, with a default value of `True`, enables the store features, use `--no-store` to deactivate it. It can be configured using the `LANGFLOW_STORE` environment variable. - -These parameters are important for users who need to customize the behavior of Langflow, especially in development or specialized deployment scenarios. - -### Environment Variables - -You can configure many of the CLI options using environment variables. These can be exported in your operating system or added to a `.env` file and loaded using the `--env-file` option. - -A sample `.env` file named `.env.example` is included with the project. Copy this file to a new file named `.env` and replace the example values with your actual settings. If you're setting values in both your OS and the `.env` file, the `.env` settings will take precedence. - -### langflow api-key - -The `api-key` command allows you to create an API key for accessing Langflow's API when `LANGFLOW_AUTO_LOGIN` is set to `True`. +Running the CLI without any arguments displays a list of available options and commands. ```bash -python -m langflow api-key --help - - Usage: langflow api-key [OPTIONS] - - Creates an API key for the default superuser if AUTO_LOGIN is enabled. - Args: log_level (str, optional): Logging level. Defaults to "error". - Returns: None - -╭─ Options ───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮ -│ --log-level TEXT Logging level. [env var: LANGFLOW_LOG_LEVEL] [default: error] │ -│ --help Show this message and exit. │ -╰─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯ +langflow +# or +langflow --help +# or +python -m langflow ``` -Once you run the `api-key` command, it will create an API key for the default superuser if `LANGFLOW_AUTO_LOGIN` is set to `True`. +### Options + +| Option | Description | +| ------ | ----------- | +| `--install-completion` | Install completion for the current shell. | +| `--show-completion` | Show completion for the current shell, to copy it or customize the installation. | +| `--help` | Show this message and exit. | + + +| Command | Description | +| ------- | ----------- | +| `api-key` | Creates an API key for the default superuser if AUTO_LOGIN is enabled. | +| `copy-db` | Copy the database files to the current directory. | +| `migration` | Run or test migrations. | +| `run` | Run the Langflow. | +| `superuser` | Create a superuser. | + + +## langflow api-key + +Run the `api-key` command to create an API key for the default superuser if `LANGFLOW_AUTO_LOGIN` is set to `True`. ```bash +langflow api-key +# or python -m langflow api-key ╭─────────────────────────────────────────────────────────────────────╮ │ API Key Created Successfully: │ @@ -83,23 +58,100 @@ python -m langflow api-key │ Make sure to store it in a secure location. │ │ │ │ The API key has been copied to your clipboard. Cmd + V to paste it. │ -╰─────────────────────────────────────────────────────────────────────╯ +╰────────────────────────────── ``` +### Options + +| Option | Type | Description | +|------------------|------|-------------------------------------------------------------| +| --log-level | TEXT | Logging level. [env var: LANGFLOW_LOG_LEVEL] [default: error] | +| --help | | Show this message and exit. | + +## langflow copy-db + +Run the `copy-db` command to copy the cached database files to the current directory. +If the files exist in the cache directory, they will be copied to the same directory as `__main__.py`, which is `/Users/username/Documents/GitHub/langflow/test-env/lf-rs/lib/python3.10/site-packages/langflow`. + +This function copies the `langflow.db` and `langflow-pre.db` files from the cache directory to the current directory. + +### Options + +None. + +## langflow migration + +Run or test migrations with the [Alembic](https://pypi.org/project/alembic/) database tool. + +```bash +langflow migration +# or +python -m langflow migration +``` + +### Options +| Option | Description | +|-----------------|-------------------------------------------------------------| +| `--test, --no-test` | Run migrations in test mode. [default: test] | +| `--fix, --no-fix` | Fix migrations. This is a destructive operation, and should only be used if you know what you are doing. [default: no-fix] | +| `--help` | Show this message and exit. | -### Copy db to current directory +## langflow run -### langflow migration +Run Langflow. -Options: -* `--test, --no-test`: Run migrations in test mode. [default: test] -* `--fix, --no-fix`: Fix migrations. This is a destructive operation, and should only be used if you know what you are doing. [default: no-fix] -* `--help`: Show this message and exit. +```bash +langflow run +# or +python -m langflow run +``` -### langflow superuser +### Options + +| Option | Description | +|-------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| +| `--help` | Displays all available options. | +| `--host` | Defines the host to bind the server to. Can be set using the `LANGFLOW_HOST` environment variable. The default is `127.0.0.1`. | +| `--workers` | Sets the number of worker processes. Can be set using the `LANGFLOW_WORKERS` environment variable. The default is `1`. | +| `--timeout` | Sets the worker timeout in seconds. The default is `60`. | +| `--port` | Sets the port to listen on. Can be set using the `LANGFLOW_PORT` environment variable. The default is `7860`. | +| `--env-file` | Specifies the path to the .env file containing environment variables. The default is `.env`. | +| `--log-level` | Defines the logging level. Can be set using the `LANGFLOW_LOG_LEVEL` environment variable. The default is `critical`. | +| `--components-path` | Specifies the path to the directory containing custom components. Can be set using the `LANGFLOW_COMPONENTS_PATH` environment variable. The default is `langflow/components`. | +| `--log-file` | Specifies the path to the log file. Can be set using the `LANGFLOW_LOG_FILE` environment variable. The default is `logs/langflow.log`. | +| `--cache` | Select the type of cache to use. Options are `InMemoryCache` and `SQLiteCache`. Can be set using the `LANGFLOW_LANGCHAIN_CACHE` environment variable. The default is `SQLiteCache`. | +| `--dev`/`--no-dev` | Toggles the development mode. The default is `no-dev`. | +| `--path` | Specifies the path to the frontend directory containing build files. This option is for development purposes only. Can be set using the `LANGFLOW_FRONTEND_PATH` environment variable. | +| `--open-browser`/`--no-open-browser`| Toggles the option to open the browser after starting the server. Can be set using the `LANGFLOW_OPEN_BROWSER` environment variable. The default is `open-browser`. | +| `--remove-api-keys`/`--no-remove-api-keys`| Toggles the option to remove API keys from the projects saved in the database. Can be set using the `LANGFLOW_REMOVE_API_KEYS` environment variable. The default is `no-remove-api-keys`. | +| `--install-completion [bash\|zsh\|fish\|powershell\|pwsh]`| Installs completion for the specified shell. | +| `--show-completion [bash\|zsh\|fish\|powershell\|pwsh]` | Shows completion for the specified shell, allowing you to copy it or customize the installation. | +| `--backend-only` | This parameter, with a default value of `False`, allows running only the backend server without the frontend. It can also be set using the `LANGFLOW_BACKEND_ONLY` environment variable. | +| `--store` | This parameter, with a default value of `True`, enables the store features, use `--no-store` to deactivate it. It can be configured using the `LANGFLOW_STORE` environment variable. | + +#### Environment Variables + +You can configure many of the CLI options using environment variables. These can be exported in your operating system or added to a `.env` file and loaded using the `--env-file` option. + +A sample `.env` file named `.env.example` is included with the project. Copy this file to a new file named `.env` and replace the example values with your actual settings. If you're setting values in both your OS and the `.env` file, the `.env` settings will take precedence. + +## langflow superuser + +Create a superuser for Langflow. + +```bash +langflow superuser +# or +python -m langflow superuser +``` + +### Options + +| Option | Type | Description | +|----------------|-------|-------------------------------------------------------------| +| `--username` | TEXT | Username for the superuser. [default: None] [required] | +| `--password` | TEXT | Password for the superuser. [default: None] [required] | +| `--log-level` | TEXT | Logging level. [env var: LANGFLOW_LOG_LEVEL] [default: error] | +| `--help` | | Show this message and exit. | -Options: -* `--username`: Username for the superuser. [default: None] [required] -* `--password`: Password for the superuser. [default: None] [required] -* `--log-level`: Logging level. [env var: LANGFLOW_LOG_LEVEL] [default: error] From 829c14e706fb0a7ded659c39ecbc1c77d441487a Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 17:14:44 -0400 Subject: [PATCH 08/61] backend-only mode --- docs/docs/deployment/backend-only.md | 113 ++++++++++++++++++++++++++- 1 file changed, 112 insertions(+), 1 deletion(-) diff --git a/docs/docs/deployment/backend-only.md b/docs/docs/deployment/backend-only.md index 7ad2754d2..7e361addd 100644 --- a/docs/docs/deployment/backend-only.md +++ b/docs/docs/deployment/backend-only.md @@ -1,3 +1,114 @@ # Backend-only Deployment -You can run a flow in `--backend-only` mode to \ No newline at end of file +You can run Langflow in `--backend-only` mode to expose your Langflow app as an API, without running the frontend UI. + +Start langflow in backend-only mode with `python3 -m langflow run --backend-only`. + +The terminal prints ` Welcome to ⛓ Langflow `, and a blank window opens at `http://127.0.0.1:7864/all`. +Langflow will now serve requests to its API without the frontend running. + +## Prerequisites + +* [Langflow installed](../getting-started/install-langflow.mdx) + +* [OpenAI API key](https://platform.openai.com) + +* [A Langflow flow created](../starter-projects/basic-prompting.mdx) + +## Download your flow's curl call + +1. Click API. +2. Click **curl** > **Copy code** and save the code to your local machine. +It will look something like this: +```curl +curl -X POST \ + "http://127.0.0.1:7864/api/v1/run/ef7e0554-69e5-4e3e-ab29-ee83bcd8d9ef?stream=false" \ + -H 'Content-Type: application/json'\ + -d '{"input_value": "message", + "output_type": "chat", + "input_type": "chat", + "tweaks": { + "Prompt-kvo86": {}, + "OpenAIModel-MilkD": {}, + "ChatOutput-ktwdw": {}, + "ChatInput-xXC4F": {} +}}' +``` +Note the flow ID of `ef7e0554-69e5-4e3e-ab29-ee83bcd8d9ef`. You can find this ID in the UI as well to ensure you're querying the right flow. + +## Start Langflow in backend-only mode + +3. Stop Langflow with Ctrl+C. +4. Start langflow in backend-only mode with `python3 -m langflow run --backend-only`. +The terminal prints ` Welcome to ⛓ Langflow `, and a blank window opens at `http://127.0.0.1:7864/all`. +Langflow will now serve requests to its API. +5. Run the curl code you copied from the UI. +You should get a result like this: +```bash +{"session_id":"ef7e0554-69e5-4e3e-ab29-ee83bcd8d9ef:bf81d898868ac87e1b4edbd96c131c5dee801ea2971122cc91352d144a45b880","outputs":[{"inputs":{"input_value":"hi, are you there?"},"outputs":[{"results":{"result":"Arrr, ahoy matey! Aye, I be here. What be ye needin', me hearty?"},"artifacts":{"message":"Arrr, ahoy matey! Aye, I be here. What be ye needin', me hearty?","sender":"Machine","sender_name":"AI"},"messages":[{"message":"Arrr, ahoy matey! Aye, I be here. What be ye needin', me hearty?","sender":"Machine","sender_name":"AI","component_id":"ChatOutput-ktwdw"}],"component_display_name":"Chat Output","component_id":"ChatOutput-ktwdw","used_frozen_result":false}]}]}% +``` +Again, note that the flow ID matches. +Langflow is receiving your POST request, running the flow, and returning the result, all without running the frontend. Cool! + +## Download your flow's Python API call + +Instead of using curl, you can download your flow as a Python API call instead. + +1. Click API. +2. Click **Python API** > **Copy code** and save the code to your local machine. +The code will look something like this: +```python +import requests +from typing import Optional + +BASE_API_URL = "http://127.0.0.1:7864/api/v1/run" +FLOW_ID = "ef7e0554-69e5-4e3e-ab29-ee83bcd8d9ef" +# You can tweak the flow by adding a tweaks dictionary +# e.g {"OpenAI-XXXXX": {"model_name": "gpt-4"}} + +def run_flow(message: str, + flow_id: str, + output_type: str = "chat", + input_type: str = "chat", + tweaks: Optional[dict] = None, + api_key: Optional[str] = None) -> dict: + """ + Run a flow with a given message and optional tweaks. + + :param message: The message to send to the flow + :param flow_id: The ID of the flow to run + :param tweaks: Optional tweaks to customize the flow + :return: The JSON response from the flow + """ + api_url = f"{BASE_API_URL}/{flow_id}" + + payload = { + "input_value": message, + "output_type": output_type, + "input_type": input_type, + } + headers = None + if tweaks: + payload["tweaks"] = tweaks + if api_key: + headers = {"x-api-key": api_key} + response = requests.post(api_url, json=payload, headers=headers) + return response.json() + +# Setup any tweaks you want to apply to the flow +message = "message" + +print(run_flow(message=message, flow_id=FLOW_ID)) +``` +3. Run your Python app: +```python +python3 app.py +``` + +The result is similar to the curl call: +```bash +{'session_id': 'ef7e0554-69e5-4e3e-ab29-ee83bcd8d9ef:bf81d898868ac87e1b4edbd96c131c5dee801ea2971122cc91352d144a45b880', 'outputs': [{'inputs': {'input_value': 'message'}, 'outputs': [{'results': {'result': "Arrr matey! What be yer message for this ol' pirate? Speak up or walk the plank!"}, 'artifacts': {'message': "Arrr matey! What be yer message for this ol' pirate? Speak up or walk the plank!", 'sender': 'Machine', 'sender_name': 'AI'}, 'messages': [{'message': "Arrr matey! What be yer message for this ol' pirate? Speak up or walk the plank!", 'sender': 'Machine', 'sender_name': 'AI', 'component_id': 'ChatOutput-ktwdw'}], 'component_display_name': 'Chat Output', 'component_id': 'ChatOutput-ktwdw', 'used_frozen_result': False}]}]} +``` +Your Python app POSTs to your Langflow server, and the server runs the flow and returns the result. + +See [API](../administration/api.mdx) for more ways to interact with your headless Langflow server. \ No newline at end of file From d8cfe679bf6f4fd02932eb6ce5d4d5d1fbe1e908 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 17:14:53 -0400 Subject: [PATCH 09/61] nav --- docs/sidebars.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/docs/sidebars.js b/docs/sidebars.js index d3f4f2671..adcafa410 100644 --- a/docs/sidebars.js +++ b/docs/sidebars.js @@ -116,7 +116,10 @@ module.exports = { type: "category", label: "Deployment", collapsed: true, - items: ["deployment/gcp-deployment"], + items: ["deployment/gcp-deployment", + "deployment/docker", + "deployment/backend-only" + ], }, { type: "category", From 1cf4779059717fcf11b6b26b67b4594a2dc86dfc Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 17:16:23 -0400 Subject: [PATCH 10/61] title-and-nav --- docs/docs/deployment/backend-only.md | 3 +-- docs/sidebars.js | 6 +++--- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/docs/docs/deployment/backend-only.md b/docs/docs/deployment/backend-only.md index 7e361addd..92f1189e1 100644 --- a/docs/docs/deployment/backend-only.md +++ b/docs/docs/deployment/backend-only.md @@ -1,5 +1,4 @@ -# Backend-only Deployment - +# Backend-only You can run Langflow in `--backend-only` mode to expose your Langflow app as an API, without running the frontend UI. Start langflow in backend-only mode with `python3 -m langflow run --backend-only`. diff --git a/docs/sidebars.js b/docs/sidebars.js index adcafa410..26e128247 100644 --- a/docs/sidebars.js +++ b/docs/sidebars.js @@ -116,9 +116,9 @@ module.exports = { type: "category", label: "Deployment", collapsed: true, - items: ["deployment/gcp-deployment", - "deployment/docker", - "deployment/backend-only" + items: ["deployment/docker", + "deployment/backend-only", + "deployment/gcp-deployment", ], }, { From 34e57b6a449ce3cd6def142cedb2053d4a658691 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Wed, 5 Jun 2024 17:18:00 -0400 Subject: [PATCH 11/61] link --- docs/docs/administration/cli.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/administration/cli.mdx b/docs/docs/administration/cli.mdx index cd418708d..65fd1357c 100644 --- a/docs/docs/administration/cli.mdx +++ b/docs/docs/administration/cli.mdx @@ -127,7 +127,7 @@ python -m langflow run | `--remove-api-keys`/`--no-remove-api-keys`| Toggles the option to remove API keys from the projects saved in the database. Can be set using the `LANGFLOW_REMOVE_API_KEYS` environment variable. The default is `no-remove-api-keys`. | | `--install-completion [bash\|zsh\|fish\|powershell\|pwsh]`| Installs completion for the specified shell. | | `--show-completion [bash\|zsh\|fish\|powershell\|pwsh]` | Shows completion for the specified shell, allowing you to copy it or customize the installation. | -| `--backend-only` | This parameter, with a default value of `False`, allows running only the backend server without the frontend. It can also be set using the `LANGFLOW_BACKEND_ONLY` environment variable. | +| `--backend-only` | This parameter, with a default value of `False`, allows running only the backend server without the frontend. It can also be set using the `LANGFLOW_BACKEND_ONLY` environment variable. For more, see [Backend-only](../deployment/backend-only.md).| | `--store` | This parameter, with a default value of `True`, enables the store features, use `--no-store` to deactivate it. It can be configured using the `LANGFLOW_STORE` environment variable. | #### Environment Variables From 7ad91a9b947218b207cd092efd2ab3864aac29a4 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Thu, 6 Jun 2024 11:44:11 -0400 Subject: [PATCH 12/61] copy-db-info --- docs/docs/administration/cli.mdx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/docs/docs/administration/cli.mdx b/docs/docs/administration/cli.mdx index 65fd1357c..3991376f3 100644 --- a/docs/docs/administration/cli.mdx +++ b/docs/docs/administration/cli.mdx @@ -35,7 +35,7 @@ python -m langflow | Command | Description | | ------- | ----------- | | `api-key` | Creates an API key for the default superuser if AUTO_LOGIN is enabled. | -| `copy-db` | Copy the database files to the current directory. | +| `copy-db` | Copy the database files to the current directory (`which langflow`). | | `migration` | Run or test migrations. | | `run` | Run the Langflow. | | `superuser` | Create a superuser. | @@ -70,10 +70,9 @@ python -m langflow api-key ## langflow copy-db -Run the `copy-db` command to copy the cached database files to the current directory. -If the files exist in the cache directory, they will be copied to the same directory as `__main__.py`, which is `/Users/username/Documents/GitHub/langflow/test-env/lf-rs/lib/python3.10/site-packages/langflow`. +Run the `copy-db` command to copy the cached `langflow.db` and `langflow-pre.db` database files to the current directory. -This function copies the `langflow.db` and `langflow-pre.db` files from the cache directory to the current directory. +If the files exist in the cache directory, they will be copied to the same directory as `__main__.py`, which can be found with `which langflow`. ### Options From 4e7867fd661b6089f48f26cfc48139d5d77c3f64 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Thu, 6 Jun 2024 12:33:21 -0400 Subject: [PATCH 13/61] numbers --- docs/docs/deployment/backend-only.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/docs/deployment/backend-only.md b/docs/docs/deployment/backend-only.md index 92f1189e1..c82e55aa6 100644 --- a/docs/docs/deployment/backend-only.md +++ b/docs/docs/deployment/backend-only.md @@ -37,11 +37,11 @@ Note the flow ID of `ef7e0554-69e5-4e3e-ab29-ee83bcd8d9ef`. You can find this ID ## Start Langflow in backend-only mode -3. Stop Langflow with Ctrl+C. -4. Start langflow in backend-only mode with `python3 -m langflow run --backend-only`. +1. Stop Langflow with Ctrl+C. +2. Start langflow in backend-only mode with `python3 -m langflow run --backend-only`. The terminal prints ` Welcome to ⛓ Langflow `, and a blank window opens at `http://127.0.0.1:7864/all`. Langflow will now serve requests to its API. -5. Run the curl code you copied from the UI. +3. Run the curl code you copied from the UI. You should get a result like this: ```bash {"session_id":"ef7e0554-69e5-4e3e-ab29-ee83bcd8d9ef:bf81d898868ac87e1b4edbd96c131c5dee801ea2971122cc91352d144a45b880","outputs":[{"inputs":{"input_value":"hi, are you there?"},"outputs":[{"results":{"result":"Arrr, ahoy matey! Aye, I be here. What be ye needin', me hearty?"},"artifacts":{"message":"Arrr, ahoy matey! Aye, I be here. What be ye needin', me hearty?","sender":"Machine","sender_name":"AI"},"messages":[{"message":"Arrr, ahoy matey! Aye, I be here. What be ye needin', me hearty?","sender":"Machine","sender_name":"AI","component_id":"ChatOutput-ktwdw"}],"component_display_name":"Chat Output","component_id":"ChatOutput-ktwdw","used_frozen_result":false}]}]}% From 60023657d8e024eb1d3c0430a9ccc1d08ada8fbe Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Thu, 6 Jun 2024 12:39:16 -0400 Subject: [PATCH 14/61] command-order --- docs/docs/administration/cli.mdx | 16 +++++++--------- 1 file changed, 7 insertions(+), 9 deletions(-) diff --git a/docs/docs/administration/cli.mdx b/docs/docs/administration/cli.mdx index 3991376f3..11ea6fa65 100644 --- a/docs/docs/administration/cli.mdx +++ b/docs/docs/administration/cli.mdx @@ -23,15 +23,6 @@ langflow --help python -m langflow ``` -### Options - -| Option | Description | -| ------ | ----------- | -| `--install-completion` | Install completion for the current shell. | -| `--show-completion` | Show completion for the current shell, to copy it or customize the installation. | -| `--help` | Show this message and exit. | - - | Command | Description | | ------- | ----------- | | `api-key` | Creates an API key for the default superuser if AUTO_LOGIN is enabled. | @@ -40,6 +31,13 @@ python -m langflow | `run` | Run the Langflow. | | `superuser` | Create a superuser. | +### Options + +| Option | Description | +| ------ | ----------- | +| `--install-completion` | Install completion for the current shell. | +| `--show-completion` | Show completion for the current shell, to copy it or customize the installation. | +| `--help` | Show this message and exit. | ## langflow api-key From ab46982053714c707d2a20aa152339f5e5b4d8fe Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 13:47:08 -0300 Subject: [PATCH 15/61] Removed ID getter from TableComponent and fixed Shortcuts --- .../src/components/tableComponent/index.tsx | 16 +++++++--------- .../SettingsPage/pages/ShortcutsPage/index.tsx | 11 +++++------ 2 files changed, 12 insertions(+), 15 deletions(-) diff --git a/src/frontend/src/components/tableComponent/index.tsx b/src/frontend/src/components/tableComponent/index.tsx index a4e4f4d6a..7f9012b0e 100644 --- a/src/frontend/src/components/tableComponent/index.tsx +++ b/src/frontend/src/components/tableComponent/index.tsx @@ -13,6 +13,7 @@ import ForwardedIconComponent from "../genericIconComponent"; import { Alert, AlertDescription, AlertTitle } from "../ui/alert"; import ResetColumns from "./components/ResetColumns"; import resetGrid from "./utils/reset-grid-columns"; +import { useParams } from "react-router-dom"; interface TableComponentProps extends AgGridReactProps { columnDefs: NonNullable; @@ -32,7 +33,7 @@ const TableComponent = forwardRef< alertDescription = DEFAULT_TABLE_ALERT_MSG, ...props }, - ref + ref, ) => { let colDef = props.columnDefs.map((col, index) => { let newCol = { @@ -82,16 +83,16 @@ const TableComponent = forwardRef< // @ts-ignore realRef.current = params; const updatedColumnDefs = makeLastColumnNonResizable([...colDef]); - params.api.setColumnDefs(updatedColumnDefs); + params.api.setGridOption("columnDefs", updatedColumnDefs); initialColumnDefs.current = params.api.getColumnDefs(); if (props.onGridReady) props.onGridReady(params); }; const onColumnMoved = (params) => { const updatedColumnDefs = makeLastColumnNonResizable( - params.columnApi.getAllGridColumns().map((col) => col.getColDef()) + params.columnApi.getAllGridColumns().map((col) => col.getColDef()), ); - params.api.setColumnDefs(updatedColumnDefs); + params.api.setGridOption("columnDefs", updatedColumnDefs); if (props.onColumnMoved) props.onColumnMoved(params); }; @@ -114,7 +115,7 @@ const TableComponent = forwardRef< className={cn( dark ? "ag-theme-quartz-dark" : "ag-theme-quartz", "ag-theme-shadcn flex h-full flex-col", - "relative" + "relative", )} // applying the grid theme > { - return params.data.id; - }} pagination={true} onGridReady={onGridReady} onColumnMoved={onColumnMoved} @@ -135,7 +133,7 @@ const TableComponent = forwardRef< resetGrid(realRef, initialColumnDefs)} /> ); - } + }, ); export default TableComponent; diff --git a/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/index.tsx b/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/index.tsx index 56052e7de..c6a5235d4 100644 --- a/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/index.tsx +++ b/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/index.tsx @@ -20,7 +20,7 @@ export default function ShortcutsPage() { const redoShortcut = `${isMac ? "Cmd" : "Ctrl"} + Y`; // Column Definitions: Defines the columns to be displayed. - const [colDefs, setColDefs] = useState<(ColDef | ColGroupDef)[]>([ + const colDefs = [ { headerName: "Functionality", field: "name", @@ -33,9 +33,9 @@ export default function ShortcutsPage() { editable: false, resizable: false, }, - ]); + ]; - const [nodesRowData, setNodesRowData] = useState([ + const nodesRowData = [ { name: "Advanced Settings Component", shortcut: advancedShortcut, @@ -96,7 +96,7 @@ export default function ShortcutsPage() { shortcut: redoShortcut, resizable: false, }, - ]); + ]; return (
@@ -114,11 +114,10 @@ export default function ShortcutsPage() {

-
+
Date: Thu, 6 Jun 2024 14:20:59 -0300 Subject: [PATCH 16/61] Added play on hover of entire node --- .../src/customNodes/genericNode/index.tsx | 70 +++++++++++-------- 1 file changed, 39 insertions(+), 31 deletions(-) diff --git a/src/frontend/src/customNodes/genericNode/index.tsx b/src/frontend/src/customNodes/genericNode/index.tsx index 5f145d523..c007caab3 100644 --- a/src/frontend/src/customNodes/genericNode/index.tsx +++ b/src/frontend/src/customNodes/genericNode/index.tsx @@ -56,14 +56,14 @@ export default function GenericNode({ const [nodeName, setNodeName] = useState(data.node!.display_name); const [inputDescription, setInputDescription] = useState(false); const [nodeDescription, setNodeDescription] = useState( - data.node?.description! + data.node?.description!, ); const [isOutdated, setIsOutdated] = useState(false); const buildStatus = useFlowStore( - (state) => state.flowBuildStatus[data.id]?.status + (state) => state.flowBuildStatus[data.id]?.status, ); const lastRunTime = useFlowStore( - (state) => state.flowBuildStatus[data.id]?.timestamp + (state) => state.flowBuildStatus[data.id]?.timestamp, ); const [validationStatus, setValidationStatus] = useState(null); @@ -116,7 +116,7 @@ export default function GenericNode({ updateNodeInternals(data.id); }, - [data.id, data.node, setNode, setIsOutdated] + [data.id, data.node, setNode, setIsOutdated], ); if (!data.node!.template) { @@ -255,8 +255,17 @@ export default function GenericNode({ const isDark = useDarkStore((state) => state.dark); const renderIconStatus = ( buildStatus: BuildStatus | undefined, - validationStatus: validationStatusType | null + validationStatus: validationStatusType | null, ) => { + const conditionSuccess = validationStatus && validationStatus.valid; + const conditionInactive = + validationStatus && + !validationStatus.valid && + buildStatus === BuildStatus.INACTIVE; + const conditionError = + buildStatus === BuildStatus.ERROR || + (validationStatus && !validationStatus.valid); + if (buildStatus === BuildStatus.BUILDING) { return ; } else { @@ -264,31 +273,30 @@ export default function GenericNode({ <> - {validationStatus && validationStatus.valid ? ( + {conditionSuccess ? ( - ) : validationStatus && - !validationStatus.valid && - buildStatus === BuildStatus.INACTIVE ? ( + ) : conditionInactive ? ( - ) : buildStatus === BuildStatus.ERROR || - (validationStatus && !validationStatus.valid) ? ( + ) : conditionError ? ( ) : ( - + <> )} ); @@ -296,7 +304,7 @@ export default function GenericNode({ }; const getSpecificClassFromBuildStatus = ( buildStatus: BuildStatus | undefined, - validationStatus: validationStatusType | null + validationStatus: validationStatusType | null, ) => { let isInvalid = validationStatus && !validationStatus.valid; @@ -320,11 +328,11 @@ export default function GenericNode({ selected: boolean, showNode: boolean, buildStatus: BuildStatus | undefined, - validationStatus: validationStatusType | null + validationStatus: validationStatusType | null, ) => { const specificClassFromBuildStatus = getSpecificClassFromBuildStatus( buildStatus, - validationStatus + validationStatus, ); const baseBorderClass = getBaseBorderClass(selected); @@ -332,8 +340,8 @@ export default function GenericNode({ const names = classNames( baseBorderClass, nodeSizeClass, - "generic-node-div", - specificClassFromBuildStatus + "generic-node-div group/node", + specificClassFromBuildStatus, ); return names; }; @@ -393,7 +401,7 @@ export default function GenericNode({ selected, showNode, buildStatus, - validationStatus + validationStatus, )} > {data.node?.beta && showNode && ( @@ -524,7 +532,7 @@ export default function GenericNode({ } title={getFieldTitle( data.node?.template!, - templateField + templateField, )} info={data.node?.template[templateField].info} name={templateField} @@ -552,7 +560,7 @@ export default function GenericNode({ proxy={data.node?.template[templateField].proxy} showNode={showNode} /> - ) + ), )} { setInputDescription(true); @@ -771,13 +779,13 @@ export default function GenericNode({ } title={getFieldTitle( data.node?.template!, - templateField + templateField, )} info={data.node?.template[templateField].info} name={templateField} tooltipTitle={ data.node?.template[templateField].input_types?.join( - "\n" + "\n", ) ?? data.node?.template[templateField].type } required={data.node!.template[templateField].required} @@ -804,7 +812,7 @@ export default function GenericNode({
{" "} From 7c28bb2bd693668d1797bf430af8247019d42765 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 14:35:12 -0300 Subject: [PATCH 17/61] Added Export handler on Main Page --- .../components/componentsComponent/index.tsx | 45 ++++++++++++++----- 1 file changed, 35 insertions(+), 10 deletions(-) diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx index f7d52c611..3e167db13 100644 --- a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx +++ b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx @@ -18,6 +18,8 @@ import { getNameByType } from "../../utils/get-name-by-type"; import { sortFlows } from "../../utils/sort-flows"; import EmptyComponent from "../emptyComponent"; import HeaderComponent from "../headerComponent"; +import { downloadFlow, removeApiKeys } from "../../../../utils/reactflowUtils"; +import { useDarkStore } from "../../../../stores/darkStore"; export default function ComponentsComponent({ type = "all", @@ -31,22 +33,22 @@ export default function ComponentsComponent({ const allFlows = useFlowsManagerStore((state) => state.allFlows); const flowsFromFolder = useFolderStore( - (state) => state.selectedFolder?.flows + (state) => state.selectedFolder?.flows, ); const setSuccessData = useAlertStore((state) => state.setSuccessData); const setErrorData = useAlertStore((state) => state.setErrorData); const [openDelete, setOpenDelete] = useState(false); const searchFlowsComponents = useFlowsManagerStore( - (state) => state.searchFlowsComponents + (state) => state.searchFlowsComponents, ); const setSelectedFlowsComponentsCards = useFlowsManagerStore( - (state) => state.setSelectedFlowsComponentsCards + (state) => state.setSelectedFlowsComponentsCards, ); const selectedFlowsComponentsCards = useFlowsManagerStore( - (state) => state.selectedFlowsComponentsCards + (state) => state.selectedFlowsComponentsCards, ); const [handleFileDrop] = useFileDrop(uploadFlow, type)!; @@ -82,7 +84,7 @@ export default function ComponentsComponent({ f.name.toLowerCase().includes(searchFlowsComponents.toLowerCase()) || f.description .toLowerCase() - .includes(searchFlowsComponents.toLowerCase()) + .includes(searchFlowsComponents.toLowerCase()), ); if (searchFlowsComponents === "") { @@ -129,6 +131,8 @@ export default function ComponentsComponent({ setOpenDelete(true); } else if (action === "duplicate") { handleDuplicate(); + } else if (action === "exprot") { + handleExport(); } }; @@ -137,9 +141,9 @@ export default function ComponentsComponent({ selectedFlowsComponentsCards.map((selectedFlow) => addFlow( true, - allFlows.find((flow) => flow.id === selectedFlow) - ) - ) + allFlows.find((flow) => flow.id === selectedFlow), + ), + ), ).then(() => { resetFilter(); getFoldersApi(true); @@ -152,6 +156,26 @@ export default function ComponentsComponent({ }); }; + const version = useDarkStore((state) => state.version); + + const handleExport = () => { + selectedFlowsComponentsCards.map((selectedFlowId) => { + const selectedFlow = allFlows.find((flow) => flow.id === selectedFlowId); + downloadFlow( + removeApiKeys({ + id: selectedFlow!.id, + data: selectedFlow!.data!, + description: selectedFlow!.description, + name: selectedFlow!.name, + last_tested_version: version, + is_component: false, + }), + selectedFlow!.name, + selectedFlow!.description, + ); + }); + }; + const handleDeleteMultiple = () => { removeFlow(selectedFlowsComponentsCards) .then(() => { @@ -180,7 +204,7 @@ export default function ComponentsComponent({ return true; } return false; - } + }, ); setSelectedFlowsComponentsCards(selectedFlows); @@ -215,7 +239,7 @@ export default function ComponentsComponent({ if (type === "all") return allFlows?.length; return allFlows?.filter( - (f) => (f.is_component ?? false) === (type === "component") + (f) => (f.is_component ?? false) === (type === "component"), )?.length; }; @@ -226,6 +250,7 @@ export default function ComponentsComponent({ handleDelete={() => handleSelectOptionsChange("delete")} handleSelectAll={handleSelectAll} handleDuplicate={() => handleSelectOptionsChange("duplicate")} + handleExport={() => handleSelectOptionsChange("export")} disableFunctions={!(selectedFlowsComponentsCards?.length > 0)} /> )} From 5b1de707fa72cd6a00f52ce1202769b523ca11f0 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 14:37:30 -0300 Subject: [PATCH 18/61] Added handleExport as parameter of header and added button to export --- .../components/headerComponent/index.tsx | 22 ++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) diff --git a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx index 2d2e43a2a..756fda03c 100644 --- a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx +++ b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx @@ -8,6 +8,7 @@ type HeaderComponentProps = { handleSelectAll: (select) => void; handleDelete: () => void; handleDuplicate: () => void; + handleExport: () => void; disableFunctions: boolean; }; @@ -15,6 +16,7 @@ const HeaderComponent = ({ handleSelectAll, handleDelete, handleDuplicate, + handleExport, disableFunctions, }: HeaderComponentProps) => { const [shouldSelectAll, setShouldSelectAll] = useState(true); @@ -49,6 +51,24 @@ const HeaderComponent = ({
+
+ Select items to export + ) : ( + Export selected items + ) + } + > + + +
From 22248d91040ba5f99b1a8058797c7f96df342f42 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 14:39:33 -0300 Subject: [PATCH 19/61] Fixed naming of errors --- .../pages/MainPage/components/componentsComponent/index.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx index 3e167db13..5bd536e8d 100644 --- a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx +++ b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx @@ -131,7 +131,7 @@ export default function ComponentsComponent({ setOpenDelete(true); } else if (action === "duplicate") { handleDuplicate(); - } else if (action === "exprot") { + } else if (action === "export") { handleExport(); } }; @@ -174,6 +174,7 @@ export default function ComponentsComponent({ selectedFlow!.description, ); }); + setSuccessData({ title: "Flows exported successfully" }); }; const handleDeleteMultiple = () => { @@ -185,7 +186,7 @@ export default function ComponentsComponent({ getFolderById(folderId ? folderId : myCollectionId); } setSuccessData({ - title: "Selected items deleted successfully!", + title: "Selected items deleted successfully", }); }) .catch(() => { From a96b08472f46526b9b1c4a8a504f2a4539ee876b Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 14:42:50 -0300 Subject: [PATCH 20/61] Fixed buttons not using ShadCN buttons on header of components section --- .../components/headerComponent/index.tsx | 28 +++++++++++++++---- 1 file changed, 22 insertions(+), 6 deletions(-) diff --git a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx index 756fda03c..114816a91 100644 --- a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx +++ b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx @@ -3,6 +3,7 @@ import IconComponent from "../../../../components/genericIconComponent"; import ShadTooltip from "../../../../components/shadTooltipComponent"; import { Checkbox } from "../../../../components/ui/checkbox"; import { cn } from "../../../../utils/utils"; +import { Button } from "../../../../components/ui/button"; type HeaderComponentProps = { handleSelectAll: (select) => void; @@ -61,12 +62,17 @@ const HeaderComponent = ({ ) } > - +
@@ -79,12 +85,17 @@ const HeaderComponent = ({ ) } > - +
@@ -97,7 +108,12 @@ const HeaderComponent = ({ ) } > - +
From 9c91f4056aadec354d02729c1fa1fa72f496f41a Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 14:43:04 -0300 Subject: [PATCH 21/61] Fixed naming and position of alert on Export modal --- src/frontend/src/constants/constants.ts | 2 +- src/frontend/src/modals/exportModal/index.tsx | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/frontend/src/constants/constants.ts b/src/frontend/src/constants/constants.ts index d9ce00554..a113b3911 100644 --- a/src/frontend/src/constants/constants.ts +++ b/src/frontend/src/constants/constants.ts @@ -668,7 +668,7 @@ export const ZERO_NOTIFICATIONS = "No new notifications"; export const SUCCESS_BUILD = "Built sucessfully ✨"; export const ALERT_SAVE_WITH_API = - "Caution: Uncheck this box only removes API keys from fields specifically designated for API keys."; + "Caution: Unchecking this box only removes API keys from fields specifically designated for API keys."; export const SAVE_WITH_API_CHECKBOX = "Save with my API keys"; export const EDIT_TEXT_MODAL_TITLE = "Edit Text"; diff --git a/src/frontend/src/modals/exportModal/index.tsx b/src/frontend/src/modals/exportModal/index.tsx index a04891821..9cd81c123 100644 --- a/src/frontend/src/modals/exportModal/index.tsx +++ b/src/frontend/src/modals/exportModal/index.tsx @@ -45,7 +45,7 @@ const ExportModal = forwardRef( is_component: false, }, name!, - description + description, ); setNoticeData({ title: API_WARNING_NOTICE_ALERT, @@ -61,7 +61,7 @@ const ExportModal = forwardRef( is_component: false, }), name!, - description + description, ); setOpen(false); }} @@ -94,7 +94,7 @@ const ExportModal = forwardRef( {SAVE_WITH_API_CHECKBOX}
- + {ALERT_SAVE_WITH_API} @@ -102,6 +102,6 @@ const ExportModal = forwardRef( ); - } + }, ); export default ExportModal; From fe9dcdf424efb3732ee520f6b85072a304508bb3 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 14:59:10 -0300 Subject: [PATCH 22/61] Fixed select all classes --- .../components/headerComponent/index.tsx | 30 ++++++++----------- 1 file changed, 12 insertions(+), 18 deletions(-) diff --git a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx index 114816a91..dc7143198 100644 --- a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx +++ b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx @@ -31,25 +31,19 @@ const HeaderComponent = ({ <>
- -
From ec240072e77a95244c2ba2990a097165a5e8dbe8 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Thu, 6 Jun 2024 15:03:10 -0300 Subject: [PATCH 23/61] Added Upload Flow button to main page --- .../components/headerComponent/index.tsx | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx index dc7143198..e5145fd83 100644 --- a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx +++ b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx @@ -1,5 +1,7 @@ import { useState } from "react"; -import IconComponent from "../../../../components/genericIconComponent"; +import IconComponent, { + ForwardedIconComponent, +} from "../../../../components/genericIconComponent"; import ShadTooltip from "../../../../components/shadTooltipComponent"; import { Checkbox } from "../../../../components/ui/checkbox"; import { cn } from "../../../../utils/utils"; @@ -30,7 +32,19 @@ const HeaderComponent = ({ return ( <>
-
+
+ + {allFlows?.length > 0 && ( + handleSelectOptionsChange("delete")} + handleSelectAll={handleSelectAll} + handleDuplicate={() => handleSelectOptionsChange("duplicate")} + handleExport={() => handleSelectOptionsChange("export")} + disableFunctions={!(selectedFlowsComponentsCards?.length > 0)} + /> + )} +
{ return ( <> -
+
diff --git a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx index a4fd7cfb4..b52fe8ad0 100644 --- a/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx +++ b/src/frontend/src/pages/MainPage/components/headerComponent/index.tsx @@ -12,7 +12,6 @@ type HeaderComponentProps = { handleDelete: () => void; handleDuplicate: () => void; handleExport: () => void; - handleImport: () => void; disableFunctions: boolean; }; @@ -21,7 +20,6 @@ const HeaderComponent = ({ handleDelete, handleDuplicate, handleExport, - handleImport, disableFunctions, }: HeaderComponentProps) => { const [shouldSelectAll, setShouldSelectAll] = useState(true); @@ -33,20 +31,8 @@ const HeaderComponent = ({ return ( <> -
-
- +
+
-
+
Date: Thu, 6 Jun 2024 16:10:34 -0300 Subject: [PATCH 28/61] Fixed eraser color --- .../src/modals/IOModal/components/chatView/index.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/frontend/src/modals/IOModal/components/chatView/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/index.tsx index 8604a11dc..4d2e79bd3 100644 --- a/src/frontend/src/modals/IOModal/components/chatView/index.tsx +++ b/src/frontend/src/modals/IOModal/components/chatView/index.tsx @@ -133,7 +133,7 @@ export default function ChatView({ function updateChat( chat: ChatMessageType, message: string, - stream_url?: string + stream_url?: string, ) { // if (message === "") return; chat.message = message; @@ -165,14 +165,12 @@ export default function ChatView({ className="flex gap-1" size="none" variant="none" + disabled={lockChat} onClick={() => handleSelectChange("builds")} >