From 71a22b9a0f8f570cd4865410e02506323415b870 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Fri, 7 Jun 2024 18:07:45 -0400 Subject: [PATCH] style-edits --- docs/docs/administration/chat-widget.mdx | 29 +++++++++++------------- docs/docs/administration/cli.mdx | 2 +- docs/docs/administration/global-env.mdx | 2 -- docs/docs/administration/login.mdx | 10 ++++---- docs/docs/administration/playground.mdx | 2 -- 5 files changed, 18 insertions(+), 27 deletions(-) diff --git a/docs/docs/administration/chat-widget.mdx b/docs/docs/administration/chat-widget.mdx index b2a97d30e..e73804673 100644 --- a/docs/docs/administration/chat-widget.mdx +++ b/docs/docs/administration/chat-widget.mdx @@ -61,7 +61,7 @@ import Admonition from "@theme/Admonition"; --- -### HTML +### Embed your flow into HTML The Chat Widget can be embedded into any HTML page, inside a _``_ tag, as demonstrated in the video below. @@ -73,15 +73,15 @@ The Chat Widget can be embedded into any HTML page, inside a _``_ tag, as --- -### React +### Embed your flow with React -To embed the Chat Widget using React, you'll need to insert this _` ``` -Then, declare your Web Component and encapsulate it in a React component. +2. Declare your Web Component and encapsulate it in a React component. ```jsx declare global { @@ -106,28 +106,27 @@ export default function ChatWidget({ className }) { } ``` -Finally, you can place the component anywhere in your code to display the Chat Widget. +3. Finally, you can place the component anywhere in your code to display the Chat Widget. --- -### Angular +### Embed your flow with Angular -To use it in Angular, first add this _` ``` -When you use a custom web component in an Angular template, the Angular compiler might show a warning when it doesn't recognize the custom elements by default. To suppress this warning, add _`CUSTOM_ELEMENTS_SCHEMA`_ to the module's _`@NgModule.schemas`_. - -- Open the module file (it typically ends with _.module.ts_) where you'd add the _`langflow-chat`_ web component. -- Import _`CUSTOM_ELEMENTS_SCHEMA`_ at the top of the file: +2. When you use a custom web component in an Angular template, the Angular compiler might show a warning when it doesn't recognize the custom elements by default. To suppress this warning, add _`CUSTOM_ELEMENTS_SCHEMA`_ to the module's _`@NgModule.schemas`_. +3. Open the module file (it typically ends with _.module.ts_) where you'd add the _`langflow-chat`_ web component. +4. Import _`CUSTOM_ELEMENTS_SCHEMA`_ at the top of the file: ```ts import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from "@angular/core"; ``` -- Add _`CUSTOM_ELEMENTS_SCHEMA`_ to the 'schemas' array inside the '@NgModule' decorator: +5. Add _`CUSTOM_ELEMENTS_SCHEMA`_ to the 'schemas' array inside the '@NgModule' decorator: ```ts @NgModule({ @@ -142,9 +141,7 @@ import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from "@angular/core"; export class YourModule {} ``` -In your Angular project, find the component belonging to the module where _`CUSTOM_ELEMENTS_SCHEMA`_ was added. - -- Inside the template, add the _`langflow-chat`_ tag to include the Chat Widget in your component's view: +6. In your Angular project, find the component belonging to the module where _`CUSTOM_ELEMENTS_SCHEMA`_ was added. Inside the template, add the _`langflow-chat`_ tag to include the Chat Widget in your component's view: ```jsx diff --git a/docs/docs/administration/login.mdx b/docs/docs/administration/login.mdx index f89f3a5ee..20386aebb 100644 --- a/docs/docs/administration/login.mdx +++ b/docs/docs/administration/login.mdx @@ -6,11 +6,9 @@ import Admonition from "@theme/Admonition"; # Sign Up and Sign In -## Introduction - The login functionality in Langflow serves to authenticate users and protect sensitive routes in the application. Starting from version 0.5, Langflow introduces an enhanced login mechanism that is governed by a few environment variables. This allows new secure features. -## Environment Variables +## Environment variables The following environment variables are crucial in configuring the login settings: @@ -68,7 +66,7 @@ export LANGFLOW_SECRET_KEY=randomly_generated_secure_key By default, this variable is set to `False`. When enabled (`True`), new users are automatically activated and can log in without requiring explicit activation by the superuser. -## Command-Line Interface +## Manage superusers with the CLI Langflow provides a command-line utility for managing superusers: @@ -78,7 +76,7 @@ langflow superuser This command prompts you to enter the username and password for the superuser, unless they are already set using environment variables. -## Sign-up +## Sign in With _`LANGFLOW_AUTO_LOGIN`_ set to _`False`_, Langflow requires users to sign up before they can log in. The sign-up page is the default landing page when a user visits Langflow for the first time. @@ -93,7 +91,7 @@ With _`LANGFLOW_AUTO_LOGIN`_ set to _`False`_, Langflow requires users to sign u ## Profile settings -You can change your profile settings by clicking on the profile icon in the top right corner of the Langflow dashboard. This opens a dropdown menu with the following options: +Once signed in, you can change your profile settings by clicking on the profile icon in the top right corner of the Langflow dashboard. This opens a dropdown menu with the following options: - **Admin Page**: Opens the admin page, which is only accessible to the superuser. - **Profile Settings**: Opens the profile settings page. diff --git a/docs/docs/administration/playground.mdx b/docs/docs/administration/playground.mdx index 13d16422a..7bc0c8db7 100644 --- a/docs/docs/administration/playground.mdx +++ b/docs/docs/administration/playground.mdx @@ -28,8 +28,6 @@ As long as you have a flow's environment variables set, you can run it by clicki 2. Chat with your bot as you normally would, all without having to open the editor. -## Video -