Refactor code and fix imports

src/backend/langflow/graph/vertex/base.py

@@ -2,8 +2,7 @@ import ast
 import inspect
 import types
 from enum import Enum
-from typing import (TYPE_CHECKING, Any, Callable, Coroutine, Dict, List,
+from typing import TYPE_CHECKING, Any, Callable, Coroutine, Dict, List, Optional
-                    Optional)
 
 from langflow.graph.utils import UnbuiltObject, UnbuiltResult
 from langflow.graph.vertex.utils import generate_result

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

@@ -7,16 +7,20 @@ import {
   DropdownMenuTrigger,
 } from "../../../ui/dropdown-menu";
 
-import { useNavigate, useParams } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
+import { Node } from "reactflow";
 import FlowSettingsModal from "../../../../modals/flowSettingsModal";
 import useAlertStore from "../../../../stores/alertStore";
+import useFlowStore from "../../../../stores/flowStore";
 import useFlowsManagerStore from "../../../../stores/flowsManagerStore";
 import IconComponent from "../../../genericIconComponent";
 import { Button } from "../../../ui/button";
-import { Node } from "reactflow";
-import useFlowStore from "../../../../stores/flowStore";
 
-export const MenuBar = ({removeFunction}: {removeFunction: (nodes: Node[]) => void}): JSX.Element => {
+export const MenuBar = ({
+  removeFunction,
+}: {
+  removeFunction: (nodes: Node[]) => void;
+}): JSX.Element => {
   const addFlow = useFlowsManagerStore((state) => state.addFlow);
   const currentFlow = useFlowsManagerStore((state) => state.currentFlow);
   const setErrorData = useAlertStore((state) => state.setErrorData);
@@ -42,7 +46,7 @@ export const MenuBar = ({removeFunction}: {removeFunction: (nodes: Node[]) => vo
     <div className="round-button-div">
       <button
         onClick={() => {
-          removeFunction(n)
+          removeFunction(n);
           navigate(-1);
         }}
       >

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

@@ -5,8 +5,11 @@ import AlertDropdown from "../../alerts/alertDropDown";
 import { USER_PROJECTS_HEADER } from "../../constants/constants";
 import { AuthContext } from "../../contexts/authContext";
 
+import { Node } from "reactflow";
 import useAlertStore from "../../stores/alertStore";
 import { useDarkStore } from "../../stores/darkStore";
+import useFlowStore from "../../stores/flowStore";
+import useFlowsManagerStore from "../../stores/flowsManagerStore";
 import { useStoreStore } from "../../stores/storeStore";
 import { gradients } from "../../utils/styleUtils";
 import IconComponent from "../genericIconComponent";
@@ -21,9 +24,6 @@ import {
 } from "../ui/dropdown-menu";
 import { Separator } from "../ui/separator";
 import MenuBar from "./components/menuBar";
-import useFlowsManagerStore from "../../stores/flowsManagerStore";
-import useFlowStore from "../../stores/flowStore";
-import { Node } from "reactflow";
 
 export default function Header(): JSX.Element {
   const notificationCenter = useAlertStore((state) => state.notificationCenter);
@@ -32,7 +32,7 @@ export default function Header(): JSX.Element {
   const navigate = useNavigate();
   const removeFlow = useFlowsManagerStore((store) => store.removeFlow);
   const hasStore = useStoreStore((state) => state.hasStore);
-  const {id} = useParams();
+  const { id } = useParams();
   const n = useFlowStore((state) => state.nodes);
 
   const dark = useDarkStore((state) => state.dark);
@@ -50,7 +50,7 @@ export default function Header(): JSX.Element {
 
   async function checkForChanges(nodes: Node[]): Promise<void> {
     if (nodes.length === 0) {
-      await removeFlow(id!)
+      await removeFlow(id!);
     }
   }
 
@@ -73,7 +73,9 @@ export default function Header(): JSX.Element {
                 : "secondary"
             }
             size="sm"
-            onClick={() => {checkForChanges(n)}}
+            onClick={() => {
+              checkForChanges(n);
+            }}
           >
             <IconComponent name="Home" className="h-4 w-4" />
             <div className="hidden flex-1 md:block">{USER_PROJECTS_HEADER}</div>
@@ -97,7 +99,9 @@ export default function Header(): JSX.Element {
               className="gap-2"
               variant={location.pathname === "/store" ? "primary" : "secondary"}
               size="sm"
-              onClick={() => {checkForChanges(n)}}
+              onClick={() => {
+                checkForChanges(n);
+              }}
             >
               <IconComponent name="Store" className="h-4 w-4" />
               <div className="flex-1">Store</div>

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

@@ -317,15 +317,15 @@ export default function Page({
   }, []);
 
   function onMouseAction(edge: Edge, color: string): void {
-    const edges = useFlowStore.getState().edges
+    const edges = useFlowStore.getState().edges;
-    const newEdges = _.cloneDeep(edges)
+    const newEdges = _.cloneDeep(edges);
     const style = { stroke: color, transition: "stroke 0.25s" };
     const updatedEdges = newEdges.map((obj) => {
       if (obj.id === edge.id) {
-        return { ...obj, style }
+        return { ...obj, style };
       }
-      return obj
+      return obj;
-    })
+    });
     setEdges(updatedEdges);
   }
 
@@ -371,8 +371,12 @@ export default function Page({
                   panOnDrag={!view}
                   proOptions={{ hideAttribution: true }}
                   onPaneClick={onPaneClick}
-                  onEdgeMouseEnter={(event, edge) => onMouseAction(edge, "#473A5C")}
+                  onEdgeMouseEnter={(event, edge) =>
-                  onEdgeMouseLeave={(event, edge) => onMouseAction(edge, "#555")}
+                    onMouseAction(edge, "#473A5C")
+                  }
+                  onEdgeMouseLeave={(event, edge) =>
+                    onMouseAction(edge, "#555")
+                  }
                 >
                   <Background className="" />
                   {!view && (

src/frontend/src/utils/reactflowUtils.ts

@@ -39,7 +39,6 @@ import {
   createRandomKey,
   getFieldTitle,
   getRandomDescription,
-  getRandomName,
   toTitleCase,
 } from "./utils";
 const uid = new ShortUniqueId({ length: 5 });