format: run make format

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

@@ -29,7 +29,7 @@ export default function GenericNode({
   const Icon = nodeIcons[data.type] || nodeIcons[types[data.type]];
   const [validationStatus, setValidationStatus] = useState(null);
   // State for outline color
-  const { sseData,isBuilding } = useSSE();
+  const { sseData, isBuilding } = useSSE();
 
   // useEffect(() => {
   //   if (reactFlowInstance) {

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

@@ -29,13 +29,15 @@ export const CardComponent = ({
     <Card className="group">
       <CardHeader>
         <CardTitle className="flex w-full items-center gap-4">
-            <span
+          <span
-              className={
+            className={
-                "rounded-full w-7 h-7 flex items-center justify-center text-2xl " +
+              "rounded-full w-7 h-7 flex items-center justify-center text-2xl " +
-                gradients[parseInt(flow.id.slice(0, 12), 16) % gradients.length]
+              gradients[parseInt(flow.id.slice(0, 12), 16) % gradients.length]
-              }
+            }
-            ></span>
+          ></span>
-            <span className="flex-1 w-full inline-block truncate-doubleline break-words">{flow.name}</span>
+          <span className="flex-1 w-full inline-block truncate-doubleline break-words">
+            {flow.name}
+          </span>
           {onDelete && (
             <button className="flex self-start" onClick={onDelete}>
               <Trash2 className="w-4 h-4 text-primary opacity-0 group-hover:opacity-100 transition-all" />

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

@@ -20,8 +20,7 @@ export default function BuildTrigger({
   setIsBuilt: any;
   isBuilt: boolean;
 }) {
-
+  const { updateSSEData, isBuilding, setIsBuilding } = useSSE();
-  const { updateSSEData,isBuilding,setIsBuilding } = useSSE();
   const { reactFlowInstance } = useContext(typesContext);
   const { setErrorData } = useContext(alertContext);
 
@@ -45,10 +44,12 @@ export default function BuildTrigger({
       const allNodesValid = await streamNodeData(flow);
       await enforceMinimumLoadingTime(startTime, minimumLoadingTime);
       setIsBuilt(allNodesValid);
-      if(!allNodesValid) {
+      if (!allNodesValid) {
         setErrorData({
           title: "Oops! Looks like you missed something",
-          list: ["Check components and retry. Hover over component status icon 🔴 to inspect."],
+          list: [
+            "Check components and retry. Hover over component status icon 🔴 to inspect.",
+          ],
         });
       }
     } catch (error) {
@@ -124,16 +125,16 @@ export default function BuildTrigger({
 
   return (
     <Transition
-    show={!open}
+      show={!open}
-    appear={true}
+      appear={true}
-    enter="transition ease-out duration-300"
+      enter="transition ease-out duration-300"
-    enterFrom="translate-y-96"
+      enterFrom="translate-y-96"
-    enterTo="translate-y-0"
+      enterTo="translate-y-0"
-    leave="transition ease-in duration-300"
+      leave="transition ease-in duration-300"
-    leaveFrom="translate-y-0"
+      leaveFrom="translate-y-0"
-    leaveTo="translate-y-96"
+      leaveTo="translate-y-96"
     >
-     <div className={`fixed right-4` + (isBuilt ? " bottom-20" : " bottom-4")}>
+      <div className={`fixed right-4` + (isBuilt ? " bottom-20" : " bottom-4")}>
         <div
           className="flex justify-center align-center py-1 px-3 w-12 h-12 rounded-full shadow-md shadow-[#0000002a] hover:shadow-[#00000032]
            bg-[#E2E7EE] dark:border-gray-600 cursor-pointer"
@@ -147,7 +148,7 @@ export default function BuildTrigger({
                 // Render your loading animation here when isBuilding is true
                 <Loading strokeWidth={1.5} style={{ color: "white" }} />
               ) : (
-                <Zap className="sh-6 w-6 fill-orange-400 stroke-1 stroke-orange-400"/>
+                <Zap className="sh-6 w-6 fill-orange-400 stroke-1 stroke-orange-400" />
               )}
             </div>
           </button>

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

@@ -19,7 +19,7 @@ export default function ChatTrigger({ open, setOpen, isBuilt }) {
   }
 
   return (
-<Transition
+    <Transition
       show={!open}
       appear={true}
       enter="transition ease-out duration-300"
@@ -28,9 +28,8 @@ export default function ChatTrigger({ open, setOpen, isBuilt }) {
       leave="transition ease-in duration-300"
       leaveFrom="translate-y-0"
       leaveTo="translate-y-96"
->
+    >
-
+      <div className="absolute bottom-4 right-3">
-<div className="absolute bottom-4 right-3">
         <div
           className="flex justify-center align-center py-1 px-3 w-12 h-12 rounded-full shadow-md shadow-[#0000002a] hover:shadow-[#00000032]
           bg-[#E2E7EE] dark:border-gray-600 cursor-pointer"

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

@@ -16,7 +16,8 @@ export default function Chat({ flow }: ChatType) {
     const handleKeyDown = (event: KeyboardEvent) => {
       if (
         (event.key === "K" || event.key === "k") &&
-        (event.metaKey || event.ctrlKey) && isBuilt
+        (event.metaKey || event.ctrlKey) &&
+        isBuilt
       ) {
         event.preventDefault();
         setOpen((oldState) => !oldState);

src/frontend/src/components/ui/tabs.tsx

@@ -1,10 +1,10 @@
-"use client"
+"use client";
 
-import * as React from "react"
+import * as React from "react";
-import * as TabsPrimitive from "@radix-ui/react-tabs"
+import * as TabsPrimitive from "@radix-ui/react-tabs";
-import { cn } from "../../utils"
+import { cn } from "../../utils";
 
-const Tabs = TabsPrimitive.Root
+const Tabs = TabsPrimitive.Root;
 
 const TabsList = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.List>,
@@ -18,8 +18,8 @@ const TabsList = React.forwardRef<
     )}
     {...props}
   />
-))
+));
-TabsList.displayName = TabsPrimitive.List.displayName
+TabsList.displayName = TabsPrimitive.List.displayName;
 
 const TabsTrigger = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Trigger>,
@@ -33,8 +33,8 @@ const TabsTrigger = React.forwardRef<
     )}
     {...props}
   />
-))
+));
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
 
 const TabsContent = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Content>,
@@ -48,7 +48,7 @@ const TabsContent = React.forwardRef<
     )}
     {...props}
   />
-))
+));
-TabsContent.displayName = TabsPrimitive.Content.displayName
+TabsContent.displayName = TabsPrimitive.Content.displayName;
 
-export { Tabs, TabsList, TabsTrigger, TabsContent }
+export { Tabs, TabsList, TabsTrigger, TabsContent };

src/frontend/src/contexts/SSEContext.tsx

@@ -31,7 +31,9 @@ export function SSEProvider({ children }) {
   }, []);
 
   return (
-    <SSEContext.Provider value={{ sseData, updateSSEData,isBuilding,setIsBuilding }}>
+    <SSEContext.Provider
+      value={{ sseData, updateSSEData, isBuilding, setIsBuilding }}
+    >
       {children}
     </SSEContext.Provider>
   );

src/frontend/src/contexts/typesContext.tsx

@@ -52,16 +52,20 @@ export function TypesProvider({ children }: { children: ReactNode }) {
           // Set the types by reducing over the keys of the result data and updating the accumulator.
           setTypes(
             // Reverse the keys so the tool world does not overlap
-            Object.keys(result.data).reverse().reduce((acc, curr) => {
+            Object.keys(result.data)
-              Object.keys(result.data[curr]).forEach((c: keyof APIKindType) => {
+              .reverse()
-                acc[c] = curr;
+              .reduce((acc, curr) => {
-                // Add the base classes to the accumulator as well.
+                Object.keys(result.data[curr]).forEach(
-                result.data[curr][c].base_classes?.forEach((b) => {
+                  (c: keyof APIKindType) => {
-                  acc[b] = curr;
+                    acc[c] = curr;
-                });
+                    // Add the base classes to the accumulator as well.
-              });
+                    result.data[curr][c].base_classes?.forEach((b) => {
-              return acc;
+                      acc[b] = curr;
-            }, {})
+                    });
+                  }
+                );
+                return acc;
+              }, {})
           );
         }
         // Clear the interval if successful.

src/frontend/src/modals/chatModal/index.tsx

@@ -7,7 +7,7 @@ import { validateNodes } from "../../utils";
 import { typesContext } from "../../contexts/typesContext";
 import ChatMessage from "./chatMessage";
 import { Eraser } from "lucide-react";
-import {X} from "lucide-react"
+import { X } from "lucide-react";
 import { sendAllProps } from "../../types/api";
 import { ChatMessageType } from "../../types/chat";
 import ChatInput from "./chatInput";

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

@@ -22,7 +22,8 @@ export default function FlowSettingsModal() {
   const { closePopUp } = useContext(PopUpContext);
   const { setErrorData, setSuccessData } = useContext(alertContext);
   const ref = useRef();
-  const { flows, tabId, updateFlow, setTabsState, saveFlow } = useContext(TabsContext);
+  const { flows, tabId, updateFlow, setTabsState, saveFlow } =
+    useContext(TabsContext);
   const maxLength = 50;
   const [name, setName] = useState(flows.find((f) => f.id === tabId).name);
   const [description, setDescription] = useState(
@@ -36,8 +37,8 @@ export default function FlowSettingsModal() {
       }, 300);
     }
   }
-  function handleClick(){
+  function handleClick() {
-    let savedFlow = flows.find((f) => f.id === tabId)
+    let savedFlow = flows.find((f) => f.id === tabId);
     savedFlow.name = name;
     savedFlow.description = description;
     saveFlow(savedFlow);
@@ -67,10 +68,7 @@ export default function FlowSettingsModal() {
         />
 
         <DialogFooter>
-          <Button
+          <Button onClick={handleClick} type="submit">
-            onClick={handleClick}
-            type="submit"
-          >
             Save
           </Button>
         </DialogFooter>

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

@@ -44,7 +44,11 @@ export default function CommunityPage() {
           Community Examples
         </span>
         <div className="flex gap-2">
-          <a href="https://github.com/logspace-ai/langflow_examples" target="_blank" rel="noreferrer">
+          <a
+            href="https://github.com/logspace-ai/langflow_examples"
+            target="_blank"
+            rel="noreferrer"
+          >
             <Button variant="primary">
               <GithubIcon className="w-4 mr-2" />
               Add Your Example

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

@@ -46,7 +46,7 @@ export default function Page({ flow }: { flow: FlowType }) {
     tabsState,
     saveFlow,
     setTabsState,
-    tabId
+    tabId,
   } = useContext(TabsContext);
   const { types, reactFlowInstance, setReactFlowInstance, templates } =
     useContext(typesContext);
@@ -156,7 +156,7 @@ export default function Page({ flow }: { flow: FlowType }) {
         };
       });
     },
-    [onEdgesChange, setNodes,setTabsState,tabId]
+    [onEdgesChange, setNodes, setTabsState, tabId]
   );
 
   const onNodesChangeMod = useCallback(
@@ -171,7 +171,7 @@ export default function Page({ flow }: { flow: FlowType }) {
         };
       });
     },
-    [onNodesChange,setTabsState,tabId]
+    [onNodesChange, setTabsState, tabId]
   );
 
   const onConnect = useCallback(
@@ -280,11 +280,11 @@ export default function Page({ flow }: { flow: FlowType }) {
 
   useEffect(() => {
     return () => {
-      if(tabsState && tabsState[flow.id]?.isPending) {
+      if (tabsState && tabsState[flow.id]?.isPending) {
-        saveFlow(flow)
+        saveFlow(flow);
       }
-    }
+    };
-  },[])
+  }, []);
 
   const onDelete = useCallback(
     (mynodes) => {
@@ -370,7 +370,7 @@ export default function Page({ flow }: { flow: FlowType }) {
                   onPaneMouseLeave={() => {
                     setDisableCopyPaste(true);
                   }}
-                  onPaneMouseEnter={()=>{
+                  onPaneMouseEnter={() => {
                     setDisableCopyPaste(false);
                   }}
                   onNodesChange={onNodesChangeMod}

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

@@ -11,13 +11,13 @@ export default function FlowPage() {
     setTabId(id);
   }, [id]);
 
-    // Initialize state variable for the version
+  // Initialize state variable for the version
-    const [version, setVersion] = useState("");
+  const [version, setVersion] = useState("");
-    useEffect(() => {
+  useEffect(() => {
-      getVersion().then((data) => {
+    getVersion().then((data) => {
-        setVersion(data.version);
+      setVersion(data.version);
-      });
+    });
-    }, []);
+  }, []);
 
   return (
     <div className="h-full w-full overflow-hidden">

src/frontend/src/routes.tsx

@@ -11,7 +11,7 @@ const Router = () => {
       <Route path="/flow/:id/">
         <Route path="" element={<FlowPage />} />
       </Route>
-      <Route path="*" element={<HomePage/>}/>
+      <Route path="*" element={<HomePage />} />
     </Routes>
   );
 };