Refactor SettingsPage component and add Messages page (#2084)
* Feat: Create the first version of the eraser tool * feat: Add Messages page to SettingsPage Refactor the SettingsPage component to include a new "Messages" page. This page will be accessible through the "/settings/messages" route and will display messages related to user settings. The necessary changes have been made to the index.tsx file of the SettingsPage component and the routes.tsx file. * refactor(tableComponent): update column definitions to include checkbox selection logic for first column feat(API): add support for excluding specific columns in getMessagesTable function fix(flowLogsModal): pass excludedFields parameter to getMessagesTable function refactor(GlobalVariablesPage): remove unnecessary checkbox selection properties from column definitions fix(messagesPage): pass excludedFields parameter to getMessagesTable function refactor(utils): add support for excluding specific columns in extractColumnsFromRows function * feat: Add API endpoints for managing messages This commit adds new API endpoints for managing messages. It includes the ability to delete messages by their IDs, update a specific message, and delete all messages associated with a session. These changes are implemented in the `monitor.py`, `schema.py`, and `service.py` files. * ✨ (monitor.py): add MessageIds schema for structured message deletion ♻️ (monitor.py): change delete_messages endpoint to POST for better semantics ♻️ (monitor.py): update delete_messages to use MessageIds schema ✨ (schemas.py): add MessageIds schema for structured message deletion 🐛 (service.py): fix SQL query in delete_messages to use correct column name ✨ (index.tsx): add toTitleCase utility to format column headers ✨ (API/index.ts): add deleteMessagesFn to handle message deletion via API ✨ (headerMessages): add HeaderMessagesComponent for message management UI ✨ (use-messages-table): add useMessagesTable hook to fetch and manage messages ✨ (use-remove-messages): add useRemoveMessages hook to handle message deletion ♻️ (messagesPage): refactor messages page to use new messages store ✨ (messagesStore): create zustand store for managing messages state ✨ (types): add types for messages and zustand messages store * 💡 (schemas.py): add newline at end of file to follow PEP 8 guidelines * refactor(headerMessages): update text content in HeaderMessagesComponent * move editable attribute to table Component * refactor: Move editable attribute to TableComponent add update function, need to fix backend * ♻️ (monitor.py): change POST to DELETE for delete_messages endpoint ♻️ (schemas.py): remove unused MessageIds schema ♻️ (api.tsx): add missing commas in ApiInterceptor function 🐛 (api.tsx): fix duplicate request check to include method "get" ♻️ (index.ts): change deleteMessagesFn to use DELETE method instead of POST ♻️ (use-remove-messages.tsx): clean up comments and improve error handling * start history in playgroundModal * ♻️ (monitor.py): refactor update_message to return MessageModelResponse ♻️ (service.py): update SQL query to use index instead of id ♻️ (api.tsx): refactor duplicate request check logic ✨ (check-duplicate-requests.ts): add helper to check and store duplicate requests 🐛 (messagesStore.ts): fix message update logic to use index instead of id * ♻️ (monitor.py, service.py): remove trailing whitespace to improve code cleanliness * refactor: Add getSessions function to fetch available sessions in IOModal * 🐛 (service.py): add missing 'id' column in SQL query to fix data retrieval issue 💡 (service.py): add print statement for debugging SQL query ♻️ (index.tsx): reorder imports for better readability and maintainability ♻️ (flowStore.ts): remove trailing commas to improve code consistency and readability 💡 (index.ts, storeUtils.ts): format type definitions for better readability * update editable fields * Feat: Make the table last column non-resizable and add a restore columns button * Remove unnused imports * Refactor: Remove “Page size” from table pagination * Refactor: remove page size directly in css file * chore: Update description text in SettingsPage * Refactor: Add ResetColumns component to improve table functionality * Refactor: Make Reset Column button reset columns order * Refactor: Remove select from delete session button * Refactor: Remove commented code for chat history tab in IOModal * update route * fix selection bug on Messages Table * fix libs --------- Co-authored-by: igorrCarvalho <igorsilvabhz6@gmail.com> Co-authored-by: ogabrielluiz <gabriel@langflow.org> Co-authored-by: cristhianzl <cristhian.lousa@gmail.com> Co-authored-by: italojohnny <italojohnnydosanjos@gmail.com>
This commit is contained in:
parent
a30bb145f7
commit
4236d22098
69 changed files with 1433 additions and 758 deletions
|
|
@ -17,7 +17,6 @@ Global Variables are a useful feature of Langflow, allowing you to define reusab
|
|||
- All Credential Global Variables are encrypted and accessible only by you.
|
||||
- Set _`LANGFLOW_STORE_ENVIRONMENT_VARIABLES`_ to _`true`_ in your `.env` file to add all variables in _`LANGFLOW_VARIABLES_TO_GET_FROM_ENVIRONMENT`_ to your user's Global Variables.
|
||||
|
||||
|
||||
## Creating and Adding a Global Variable
|
||||
|
||||
To create and add a global variable, click the 🌐 button in a Text field, and then click **+ Add New Variable**.
|
||||
|
|
@ -25,18 +24,20 @@ To create and add a global variable, click the 🌐 button in a Text field, and
|
|||
Text fields are where you write text without opening a Text area, and are identified with the 🌐 icon.
|
||||
|
||||
For example, to create an environment variable for the **OpenAI** component:
|
||||
1. In the **OpenAI API Key** text field, click the 🌐 button, then **Add New Variable**.
|
||||
2. Enter `openai_api_key` in the **Variable Name** field.
|
||||
3. Paste your OpenAI API Key (`sk-...`) in the **Value** field.
|
||||
4. Select **Credential** for the **Type**.
|
||||
5. Choose **OpenAI API Key** in the **Apply to Fields** field to apply this variable to all fields named **OpenAI API Key**.
|
||||
6. Click **Save Variable**.
|
||||
|
||||
1. In the **OpenAI API Key** text field, click the 🌐 button, then **Add New Variable**.
|
||||
2. Enter `openai_api_key` in the **Variable Name** field.
|
||||
3. Paste your OpenAI API Key (`sk-...`) in the **Value** field.
|
||||
4. Select **Credential** for the **Type**.
|
||||
5. Choose **OpenAI API Key** in the **Apply to Fields** field to apply this variable to all fields named **OpenAI API Key**.
|
||||
6. Click **Save Variable**.
|
||||
|
||||
You now have a `openai_api_key` global environment variable for your Langflow project.
|
||||
Subsequently, clicking the 🌐 button in a Text field will display the new variable in the dropdown.
|
||||
|
||||
<Admonition type="tip">
|
||||
You can also create global variables in **Settings** > **Variables and Secrets**.
|
||||
You can also create global variables in **Settings** > **Variables and
|
||||
Secrets**.
|
||||
</Admonition>
|
||||
|
||||
<ZoomableImage
|
||||
|
|
@ -65,7 +66,8 @@ Setting `LANGFLOW_STORE_ENVIRONMENT_VARIABLES` to `true` in your `.env` file (de
|
|||
These variables are accessible like any other Global Variable.
|
||||
|
||||
<Admonition type="tip">
|
||||
To prevent this behavior, set `LANGFLOW_STORE_ENVIRONMENT_VARIABLES` to `false` in your `.env` file.
|
||||
To prevent this behavior, set `LANGFLOW_STORE_ENVIRONMENT_VARIABLES` to
|
||||
`false` in your `.env` file.
|
||||
</Admonition>
|
||||
|
||||
You can specify variables to get from the environment by listing them in `LANGFLOW_VARIABLES_TO_GET_FROM_ENVIRONMENT`.
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import Admonition from '@theme/Admonition';
|
||||
import Admonition from "@theme/Admonition";
|
||||
import ZoomableImage from "/src/theme/ZoomableImage.js";
|
||||
|
||||
# Inputs and Outputs
|
||||
|
|
@ -29,9 +29,8 @@ This component collects user input from the chat.
|
|||
|
||||
<Admonition type="note" title="Note">
|
||||
<p>
|
||||
If `As Record` is `true` and the `Message` is a `Record`, the data
|
||||
of the `Record` will be updated with the `Sender`, `Sender Name`, and
|
||||
`Session ID`.
|
||||
If `As Record` is `true` and the `Message` is a `Record`, the data of the
|
||||
`Record` will be updated with the `Sender`, `Sender Name`, and `Session ID`.
|
||||
</p>
|
||||
</Admonition>
|
||||
|
||||
|
|
@ -112,9 +111,10 @@ This component sends a message to the chat.
|
|||
- **Message:** Specifies the text of the message.
|
||||
|
||||
<Admonition type="note" title="Note">
|
||||
<p>
|
||||
If `As Record` is `true` and the `Message` is a `Record`, the data in the `Record` is updated with the `Sender`, `Sender Name`, and `Session ID`.
|
||||
</p>
|
||||
<p>
|
||||
If `As Record` is `true` and the `Message` is a `Record`, the data in the
|
||||
`Record` is updated with the `Sender`, `Sender Name`, and `Session ID`.
|
||||
</p>
|
||||
</Admonition>
|
||||
|
||||
### Text Output
|
||||
|
|
@ -125,7 +125,6 @@ This component displays text data to the user. It is useful when you want to sho
|
|||
|
||||
- **Value:** Specifies the text data to be displayed. Defaults to an empty string.
|
||||
|
||||
|
||||
The `TextOutput` component provides a simple way to display text data. It allows textual data to be visible in the chat window during your interaction flow.
|
||||
|
||||
## Prompts
|
||||
|
|
@ -155,7 +154,8 @@ The `PromptTemplate` component enables users to create prompts and define variab
|
|||
|
||||
<Admonition type="info">
|
||||
After defining a variable in the prompt template, it acts as its own component
|
||||
input. See [Prompt Customization](../administration/prompt-customization) for more details.
|
||||
input. See [Prompt Customization](../administration/prompt-customization) for
|
||||
more details.
|
||||
</Admonition>
|
||||
|
||||
- **template:** The template used to format an individual request.
|
||||
- **template:** The template used to format an individual request.
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
In Langflow 1.0, we added two main input and output types: `Text` and `Record`.
|
||||
|
||||
`Text` is a simple string input and output type, while ``Record`` is a structure very similar to a dictionary in Python. It is a key-value pair data structure.
|
||||
`Text` is a simple string input and output type, while `Record` is a structure very similar to a dictionary in Python. It is a key-value pair data structure.
|
||||
|
||||
We've created a few components to help you work with these types. Let's see how a few of them work.
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue