From 8461eec1803604e6d32337b69880e9980fc419a0 Mon Sep 17 00:00:00 2001 From: igorrCarvalho Date: Tue, 27 Feb 2024 15:46:07 -0300 Subject: [PATCH] Refactor: Move texts to constants files --- .../components/parameterComponent/index.tsx | 6 ++-- .../src/CustomNodes/GenericNode/index.tsx | 6 ++-- .../src/alerts/alertDropDown/index.tsx | 3 +- src/frontend/src/components/IOview/index.tsx | 6 ++-- .../chatComponent/buildTrigger/index.tsx | 2 +- .../components/menuBar/index.tsx | 3 +- .../components/inputFileComponent/index.tsx | 2 +- .../newChatView/chatInput/index.tsx | 5 +-- .../src/components/newChatView/index.tsx | 7 ++-- .../components/textAreaComponent/index.tsx | 3 +- .../src/{ => constants}/alerts_constants.tsx | 0 src/frontend/src/constants/constants.ts | 32 +++++++++++++++++++ .../src/modals/SecretKeyModal/index.tsx | 2 +- .../src/modals/StoreApiKeyModal/index.tsx | 11 ++++--- .../src/modals/codeAreaModal/index.tsx | 6 ++-- src/frontend/src/modals/exportModal/index.tsx | 9 +++--- .../src/modals/formModal/chatInput/index.tsx | 7 ++-- src/frontend/src/modals/formModal/index.tsx | 10 +++--- .../src/modals/genericModal/index.tsx | 8 +++-- .../src/pages/AdminPage/LoginPage/index.tsx | 2 +- src/frontend/src/pages/AdminPage/index.tsx | 2 +- src/frontend/src/pages/ApiKeysPage/index.tsx | 2 +- .../components/PageComponent/index.tsx | 2 +- .../extraSidebarComponent/index.tsx | 2 +- .../MainPage/components/components/index.tsx | 2 +- src/frontend/src/pages/MainPage/index.tsx | 6 ++-- .../src/pages/ProfileSettingsPage/index.tsx | 2 +- src/frontend/src/pages/StorePage/index.tsx | 7 ++-- src/frontend/src/pages/loginPage/index.tsx | 2 +- src/frontend/src/pages/signUpPage/index.tsx | 2 +- src/frontend/src/stores/flowStore.ts | 2 +- src/frontend/src/utils/reactflowUtils.ts | 3 +- 32 files changed, 104 insertions(+), 60 deletions(-) rename src/frontend/src/{ => constants}/alerts_constants.tsx (100%) diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx index 0aae88857..9006039d1 100644 --- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx @@ -19,6 +19,8 @@ import { Button } from "../../../../components/ui/button"; import { LANGFLOW_SUPPORTED_TYPES, TOOLTIP_EMPTY, + inputHandleHover, + outputHandleHover, } from "../../../../constants/constants"; import { postCustomComponentUpdate } from "../../../../controllers/API"; import useAlertStore from "../../../../stores/alertStore"; @@ -182,8 +184,8 @@ export default function ParameterComponent({ {index === 0 && ( {left - ? "Avaliable input components:" - : "Avaliable output components:"} + ? inputHandleHover + : outputHandleHover} )} Building... + {statusBuilding} ) : !validationStatus ? ( - Build to validate status. + {statusBuild} ) : (
{typeof validationStatus.params === "string" diff --git a/src/frontend/src/alerts/alertDropDown/index.tsx b/src/frontend/src/alerts/alertDropDown/index.tsx index 967d82174..cf3fa13dc 100644 --- a/src/frontend/src/alerts/alertDropDown/index.tsx +++ b/src/frontend/src/alerts/alertDropDown/index.tsx @@ -8,6 +8,7 @@ import { import useAlertStore from "../../stores/alertStore"; import { AlertDropdownType } from "../../types/alerts"; import SingleAlert from "./components/singleAlertComponent"; +import { zeroNotifications } from "../../constants/constants"; export default function AlertDropdown({ children, @@ -68,7 +69,7 @@ export default function AlertDropdown({ )) ) : (
- No new notifications + {zeroNotifications}
)}
diff --git a/src/frontend/src/components/IOview/index.tsx b/src/frontend/src/components/IOview/index.tsx index 5fb5ba665..a8edfa9b6 100644 --- a/src/frontend/src/components/IOview/index.tsx +++ b/src/frontend/src/components/IOview/index.tsx @@ -1,6 +1,6 @@ import { cloneDeep } from "lodash"; import { useEffect, useState } from "react"; -import { CHAT_FORM_DIALOG_SUBTITLE } from "../../constants/constants"; +import { CHAT_FORM_DIALOG_SUBTITLE, outputsModalTitle, textInputModalTitle } from "../../constants/constants"; import BaseModal from "../../modals/baseModal"; import useAlertStore from "../../stores/alertStore"; import useFlowStore from "../../stores/flowStore"; @@ -127,7 +127,7 @@ export default function IOView({ children, open, setOpen }): JSX.Element { >
- Text Inputs + {textInputModalTitle}
{nodes .filter((node) => @@ -188,7 +188,7 @@ export default function IOView({ children, open, setOpen }): JSX.Element { >
- Prompt Outputs + {outputsModalTitle}
{nodes .filter((node) => diff --git a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx index db5a81758..2db2e0c3b 100644 --- a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx +++ b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx @@ -8,7 +8,7 @@ import useFlowStore from "../../../stores/flowStore"; import { validateNodes } from "../../../utils/reactflowUtils"; import RadialProgressComponent from "../../RadialProgress"; import IconComponent from "../../genericIconComponent"; -import { MISSED_ERROR_ALERT } from "../../../alerts_constants"; +import { MISSED_ERROR_ALERT } from "../../../constants/alerts_constants"; export default function BuildTrigger({ open, diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx index db6fa5b2c..7dcc62ee2 100644 --- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx +++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx @@ -17,6 +17,7 @@ import { cn } from "../../../../utils/utils"; import ShadTooltip from "../../../ShadTooltipComponent"; import IconComponent from "../../../genericIconComponent"; import { Button } from "../../../ui/button"; +import { savedHover } from "../../../../constants/constants"; export const MenuBar = ({ removeFunction, @@ -127,7 +128,7 @@ export const MenuBar = ({
diff --git a/src/frontend/src/components/newChatView/index.tsx b/src/frontend/src/components/newChatView/index.tsx index 94231d4b2..86b8ace6a 100644 --- a/src/frontend/src/components/newChatView/index.tsx +++ b/src/frontend/src/components/newChatView/index.tsx @@ -14,7 +14,8 @@ import { import { classNames } from "../../utils/utils"; import ChatInput from "./chatInput"; import ChatMessage from "./chatMessage"; -import { INFO_MISSING_ALERT, NOCHATOUTPUT_NOTICE_ALERT } from "../../alerts_constants"; +import { INFO_MISSING_ALERT, NOCHATOUTPUT_NOTICE_ALERT } from "../../constants/alerts_constants"; +import { chatFirstInitialText, chatSecondInitialText } from "../../constants/constants"; export default function NewChatView({ sendMessage, @@ -178,14 +179,14 @@ export default function NewChatView({
- Start a conversation and click the agent's thoughts{" "} + {chatFirstInitialText}{" "} {" "} - to inspect the chaining process. + {chatSecondInitialText}
diff --git a/src/frontend/src/components/textAreaComponent/index.tsx b/src/frontend/src/components/textAreaComponent/index.tsx index 7b41f3757..14ba7c67e 100644 --- a/src/frontend/src/components/textAreaComponent/index.tsx +++ b/src/frontend/src/components/textAreaComponent/index.tsx @@ -4,6 +4,7 @@ import GenericModal from "../../modals/genericModal"; import { TextAreaComponentType } from "../../types/components"; import IconComponent from "../genericIconComponent"; import { Input } from "../ui/input"; +import { editTextModalTitle } from "../../constants/constants"; export default function TextAreaComponent({ value, @@ -37,7 +38,7 @@ export default function TextAreaComponent({ { onChange(value); diff --git a/src/frontend/src/alerts_constants.tsx b/src/frontend/src/constants/alerts_constants.tsx similarity index 100% rename from src/frontend/src/alerts_constants.tsx rename to src/frontend/src/constants/alerts_constants.tsx diff --git a/src/frontend/src/constants/constants.ts b/src/frontend/src/constants/constants.ts index d6eb6eb56..2c0df8fad 100644 --- a/src/frontend/src/constants/constants.ts +++ b/src/frontend/src/constants/constants.ts @@ -682,3 +682,35 @@ export const priorityFields = new Set(["code", "template"]); export const INPUT_TYPES = new Set(["ChatInput", "TextInput"]); export const OUTPUT_TYPES = new Set(["ChatOutput", "TextOutput"]); + +export const chatFirstInitialText = "Start a conversation and click the agent's thoughts"; + +export const chatSecondInitialText = "to inspect the chaining process."; + +export const zeroNotifications = "No new notifications"; + +export const successBuild = "Built sucessfully ✨"; + +export const alertSaveWApi = "Caution: Uncheck this box only removes API keys from fields specifically designated for API keys." + +export const saveWApiCheckbox = "Save with my API keys"; +export const editTextModalTitle = "Edit Text" +export const editTextPlaceholder = "Type message here." +export const inputHandleHover = "Avaliable input components:"; +export const outputHandleHover = "Avaliable output components:"; +export const textInputModalTitle = "Text Inputs"; +export const outputsModalTitle = "Prompt Outputs" +export const langflowChatTitle = "Langflow Chat" +export const chatInputPlaceholder = "No chat input variables found. Click to run your flow." +export const chatInputPlaceholderSend = "Send a message..." +export const editCodeTitle = "Edit Code" +export const myCollectionDesc = "Manage your personal projects. Download or upload your collection." +export const storeDesc = "Search flows and components from the community."; +export const storeTitle = "Langflow Store" +export const noApi = "You don't have an API key. " +export const insertApi = "Insert your Langflow API key." +export const invalidApi = "Your API key is not valid. " +export const createApi = `Don’t have an API key? Sign up at` +export const statusBuild = "Build to validate status." +export const statusBuilding = "Building..." +export const savedHover = "Last saved at " \ No newline at end of file diff --git a/src/frontend/src/modals/SecretKeyModal/index.tsx b/src/frontend/src/modals/SecretKeyModal/index.tsx index a09e58c36..a03ce8262 100644 --- a/src/frontend/src/modals/SecretKeyModal/index.tsx +++ b/src/frontend/src/modals/SecretKeyModal/index.tsx @@ -8,7 +8,7 @@ import useAlertStore from "../../stores/alertStore"; import { ApiKeyType } from "../../types/components"; import { nodeIconsLucide } from "../../utils/styleUtils"; import BaseModal from "../baseModal"; -import { COPIED_NOTICE_ALERT } from "../../alerts_constants"; +import { COPIED_NOTICE_ALERT } from "../../constants/alerts_constants"; export default function SecretKeyModal({ title, diff --git a/src/frontend/src/modals/StoreApiKeyModal/index.tsx b/src/frontend/src/modals/StoreApiKeyModal/index.tsx index 038e33402..168fc79fc 100644 --- a/src/frontend/src/modals/StoreApiKeyModal/index.tsx +++ b/src/frontend/src/modals/StoreApiKeyModal/index.tsx @@ -9,7 +9,8 @@ import useAlertStore from "../../stores/alertStore"; import { useStoreStore } from "../../stores/storeStore"; import { StoreApiKeyType } from "../../types/components"; import BaseModal from "../baseModal"; -import { API_ERROR_ALERT, API_SUCCESS_ALERT } from "../../alerts_constants"; +import { API_ERROR_ALERT, API_SUCCESS_ALERT } from "../../constants/alerts_constants"; +import { createApi, insertApi, invalidApi, noApi } from "../../constants/constants"; export default function StoreApiKeyModal({ children, @@ -60,10 +61,10 @@ export default function StoreApiKeyModal({ API Key @@ -98,7 +99,7 @@ export default function StoreApiKeyModal({
- Don’t have an API key? Sign up at{" "} + {createApi} {" "} {children} - Edit Code + {editCodeTitle} { @@ -52,12 +52,11 @@ const ExportModal = forwardRef( }} />
- Caution: Uncheck this box only removes API keys from fields - specifically designated for API keys. + {alertSaveWApi} diff --git a/src/frontend/src/modals/formModal/chatInput/index.tsx b/src/frontend/src/modals/formModal/chatInput/index.tsx index 242ce6532..bf39740d4 100644 --- a/src/frontend/src/modals/formModal/chatInput/index.tsx +++ b/src/frontend/src/modals/formModal/chatInput/index.tsx @@ -3,6 +3,7 @@ import IconComponent from "../../../components/genericIconComponent"; import { Textarea } from "../../../components/ui/textarea"; import { chatInputType } from "../../../types/components"; import { classNames } from "../../../utils/utils"; +import { chatInputPlaceholder, chatInputPlaceholderSend } from "../../../constants/constants"; export default function ChatInput({ lockChat, @@ -51,7 +52,7 @@ export default function ChatInput({ ? "Thinking..." : typeof chatValue === "object" && Object.keys(chatValue)?.length === 0 - ? "No chat input variables found. Click to run your flow." + ? chatInputPlaceholder : chatValue } onChange={(event): void => { @@ -68,8 +69,8 @@ export default function ChatInput({ )} placeholder={ noInput - ? "No chat input variables found. Click to run your flow." - : "Send a message..." + ? chatInputPlaceholder + : chatInputPlaceholderSend } />
diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx index f18eff977..1d000ee31 100644 --- a/src/frontend/src/modals/formModal/index.tsx +++ b/src/frontend/src/modals/formModal/index.tsx @@ -20,14 +20,14 @@ import { DialogTrigger, } from "../../components/ui/dialog"; import { Textarea } from "../../components/ui/textarea"; -import { CHAT_FORM_DIALOG_SUBTITLE } from "../../constants/constants"; +import { CHAT_FORM_DIALOG_SUBTITLE, chatFirstInitialText, chatSecondInitialText, langflowChatTitle } from "../../constants/constants"; import { AuthContext } from "../../contexts/authContext"; import { getBuildStatus } from "../../controllers/API"; import useAlertStore from "../../stores/alertStore"; import useFlowStore from "../../stores/flowStore"; import { FlowState } from "../../types/tabs"; import { validateNodes } from "../../utils/reactflowUtils"; -import { CHAT_ERROR_ALERT, INFO_MISSING_ALERT, MSG_ERROR_ALERT } from "../../alerts_constants"; +import { CHAT_ERROR_ALERT, INFO_MISSING_ALERT, MSG_ERROR_ALERT } from "../../constants/alerts_constants"; export default function FormModal({ flow, @@ -585,20 +585,20 @@ export default function FormModal({ 👋{" "} - Langflow Chat + {langflowChatTitle}
- Start a conversation and click the agent's thoughts{" "} + {chatFirstInitialText} {" "} {" "} - to inspect the chaining process. + {chatSecondInitialText}
diff --git a/src/frontend/src/modals/genericModal/index.tsx b/src/frontend/src/modals/genericModal/index.tsx index 54ea08edb..b79431ac9 100644 --- a/src/frontend/src/modals/genericModal/index.tsx +++ b/src/frontend/src/modals/genericModal/index.tsx @@ -10,6 +10,8 @@ import { MAX_WORDS_HIGHLIGHT, PROMPT_DIALOG_SUBTITLE, TEXT_DIALOG_SUBTITLE, + editTextModalTitle, + editTextPlaceholder, regexHighlight, } from "../../constants/constants"; import { TypeModal } from "../../constants/enums"; @@ -19,7 +21,7 @@ import { genericModalPropsType } from "../../types/components"; import { handleKeyDown } from "../../utils/reactflowUtils"; import { classNames, varHighlightHTML } from "../../utils/utils"; import BaseModal from "../baseModal"; -import { BUG_ALERT, PROMPT_ERROR_ALERT, PROMPT_SUCCESS_ALERT, TEMP_NOTICE_ALERT } from "../../alerts_constants"; +import { BUG_ALERT, PROMPT_ERROR_ALERT, PROMPT_SUCCESS_ALERT, TEMP_NOTICE_ALERT } from "../../constants/alerts_constants"; export default function GenericModal({ field_name = "", @@ -211,7 +213,7 @@ export default function GenericModal({ setInputValue(event.target.value); checkVariables(event.target.value); }} - placeholder="Type message here." + placeholder={editTextPlaceholder} onKeyDown={(e) => { handleKeyDown(e, inputValue, ""); }} @@ -233,7 +235,7 @@ export default function GenericModal({ onChange={(event) => { setInputValue(event.target.value); }} - placeholder="Type message here." + placeholder={editTextPlaceholder} onKeyDown={(e) => { handleKeyDown(e, value, ""); }} diff --git a/src/frontend/src/pages/AdminPage/LoginPage/index.tsx b/src/frontend/src/pages/AdminPage/LoginPage/index.tsx index c94474ab8..335cf2a6a 100644 --- a/src/frontend/src/pages/AdminPage/LoginPage/index.tsx +++ b/src/frontend/src/pages/AdminPage/LoginPage/index.tsx @@ -11,7 +11,7 @@ import { inputHandlerEventType, loginInputStateType, } from "../../../types/components"; -import { SIGNIN_ERROR_ALERT } from "../../../alerts_constants"; +import { SIGNIN_ERROR_ALERT } from "../../../constants/alerts_constants"; export default function LoginAdminPage() { const navigate = useNavigate(); diff --git a/src/frontend/src/pages/AdminPage/index.tsx b/src/frontend/src/pages/AdminPage/index.tsx index 037fce720..16cce09da 100644 --- a/src/frontend/src/pages/AdminPage/index.tsx +++ b/src/frontend/src/pages/AdminPage/index.tsx @@ -33,7 +33,7 @@ import useAlertStore from "../../stores/alertStore"; import useFlowsManagerStore from "../../stores/flowsManagerStore"; import { Users } from "../../types/api"; import { UserInputType } from "../../types/components"; -import { USER_ADD_ERROR_ALERT, USER_ADD_SUCCESS_ALERT, USER_DEL_ERROR_ALERT, USER_DEL_SUCCESS_ALERT, USER_EDIT_ERROR_ALERT, USER_EDIT_SUCCESS_ALERT } from "../../alerts_constants"; +import { USER_ADD_ERROR_ALERT, USER_ADD_SUCCESS_ALERT, USER_DEL_ERROR_ALERT, USER_DEL_SUCCESS_ALERT, USER_EDIT_ERROR_ALERT, USER_EDIT_SUCCESS_ALERT } from "../../constants/alerts_constants"; export default function AdminPage() { const [inputValue, setInputValue] = useState(""); diff --git a/src/frontend/src/pages/ApiKeysPage/index.tsx b/src/frontend/src/pages/ApiKeysPage/index.tsx index 3143c52a6..bf9c62e7f 100644 --- a/src/frontend/src/pages/ApiKeysPage/index.tsx +++ b/src/frontend/src/pages/ApiKeysPage/index.tsx @@ -26,7 +26,7 @@ import { } from "../../constants/constants"; import useAlertStore from "../../stores/alertStore"; import { ApiKey } from "../../types/components"; -import { DEL_KEY_ERROR_ALERT, DEL_KEY_SUCCESS_ALERT } from "../../alerts_constants"; +import { DEL_KEY_ERROR_ALERT, DEL_KEY_SUCCESS_ALERT } from "../../constants/alerts_constants"; export default function ApiKeysPage() { const [loadingKeys, setLoadingKeys] = useState(true); diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx index d7358b27a..ba12a25ea 100644 --- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx @@ -31,7 +31,7 @@ import { getRandomName, isWrappedWithClass } from "../../../../utils/utils"; import ConnectionLineComponent from "../ConnectionLineComponent"; import SelectionMenu from "../SelectionMenuComponent"; import ExtraSidebar from "../extraSidebarComponent"; -import { INVALID_SELECTION_ERROR_ALERT, UPLOAD_ALERT_LIST, UPLOAD_ERROR_ALERT, WRONG_FILE_ERROR_ALERT } from "../../../../alerts_constants"; +import { INVALID_SELECTION_ERROR_ALERT, UPLOAD_ALERT_LIST, UPLOAD_ERROR_ALERT, WRONG_FILE_ERROR_ALERT } from "../../../../constants/alerts_constants"; const nodeTypes = { genericNode: GenericNode, diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx index 84446eaad..a756ae8c3 100644 --- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx @@ -25,7 +25,7 @@ import { } from "../../../../utils/utils"; import DisclosureComponent from "../DisclosureComponent"; import SidebarDraggableComponent from "./sideBarDraggableComponent"; -import { UPLOAD_ERROR_ALERT } from "../../../../alerts_constants"; +import { UPLOAD_ERROR_ALERT } from "../../../../constants/alerts_constants"; export default function ExtraSidebar(): JSX.Element { const data = useTypesStore((state) => state.data); diff --git a/src/frontend/src/pages/MainPage/components/components/index.tsx b/src/frontend/src/pages/MainPage/components/components/index.tsx index 43e351e65..d93811d5b 100644 --- a/src/frontend/src/pages/MainPage/components/components/index.tsx +++ b/src/frontend/src/pages/MainPage/components/components/index.tsx @@ -9,7 +9,7 @@ import { Button } from "../../../../components/ui/button"; import useAlertStore from "../../../../stores/alertStore"; import useFlowsManagerStore from "../../../../stores/flowsManagerStore"; import { FlowType } from "../../../../types/flow"; -import { CONSOLE_ERROR_MSG, UPLOAD_ALERT_LIST, WRONG_FILE_ERROR_ALERT } from "../../../../alerts_constants"; +import { CONSOLE_ERROR_MSG, UPLOAD_ALERT_LIST, WRONG_FILE_ERROR_ALERT } from "../../../../constants/alerts_constants"; export default function ComponentsComponent({ is_component = true, diff --git a/src/frontend/src/pages/MainPage/index.tsx b/src/frontend/src/pages/MainPage/index.tsx index fb636a4d5..e8f0f4136 100644 --- a/src/frontend/src/pages/MainPage/index.tsx +++ b/src/frontend/src/pages/MainPage/index.tsx @@ -6,11 +6,11 @@ import IconComponent from "../../components/genericIconComponent"; import PageLayout from "../../components/pageLayout"; import SidebarNav from "../../components/sidebarComponent"; import { Button } from "../../components/ui/button"; -import { USER_PROJECTS_HEADER } from "../../constants/constants"; +import { USER_PROJECTS_HEADER, myCollectionDesc } from "../../constants/constants"; import useAlertStore from "../../stores/alertStore"; import useFlowsManagerStore from "../../stores/flowsManagerStore"; import { downloadFlows } from "../../utils/reactflowUtils"; -import { CONSOLE_ERROR_MSG } from "../../alerts_constants"; +import { CONSOLE_ERROR_MSG } from "../../constants/alerts_constants"; export default function HomePage(): JSX.Element { const addFlow = useFlowsManagerStore((state) => state.addFlow); const uploadFlow = useFlowsManagerStore((state) => state.uploadFlow); @@ -72,7 +72,7 @@ export default function HomePage(): JSX.Element { return (