Merge remote-tracking branch 'origin/dev' into bugFixes

pyproject.toml

@@ -1,6 +1,6 @@
 [tool.poetry]
 name = "langflow"
-version = "0.5.3"
+version = "0.5.5"
 description = "A Python package with a built-in web application"
 authors = ["Logspace <contact@logspace.ai>"]
 maintainers = [
@@ -90,10 +90,10 @@ langfuse = "^1.0.13"
 pillow = "^10.0.0"
 metal-sdk = "^2.2.0"
 markupsafe = "^2.1.3"
+boto3 = "^1.28.63"
 numexpr = "^2.8.6"
 qianfan = "0.0.5"
 
-
 [tool.poetry.group.dev.dependencies]
 types-redis = "^4.6.0.5"
 black = "^23.1.0"

src/backend/langflow/components/llms/AmazonBedrock.py

@@ -0,0 +1,45 @@
+from typing import Optional
+from langflow import CustomComponent
+from langchain.llms.bedrock import Bedrock
+from langchain.llms.base import BaseLLM
+
+
+class AmazonBedrockComponent(CustomComponent):
+    display_name: str = "Amazon Bedrock"
+    description: str = "LLM model from Amazon Bedrock."
+
+    def build_config(self):
+        return {
+            "model_id": {
+                "display_name": "Model Id",
+                "options": [
+                    "ai21.j2-grande-instruct",
+                    "ai21.j2-jumbo-instruct",
+                    "ai21.j2-mid",
+                    "ai21.j2-mid-v1",
+                    "ai21.j2-ultra",
+                    "ai21.j2-ultra-v1",
+                    "anthropic.claude-instant-v1",
+                    "anthropic.claude-v1",
+                    "anthropic.claude-v2",
+                    "cohere.command-text-v14",
+                ],
+            },
+            "credentials_profile_name": {"display_name": "Credentials Profile Name"},
+            "streaming": {"display_name": "Streaming", "field_type": "bool"},
+            "code": {"show": False},
+        }
+
+    def build(
+        self,
+        model_id: str = "anthropic.claude-instant-v1",
+        credentials_profile_name: Optional[str] = None,
+    ) -> BaseLLM:
+        try:
+            output = Bedrock(
+                credentials_profile_name=credentials_profile_name,
+                model_id=model_id,
+            )  # type: ignore
+        except Exception as e:
+            raise ValueError("Could not connect to AmazonBedrock API.") from e
+        return output

src/backend/langflow/components/retrievers/AmazonKendra.py

@@ -0,0 +1,48 @@
+from typing import Optional
+from langflow import CustomComponent
+from langchain.retrievers import AmazonKendraRetriever
+from langchain.schema import BaseRetriever
+
+
+class AmazonKendraRetrieverComponent(CustomComponent):
+    display_name: str = "Amazon Kendra Retriever"
+    description: str = "Retriever that uses the Amazon Kendra API."
+
+    def build_config(self):
+        return {
+            "index_id": {"display_name": "Index ID"},
+            "region_name": {"display_name": "Region Name"},
+            "credentials_profile_name": {"display_name": "Credentials Profile Name"},
+            "attribute_filter": {
+                "display_name": "Attribute Filter",
+                "field_type": "code",
+            },
+            "top_k": {"display_name": "Top K", "field_type": "int"},
+            "user_context": {
+                "display_name": "User Context",
+                "field_type": "code",
+            },
+            "code": {"show": False},
+        }
+
+    def build(
+        self,
+        index_id: str,
+        top_k: int = 3,
+        region_name: Optional[str] = None,
+        credentials_profile_name: Optional[str] = None,
+        attribute_filter: Optional[dict] = None,
+        user_context: Optional[dict] = None,
+    ) -> BaseRetriever:
+        try:
+            output = AmazonKendraRetriever(
+                index_id=index_id,
+                top_k=top_k,
+                region_name=region_name,
+                credentials_profile_name=credentials_profile_name,
+                attribute_filter=attribute_filter,
+                user_context=user_context,
+            )  # type: ignore
+        except Exception as e:
+            raise ValueError("Could not connect to AmazonKendra API.") from e
+        return output

src/backend/langflow/components/vectorstores/Chroma.py

@@ -14,7 +14,7 @@ class ChromaComponent(CustomComponent):
     A custom component for implementing a Vector Store using Chroma.
     """
 
-    display_name: str = "Chroma (Custom Component)"
+    display_name: str = "Chroma"
     description: str = "Implementation of Vector Store using Chroma"
     documentation = "https://python.langchain.com/docs/integrations/vectorstores/chroma"
     beta = True

src/backend/langflow/config.yaml

@@ -265,8 +265,8 @@ retrievers:
   # ZepRetriever:
   #   documentation: "https://python.langchain.com/docs/modules/data_connection/retrievers/integrations/zep_memorystore"
 vectorstores:
-  Chroma:
+  # Chroma:
-    documentation: "https://python.langchain.com/docs/modules/data_connection/vectorstores/integrations/chroma"
+  #   documentation: "https://python.langchain.com/docs/modules/data_connection/vectorstores/integrations/chroma"
   Qdrant:
     documentation: "https://python.langchain.com/docs/modules/data_connection/vectorstores/integrations/qdrant"
   Weaviate:

src/backend/langflow/interface/initialize/loading.py

@@ -300,6 +300,8 @@ def instantiate_embedding(node_type, class_object, params: Dict):
 
 def instantiate_vectorstore(class_object: Type[VectorStore], params: Dict):
     search_kwargs = params.pop("search_kwargs", {})
+    if search_kwargs == {"yourkey": "value"}:
+        search_kwargs = {}
     # clean up docs or texts to have only documents
     if "texts" in params:
         params["documents"] = params.pop("texts")

src/frontend/src/App.tsx

@@ -16,8 +16,8 @@ import {
   FETCH_ERROR_MESSAGE,
 } from "./constants/constants";
 import { alertContext } from "./contexts/alertContext";
+import { FlowsContext } from "./contexts/flowsContext";
 import { locationContext } from "./contexts/locationContext";
-import { TabsContext } from "./contexts/tabsContext";
 import { typesContext } from "./contexts/typesContext";
 import Router from "./routes";
 
@@ -30,7 +30,7 @@ export default function App() {
     setShowSideBar(true);
     setIsStackedOpen(true);
   }, [location.pathname, setCurrent, setIsStackedOpen, setShowSideBar]);
-  const { hardReset } = useContext(TabsContext);
+  const { hardReset } = useContext(FlowsContext);
 
   const {
     errorData,

src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx

@@ -23,10 +23,9 @@ import TextAreaComponent from "../../../../components/textAreaComponent";
 import ToggleShadComponent from "../../../../components/toggleShadComponent";
 import { Button } from "../../../../components/ui/button";
 import { TOOLTIP_EMPTY } from "../../../../constants/constants";
-import { TabsContext } from "../../../../contexts/tabsContext";
+import { FlowsContext } from "../../../../contexts/flowsContext";
 import { typesContext } from "../../../../contexts/typesContext";
 import { ParameterComponentType } from "../../../../types/components";
-import { TabsState } from "../../../../types/tabs";
 import {
   convertObjToArray,
   convertValuesToNumbers,
@@ -63,7 +62,7 @@ export default function ParameterComponent({
   const infoHtml = useRef<HTMLDivElement & ReactNode>(null);
   const updateNodeInternals = useUpdateNodeInternals();
   const [position, setPosition] = useState(0);
-  const { setTabsState, tabId, flows } = useContext(TabsContext);
+  const { setTabsState, tabId, flows } = useContext(FlowsContext);
 
   const flow = flows.find((flow) => flow.id === tabId)?.data?.nodes ?? null;
 

src/frontend/src/CustomNodes/GenericNode/index.tsx

@@ -7,7 +7,7 @@ import IconComponent from "../../components/genericIconComponent";
 import InputComponent from "../../components/inputComponent";
 import { Textarea } from "../../components/ui/textarea";
 import { useSSE } from "../../contexts/SSEContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { typesContext } from "../../contexts/typesContext";
 import NodeToolbarComponent from "../../pages/FlowPage/components/nodeToolbarComponent";
 import { validationStatusType } from "../../types/components";
@@ -33,7 +33,7 @@ export default function GenericNode({
   yPos: number;
 }): JSX.Element {
   const [data, setData] = useState(olddata);
-  const { updateFlow, flows, tabId } = useContext(TabsContext);
+  const { updateFlow, flows, tabId } = useContext(FlowsContext);
   const updateNodeInternals = useUpdateNodeInternals();
   const { types, deleteNode, reactFlowInstance, setFilterEdge, getFilterEdge } =
     useContext(typesContext);

src/frontend/src/components/cardComponent/index.tsx

@@ -1,5 +1,5 @@
 import { useContext } from "react";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { cardComponentPropsType } from "../../types/components";
 import { gradients } from "../../utils/styleUtils";
 import IconComponent from "../genericIconComponent";
@@ -17,7 +17,7 @@ export const CardComponent = ({
   onDelete,
   button,
 }: cardComponentPropsType): JSX.Element => {
-  const { removeFlow } = useContext(TabsContext);
+  const { removeFlow } = useContext(FlowsContext);
 
   return (
     <Card className="group">

src/frontend/src/components/chatComponent/buildTrigger/index.tsx

@@ -7,7 +7,7 @@ import { typesContext } from "../../../contexts/typesContext";
 import { postBuildInit } from "../../../controllers/API";
 import { FlowType } from "../../../types/flow";
 
-import { TabsContext } from "../../../contexts/tabsContext";
+import { FlowsContext } from "../../../contexts/flowsContext";
 import { parsedDataType } from "../../../types/components";
 import { TabsState } from "../../../types/tabs";
 import { validateNodes } from "../../../utils/reactflowUtils";
@@ -26,7 +26,7 @@ export default function BuildTrigger({
 }): JSX.Element {
   const { updateSSEData, isBuilding, setIsBuilding, sseData } = useSSE();
   const { reactFlowInstance } = useContext(typesContext);
-  const { setTabsState } = useContext(TabsContext);
+  const { setTabsState } = useContext(FlowsContext);
   const { setErrorData, setSuccessData } = useContext(alertContext);
   const [isIconTouched, setIsIconTouched] = useState(false);
   const eventClick = isBuilding ? "pointer-events-none" : "";

src/frontend/src/components/chatComponent/index.tsx

@@ -5,7 +5,7 @@ import BuildTrigger from "./buildTrigger";
 import ChatTrigger from "./chatTrigger";
 
 import * as _ from "lodash";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { getBuildStatus } from "../../controllers/API";
 import FormModal from "../../modals/formModal";
 import { NodeType } from "../../types/flow";
@@ -13,7 +13,7 @@ import { NodeType } from "../../types/flow";
 export default function Chat({ flow }: ChatType): JSX.Element {
   const [open, setOpen] = useState(false);
   const [canOpen, setCanOpen] = useState(false);
-  const { tabsState, isBuilt, setIsBuilt } = useContext(TabsContext);
+  const { tabsState, isBuilt, setIsBuilt } = useContext(FlowsContext);
 
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {

src/frontend/src/components/headerComponent/components/menuBar/index.tsx

@@ -1,5 +1,5 @@
 import { useContext, useState } from "react";
-import { TabsContext } from "../../../../contexts/tabsContext";
+import { FlowsContext } from "../../../../contexts/flowsContext";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -17,7 +17,7 @@ import IconComponent from "../../../genericIconComponent";
 import { Button } from "../../../ui/button";
 
 export const MenuBar = ({ flows, tabId }: menuBarPropsType): JSX.Element => {
-  const { addFlow } = useContext(TabsContext);
+  const { addFlow } = useContext(FlowsContext);
   const { setErrorData } = useContext(alertContext);
   const { undo, redo } = useContext(undoRedoContext);
   const [openSettings, setOpenSettings] = useState(false);

src/frontend/src/components/headerComponent/index.tsx

@@ -6,7 +6,7 @@ import { USER_PROJECTS_HEADER } from "../../constants/constants";
 import { alertContext } from "../../contexts/alertContext";
 import { AuthContext } from "../../contexts/authContext";
 import { darkContext } from "../../contexts/darkContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { gradients } from "../../utils/styleUtils";
 import IconComponent from "../genericIconComponent";
 import { Button } from "../ui/button";
@@ -22,7 +22,7 @@ import { Separator } from "../ui/separator";
 import MenuBar from "./components/menuBar";
 
 export default function Header(): JSX.Element {
-  const { flows, tabId } = useContext(TabsContext);
+  const { flows, tabId } = useContext(FlowsContext);
   const { dark, setDark } = useContext(darkContext);
   const { notificationCenter } = useContext(alertContext);
   const location = useLocation();

src/frontend/src/components/inputFileComponent/index.tsx

@@ -1,6 +1,6 @@
 import { useContext, useEffect, useState } from "react";
 import { alertContext } from "../../contexts/alertContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { uploadFile } from "../../controllers/API";
 import { FileComponentType } from "../../types/components";
 import IconComponent from "../genericIconComponent";
@@ -17,7 +17,7 @@ export default function InputFileComponent({
   const [myValue, setMyValue] = useState(value);
   const [loading, setLoading] = useState(false);
   const { setErrorData } = useContext(alertContext);
-  const { tabId } = useContext(TabsContext);
+  const { tabId } = useContext(FlowsContext);
 
   // Clear component state
   useEffect(() => {

src/frontend/src/contexts/flowsContext.tsx

@@ -28,7 +28,7 @@ import {
   sourceHandleType,
   targetHandleType,
 } from "../types/flow";
-import { TabsContextType, TabsState } from "../types/tabs";
+import { FlowsContextType, TabsState } from "../types/tabs";
 import {
   addVersionToDuplicates,
   checkOldEdgesHandles,
@@ -45,7 +45,7 @@ import { typesContext } from "./typesContext";
 
 const uid = new ShortUniqueId({ length: 5 });
 
-const TabsContextInitialValue: TabsContextType = {
+const FlowsContextInitialValue: FlowsContextType = {
   tabId: "",
   setTabId: (index: string) => {},
   isLoading: true,
@@ -75,8 +75,8 @@ const TabsContextInitialValue: TabsContextType = {
   ) => {},
 };
 
-export const TabsContext = createContext<TabsContextType>(
+export const FlowsContext = createContext<FlowsContextType>(
-  TabsContextInitialValue
+  FlowsContextInitialValue
 );
 
 export function TabsProvider({ children }: { children: ReactNode }) {
@@ -638,7 +638,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
   const [isBuilt, setIsBuilt] = useState(false);
 
   return (
-    <TabsContext.Provider
+    <FlowsContext.Provider
       value={{
         saveFlow,
         isBuilt,
@@ -667,6 +667,6 @@ export function TabsProvider({ children }: { children: ReactNode }) {
       }}
     >
       {children}
-    </TabsContext.Provider>
+    </FlowsContext.Provider>
   );
 }

src/frontend/src/contexts/index.tsx

@@ -7,8 +7,8 @@ import { SSEProvider } from "./SSEContext";
 import { AlertProvider } from "./alertContext";
 import { AuthProvider } from "./authContext";
 import { DarkProvider } from "./darkContext";
+import { TabsProvider } from "./flowsContext";
 import { LocationProvider } from "./locationContext";
-import { TabsProvider } from "./tabsContext";
 import { TypesProvider } from "./typesContext";
 import { UndoRedoProvider } from "./undoRedoContext";
 

src/frontend/src/contexts/undoRedoContext.tsx

@@ -13,7 +13,7 @@ import {
   undoRedoContextType,
 } from "../types/typesContext";
 import { isWrappedWithClass } from "../utils/utils";
-import { TabsContext } from "./tabsContext";
+import { FlowsContext } from "./flowsContext";
 
 const initialValue = {
   undo: () => {},
@@ -29,7 +29,7 @@ const defaultOptions: UseUndoRedoOptions = {
 export const undoRedoContext = createContext<undoRedoContextType>(initialValue);
 
 export function UndoRedoProvider({ children }) {
-  const { tabId, flows } = useContext(TabsContext);
+  const { tabId, flows } = useContext(FlowsContext);
 
   const [past, setPast] = useState<HistoryItem[][]>(flows.map(() => []));
   const [future, setFuture] = useState<HistoryItem[][]>(flows.map(() => []));

src/frontend/src/modals/ApiModal/index.tsx

@@ -15,7 +15,7 @@ import CodeTabsComponent from "../../components/codeTabsComponent";
 import IconComponent from "../../components/genericIconComponent";
 import { EXPORT_CODE_DIALOG } from "../../constants/constants";
 import { AuthContext } from "../../contexts/authContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { TemplateVariableType } from "../../types/api";
 import { tweakType, uniqueTweakType } from "../../types/components";
 import { FlowType, NodeType } from "../../types/flow/index";
@@ -45,7 +45,7 @@ const ApiModal = forwardRef(
     const [activeTab, setActiveTab] = useState("0");
     const tweak = useRef<tweakType>([]);
     const tweaksList = useRef<string[]>([]);
-    const { setTweak, getTweak, tabsState } = useContext(TabsContext);
+    const { setTweak, getTweak, tabsState } = useContext(FlowsContext);
     const pythonApiCode = getPythonApiCode(
       flow,
       autoLogin,

src/frontend/src/modals/EditNodeModal/index.tsx

@@ -33,7 +33,7 @@ import {
   TableRow,
 } from "../../components/ui/table";
 import { limitScrollFieldsModal } from "../../constants/constants";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { typesContext } from "../../contexts/typesContext";
 import { NodeDataType } from "../../types/flow";
 import { TabsState } from "../../types/tabs";
@@ -69,7 +69,7 @@ const EditNodeModal = forwardRef(
 
     const myData = useRef(data);
 
-    const { setTabsState, tabId } = useContext(TabsContext);
+    const { setTabsState, tabId } = useContext(FlowsContext);
     const { reactFlowInstance } = useContext(typesContext);
     let disabled =
       reactFlowInstance

src/frontend/src/modals/exportModal/index.tsx

@@ -5,13 +5,13 @@ import { Button } from "../../components/ui/button";
 import { Checkbox } from "../../components/ui/checkbox";
 import { EXPORT_DIALOG_SUBTITLE } from "../../constants/constants";
 import { alertContext } from "../../contexts/alertContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { removeApiKeys } from "../../utils/reactflowUtils";
 import BaseModal from "../baseModal";
 
 const ExportModal = forwardRef(
   (props: { children: ReactNode }, ref): JSX.Element => {
-    const { flows, tabId, downloadFlow } = useContext(TabsContext);
+    const { flows, tabId, downloadFlow } = useContext(FlowsContext);
     const { setNoticeData } = useContext(alertContext);
     const [checked, setChecked] = useState(true);
     const flow = flows.find((f) => f.id === tabId);

src/frontend/src/modals/flowSettingsModal/index.tsx

@@ -3,7 +3,7 @@ import EditFlowSettings from "../../components/EditFlowSettingsComponent";
 import IconComponent from "../../components/genericIconComponent";
 import { Button } from "../../components/ui/button";
 import { SETTINGS_DIALOG_SUBTITLE } from "../../constants/constants";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { FlowSettingsPropsType } from "../../types/components";
 import BaseModal from "../baseModal";
 
@@ -11,7 +11,7 @@ export default function FlowSettingsModal({
   open,
   setOpen,
 }: FlowSettingsPropsType): JSX.Element {
-  const { flows, tabId, updateFlow, saveFlow } = useContext(TabsContext);
+  const { flows, tabId, updateFlow, saveFlow } = useContext(FlowsContext);
   const flow = flows.find((f) => f.id === tabId);
   useEffect(() => {
     setName(flow!.name);

src/frontend/src/modals/formModal/index.tsx

@@ -24,7 +24,7 @@ import {
 import { Textarea } from "../../components/ui/textarea";
 import { CHAT_FORM_DIALOG_SUBTITLE } from "../../constants/constants";
 import { AuthContext } from "../../contexts/authContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { getBuildStatus } from "../../controllers/API";
 import { TabsState } from "../../types/tabs";
 import { validateNodes } from "../../utils/reactflowUtils";
@@ -38,7 +38,7 @@ export default function FormModal({
   setOpen: (open: boolean) => void;
   flow: FlowType;
 }): JSX.Element {
-  const { tabsState, setTabsState } = useContext(TabsContext);
+  const { tabsState, setTabsState } = useContext(FlowsContext);
   const [chatValue, setChatValue] = useState(() => {
     try {
       const { formKeysData } = tabsState[flow.id];

src/frontend/src/pages/AdminPage/index.tsx

@@ -22,7 +22,7 @@ import {
 } from "../../constants/constants";
 import { alertContext } from "../../contexts/alertContext";
 import { AuthContext } from "../../contexts/authContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import {
   addUser,
   deleteUser,
@@ -44,7 +44,7 @@ export default function AdminPage() {
   const { userData } = useContext(AuthContext);
   const [totalRowsCount, setTotalRowsCount] = useState(0);
 
-  const { setTabId } = useContext(TabsContext);
+  const { setTabId } = useContext(FlowsContext);
 
   // set null id
   useEffect(() => {

src/frontend/src/pages/CommunityPage/index.tsx

@@ -1,7 +1,7 @@
 import { useContext, useEffect, useState } from "react";
 import { Button } from "../../components/ui/button";
 import { alertContext } from "../../contexts/alertContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 
 import { useNavigate } from "react-router-dom";
 import { CardComponent } from "../../components/cardComponent";
@@ -12,7 +12,7 @@ import { getExamples } from "../../controllers/API";
 import { FlowType } from "../../types/flow";
 export default function CommunityPage(): JSX.Element {
   const { flows, setTabId, downloadFlows, uploadFlows, addFlow } =
-    useContext(TabsContext);
+    useContext(FlowsContext);
 
   // set null id
   useEffect(() => {

src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx

@@ -28,8 +28,8 @@ import ReactFlow, {
 import GenericNode from "../../../../CustomNodes/GenericNode";
 import Chat from "../../../../components/chatComponent";
 import { alertContext } from "../../../../contexts/alertContext";
+import { FlowsContext } from "../../../../contexts/flowsContext";
 import { locationContext } from "../../../../contexts/locationContext";
-import { TabsContext } from "../../../../contexts/tabsContext";
 import { typesContext } from "../../../../contexts/typesContext";
 import { undoRedoContext } from "../../../../contexts/undoRedoContext";
 import { APIClassType } from "../../../../types/api";
@@ -70,7 +70,7 @@ export default function Page({
     saveFlow,
     setTabsState,
     tabId,
-  } = useContext(TabsContext);
+  } = useContext(FlowsContext);
   const {
     types,
     reactFlowInstance,

src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx

@@ -5,7 +5,7 @@ import IconComponent from "../../../../components/genericIconComponent";
 import { Input } from "../../../../components/ui/input";
 import { Separator } from "../../../../components/ui/separator";
 import { alertContext } from "../../../../contexts/alertContext";
-import { TabsContext } from "../../../../contexts/tabsContext";
+import { FlowsContext } from "../../../../contexts/flowsContext";
 import { typesContext } from "../../../../contexts/typesContext";
 import ApiModal from "../../../../modals/ApiModal";
 import ExportModal from "../../../../modals/exportModal";
@@ -22,7 +22,7 @@ export default function ExtraSidebar(): JSX.Element {
   const { data, templates, getFilterEdge, setFilterEdge } =
     useContext(typesContext);
   const { flows, tabId, uploadFlow, tabsState, saveFlow, isBuilt } =
-    useContext(TabsContext);
+    useContext(FlowsContext);
   const { setSuccessData, setErrorData } = useContext(alertContext);
   const [dataFilter, setFilterData] = useState(data);
   const [search, setSearch] = useState("");

src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx

@@ -8,7 +8,7 @@ import {
   SelectItem,
   SelectTrigger,
 } from "../../../../components/ui/select-custom";
-import { TabsContext } from "../../../../contexts/tabsContext";
+import { FlowsContext } from "../../../../contexts/flowsContext";
 import EditNodeModal from "../../../../modals/EditNodeModal";
 import { nodeToolbarPropsType } from "../../../../types/components";
 import {
@@ -54,7 +54,7 @@ export default function NodeToolbarComponent({
   const isMinimal = canMinimize();
   const isGroup = data.node?.flow ? true : false;
 
-  const { paste } = useContext(TabsContext);
+  const { paste } = useContext(FlowsContext);
   const reactFlowInstance = useReactFlow();
   const [showModalAdvanced, setShowModalAdvanced] = useState(false);
   const [selectedValue, setSelectedValue] = useState("");

src/frontend/src/pages/FlowPage/index.tsx

@@ -1,12 +1,12 @@
 import { useContext, useEffect, useState } from "react";
 import { useParams } from "react-router-dom";
 import Header from "../../components/headerComponent";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { getVersion } from "../../controllers/API";
 import Page from "./components/PageComponent";
 
 export default function FlowPage(): JSX.Element {
-  const { flows, tabId, setTabId } = useContext(TabsContext);
+  const { flows, tabId, setTabId } = useContext(FlowsContext);
   const { id } = useParams();
 
   // Set flow tab id

src/frontend/src/pages/MainPage/index.tsx

@@ -8,7 +8,7 @@ import { SkeletonCardComponent } from "../../components/skeletonCardComponent";
 import { Button } from "../../components/ui/button";
 import { USER_PROJECTS_HEADER } from "../../constants/constants";
 import { alertContext } from "../../contexts/alertContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 export default function HomePage(): JSX.Element {
   const {
     flows,
@@ -19,7 +19,7 @@ export default function HomePage(): JSX.Element {
     removeFlow,
     uploadFlow,
     isLoading,
-  } = useContext(TabsContext);
+  } = useContext(FlowsContext);
   const { setErrorData } = useContext(alertContext);
   const dropdownOptions = [
     {

src/frontend/src/pages/ProfileSettingsPage/index.tsx

@@ -9,7 +9,7 @@ import { Button } from "../../components/ui/button";
 import { CONTROL_PATCH_USER_STATE } from "../../constants/constants";
 import { alertContext } from "../../contexts/alertContext";
 import { AuthContext } from "../../contexts/authContext";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { resetPassword, updateUser } from "../../controllers/API";
 import {
   inputHandlerEventType,
@@ -17,7 +17,7 @@ import {
 } from "../../types/components";
 import { gradients } from "../../utils/styleUtils";
 export default function ProfileSettingsPage(): JSX.Element {
-  const { setTabId } = useContext(TabsContext);
+  const { setTabId } = useContext(FlowsContext);
 
   const [inputState, setInputState] = useState<patchUserInputStateType>(
     CONTROL_PATCH_USER_STATE

src/frontend/src/pages/ViewPage/index.tsx

@@ -1,11 +1,11 @@
 import { useContext, useEffect, useState } from "react";
 import { useParams } from "react-router-dom";
-import { TabsContext } from "../../contexts/tabsContext";
+import { FlowsContext } from "../../contexts/flowsContext";
 import { getVersion } from "../../controllers/API";
 import Page from "../FlowPage/components/PageComponent";
 
 export default function ViewPage() {
-  const { flows, tabId, setTabId } = useContext(TabsContext);
+  const { flows, tabId, setTabId } = useContext(FlowsContext);
   const { id } = useParams();
 
   // Set flow tab id

src/frontend/src/types/tabs/index.ts

@@ -1,7 +1,7 @@
 import { tweakType } from "../components";
 import { FlowType } from "../flow";
 
-export type TabsContextType = {
+export type FlowsContextType = {
   saveFlow: (flow: FlowType, silent?: boolean) => Promise<void>;
   tabId: string;
   isLoading: boolean;
@@ -26,8 +26,8 @@ export type TabsContextType = {
   uploadFlow: (newFlow: boolean, file?: File) => Promise<String | undefined>;
   hardReset: () => void;
   getNodeId: (nodeType: string) => string;
-  tabsState: TabsState;
+  tabsState: FlowsState;
-  setTabsState: (state: TabsState) => void;
+  setTabsState: (state: FlowsState) => void;
   paste: (
     selection: { nodes: any; edges: any },
     position: { x: number; y: number; paneX?: number; paneY?: number }
@@ -38,7 +38,7 @@ export type TabsContextType = {
   getTweak: tweakType;
 };
 
-export type TabsState = {
+export type FlowsState = {
   [key: string]: {
     isPending: boolean;
     formKeysData: {