diff --git a/src/frontend/src/App.tsx b/src/frontend/src/App.tsx
index b84c0d792..720ffb6b2 100644
--- a/src/frontend/src/App.tsx
+++ b/src/frontend/src/App.tsx
@@ -29,10 +29,10 @@ export default function App() {
   useTrackLastVisitedPath();
 
   const removeFromTempNotificationList = useAlertStore(
-    (state) => state.removeFromTempNotificationList
+    (state) => state.removeFromTempNotificationList,
   );
   const tempNotificationList = useAlertStore(
-    (state) => state.tempNotificationList
+    (state) => state.tempNotificationList,
   );
   const [fetchError, setFetchError] = useState(false);
   const isLoading = useFlowsManagerStore((state) => state.isLoading);
@@ -48,7 +48,7 @@ export default function App() {
   const refreshVersion = useDarkStore((state) => state.refreshVersion);
   const refreshStars = useDarkStore((state) => state.refreshStars);
   const setGlobalVariables = useGlobalVariablesStore(
-    (state) => state.setGlobalVariables
+    (state) => state.setGlobalVariables,
   );
   const checkHasStore = useStoreStore((state) => state.checkHasStore);
   const navigate = useNavigate();
diff --git a/src/frontend/src/CustomNodes/GenericNode/components/OutputComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/OutputComponent/index.tsx
index 5e7cf1308..1ff965ab5 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/OutputComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/OutputComponent/index.tsx
@@ -26,18 +26,22 @@ export default function OutputComponent({
   const setNode = useFlowStore((state) => state.setNode);
   const updateNodeInternals = useUpdateNodeInternals();
 
-  const displayProxy = (children)=>{
-    if(proxy){
-      return <ShadTooltip content={<span>{proxy.nodeDisplayName}</span>}>
-        {children}
-      </ShadTooltip>
-    }else{
-      return children
+  const displayProxy = (children) => {
+    if (proxy) {
+      return (
+        <ShadTooltip content={<span>{proxy.nodeDisplayName}</span>}>
+          {children}
+        </ShadTooltip>
+      );
+    } else {
+      return children;
     }
-  }
+  };
 
   if (types.length < 2) {
-    return displayProxy(<span className={cn(frozen ? " text-ice" : "")}>{name}</span>);
+    return displayProxy(
+      <span className={cn(frozen ? " text-ice" : "")}>{name}</span>,
+    );
   }
 
   return (
@@ -50,7 +54,7 @@ export default function OutputComponent({
             size="xs"
             className={cn(
               frozen ? "text-ice" : "",
-              "items-center gap-1 pl-2 pr-1.5 align-middle text-xs font-normal"
+              "items-center gap-1 pl-2 pr-1.5 align-middle text-xs font-normal",
             )}
           >
             <span className="pb-px">{selected}</span>
diff --git a/src/frontend/src/CustomNodes/GenericNode/components/tooltipRenderComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/tooltipRenderComponent/index.tsx
index c76bc7293..ed2760161 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/tooltipRenderComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/tooltipRenderComponent/index.tsx
@@ -24,7 +24,7 @@ const TooltipRenderComponent = ({ item, index, left }) => {
       <span
         key={index}
         className={classNames(
-          index > 0 ? "mt-2 flex items-center" : "mt-3 flex items-center"
+          index > 0 ? "mt-2 flex items-center" : "mt-3 flex items-center",
         )}
       >
         <div
diff --git a/src/frontend/src/CustomNodes/helpers/get-class-from-build-status.ts b/src/frontend/src/CustomNodes/helpers/get-class-from-build-status.ts
index cf251c40c..710e91d15 100644
--- a/src/frontend/src/CustomNodes/helpers/get-class-from-build-status.ts
+++ b/src/frontend/src/CustomNodes/helpers/get-class-from-build-status.ts
@@ -4,7 +4,7 @@ import { VertexBuildTypeAPI } from "../../types/api";
 export const getSpecificClassFromBuildStatus = (
   buildStatus: BuildStatus | undefined,
   validationStatus: VertexBuildTypeAPI | null,
-  isDark: boolean
+  isDark: boolean,
 ) => {
   let isInvalid = validationStatus && !validationStatus.valid;
 
diff --git a/src/frontend/src/CustomNodes/hooks/use-check-code-validity.tsx b/src/frontend/src/CustomNodes/hooks/use-check-code-validity.tsx
index 3a49ef62f..ec4d586f6 100644
--- a/src/frontend/src/CustomNodes/hooks/use-check-code-validity.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-check-code-validity.tsx
@@ -6,7 +6,7 @@ const useCheckCodeValidity = (
   data: NodeDataType,
   templates: { [key: string]: any },
   setIsOutdated: (value: boolean) => void,
-  types
+  types,
 ) => {
   useEffect(() => {
     // This one should run only once
diff --git a/src/frontend/src/CustomNodes/hooks/use-fetch-data-on-mount.tsx b/src/frontend/src/CustomNodes/hooks/use-fetch-data-on-mount.tsx
index 3b5c8ce74..5802863b0 100644
--- a/src/frontend/src/CustomNodes/hooks/use-fetch-data-on-mount.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-fetch-data-on-mount.tsx
@@ -12,7 +12,7 @@ const useFetchDataOnMount = (
   name,
   handleUpdateValues,
   setNode,
-  setIsLoading
+  setIsLoading,
 ) => {
   const setErrorData = useAlertStore((state) => state.setErrorData);
 
diff --git a/src/frontend/src/CustomNodes/hooks/use-handle-new-value.tsx b/src/frontend/src/CustomNodes/hooks/use-handle-new-value.tsx
index 22625d96d..b9690e270 100644
--- a/src/frontend/src/CustomNodes/hooks/use-handle-new-value.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-handle-new-value.tsx
@@ -13,7 +13,7 @@ const useHandleOnNewValue = (
   handleUpdateValues,
   debouncedHandleUpdateValues,
   setNode,
-  setIsLoading
+  setIsLoading,
 ) => {
   const setErrorData = useAlertStore((state) => state.setErrorData);
 
diff --git a/src/frontend/src/CustomNodes/hooks/use-handle-node-class.tsx b/src/frontend/src/CustomNodes/hooks/use-handle-node-class.tsx
index c2afa1ab1..6fb78ce10 100644
--- a/src/frontend/src/CustomNodes/hooks/use-handle-node-class.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-handle-node-class.tsx
@@ -5,7 +5,7 @@ const useHandleNodeClass = (
   name,
   takeSnapshot,
   setNode,
-  updateNodeInternals
+  updateNodeInternals,
 ) => {
   const handleNodeClass = (newNodeClass, code) => {
     if (!data.node) return;
diff --git a/src/frontend/src/CustomNodes/hooks/use-icon-render.tsx b/src/frontend/src/CustomNodes/hooks/use-icon-render.tsx
index cc9e29c0e..181b4f515 100644
--- a/src/frontend/src/CustomNodes/hooks/use-icon-render.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-icon-render.tsx
@@ -12,8 +12,8 @@ const useIconNodeRender = (
   checkNodeIconFragment: (
     iconColor: string,
     iconName: string,
-    iconClassName: string
-  ) => JSX.Element
+    iconClassName: string,
+  ) => JSX.Element,
 ) => {
   const iconNodeRender = useCallback(() => {
     const iconElement = data?.node?.icon;
diff --git a/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx b/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx
index 19c6112d5..bea5d3f1f 100644
--- a/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-icons-status.tsx
@@ -6,7 +6,7 @@ import { VertexBuildTypeAPI } from "../../types/api";
 
 const useIconStatus = (
   buildStatus: BuildStatus | undefined,
-  validationStatus: VertexBuildTypeAPI | null
+  validationStatus: VertexBuildTypeAPI | null,
 ) => {
   const conditionSuccess = validationStatus && validationStatus.valid;
   const conditionError =
diff --git a/src/frontend/src/CustomNodes/hooks/use-update-node-code.tsx b/src/frontend/src/CustomNodes/hooks/use-update-node-code.tsx
index d919a4fa9..f1593597f 100644
--- a/src/frontend/src/CustomNodes/hooks/use-update-node-code.tsx
+++ b/src/frontend/src/CustomNodes/hooks/use-update-node-code.tsx
@@ -7,7 +7,7 @@ const useUpdateNodeCode = (
   dataNode: APIClassType, // Define YourNodeType according to your data structure
   setNode: (id: string, callback: (oldNode) => any) => void,
   setIsOutdated: (value: boolean) => void,
-  updateNodeInternals: (id: string) => void
+  updateNodeInternals: (id: string) => void,
 ) => {
   const updateNodeCode = useCallback(
     (newNodeClass: APIClassType, code: string, name: string) => {
@@ -30,7 +30,7 @@ const useUpdateNodeCode = (
 
       updateNodeInternals(dataId);
     },
-    [dataId, dataNode, setNode, setIsOutdated, updateNodeInternals]
+    [dataId, dataNode, setNode, setIsOutdated, updateNodeInternals],
   );
 
   return updateNodeCode;
diff --git a/src/frontend/src/CustomNodes/utils/get-field-title.tsx b/src/frontend/src/CustomNodes/utils/get-field-title.tsx
index a00829a90..e448c4f01 100644
--- a/src/frontend/src/CustomNodes/utils/get-field-title.tsx
+++ b/src/frontend/src/CustomNodes/utils/get-field-title.tsx
@@ -2,7 +2,7 @@ import { APITemplateType } from "../../types/api";
 
 export default function getFieldTitle(
   template: APITemplateType,
-  templateField: string
+  templateField: string,
 ): string {
   return template[templateField].display_name
     ? template[templateField].display_name!
diff --git a/src/frontend/src/alerts/alertDropDown/index.tsx b/src/frontend/src/alerts/alertDropDown/index.tsx
index 597431884..48c51088d 100644
--- a/src/frontend/src/alerts/alertDropDown/index.tsx
+++ b/src/frontend/src/alerts/alertDropDown/index.tsx
@@ -16,13 +16,13 @@ export default function AlertDropdown({
 }: AlertDropdownType): JSX.Element {
   const notificationList = useAlertStore((state) => state.notificationList);
   const clearNotificationList = useAlertStore(
-    (state) => state.clearNotificationList
+    (state) => state.clearNotificationList,
   );
   const removeFromNotificationList = useAlertStore(
-    (state) => state.removeFromNotificationList
+    (state) => state.removeFromNotificationList,
   );
   const setNotificationCenter = useAlertStore(
-    (state) => state.setNotificationCenter
+    (state) => state.setNotificationCenter,
   );
 
   const [open, setOpen] = useState(false);
diff --git a/src/frontend/src/components/ImageViewer/index.tsx b/src/frontend/src/components/ImageViewer/index.tsx
index e82836441..9e7f091d2 100644
--- a/src/frontend/src/components/ImageViewer/index.tsx
+++ b/src/frontend/src/components/ImageViewer/index.tsx
@@ -31,14 +31,14 @@ export default function ImageViewer({ image }) {
         const fullPageButton = document.getElementById("full-page-button");
 
         zoomInButton!.addEventListener("click", () =>
-          viewer.viewport.zoomBy(1.2)
+          viewer.viewport.zoomBy(1.2),
         );
         zoomOutButton!.addEventListener("click", () =>
-          viewer.viewport.zoomBy(0.8)
+          viewer.viewport.zoomBy(0.8),
         );
         homeButton!.addEventListener("click", () => viewer.viewport.goHome());
         fullPageButton!.addEventListener("click", () =>
-          viewer.setFullScreen(true)
+          viewer.setFullScreen(true),
         );
 
         // Optionally, you can set additional viewer options here
@@ -47,16 +47,16 @@ export default function ImageViewer({ image }) {
         return () => {
           viewer.destroy();
           zoomInButton!.removeEventListener("click", () =>
-            viewer.viewport.zoomBy(1.2)
+            viewer.viewport.zoomBy(1.2),
           );
           zoomOutButton!.removeEventListener("click", () =>
-            viewer.viewport.zoomBy(0.8)
+            viewer.viewport.zoomBy(0.8),
           );
           homeButton!.removeEventListener("click", () =>
-            viewer.viewport.goHome()
+            viewer.viewport.goHome(),
           );
           fullPageButton!.removeEventListener("click", () =>
-            viewer.setFullScreen(true)
+            viewer.setFullScreen(true),
           );
         };
       }
diff --git a/src/frontend/src/components/accordionComponent/composite/folderAccordionComponent/index.tsx b/src/frontend/src/components/accordionComponent/composite/folderAccordionComponent/index.tsx
index 212a03fa2..d4fb95b5c 100644
--- a/src/frontend/src/components/accordionComponent/composite/folderAccordionComponent/index.tsx
+++ b/src/frontend/src/components/accordionComponent/composite/folderAccordionComponent/index.tsx
@@ -15,7 +15,7 @@ export default function FolderAccordionComponent({
   options,
 }: AccordionComponentType): JSX.Element {
   const [value, setValue] = useState(
-    open.length === 0 ? "" : getOpenAccordion()
+    open.length === 0 ? "" : getOpenAccordion(),
   );
 
   function getOpenAccordion(): string {
diff --git a/src/frontend/src/components/accordionComponent/index.tsx b/src/frontend/src/components/accordionComponent/index.tsx
index 43a0aef79..c9c21b8b2 100644
--- a/src/frontend/src/components/accordionComponent/index.tsx
+++ b/src/frontend/src/components/accordionComponent/index.tsx
@@ -17,7 +17,7 @@ export default function AccordionComponent({
   sideBar,
 }: AccordionComponentType): JSX.Element {
   const [value, setValue] = useState(
-    open.length === 0 ? "" : getOpenAccordion()
+    open.length === 0 ? "" : getOpenAccordion(),
   );
 
   function getOpenAccordion(): string {
@@ -52,7 +52,7 @@ export default function AccordionComponent({
             disabled={disabled}
             className={cn(
               sideBar ? "w-full bg-muted px-[0.75rem] py-[0.5rem]" : "ml-3",
-              disabled ? "cursor-not-allowed" : "cursor-pointer"
+              disabled ? "cursor-not-allowed" : "cursor-pointer",
             )}
           >
             {trigger}
diff --git a/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx b/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx
index d56a0e608..415cd92d7 100644
--- a/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx
+++ b/src/frontend/src/components/addNewVariableButtonComponent/addNewVariableButton.tsx
@@ -29,19 +29,19 @@ export default function AddNewVariableButton({
   const setErrorData = useAlertStore((state) => state.setErrorData);
   const componentFields = useTypesStore((state) => state.ComponentFields);
   const unavaliableFields = new Set(
-    Object.keys(useGlobalVariablesStore((state) => state.unavaliableFields))
+    Object.keys(useGlobalVariablesStore((state) => state.unavaliableFields)),
   );
 
   const availableFields = () => {
     const fields = Array.from(componentFields).filter(
-      (field) => !unavaliableFields.has(field)
+      (field) => !unavaliableFields.has(field),
     );
 
     return sortByName(fields);
   };
 
   const addGlobalVariable = useGlobalVariablesStore(
-    (state) => state.addGlobalVariable
+    (state) => state.addGlobalVariable,
   );
 
   function handleSaveVariable() {
diff --git a/src/frontend/src/components/cardComponent/components/dragCardComponent/index.tsx b/src/frontend/src/components/cardComponent/components/dragCardComponent/index.tsx
index 54dbf4846..28674f3bc 100644
--- a/src/frontend/src/components/cardComponent/components/dragCardComponent/index.tsx
+++ b/src/frontend/src/components/cardComponent/components/dragCardComponent/index.tsx
@@ -10,7 +10,7 @@ export default function DragCardComponent({ data }: { data: storeComponent }) {
         draggable
         //TODO check color schema
         className={cn(
-          "group relative flex flex-col justify-between overflow-hidden transition-all hover:bg-muted/50 hover:shadow-md hover:dark:bg-[#ffffff10]"
+          "group relative flex flex-col justify-between overflow-hidden transition-all hover:bg-muted/50 hover:shadow-md hover:dark:bg-[#ffffff10]",
         )}
       >
         <div>
@@ -22,7 +22,7 @@ export default function DragCardComponent({ data }: { data: storeComponent }) {
                     "visible flex-shrink-0",
                     data.is_component
                       ? "mx-0.5 h-6 w-6 text-component-icon"
-                      : "h-7 w-7 flex-shrink-0 text-flow-icon"
+                      : "h-7 w-7 flex-shrink-0 text-flow-icon",
                   )}
                   name={data.is_component ? "ToyBrick" : "Group"}
                 />
diff --git a/src/frontend/src/components/cardComponent/index.tsx b/src/frontend/src/components/cardComponent/index.tsx
index 03c71feee..ba00e6958 100644
--- a/src/frontend/src/components/cardComponent/index.tsx
+++ b/src/frontend/src/components/cardComponent/index.tsx
@@ -60,11 +60,11 @@ export default function CollectionCardComponent({
   const [loading, setLoading] = useState(false);
   const [loadingLike, setLoadingLike] = useState(false);
   const [liked_by_user, setLiked_by_user] = useState(
-    data?.liked_by_user ?? false
+    data?.liked_by_user ?? false,
   );
   const [likes_count, setLikes_count] = useState(data?.liked_by_count ?? 0);
   const [downloads_count, setDownloads_count] = useState(
-    data?.downloads_count ?? 0
+    data?.downloads_count ?? 0,
   );
   const currentFlow = useFlowsManagerStore((state) => state.currentFlow);
   const setCurrentFlow = useFlowsManagerStore((state) => state.setCurrentFlow);
@@ -75,12 +75,12 @@ export default function CollectionCardComponent({
   const [openPlayground, setOpenPlayground] = useState(false);
   const [openDelete, setOpenDelete] = useState(false);
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
   const [loadingPlayground, setLoadingPlayground] = useState(false);
 
   const selectedFlowsComponentsCards = useFlowsManagerStore(
-    (state) => state.selectedFlowsComponentsCards
+    (state) => state.selectedFlowsComponentsCards,
   );
 
   const name = data.is_component ? "Component" : "Flow";
@@ -220,7 +220,7 @@ export default function CollectionCardComponent({
           "group relative flex h-[11rem] flex-col justify-between overflow-hidden hover:bg-muted/50 hover:shadow-md hover:dark:bg-[#5f5f5f0e]",
           disabled ? "pointer-events-none opacity-50" : "",
           onClick ? "cursor-pointer" : "",
-          isSelectedCard ? "border border-selected" : ""
+          isSelectedCard ? "border border-selected" : "",
         )}
         onClick={onClick}
       >
@@ -233,7 +233,7 @@ export default function CollectionCardComponent({
                     "visible flex-shrink-0",
                     data.is_component
                       ? "mx-0.5 h-6 w-6 text-component-icon"
-                      : "h-7 w-7 flex-shrink-0 text-flow-icon"
+                      : "h-7 w-7 flex-shrink-0 text-flow-icon",
                   )}
                   name={data.is_component ? "ToyBrick" : "Group"}
                 />
@@ -425,7 +425,7 @@ export default function CollectionCardComponent({
                             name="Trash2"
                             className={cn(
                               "h-5 w-5",
-                              !authorized ? "text-ring" : ""
+                              !authorized ? "text-ring" : "",
                             )}
                           />
                         </Button>
@@ -460,7 +460,7 @@ export default function CollectionCardComponent({
                             liked_by_user
                               ? "fill-destructive stroke-destructive"
                               : "",
-                            !authorized ? "text-ring" : ""
+                            !authorized ? "text-ring" : "",
                           )}
                         />
                       </Button>
@@ -498,7 +498,7 @@ export default function CollectionCardComponent({
                         }
                         className={cn(
                           loading ? "h-5 w-5 animate-spin" : "h-5 w-5",
-                          !authorized ? "text-ring" : ""
+                          !authorized ? "text-ring" : "",
                         )}
                       />
                     </Button>
diff --git a/src/frontend/src/components/cardsWrapComponent/index.tsx b/src/frontend/src/components/cardsWrapComponent/index.tsx
index 0de3f1a2f..c7ca01588 100644
--- a/src/frontend/src/components/cardsWrapComponent/index.tsx
+++ b/src/frontend/src/components/cardsWrapComponent/index.tsx
@@ -65,7 +65,7 @@ export default function CardsWrapComponent({
         "h-full w-full",
         isDragging
           ? "mb-36 flex flex-col items-center justify-center gap-4 text-2xl font-light"
-          : ""
+          : "",
       )}
     >
       {isDragging ? (
diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx
index 1dae86775..83c6c80c1 100644
--- a/src/frontend/src/components/chatComponent/index.tsx
+++ b/src/frontend/src/components/chatComponent/index.tsx
@@ -65,7 +65,7 @@ export default function FlowToolbar(): JSX.Element {
             "relative inline-flex h-full w-full items-center justify-center gap-[4px] bg-muted px-5 py-3 text-sm font-semibold text-foreground transition-all duration-150 ease-in-out hover:bg-background hover:bg-hover",
             !hasApiKey || !validApiKey || !hasStore
               ? "button-disable text-muted-foreground"
-              : ""
+              : "",
           )}
         >
           <ForwardedIconComponent
@@ -74,7 +74,7 @@ export default function FlowToolbar(): JSX.Element {
               "-m-0.5 -ml-1 h-6 w-6",
               !hasApiKey || !validApiKey || !hasStore
                 ? "extra-side-bar-save-disable"
-                : ""
+                : "",
             )}
           />
           Share
@@ -88,7 +88,7 @@ export default function FlowToolbar(): JSX.Element {
       hasStore,
       openShareModal,
       setOpenShareModal,
-    ]
+    ],
   );
 
   return (
@@ -144,7 +144,7 @@ export default function FlowToolbar(): JSX.Element {
                 >
                   <div
                     className={classNames(
-                      "relative inline-flex w-full items-center justify-center gap-1 px-5 py-3 text-sm font-semibold text-foreground transition-all duration-150 ease-in-out hover:bg-hover"
+                      "relative inline-flex w-full items-center justify-center gap-1 px-5 py-3 text-sm font-semibold text-foreground transition-all duration-150 ease-in-out hover:bg-hover",
                     )}
                   >
                     <ForwardedIconComponent
diff --git a/src/frontend/src/components/codeAreaComponent/index.tsx b/src/frontend/src/components/codeAreaComponent/index.tsx
index 92fa810d5..9772b3199 100644
--- a/src/frontend/src/components/codeAreaComponent/index.tsx
+++ b/src/frontend/src/components/codeAreaComponent/index.tsx
@@ -18,7 +18,7 @@ export default function CodeAreaComponent({
   setOpen,
 }: CodeAreaComponentType) {
   const [myValue, setMyValue] = useState(
-    typeof value == "string" ? value : JSON.stringify(value)
+    typeof value == "string" ? value : JSON.stringify(value),
   );
   useEffect(() => {
     if (disabled && myValue !== "") {
diff --git a/src/frontend/src/components/codeTabsComponent/index.tsx b/src/frontend/src/components/codeTabsComponent/index.tsx
index 448eca948..8b0106902 100644
--- a/src/frontend/src/components/codeTabsComponent/index.tsx
+++ b/src/frontend/src/components/codeTabsComponent/index.tsx
@@ -138,7 +138,7 @@ export default function CodeTabsComponent({
               <Label
                 className={cn(
                   "relative right-1 top-[4px] text-xs font-medium text-muted-foreground",
-                  activeTweaks ? "text-primary" : ""
+                  activeTweaks ? "text-primary" : "",
                 )}
                 htmlFor="tweaks-switch"
               >
@@ -193,7 +193,7 @@ export default function CodeTabsComponent({
               <div className="api-modal-according-display">
                 <div
                   className={classNames(
-                    "h-[70vh] w-full overflow-y-auto overflow-x-hidden rounded-lg bg-muted custom-scroll"
+                    "h-[70vh] w-full overflow-y-auto overflow-x-hidden rounded-lg bg-muted custom-scroll",
                   )}
                 >
                   {data?.map((node: any, i) => (
@@ -232,8 +232,8 @@ export default function CodeTabsComponent({
                                         .show &&
                                       LANGFLOW_SUPPORTED_TYPES.has(
                                         node.data.node.template[templateField]
-                                          .type
-                                      )
+                                          .type,
+                                      ),
                                   )
                                   .map((templateField, indx) => {
                                     return (
@@ -291,7 +291,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                 />
@@ -337,7 +337,7 @@ export default function CodeTabsComponent({
                                                         target,
                                                         node.data.node.template[
                                                           templateField
-                                                        ]
+                                                        ],
                                                       );
                                                     }}
                                                   />
@@ -390,7 +390,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                 />
@@ -427,7 +427,7 @@ export default function CodeTabsComponent({
                                                       e,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                   size="small"
@@ -458,7 +458,7 @@ export default function CodeTabsComponent({
                                                     ].fileTypes
                                                   }
                                                   onFileChange={(
-                                                    value: any
+                                                    value: any,
                                                   ) => {
                                                     node.data.node.template[
                                                       templateField
@@ -511,7 +511,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                 />
@@ -551,7 +551,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                   value={
@@ -613,7 +613,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                 />
@@ -659,7 +659,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                 />
@@ -705,7 +705,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                 />
@@ -737,8 +737,8 @@ export default function CodeTabsComponent({
                                                           ].value,
                                                           type(
                                                             node,
-                                                            templateField
-                                                          )
+                                                            templateField,
+                                                          ),
                                                         )
                                                   }
                                                   duplicateKey={
@@ -747,15 +747,15 @@ export default function CodeTabsComponent({
                                                   onChange={(target) => {
                                                     const valueToNumbers =
                                                       convertValuesToNumbers(
-                                                        target
+                                                        target,
                                                       );
                                                     node.data.node!.template[
                                                       templateField
                                                     ].value = valueToNumbers;
                                                     setErrorDuplicateKey(
                                                       hasDuplicateKeys(
-                                                        valueToNumbers
-                                                      )
+                                                        valueToNumbers,
+                                                      ),
                                                     );
                                                     setData((old) => {
                                                       let newInputList =
@@ -772,7 +772,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                   isList={
@@ -820,7 +820,7 @@ export default function CodeTabsComponent({
                                                       target,
                                                       node.data.node.template[
                                                         templateField
-                                                      ]
+                                                      ],
                                                     );
                                                   }}
                                                 />
diff --git a/src/frontend/src/components/csvOutputComponent/index.tsx b/src/frontend/src/components/csvOutputComponent/index.tsx
index e88bc7af5..78f5e22a9 100644
--- a/src/frontend/src/components/csvOutputComponent/index.tsx
+++ b/src/frontend/src/components/csvOutputComponent/index.tsx
@@ -67,7 +67,7 @@ function CsvOutputComponent({
     if (file) {
       const { rowData: data, colDefs: columns } = convertCSVToData(
         file,
-        separator
+        separator,
       );
       setRowData(data);
       setColDefs(columns);
diff --git a/src/frontend/src/components/dictComponent/index.tsx b/src/frontend/src/components/dictComponent/index.tsx
index b0340bf1a..057ba599d 100644
--- a/src/frontend/src/components/dictComponent/index.tsx
+++ b/src/frontend/src/components/dictComponent/index.tsx
@@ -24,7 +24,7 @@ export default function DictComponent({
     <div
       className={classNames(
         value.length > 1 && editNode ? "my-1" : "",
-        "flex w-full flex-col gap-3"
+        "flex w-full flex-col gap-3",
       )}
     >
       {
diff --git a/src/frontend/src/components/dropdownComponent/index.tsx b/src/frontend/src/components/dropdownComponent/index.tsx
index 03fb25202..7a3f0fcf2 100644
--- a/src/frontend/src/components/dropdownComponent/index.tsx
+++ b/src/frontend/src/components/dropdownComponent/index.tsx
@@ -57,7 +57,7 @@ export default function Dropdown({
                       ? "dropdown-component-outline"
                       : "dropdown-component-false-outline",
                     "w-full justify-between font-normal",
-                    editNode ? "input-edit-node" : "py-2"
+                    editNode ? "input-edit-node" : "py-2",
                   )}
                 >
                   <span data-testid={`value-dropdown-` + id}>
@@ -105,7 +105,7 @@ export default function Dropdown({
                           name="Check"
                           className={cn(
                             "ml-auto h-4 w-4 text-primary",
-                            value === option ? "opacity-100" : "opacity-0"
+                            value === option ? "opacity-100" : "opacity-0",
                           )}
                         />
                       </CommandItem>
diff --git a/src/frontend/src/components/editFlowSettingsComponent/index.tsx b/src/frontend/src/components/editFlowSettingsComponent/index.tsx
index 085ebf68f..ba376cd9b 100644
--- a/src/frontend/src/components/editFlowSettingsComponent/index.tsx
+++ b/src/frontend/src/components/editFlowSettingsComponent/index.tsx
@@ -99,7 +99,7 @@ export const EditFlowSettings: React.FC<InputProps> = ({
           <span
             className={cn(
               "font-normal text-muted-foreground word-break-break-word",
-              description === "" ? "font-light italic" : ""
+              description === "" ? "font-light italic" : "",
             )}
           >
             {description === "" ? "No description" : description}
diff --git a/src/frontend/src/components/exampleComponent/index.tsx b/src/frontend/src/components/exampleComponent/index.tsx
index b96289bdf..02af6b9bc 100644
--- a/src/frontend/src/components/exampleComponent/index.tsx
+++ b/src/frontend/src/components/exampleComponent/index.tsx
@@ -28,7 +28,7 @@ export default function CollectionCardComponent({
   return (
     <Card
       className={cn(
-        "group relative flex h-48 w-2/6 flex-col justify-between overflow-hidden transition-all hover:shadow-md"
+        "group relative flex h-48 w-2/6 flex-col justify-between overflow-hidden transition-all hover:shadow-md",
       )}
     >
       <div>
diff --git a/src/frontend/src/components/genericIconComponent/index.tsx b/src/frontend/src/components/genericIconComponent/index.tsx
index 398ae6e7f..9f7c687a1 100644
--- a/src/frontend/src/components/genericIconComponent/index.tsx
+++ b/src/frontend/src/components/genericIconComponent/index.tsx
@@ -18,7 +18,7 @@ export const ForwardedIconComponent = memo(
         strokeWidth,
         id = "",
       }: IconComponentProps,
-      ref
+      ref,
     ) => {
       const [showFallback, setShowFallback] = useState(false);
 
@@ -65,8 +65,8 @@ export const ForwardedIconComponent = memo(
           />
         </Suspense>
       );
-    }
-  )
+    },
+  ),
 );
 
 export default ForwardedIconComponent;
diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx
index b99dae795..63a8742dd 100644
--- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx
+++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx
@@ -121,7 +121,7 @@ export const MenuBar = ({}: {}): JSX.Element => {
                       title: UPLOAD_ERROR_ALERT,
                       list: [error],
                     });
-                  }
+                  },
                 );
               }}
             >
@@ -207,7 +207,7 @@ export const MenuBar = ({}: {}): JSX.Element => {
               name={isBuilding || saveLoading ? "Loader2" : "CheckCircle2"}
               className={cn(
                 "h-4 w-4",
-                isBuilding || saveLoading ? "animate-spin" : "animate-wiggle"
+                isBuilding || saveLoading ? "animate-spin" : "animate-wiggle",
               )}
             />
             {printByBuildStatus()}
diff --git a/src/frontend/src/components/horizontalScrollFadeComponent/index.tsx b/src/frontend/src/components/horizontalScrollFadeComponent/index.tsx
index 7e0c788a6..e0bf48917 100644
--- a/src/frontend/src/components/horizontalScrollFadeComponent/index.tsx
+++ b/src/frontend/src/components/horizontalScrollFadeComponent/index.tsx
@@ -32,11 +32,11 @@ export default function HorizontalScrollFadeComponent({
 
       fadeContainerRef.current.classList.toggle(
         "fade-left",
-        isScrollable && !atStart
+        isScrollable && !atStart,
       );
       fadeContainerRef.current.classList.toggle(
         "fade-right",
-        isScrollable && !atEnd
+        isScrollable && !atEnd,
       );
     };
 
diff --git a/src/frontend/src/components/inputComponent/components/popover/index.tsx b/src/frontend/src/components/inputComponent/components/popover/index.tsx
index 9445f334b..d0c51f064 100644
--- a/src/frontend/src/components/inputComponent/components/popover/index.tsx
+++ b/src/frontend/src/components/inputComponent/components/popover/index.tsx
@@ -75,9 +75,9 @@ const CustomInputPopover = ({
             (selectedOption !== "" || !onChange) && setSelectedOption
               ? selectedOption
               : (selectedOptions?.length !== 0 || !onChange) &&
-                setSelectedOptions
-              ? selectedOptions?.join(", ")
-              : value
+                  setSelectedOptions
+                ? selectedOptions?.join(", ")
+                : value
           }
           autoFocus={autoFocus}
           disabled={disabled}
@@ -103,7 +103,7 @@ const CustomInputPopover = ({
               (password && !(setSelectedOption || setSelectedOptions))
               ? "pr-8"
               : "",
-            className!
+            className!,
           )}
           placeholder={password && editNode ? "Key" : placeholder}
           onChange={handleInputChange}
@@ -141,15 +141,15 @@ const CustomInputPopover = ({
                   onSelect={(currentValue) => {
                     setSelectedOption &&
                       setSelectedOption(
-                        currentValue === selectedOption ? "" : currentValue
+                        currentValue === selectedOption ? "" : currentValue,
                       );
                     setSelectedOptions &&
                       setSelectedOptions(
                         selectedOptions?.includes(currentValue)
                           ? selectedOptions.filter(
-                              (item) => item !== currentValue
+                              (item) => item !== currentValue,
                             )
-                          : [...selectedOptions, currentValue]
+                          : [...selectedOptions, currentValue],
                       );
                     !setSelectedOptions && setShowOptions(false);
                   }}
@@ -162,7 +162,7 @@ const CustomInputPopover = ({
                           selectedOption === option ||
                             selectedOptions?.includes(option)
                             ? "opacity-100"
-                            : "opacity-0"
+                            : "opacity-0",
                         )}
                       >
                         <div className="absolute opacity-100 transition-all group-hover:opacity-0">
diff --git a/src/frontend/src/components/inputComponent/components/popoverObject/index.tsx b/src/frontend/src/components/inputComponent/components/popoverObject/index.tsx
index d43022845..e907ec239 100644
--- a/src/frontend/src/components/inputComponent/components/popoverObject/index.tsx
+++ b/src/frontend/src/components/inputComponent/components/popoverObject/index.tsx
@@ -60,14 +60,14 @@ const CustomInputPopoverObject = ({
               ? options.find((option) => option.id === selectedOption)?.name ||
                 ""
               : (selectedOptions?.length !== 0 || !onChange) &&
-                setSelectedOptions
-              ? selectedOptions
-                  .map(
-                    (optionId) =>
-                      options.find((option) => option.id === optionId)?.name
-                  )
-                  .join(", ")
-              : value
+                  setSelectedOptions
+                ? selectedOptions
+                    .map(
+                      (optionId) =>
+                        options.find((option) => option.id === optionId)?.name,
+                    )
+                    .join(", ")
+                : value
           }
           autoFocus={autoFocus}
           disabled={disabled}
@@ -115,15 +115,15 @@ const CustomInputPopoverObject = ({
                   onSelect={(currentValue) => {
                     setSelectedOption &&
                       setSelectedOption(
-                        currentValue === selectedOption ? "" : currentValue
+                        currentValue === selectedOption ? "" : currentValue,
                       );
                     setSelectedOptions &&
                       setSelectedOptions(
                         selectedOptions?.includes(currentValue)
                           ? selectedOptions.filter(
-                              (item) => item !== currentValue
+                              (item) => item !== currentValue,
                             )
-                          : [...selectedOptions, currentValue]
+                          : [...selectedOptions, currentValue],
                       );
                     !setSelectedOptions && setShowOptions(false);
                   }}
@@ -136,7 +136,7 @@ const CustomInputPopoverObject = ({
                           selectedOption === option.id ||
                             selectedOptions?.includes(option.id)
                             ? "opacity-100"
-                            : "opacity-0"
+                            : "opacity-0",
                         )}
                       >
                         <div className="absolute opacity-100 transition-all group-hover:opacity-0">
diff --git a/src/frontend/src/components/inputFileComponent/index.tsx b/src/frontend/src/components/inputFileComponent/index.tsx
index 22002c0cd..1e9f4dea5 100644
--- a/src/frontend/src/components/inputFileComponent/index.tsx
+++ b/src/frontend/src/components/inputFileComponent/index.tsx
@@ -105,8 +105,8 @@ export default function InputFileComponent({
             editNode
               ? "input-edit-node input-dialog text-muted-foreground"
               : disabled
-              ? "input-disable input-dialog primary-input"
-              : "input-dialog primary-input text-muted-foreground"
+                ? "input-disable input-dialog primary-input"
+                : "input-dialog primary-input text-muted-foreground"
           }
         >
           {myValue !== "" ? myValue : "No file"}
diff --git a/src/frontend/src/components/inputGlobalComponent/index.tsx b/src/frontend/src/components/inputGlobalComponent/index.tsx
index 21c93e6bf..3f74d2c1d 100644
--- a/src/frontend/src/components/inputGlobalComponent/index.tsx
+++ b/src/frontend/src/components/inputGlobalComponent/index.tsx
@@ -19,15 +19,15 @@ export default function InputGlobalComponent({
   editNode = false,
 }: InputGlobalComponentType): JSX.Element {
   const globalVariablesEntries = useGlobalVariablesStore(
-    (state) => state.globalVariablesEntries
+    (state) => state.globalVariablesEntries,
   );
 
   const getVariableId = useGlobalVariablesStore((state) => state.getVariableId);
   const unavaliableFields = useGlobalVariablesStore(
-    (state) => state.unavaliableFields
+    (state) => state.unavaliableFields,
   );
   const removeGlobalVariable = useGlobalVariablesStore(
-    (state) => state.removeGlobalVariable
+    (state) => state.removeGlobalVariable,
   );
   const setErrorData = useAlertStore((state) => state.setErrorData);
 
@@ -121,7 +121,7 @@ export default function InputGlobalComponent({
             <ForwardedIconComponent
               name="Trash2"
               className={cn(
-                "h-4 w-4 text-primary opacity-0 hover:text-status-red group-hover:opacity-100"
+                "h-4 w-4 text-primary opacity-0 hover:text-status-red group-hover:opacity-100",
               )}
               aria-hidden="true"
             />
diff --git a/src/frontend/src/components/inputListComponent/index.tsx b/src/frontend/src/components/inputListComponent/index.tsx
index e89320dc9..7b5f87274 100644
--- a/src/frontend/src/components/inputListComponent/index.tsx
+++ b/src/frontend/src/components/inputListComponent/index.tsx
@@ -31,7 +31,7 @@ export default function InputListComponent({
     <div
       className={classNames(
         value.length > 1 && editNode ? "my-1" : "",
-        "flex flex-col gap-3"
+        "flex flex-col gap-3",
       )}
     >
       {value.map((singleValue, idx) => {
diff --git a/src/frontend/src/components/keypairListComponent/index.tsx b/src/frontend/src/components/keypairListComponent/index.tsx
index 2fa12e3b8..6cfee4c94 100644
--- a/src/frontend/src/components/keypairListComponent/index.tsx
+++ b/src/frontend/src/components/keypairListComponent/index.tsx
@@ -52,7 +52,7 @@ export default function KeypairListComponent({
     <div
       className={classNames(
         ref.current?.length > 1 && editNode ? "mx-2 my-1" : "",
-        "flex h-full flex-col gap-3"
+        "flex h-full flex-col gap-3",
       )}
     >
       {ref.current?.map((obj, index) => {
@@ -68,7 +68,7 @@ export default function KeypairListComponent({
                 value={key.trim()}
                 className={classNames(
                   editNode ? "input-edit-node" : "",
-                  duplicateKey ? "input-invalid" : ""
+                  duplicateKey ? "input-invalid" : "",
                 )}
                 placeholder="Type key..."
                 onChange={(event) => handleChangeKey(event, index)}
diff --git a/src/frontend/src/components/paginatorComponent/index.tsx b/src/frontend/src/components/paginatorComponent/index.tsx
index 09c5e0702..da6a9492a 100644
--- a/src/frontend/src/components/paginatorComponent/index.tsx
+++ b/src/frontend/src/components/paginatorComponent/index.tsx
@@ -20,7 +20,7 @@ export default function PaginatorComponent({
 }: PaginatorComponentType) {
   const [size, setPageSize] = useState(pageSize);
   const [maxIndex, setMaxPageIndex] = useState(
-    Math.ceil(totalRowsCount / pageSize)
+    Math.ceil(totalRowsCount / pageSize),
   );
 
   useEffect(() => {
diff --git a/src/frontend/src/components/sidebarComponent/components/sideBarButtons/index.tsx b/src/frontend/src/components/sidebarComponent/components/sideBarButtons/index.tsx
index 8e14f8fc1..5b382bd15 100644
--- a/src/frontend/src/components/sidebarComponent/components/sideBarButtons/index.tsx
+++ b/src/frontend/src/components/sidebarComponent/components/sideBarButtons/index.tsx
@@ -27,7 +27,7 @@ const SideBarButtonsComponent = ({
               pathname === item.href
                 ? "border border-border bg-muted hover:bg-muted"
                 : "border border-transparent hover:border-border hover:bg-transparent",
-              "flex w-full shrink-0 justify-start gap-4"
+              "flex w-full shrink-0 justify-start gap-4",
             )}
           >
             {item.icon}
diff --git a/src/frontend/src/components/sidebarComponent/hooks/use-on-file-drop.tsx b/src/frontend/src/components/sidebarComponent/hooks/use-on-file-drop.tsx
index ab4b9d27f..c75bf4bec 100644
--- a/src/frontend/src/components/sidebarComponent/hooks/use-on-file-drop.tsx
+++ b/src/frontend/src/components/sidebarComponent/hooks/use-on-file-drop.tsx
@@ -12,7 +12,7 @@ import { addVersionToDuplicates } from "../../../utils/reactflowUtils";
 const useFileDrop = (folderId, folderChangeCallback) => {
   const setFolderDragging = useFolderStore((state) => state.setFolderDragging);
   const setFolderIdDragging = useFolderStore(
-    (state) => state.setFolderIdDragging
+    (state) => state.setFolderIdDragging,
   );
 
   const setErrorData = useAlertStore((state) => state.setErrorData);
@@ -45,7 +45,7 @@ const useFileDrop = (folderId, folderChangeCallback) => {
       | React.DragEvent<HTMLDivElement>
       | React.DragEvent<HTMLButtonElement>
       | React.DragEvent<HTMLAnchorElement>,
-    folderId: string
+    folderId: string,
   ) => {
     e.preventDefault();
 
@@ -60,7 +60,7 @@ const useFileDrop = (folderId, folderChangeCallback) => {
       | React.DragEvent<HTMLDivElement>
       | React.DragEvent<HTMLButtonElement>
       | React.DragEvent<HTMLAnchorElement>,
-    folderId: string
+    folderId: string,
   ) => {
     if (e.dataTransfer.types.some((types) => types === "Files")) {
       setFolderDragging(true);
@@ -73,7 +73,7 @@ const useFileDrop = (folderId, folderChangeCallback) => {
     e:
       | React.DragEvent<HTMLDivElement>
       | React.DragEvent<HTMLButtonElement>
-      | React.DragEvent<HTMLAnchorElement>
+      | React.DragEvent<HTMLAnchorElement>,
   ) => {
     e.preventDefault();
     if (e.target === e.currentTarget) {
@@ -87,7 +87,7 @@ const useFileDrop = (folderId, folderChangeCallback) => {
       | React.DragEvent<HTMLDivElement>
       | React.DragEvent<HTMLButtonElement>
       | React.DragEvent<HTMLAnchorElement>,
-    folderId: string
+    folderId: string,
   ) => {
     if (e?.dataTransfer?.getData("flow")) {
       const data = JSON.parse(e?.dataTransfer?.getData("flow"));
diff --git a/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx b/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx
index fcf76c823..b55788134 100644
--- a/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx
+++ b/src/frontend/src/components/tableComponent/components/tableNodeCellRender/index.tsx
@@ -72,8 +72,8 @@ export default function TableNodeCellRender({
                 ...id,
                 proxy: templateData.proxy,
               }
-            : id
-        )
+            : id,
+        ),
     ) ?? false;
   function getCellType() {
     switch (templateData.type) {
@@ -146,7 +146,7 @@ export default function TableNodeCellRender({
           <div
             className={classNames(
               "max-h-48 w-full overflow-auto custom-scroll",
-              templateValue?.length > 1 ? "my-3" : ""
+              templateValue?.length > 1 ? "my-3" : "",
             )}
           >
             <KeypairListComponent
diff --git a/src/frontend/src/components/tableComponent/index.tsx b/src/frontend/src/components/tableComponent/index.tsx
index b1f650f16..1bfd4b6ef 100644
--- a/src/frontend/src/components/tableComponent/index.tsx
+++ b/src/frontend/src/components/tableComponent/index.tsx
@@ -35,7 +35,7 @@ const TableComponent = forwardRef<
       alertDescription = DEFAULT_TABLE_ALERT_MSG,
       ...props
     },
-    ref
+    ref,
   ) => {
     let colDef = props.columnDefs.map((col, index) => {
       let newCol = {
@@ -110,7 +110,7 @@ const TableComponent = forwardRef<
     };
     const onColumnMoved = (params) => {
       const updatedColumnDefs = makeLastColumnNonResizable(
-        params.columnApi.getAllGridColumns().map((col) => col.getColDef())
+        params.columnApi.getAllGridColumns().map((col) => col.getColDef()),
       );
       params.api.setGridOption("columnDefs", updatedColumnDefs);
       if (props.onColumnMoved) props.onColumnMoved(params);
@@ -134,7 +134,7 @@ const TableComponent = forwardRef<
         className={cn(
           dark ? "ag-theme-quartz-dark" : "ag-theme-quartz",
           "ag-theme-shadcn flex h-full flex-col",
-          "relative"
+          "relative",
         )} // applying the grid theme
       >
         <AgGridReact
@@ -151,7 +151,7 @@ const TableComponent = forwardRef<
             if (e.sources.some((source) => source.includes("column"))) {
               localStorage.setItem(
                 storeReference,
-                JSON.stringify(realRef.current?.api?.getColumnState())
+                JSON.stringify(realRef.current?.api?.getColumnState()),
               );
               setColumnStateChange(true);
             }
@@ -174,7 +174,7 @@ const TableComponent = forwardRef<
         )}
       </div>
     );
-  }
+  },
 );
 
 export default TableComponent;
diff --git a/src/frontend/src/components/tagsSelectorComponent/index.tsx b/src/frontend/src/components/tagsSelectorComponent/index.tsx
index 6bf0c1d3c..95bcc1101 100644
--- a/src/frontend/src/components/tagsSelectorComponent/index.tsx
+++ b/src/frontend/src/components/tagsSelectorComponent/index.tsx
@@ -48,7 +48,7 @@ export function TagsSelector({
               className={cn(
                 selectedTags.some((category) => category === tag.name)
                   ? "min-w-min bg-beta-foreground text-background hover:bg-beta-foreground"
-                  : ""
+                  : "",
               )}
             >
               {tag.name}
diff --git a/src/frontend/src/components/ui/accordion.tsx b/src/frontend/src/components/ui/accordion.tsx
index 3efc7518a..d7862e1e5 100644
--- a/src/frontend/src/components/ui/accordion.tsx
+++ b/src/frontend/src/components/ui/accordion.tsx
@@ -34,7 +34,7 @@ const AccordionTrigger = React.forwardRef<
       <div
         className={cn(
           "flex flex-1 cursor-pointer items-center justify-between py-4 text-sm font-medium transition-all [&[data-state=open]>svg]:rotate-180",
-          className
+          className,
         )}
       >
         {children}
@@ -46,7 +46,7 @@ const AccordionTrigger = React.forwardRef<
           <ChevronDownIcon
             className={cn(
               "h-4 w-4 font-bold transition-transform duration-200",
-              disabled ? "text-muted-foreground" : "text-primary"
+              disabled ? "text-muted-foreground" : "text-primary",
             )}
           />
         </ShadTooltip>
@@ -64,7 +64,7 @@ const AccordionContent = React.forwardRef<
     ref={ref}
     className={cn(
       "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
-      className
+      className,
     )}
     {...props}
   >
diff --git a/src/frontend/src/components/ui/alert.tsx b/src/frontend/src/components/ui/alert.tsx
index a584cea26..05c5b7fa7 100644
--- a/src/frontend/src/components/ui/alert.tsx
+++ b/src/frontend/src/components/ui/alert.tsx
@@ -15,7 +15,7 @@ const alertVariants = cva(
     defaultVariants: {
       variant: "default",
     },
-  }
+  },
 );
 
 const Alert = React.forwardRef<
diff --git a/src/frontend/src/components/ui/badge.tsx b/src/frontend/src/components/ui/badge.tsx
index 8f8d1f6aa..6eea7971a 100644
--- a/src/frontend/src/components/ui/badge.tsx
+++ b/src/frontend/src/components/ui/badge.tsx
@@ -27,7 +27,7 @@ const badgeVariants = cva(
     defaultVariants: {
       variant: "default",
     },
-  }
+  },
 );
 
 export interface BadgeProps
diff --git a/src/frontend/src/components/ui/card.tsx b/src/frontend/src/components/ui/card.tsx
index eb9bd7b56..11a72e215 100644
--- a/src/frontend/src/components/ui/card.tsx
+++ b/src/frontend/src/components/ui/card.tsx
@@ -9,7 +9,7 @@ const Card = React.forwardRef<
     ref={ref}
     className={cn(
       "flex flex-col justify-between rounded-lg border bg-muted text-card-foreground shadow-sm transition-all",
-      className
+      className,
     )}
     {...props}
   />
@@ -36,7 +36,7 @@ const CardTitle = React.forwardRef<
     ref={ref}
     className={cn(
       "text-base font-semibold leading-tight tracking-tight",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/components/ui/checkbox.tsx b/src/frontend/src/components/ui/checkbox.tsx
index 2c48fde84..1c3d1e4fe 100644
--- a/src/frontend/src/components/ui/checkbox.tsx
+++ b/src/frontend/src/components/ui/checkbox.tsx
@@ -13,7 +13,7 @@ const Checkbox = React.forwardRef<
     ref={ref}
     className={cn(
       "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
-      className
+      className,
     )}
     {...props}
   >
@@ -37,7 +37,7 @@ const CheckBoxDiv = ({
     className={cn(
       className,
       "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-      checked ? "bg-primary text-primary-foreground" : ""
+      checked ? "bg-primary text-primary-foreground" : "",
     )}
   >
     {checked && (
diff --git a/src/frontend/src/components/ui/combobox.tsx b/src/frontend/src/components/ui/combobox.tsx
index faaafda56..3f35ce6a7 100644
--- a/src/frontend/src/components/ui/combobox.tsx
+++ b/src/frontend/src/components/ui/combobox.tsx
@@ -65,7 +65,7 @@ export function Combobox({
                     "mr-2 h-4 w-4",
                     value.includes(framework.value)
                       ? "opacity-100"
-                      : "opacity-0"
+                      : "opacity-0",
                   )}
                 />
                 {framework.label}
diff --git a/src/frontend/src/components/ui/command.tsx b/src/frontend/src/components/ui/command.tsx
index 57088882b..a98bc0cf0 100644
--- a/src/frontend/src/components/ui/command.tsx
+++ b/src/frontend/src/components/ui/command.tsx
@@ -16,7 +16,7 @@ const Command = React.forwardRef<
     ref={ref}
     className={cn(
       "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
-      className
+      className,
     )}
     {...props}
   />
@@ -47,7 +47,7 @@ const CommandInput = React.forwardRef<
       ref={ref}
       className={cn(
         "flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
-        className
+        className,
       )}
       {...props}
     />
@@ -90,7 +90,7 @@ const CommandGroup = React.forwardRef<
     ref={ref}
     className={cn(
       "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
-      className
+      className,
     )}
     {...props}
   />
@@ -118,7 +118,7 @@ const CommandItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
-      className
+      className,
     )}
     {...props}
   />
@@ -134,7 +134,7 @@ const CommandShortcut = ({
     <span
       className={cn(
         "ml-auto text-xs tracking-widest text-muted-foreground",
-        className
+        className,
       )}
       {...props}
     />
diff --git a/src/frontend/src/components/ui/custom-accordion.tsx b/src/frontend/src/components/ui/custom-accordion.tsx
index b43c0f71c..238e0ddab 100644
--- a/src/frontend/src/components/ui/custom-accordion.tsx
+++ b/src/frontend/src/components/ui/custom-accordion.tsx
@@ -24,7 +24,7 @@ const AccordionTrigger = React.forwardRef<
       <div
         className={cn(
           "flex flex-1 cursor-pointer items-center justify-between border-[1px] py-2 text-sm font-medium data-[state=closed]:rounded-md data-[state=open]:rounded-t-md data-[state=open]:border-b-0 data-[state=open]:bg-muted [&[data-state=open]>svg]:rotate-180",
-          className
+          className,
         )}
       >
         {children}
@@ -43,7 +43,7 @@ const AccordionContent = React.forwardRef<
     ref={ref}
     className={cn(
       "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden border-[1px] text-sm data-[state=open]:rounded-b-md data-[state=open]:border-t-0 data-[state=open]:bg-muted",
-      className
+      className,
     )}
     {...props}
   >
diff --git a/src/frontend/src/components/ui/dialog-with-no-close.tsx b/src/frontend/src/components/ui/dialog-with-no-close.tsx
index 929172e00..262dee67f 100644
--- a/src/frontend/src/components/ui/dialog-with-no-close.tsx
+++ b/src/frontend/src/components/ui/dialog-with-no-close.tsx
@@ -26,7 +26,7 @@ const DialogOverlay = React.forwardRef<
     ref={ref}
     className={cn(
       "nopan nodelete nodrag noundo nocopy fixed inset-0 bottom-0 left-0 right-0 top-0 z-50 overflow-auto bg-blur-shared backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
+      className,
     )}
     {...props}
   />
@@ -43,7 +43,7 @@ const DialogContent = React.forwardRef<
       ref={ref}
       className={cn(
         "fixed z-50 flex w-full max-w-lg flex-col gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] sm:rounded-lg md:w-full",
-        className
+        className,
       )}
       {...props}
     >
@@ -60,7 +60,7 @@ const DialogHeader = ({
   <div
     className={cn(
       "flex flex-col space-y-1.5 text-center sm:text-left",
-      className
+      className,
     )}
     {...props}
   />
@@ -74,7 +74,7 @@ const DialogFooter = ({
   <div
     className={cn(
       "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
+      className,
     )}
     {...props}
   />
@@ -89,7 +89,7 @@ const DialogTitle = React.forwardRef<
     ref={ref}
     className={cn(
       "text-lg font-semibold leading-none tracking-tight",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/components/ui/dialog.tsx b/src/frontend/src/components/ui/dialog.tsx
index 76b86f592..915292b98 100644
--- a/src/frontend/src/components/ui/dialog.tsx
+++ b/src/frontend/src/components/ui/dialog.tsx
@@ -27,7 +27,7 @@ const DialogOverlay = React.forwardRef<
     ref={ref}
     className={cn(
       "nopan nodelete nodrag noundo nocopy fixed inset-0 bottom-0 left-0 right-0 top-0 z-50 overflow-auto bg-blur-shared backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
+      className,
     )}
     {...props}
   />
@@ -44,7 +44,7 @@ const DialogContent = React.forwardRef<
       ref={ref}
       className={cn(
         "fixed z-50 flex w-full max-w-lg flex-col gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] sm:rounded-lg md:w-full",
-        className
+        className,
       )}
       {...props}
     >
@@ -65,7 +65,7 @@ const DialogHeader = ({
   <div
     className={cn(
       "flex flex-col space-y-1 text-center sm:text-left",
-      className
+      className,
     )}
     {...props}
   />
@@ -79,7 +79,7 @@ const DialogFooter = ({
   <div
     className={cn(
       "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
+      className,
     )}
     {...props}
   />
@@ -94,7 +94,7 @@ const DialogTitle = React.forwardRef<
     ref={ref}
     className={cn(
       "text-lg font-semibold leading-none tracking-tight",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/components/ui/dropdown-menu.tsx b/src/frontend/src/components/ui/dropdown-menu.tsx
index f9a0d87d3..2c3cdcd7f 100644
--- a/src/frontend/src/components/ui/dropdown-menu.tsx
+++ b/src/frontend/src/components/ui/dropdown-menu.tsx
@@ -28,7 +28,7 @@ const DropdownMenuSubTrigger = React.forwardRef<
     className={cn(
       "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   >
@@ -47,7 +47,7 @@ const DropdownMenuSubContent = React.forwardRef<
     ref={ref}
     className={cn(
       "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1",
-      className
+      className,
     )}
     {...props}
   />
@@ -65,7 +65,7 @@ const DropdownMenuContent = React.forwardRef<
       sideOffset={sideOffset}
       className={cn(
         "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        className
+        className,
       )}
       {...props}
     />
@@ -84,7 +84,7 @@ const DropdownMenuItem = React.forwardRef<
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   />
@@ -99,7 +99,7 @@ const DropdownMenuCheckboxItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     checked={checked}
     {...props}
@@ -123,7 +123,7 @@ const DropdownMenuRadioItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
@@ -148,7 +148,7 @@ const DropdownMenuLabel = React.forwardRef<
     className={cn(
       "px-2 py-1.5 pl-2 text-sm font-semibold",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/components/ui/form.tsx b/src/frontend/src/components/ui/form.tsx
index dcfd39449..69789b6f3 100644
--- a/src/frontend/src/components/ui/form.tsx
+++ b/src/frontend/src/components/ui/form.tsx
@@ -16,18 +16,18 @@ const Form = FormProvider;
 
 type FormFieldContextValue<
   TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
 > = {
   name: TName;
 };
 
 const FormFieldContext = React.createContext<FormFieldContextValue>(
-  {} as FormFieldContextValue
+  {} as FormFieldContextValue,
 );
 
 const FormField = <
   TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
 >({
   ...props
 }: ControllerProps<TFieldValues, TName>) => {
@@ -66,7 +66,7 @@ type FormItemContextValue = {
 };
 
 const FormItemContext = React.createContext<FormItemContextValue>(
-  {} as FormItemContextValue
+  {} as FormItemContextValue,
 );
 
 const FormItem = React.forwardRef<
diff --git a/src/frontend/src/components/ui/input.tsx b/src/frontend/src/components/ui/input.tsx
index ed0e22993..eb0587e00 100644
--- a/src/frontend/src/components/ui/input.tsx
+++ b/src/frontend/src/components/ui/input.tsx
@@ -12,13 +12,13 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
         type={type}
         className={cn(
           "nopan nodelete nodrag noundo nocopy primary-input",
-          className
+          className,
         )}
         ref={ref}
         {...props}
       />
     );
-  }
+  },
 );
 Input.displayName = "Input";
 
diff --git a/src/frontend/src/components/ui/label.tsx b/src/frontend/src/components/ui/label.tsx
index f8d45c11d..dab1236ba 100644
--- a/src/frontend/src/components/ui/label.tsx
+++ b/src/frontend/src/components/ui/label.tsx
@@ -6,7 +6,7 @@ import * as React from "react";
 import { cn } from "../../utils/utils";
 
 const labelVariants = cva(
-  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
 );
 
 const Label = React.forwardRef<
diff --git a/src/frontend/src/components/ui/menubar.tsx b/src/frontend/src/components/ui/menubar.tsx
index 512bb6e63..e71efe5e9 100644
--- a/src/frontend/src/components/ui/menubar.tsx
+++ b/src/frontend/src/components/ui/menubar.tsx
@@ -24,7 +24,7 @@ const Menubar = React.forwardRef<
     ref={ref}
     className={cn(
       "flex h-10 items-center space-x-1 rounded-md border bg-background p-1",
-      className
+      className,
     )}
     {...props}
   />
@@ -39,7 +39,7 @@ const MenubarTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       "flex cursor-default select-none items-center rounded-sm px-3 py-1.5 text-sm font-medium outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
-      className
+      className,
     )}
     {...props}
   />
@@ -57,7 +57,7 @@ const MenubarSubTrigger = React.forwardRef<
     className={cn(
       "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   >
@@ -75,7 +75,7 @@ const MenubarSubContent = React.forwardRef<
     ref={ref}
     className={cn(
       "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1",
-      className
+      className,
     )}
     {...props}
   />
@@ -88,7 +88,7 @@ const MenubarContent = React.forwardRef<
 >(
   (
     { className, align = "start", alignOffset = -4, sideOffset = 8, ...props },
-    ref
+    ref,
   ) => (
     <MenubarPrimitive.Portal>
       <MenubarPrimitive.Content
@@ -98,12 +98,12 @@ const MenubarContent = React.forwardRef<
         sideOffset={sideOffset}
         className={cn(
           "z-50 min-w-[12rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in slide-in-from-top-1",
-          className
+          className,
         )}
         {...props}
       />
     </MenubarPrimitive.Portal>
-  )
+  ),
 );
 MenubarContent.displayName = MenubarPrimitive.Content.displayName;
 
@@ -118,7 +118,7 @@ const MenubarItem = React.forwardRef<
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   />
@@ -133,7 +133,7 @@ const MenubarCheckboxItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     checked={checked}
     {...props}
@@ -156,7 +156,7 @@ const MenubarRadioItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
@@ -181,7 +181,7 @@ const MenubarLabel = React.forwardRef<
     className={cn(
       "px-2 py-1.5 text-sm font-semibold",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   />
@@ -208,7 +208,7 @@ const MenubarShortcut = ({
     <span
       className={cn(
         "ml-auto text-xs tracking-widest text-muted-foreground",
-        className
+        className,
       )}
       {...props}
     />
diff --git a/src/frontend/src/components/ui/popover.tsx b/src/frontend/src/components/ui/popover.tsx
index 34a6f3142..380ab7c5b 100644
--- a/src/frontend/src/components/ui/popover.tsx
+++ b/src/frontend/src/components/ui/popover.tsx
@@ -19,7 +19,7 @@ const PopoverContent = React.forwardRef<
       sideOffset={sideOffset}
       className={cn(
         "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        className
+        className,
       )}
       {...props}
     />
@@ -37,7 +37,7 @@ const PopoverContentWithoutPortal = React.forwardRef<
     sideOffset={sideOffset}
     className={cn(
       "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/components/ui/progress.tsx b/src/frontend/src/components/ui/progress.tsx
index c2afa8a4c..ff55ab76d 100644
--- a/src/frontend/src/components/ui/progress.tsx
+++ b/src/frontend/src/components/ui/progress.tsx
@@ -12,7 +12,7 @@ const Progress = React.forwardRef<
     ref={ref}
     className={cn(
       "relative h-4 w-full overflow-hidden rounded-full bg-secondary",
-      className
+      className,
     )}
     {...props}
   >
diff --git a/src/frontend/src/components/ui/rename-label.tsx b/src/frontend/src/components/ui/rename-label.tsx
index 0273e1ceb..27a21056b 100644
--- a/src/frontend/src/components/ui/rename-label.tsx
+++ b/src/frontend/src/components/ui/rename-label.tsx
@@ -61,7 +61,7 @@ export default function RenameLabel(props) {
           onInput={resizeInput}
           className={cn(
             "nopan nodelete nodrag noundo nocopy rounded-md bg-transparent px-2 outline-ring hover:outline focus:border-none focus:outline active:outline",
-            props.className
+            props.className,
           )}
           onBlur={() => {
             setIsRename(false);
diff --git a/src/frontend/src/components/ui/select-custom.tsx b/src/frontend/src/components/ui/select-custom.tsx
index 86a7bf3ac..82ba540fe 100644
--- a/src/frontend/src/components/ui/select-custom.tsx
+++ b/src/frontend/src/components/ui/select-custom.tsx
@@ -36,7 +36,7 @@ const SelectContent = React.forwardRef<
         "relative z-50 min-w-[14rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         position === "popper" &&
           "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
+        className,
       )}
       position={position}
       {...props}
@@ -45,7 +45,7 @@ const SelectContent = React.forwardRef<
         className={cn(
           "p-1",
           position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
         )}
       >
         {children}
@@ -75,7 +75,7 @@ const SelectItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-3 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
diff --git a/src/frontend/src/components/ui/select.tsx b/src/frontend/src/components/ui/select.tsx
index 7430a0d46..812fc8754 100644
--- a/src/frontend/src/components/ui/select.tsx
+++ b/src/frontend/src/components/ui/select.tsx
@@ -19,7 +19,7 @@ const SelectTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       "flex h-8 items-center justify-between rounded-md border border-ring/60 px-4 py-2 text-sm text-primary ring-offset-background placeholder:text-muted-foreground hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
@@ -42,7 +42,7 @@ const SelectContent = React.forwardRef<
         "relative z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         position === "popper" &&
           "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
+        className,
       )}
       position={position}
       {...props}
@@ -51,7 +51,7 @@ const SelectContent = React.forwardRef<
         className={cn(
           "p-1",
           position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
         )}
       >
         {children}
@@ -81,7 +81,7 @@ const SelectItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
diff --git a/src/frontend/src/components/ui/separator.tsx b/src/frontend/src/components/ui/separator.tsx
index 1fec6d2ca..8532fc89e 100644
--- a/src/frontend/src/components/ui/separator.tsx
+++ b/src/frontend/src/components/ui/separator.tsx
@@ -10,7 +10,7 @@ const Separator = React.forwardRef<
 >(
   (
     { className, orientation = "horizontal", decorative = true, ...props },
-    ref
+    ref,
   ) => (
     <SeparatorPrimitive.Root
       ref={ref}
@@ -19,11 +19,11 @@ const Separator = React.forwardRef<
       className={cn(
         "shrink-0 bg-ring/40",
         orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
-        className
+        className,
       )}
       {...props}
     />
-  )
+  ),
 );
 Separator.displayName = SeparatorPrimitive.Root.displayName;
 
diff --git a/src/frontend/src/components/ui/switch.tsx b/src/frontend/src/components/ui/switch.tsx
index 0d4bc8224..8b89baa50 100644
--- a/src/frontend/src/components/ui/switch.tsx
+++ b/src/frontend/src/components/ui/switch.tsx
@@ -11,7 +11,7 @@ const Switch = React.forwardRef<
   <SwitchPrimitives.Root
     className={cn(
       "peer inline-flex h-[24px] w-[44px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-ring",
-      className
+      className,
     )}
     {...props}
     ref={ref}
@@ -19,7 +19,7 @@ const Switch = React.forwardRef<
     <SwitchPrimitives.Thumb
       aria-disabled={props.disabled}
       className={cn(
-        "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform aria-disabled:bg-muted/70 data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
+        "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform aria-disabled:bg-muted/70 data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0",
       )}
     />
   </SwitchPrimitives.Root>
diff --git a/src/frontend/src/components/ui/table.tsx b/src/frontend/src/components/ui/table.tsx
index eb1e3bda6..cac4b5b70 100644
--- a/src/frontend/src/components/ui/table.tsx
+++ b/src/frontend/src/components/ui/table.tsx
@@ -55,7 +55,7 @@ const TableRow = React.forwardRef<
     ref={ref}
     className={cn(
       "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
-      className
+      className,
     )}
     {...props}
   />
@@ -70,7 +70,7 @@ const TableHead = React.forwardRef<
     ref={ref}
     className={cn(
       "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/components/ui/tabs.tsx b/src/frontend/src/components/ui/tabs.tsx
index a1f365ba6..e6eefc5f8 100644
--- a/src/frontend/src/components/ui/tabs.tsx
+++ b/src/frontend/src/components/ui/tabs.tsx
@@ -14,7 +14,7 @@ const TabsList = React.forwardRef<
     ref={ref}
     className={cn(
       "inline-flex h-10 items-center justify-center rounded-md p-1 text-muted-foreground",
-      className
+      className,
     )}
     {...props}
   />
@@ -29,7 +29,7 @@ const TabsTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border data-[state=inactive]:border data-[state=inactive]:border-muted data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm data-[state=inactive]:hover:bg-secondary/80",
-      className
+      className,
     )}
     {...props}
   />
@@ -44,7 +44,7 @@ const TabsContent = React.forwardRef<
     ref={ref}
     className={cn(
       "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/components/ui/textarea.tsx b/src/frontend/src/components/ui/textarea.tsx
index 1f2970545..c18d57cfc 100644
--- a/src/frontend/src/components/ui/textarea.tsx
+++ b/src/frontend/src/components/ui/textarea.tsx
@@ -10,13 +10,13 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
       <textarea
         className={cn(
           "nopan nodelete nodrag noundo nocopy textarea-primary",
-          className
+          className,
         )}
         ref={ref}
         {...props}
       />
     );
-  }
+  },
 );
 Textarea.displayName = "Textarea";
 
diff --git a/src/frontend/src/components/ui/toggle.tsx b/src/frontend/src/components/ui/toggle.tsx
index 08ebb1380..f41840dce 100644
--- a/src/frontend/src/components/ui/toggle.tsx
+++ b/src/frontend/src/components/ui/toggle.tsx
@@ -25,7 +25,7 @@ const toggleVariants = cva(
       variant: "default",
       size: "default",
     },
-  }
+  },
 );
 
 const Toggle = React.forwardRef<
diff --git a/src/frontend/src/components/ui/tooltip.tsx b/src/frontend/src/components/ui/tooltip.tsx
index 7f81bc3bd..3ee8b9c7a 100644
--- a/src/frontend/src/components/ui/tooltip.tsx
+++ b/src/frontend/src/components/ui/tooltip.tsx
@@ -20,7 +20,7 @@ const TooltipContent = React.forwardRef<
       sideOffset={sideOffset}
       className={cn(
         "z-45 overflow-y-auto rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-50 data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1",
-        className
+        className,
       )}
       {...props}
     />
@@ -37,7 +37,7 @@ const TooltipContentWithoutPortal = React.forwardRef<
     sideOffset={sideOffset}
     className={cn(
       "z-45 overflow-y-auto rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-50 data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1",
-      className
+      className,
     )}
     {...props}
   />
diff --git a/src/frontend/src/contexts/authContext.tsx b/src/frontend/src/contexts/authContext.tsx
index f6b81a235..bd5c2d02c 100644
--- a/src/frontend/src/contexts/authContext.tsx
+++ b/src/frontend/src/contexts/authContext.tsx
@@ -31,17 +31,17 @@ export function AuthProvider({ children }): React.ReactElement {
   const navigate = useNavigate();
   const cookies = new Cookies();
   const [accessToken, setAccessToken] = useState<string | null>(
-    cookies.get("access_token_lf") ?? null
+    cookies.get("access_token_lf") ?? null,
   );
   const [isAuthenticated, setIsAuthenticated] = useState<boolean>(
-    !!cookies.get("access_token_lf")
+    !!cookies.get("access_token_lf"),
   );
   const [isAdmin, setIsAdmin] = useState<boolean>(false);
   const [userData, setUserData] = useState<Users | null>(null);
   const [autoLogin, setAutoLogin] = useState<boolean>(false);
   const setLoading = useAlertStore((state) => state.setLoading);
   const [apiKey, setApiKey] = useState<string | null>(
-    cookies.get("apikey_tkn_lflw")
+    cookies.get("apikey_tkn_lflw"),
   );
 
   const getFoldersApi = useFolderStore((state) => state.getFoldersApi);
diff --git a/src/frontend/src/controllers/API/api.tsx b/src/frontend/src/controllers/API/api.tsx
index 6bd73f5f1..0ac3efa6b 100644
--- a/src/frontend/src/controllers/API/api.tsx
+++ b/src/frontend/src/controllers/API/api.tsx
@@ -48,7 +48,7 @@ function ApiInterceptor() {
         }
         await clearBuildVerticesState(error);
         return Promise.reject(error);
-      }
+      },
     );
 
     const isAuthorizedURL = (url) => {
@@ -65,10 +65,10 @@ function ApiInterceptor() {
         const parsedURL = new URL(url);
 
         const isDomainAllowed = authorizedDomains.some(
-          (domain) => parsedURL.origin === new URL(domain).origin
+          (domain) => parsedURL.origin === new URL(domain).origin,
         );
         const isEndpointAllowed = authorizedEndpoints.some((endpoint) =>
-          parsedURL.pathname.includes(endpoint)
+          parsedURL.pathname.includes(endpoint),
         );
 
         return isDomainAllowed || isEndpointAllowed;
@@ -102,7 +102,7 @@ function ApiInterceptor() {
       },
       (error) => {
         return Promise.reject(error);
-      }
+      },
     );
 
     return () => {
@@ -134,7 +134,7 @@ function ApiInterceptor() {
       if (error?.config?.headers) {
         delete error.config.headers["Authorization"];
         error.config.headers["Authorization"] = `Bearer ${cookies.get(
-          "access_token_lf"
+          "access_token_lf",
         )}`;
         const response = await axios.request(error.config);
         return response;
diff --git a/src/frontend/src/controllers/API/helpers/check-duplicate-requests.ts b/src/frontend/src/controllers/API/helpers/check-duplicate-requests.ts
index ec3c74268..85c6608ac 100644
--- a/src/frontend/src/controllers/API/helpers/check-duplicate-requests.ts
+++ b/src/frontend/src/controllers/API/helpers/check-duplicate-requests.ts
@@ -9,7 +9,7 @@ export function checkDuplicateRequestAndStoreRequest(config) {
   const currentUrl = window.location.pathname;
   const currentTime = Date.now();
   const isContained = AUTHORIZED_DUPLICATE_REQUESTS.some((request) =>
-    config?.url!.includes(request)
+    config?.url!.includes(request),
   );
 
   if (
diff --git a/src/frontend/src/controllers/API/index.ts b/src/frontend/src/controllers/API/index.ts
index 8aced1fd0..b20a4c23b 100644
--- a/src/frontend/src/controllers/API/index.ts
+++ b/src/frontend/src/controllers/API/index.ts
@@ -38,7 +38,7 @@ import {
  * @returns {Promise<AxiosResponse<APIObjectType>>} A promise that resolves to an AxiosResponse containing all the objects.
  */
 export async function getAll(
-  force_refresh: boolean = true
+  force_refresh: boolean = true,
 ): Promise<AxiosResponse<APIObjectType>> {
   return await api.get(`${BASE_URL_API}all?force_refresh=${force_refresh}`);
 }
@@ -66,7 +66,7 @@ export async function sendAll(data: sendAllProps) {
 }
 
 export async function postValidateCode(
-  code: string
+  code: string,
 ): Promise<AxiosResponse<errorsTypeAPI>> {
   return await api.post(`${BASE_URL_API}validate/code`, { code });
 }
@@ -81,7 +81,7 @@ export async function postValidateCode(
 export async function postValidatePrompt(
   name: string,
   template: string,
-  frontend_node: APIClassType
+  frontend_node: APIClassType,
 ): Promise<AxiosResponse<PromptTypeAPI>> {
   return api.post(`${BASE_URL_API}validate/prompt`, {
     name,
@@ -156,7 +156,7 @@ export async function saveFlowToDatabase(newFlow: {
  * @throws Will throw an error if the update fails.
  */
 export async function updateFlowInDatabase(
-  updatedFlow: FlowType
+  updatedFlow: FlowType,
 ): Promise<FlowType> {
   try {
     const response = await api.patch(`${BASE_URL_API}flows/${updatedFlow.id}`, {
@@ -334,7 +334,7 @@ export async function getHealth() {
  *
  */
 export async function getBuildStatus(
-  flowId: string
+  flowId: string,
 ): Promise<AxiosResponse<BuildStatusTypeAPI>> {
   return await api.get(`${BASE_URL_API}build/${flowId}/status`);
 }
@@ -347,7 +347,7 @@ export async function getBuildStatus(
  *
  */
 export async function postBuildInit(
-  flow: FlowType
+  flow: FlowType,
 ): Promise<AxiosResponse<InitTypeAPI>> {
   return await api.post(`${BASE_URL_API}build/init/${flow.id}`, flow);
 }
@@ -363,7 +363,7 @@ export async function postBuildInit(
  */
 export async function uploadFile(
   file: File,
-  id: string
+  id: string,
 ): Promise<AxiosResponse<UploadFileTypeAPI>> {
   const formData = new FormData();
   formData.append("file", file);
@@ -385,7 +385,7 @@ export async function getProfilePictures(): Promise<ProfilePicturesTypeAPI | nul
 
 export async function postCustomComponent(
   code: string,
-  apiClass: APIClassType
+  apiClass: APIClassType,
 ): Promise<AxiosResponse<APIClassType>> {
   // let template = apiClass.template;
   return await api.post(`${BASE_URL_API}custom_component`, {
@@ -398,7 +398,7 @@ export async function postCustomComponentUpdate(
   code: string,
   template: APITemplateType,
   field: string,
-  field_value: any
+  field_value: any,
 ): Promise<AxiosResponse<APIClassType>> {
   return await api.post(`${BASE_URL_API}custom_component/update`, {
     code,
@@ -420,7 +420,7 @@ export async function onLogin(user: LoginType) {
         headers: {
           "Content-Type": "application/x-www-form-urlencoded",
         },
-      }
+      },
     );
 
     if (response.status === 200) {
@@ -482,11 +482,11 @@ export async function addUser(user: UserInputType): Promise<Array<Users>> {
 
 export async function getUsersPage(
   skip: number,
-  limit: number
+  limit: number,
 ): Promise<Array<Users>> {
   try {
     const res = await api.get(
-      `${BASE_URL_API}users/?skip=${skip}&limit=${limit}`
+      `${BASE_URL_API}users/?skip=${skip}&limit=${limit}`,
     );
     if (res.status === 200) {
       return res.data;
@@ -523,7 +523,7 @@ export async function resetPassword(user_id: string, user: resetPasswordType) {
   try {
     const res = await api.patch(
       `${BASE_URL_API}users/${user_id}/reset-password`,
-      user
+      user,
     );
     if (res.status === 200) {
       return res.data;
@@ -597,7 +597,7 @@ export async function saveFlowStore(
     last_tested_version?: string;
   },
   tags: string[],
-  publicFlow = false
+  publicFlow = false,
 ): Promise<FlowType> {
   try {
     const response = await api.post(`${BASE_URL_API}store/components/`, {
@@ -726,7 +726,7 @@ export async function postStoreComponents(component: Component) {
 export async function getComponent(component_id: string) {
   try {
     const res = await api.get(
-      `${BASE_URL_API}store/components/${component_id}`
+      `${BASE_URL_API}store/components/${component_id}`,
     );
     if (res.status === 200) {
       return res.data;
@@ -741,7 +741,7 @@ export async function searchComponent(
   page?: number | null,
   limit?: number | null,
   status?: string | null,
-  tags?: string[]
+  tags?: string[],
 ): Promise<StoreComponentResponse | undefined> {
   try {
     let url = `${BASE_URL_API}store/components/`;
@@ -853,7 +853,7 @@ export async function updateFlowStore(
   },
   tags: string[],
   publicFlow = false,
-  id: string
+  id: string,
 ): Promise<FlowType> {
   try {
     const response = await api.patch(`${BASE_URL_API}store/components/${id}`, {
@@ -937,7 +937,7 @@ export async function deleteGlobalVariable(id: string) {
 export async function updateGlobalVariable(
   name: string,
   value: string,
-  id: string
+  id: string,
 ) {
   try {
     const response = api.patch(`${BASE_URL_API}variables/${id}`, {
@@ -956,7 +956,7 @@ export async function getVerticesOrder(
   startNodeId?: string | null,
   stopNodeId?: string | null,
   nodes?: Node[],
-  Edges?: Edge[]
+  Edges?: Edge[],
 ): Promise<AxiosResponse<VerticesOrderTypeAPI>> {
   // nodeId is optional and is a query parameter
   // if nodeId is not provided, the API will return all vertices
@@ -976,7 +976,7 @@ export async function getVerticesOrder(
   return await api.post(
     `${BASE_URL_API}build/${flowId}/vertices`,
     data,
-    config
+    config,
   );
 }
 
@@ -984,7 +984,7 @@ export async function postBuildVertex(
   flowId: string,
   vertexId: string,
   input_value: string,
-  files?: string[]
+  files?: string[],
 ): Promise<AxiosResponse<VertexBuildTypeAPI>> {
   // input_value is optional and is a query parameter
   let data = {};
@@ -996,7 +996,7 @@ export async function postBuildVertex(
   }
   return await api.post(
     `${BASE_URL_API}build/${flowId}/vertices/${vertexId}`,
-    data
+    data,
   );
 }
 
@@ -1020,7 +1020,7 @@ export async function getFlowPool({
 }
 
 export async function deleteFlowPool(
-  flowId: string
+  flowId: string,
 ): Promise<AxiosResponse<any>> {
   const config = {};
   config["params"] = { flow_id: flowId };
@@ -1034,7 +1034,7 @@ export async function deleteFlowPool(
  * @returns A promise that resolves to an array of AxiosResponse objects representing the delete responses.
  */
 export async function multipleDeleteFlowsComponents(
-  flowIds: string[]
+  flowIds: string[],
 ): Promise<AxiosResponse<any>[]> {
   const batches: string[][] = [];
 
@@ -1057,7 +1057,7 @@ export async function multipleDeleteFlowsComponents(
 
   // Execute all delete requests
   const responses: Promise<AxiosResponse<any>>[] = batches.map((batch) =>
-    deleteBatch(batch)
+    deleteBatch(batch),
   );
 
   // Return the responses after all requests are completed
@@ -1067,7 +1067,7 @@ export async function multipleDeleteFlowsComponents(
 export async function getTransactionTable(
   id: string,
   mode: "intersection" | "union",
-  params = {}
+  params = {},
 ): Promise<{ rows: Array<object>; columns: Array<ColDef | ColGroupDef> }> {
   const config = {};
   config["params"] = { flow_id: id };
@@ -1083,7 +1083,7 @@ export async function getMessagesTable(
   mode: "intersection" | "union",
   id?: string,
   excludedFields?: string[],
-  params = {}
+  params = {},
 ): Promise<{ rows: Array<Message>; columns: Array<ColDef | ColGroupDef> }> {
   const config = {};
   if (id) {
diff --git a/src/frontend/src/icons/AWS/index.tsx b/src/frontend/src/icons/AWS/index.tsx
index caedd54aa..7bdb4c4d1 100644
--- a/src/frontend/src/icons/AWS/index.tsx
+++ b/src/frontend/src/icons/AWS/index.tsx
@@ -4,5 +4,5 @@ import SvgAWS from "./AWS";
 export const AWSIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgAWS ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/AzLogo/index.tsx b/src/frontend/src/icons/AzLogo/index.tsx
index 4fa00c204..fa8f5605e 100644
--- a/src/frontend/src/icons/AzLogo/index.tsx
+++ b/src/frontend/src/icons/AzLogo/index.tsx
@@ -4,5 +4,5 @@ import SvgAzLogo from "./AzLogo";
 export const AzIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgAzLogo ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Azure/index.tsx b/src/frontend/src/icons/Azure/index.tsx
index 346868ab4..cde247d1b 100644
--- a/src/frontend/src/icons/Azure/index.tsx
+++ b/src/frontend/src/icons/Azure/index.tsx
@@ -4,5 +4,5 @@ import SvgAzure from "./Azure";
 export const AzureIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgAzure ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Bing/index.tsx b/src/frontend/src/icons/Bing/index.tsx
index 8e030ca88..60e70d6a6 100644
--- a/src/frontend/src/icons/Bing/index.tsx
+++ b/src/frontend/src/icons/Bing/index.tsx
@@ -4,5 +4,5 @@ import SvgBing from "./Bing";
 export const BingIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgBing ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/FacebookMessenger/index.tsx b/src/frontend/src/icons/FacebookMessenger/index.tsx
index 621e5b766..5264b376d 100644
--- a/src/frontend/src/icons/FacebookMessenger/index.tsx
+++ b/src/frontend/src/icons/FacebookMessenger/index.tsx
@@ -4,5 +4,5 @@ import SvgFacebookMessengerLogo2020 from "./FacebookMessengerLogo2020";
 export const FBIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgFacebookMessengerLogo2020 ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Groq/index.tsx b/src/frontend/src/icons/Groq/index.tsx
index 291696154..6c4283d29 100644
--- a/src/frontend/src/icons/Groq/index.tsx
+++ b/src/frontend/src/icons/Groq/index.tsx
@@ -4,5 +4,5 @@ import SvgGroqLogo from "./GroqLogo";
 export const GroqIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgGroqLogo ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/IFixIt/index.tsx b/src/frontend/src/icons/IFixIt/index.tsx
index 7d94a4fcd..318ae72a6 100644
--- a/src/frontend/src/icons/IFixIt/index.tsx
+++ b/src/frontend/src/icons/IFixIt/index.tsx
@@ -4,5 +4,5 @@ import SvgIfixitSeeklogocom from "./IfixitSeeklogoCom";
 export const IFixIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgIfixitSeeklogocom ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Meta/index.tsx b/src/frontend/src/icons/Meta/index.tsx
index 0882b673d..9fb123e86 100644
--- a/src/frontend/src/icons/Meta/index.tsx
+++ b/src/frontend/src/icons/Meta/index.tsx
@@ -4,5 +4,5 @@ import SvgMetaIcon from "./MetaIcon";
 export const MetaIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgMetaIcon ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Redis/index.tsx b/src/frontend/src/icons/Redis/index.tsx
index b1624e4a5..80f94bd85 100644
--- a/src/frontend/src/icons/Redis/index.tsx
+++ b/src/frontend/src/icons/Redis/index.tsx
@@ -4,5 +4,5 @@ import { SvgRedis } from "./Redis";
 export const RedisIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgRedis ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Searx/index.tsx b/src/frontend/src/icons/Searx/index.tsx
index f78252072..d1e07c3b4 100644
--- a/src/frontend/src/icons/Searx/index.tsx
+++ b/src/frontend/src/icons/Searx/index.tsx
@@ -4,5 +4,5 @@ import SvgSearxLogo from "./SearxLogo";
 export const SearxIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgSearxLogo ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Share/index.tsx b/src/frontend/src/icons/Share/index.tsx
index 00beb1c4b..2a68b6c19 100644
--- a/src/frontend/src/icons/Share/index.tsx
+++ b/src/frontend/src/icons/Share/index.tsx
@@ -4,5 +4,5 @@ import SvgShare from "./Share";
 export const ShareIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgShare ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Slack/index.tsx b/src/frontend/src/icons/Slack/index.tsx
index eab13486f..d37a8ce1a 100644
--- a/src/frontend/src/icons/Slack/index.tsx
+++ b/src/frontend/src/icons/Slack/index.tsx
@@ -4,5 +4,5 @@ import SvgSlackIcon from "./SlackIcon";
 export const SlackIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgSlackIcon ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Streamlit/index.tsx b/src/frontend/src/icons/Streamlit/index.tsx
index 6b3391021..1a4c55119 100644
--- a/src/frontend/src/icons/Streamlit/index.tsx
+++ b/src/frontend/src/icons/Streamlit/index.tsx
@@ -4,5 +4,5 @@ import SvgStreamlit from "./SvgStreamlit";
 export const Streamlit = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgStreamlit className="icon" ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/icons/Word/index.tsx b/src/frontend/src/icons/Word/index.tsx
index ac7842e2f..9df0d60cc 100644
--- a/src/frontend/src/icons/Word/index.tsx
+++ b/src/frontend/src/icons/Word/index.tsx
@@ -4,5 +4,5 @@ import SvgWord from "./Word";
 export const WordIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
   (props, ref) => {
     return <SvgWord ref={ref} {...props} />;
-  }
+  },
 );
diff --git a/src/frontend/src/index.tsx b/src/frontend/src/index.tsx
index 78a57298f..006d93ff2 100644
--- a/src/frontend/src/index.tsx
+++ b/src/frontend/src/index.tsx
@@ -11,11 +11,11 @@ import "./style/applies.css";
 import "./style/classes.css";
 
 const root = ReactDOM.createRoot(
-  document.getElementById("root") as HTMLElement
+  document.getElementById("root") as HTMLElement,
 );
 root.render(
   <ContextWrapper>
     <App />
-  </ContextWrapper>
+  </ContextWrapper>,
 );
 reportWebVitals();
diff --git a/src/frontend/src/modals/BundleModal/hooks/submit-folder.tsx b/src/frontend/src/modals/BundleModal/hooks/submit-folder.tsx
index 1347a323b..cb12ca7cb 100644
--- a/src/frontend/src/modals/BundleModal/hooks/submit-folder.tsx
+++ b/src/frontend/src/modals/BundleModal/hooks/submit-folder.tsx
@@ -27,7 +27,7 @@ const useFolderSubmit = (setOpen, folderToEdit) => {
             getFoldersApi(true);
             setOpen(false);
           }
-        }
+        },
       );
     } else {
       addFolder(data).then(
@@ -42,7 +42,7 @@ const useFolderSubmit = (setOpen, folderToEdit) => {
           setErrorData({
             title: `Error creating folder.`,
           });
-        }
+        },
       );
     }
   };
diff --git a/src/frontend/src/modals/IOModal/components/IOFieldView/components/csvSelect/index.tsx b/src/frontend/src/modals/IOModal/components/IOFieldView/components/csvSelect/index.tsx
index 1438237b7..5adb156ef 100644
--- a/src/frontend/src/modals/IOModal/components/IOFieldView/components/csvSelect/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/IOFieldView/components/csvSelect/index.tsx
@@ -29,7 +29,7 @@ export default function CsvSelect({ node, handleChangeSelect }): JSX.Element {
                   <SelectItem key={separator} value={separator}>
                     {separator}
                   </SelectItem>
-                )
+                ),
               )}
             </SelectGroup>
           </SelectContent>
diff --git a/src/frontend/src/modals/IOModal/components/SessionView/hooks/index.tsx b/src/frontend/src/modals/IOModal/components/SessionView/hooks/index.tsx
index 738ea9977..e8e638def 100644
--- a/src/frontend/src/modals/IOModal/components/SessionView/hooks/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/SessionView/hooks/index.tsx
@@ -10,7 +10,7 @@ const useRemoveSession = (setSuccessData, setErrorData) => {
       await deleteMessagesFn(
         messages
           .filter((msg) => msg.session_id === session_id)
-          .map((msg) => msg.index)
+          .map((msg) => msg.index),
       );
       deleteSession(session_id);
       setSuccessData({
diff --git a/src/frontend/src/modals/IOModal/components/SessionView/index.tsx b/src/frontend/src/modals/IOModal/components/SessionView/index.tsx
index 705e9245d..ef2c44d44 100644
--- a/src/frontend/src/modals/IOModal/components/SessionView/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/SessionView/index.tsx
@@ -18,7 +18,7 @@ export default function SessionView({ rows }: { rows: Array<any> }) {
     setSelectedRows,
     setSuccessData,
     setErrorData,
-    selectedRows
+    selectedRows,
   );
 
   const { handleUpdate } = useUpdateMessage(setSuccessData, setErrorData);
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/textAreaWrapper/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/textAreaWrapper/index.tsx
index 3d41e51f4..29f88453a 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/textAreaWrapper/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/textAreaWrapper/index.tsx
@@ -18,7 +18,7 @@ const TextAreaWrapper = ({
 }) => {
   const getPlaceholderText = (
     isDragging: boolean,
-    noInput: boolean
+    noInput: boolean,
   ): string => {
     if (isDragging) {
       return "Drop here";
@@ -33,8 +33,8 @@ const TextAreaWrapper = ({
     lockChat || saveLoading
       ? "form-modal-lock-true bg-input"
       : noInput
-      ? "form-modal-no-input bg-input"
-      : "form-modal-lock-false bg-background";
+        ? "form-modal-no-input bg-input"
+        : "form-modal-lock-false bg-background";
 
   const fileClass =
     files.length > 0
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx
index cf999d094..5326f3826 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx
@@ -10,7 +10,7 @@ const useDragAndDrop = (
   setIsDragging,
   setFiles,
   currentFlowId,
-  setErrorData
+  setErrorData,
 ) => {
   const dragOver = (e) => {
     e.preventDefault();
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx
index 1784f2e40..28581cfb6 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx
@@ -10,7 +10,7 @@ import useFileUpload from "./use-file-upload";
 export const useHandleFileChange = (setFiles, currentFlowId) => {
   const setErrorData = useAlertStore((state) => state.setErrorData);
   const handleFileChange = async (
-    event: React.ChangeEvent<HTMLInputElement>
+    event: React.ChangeEvent<HTMLInputElement>,
   ) => {
     const fileInput = event.target;
     const file = fileInput.files?.[0];
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/index.tsx
index 4311f0ed2..a3c070a5f 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/index.tsx
@@ -116,7 +116,7 @@ export default function ChatInput({
               key={file.id}
               onDelete={() => {
                 setFiles((prev: FilePreviewType[]) =>
-                  prev.filter((f) => f.id !== file.id)
+                  prev.filter((f) => f.id !== file.id),
                 );
                 // TODO: delete file on backend
               }}
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx
index 49939da08..238cecec6 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx
@@ -9,12 +9,12 @@ import Robot from "../../../../../assets/robot.png";
 import CodeTabsComponent from "../../../../../components/codeTabsComponent";
 import IconComponent from "../../../../../components/genericIconComponent";
 import SanitizedHTMLWrapper from "../../../../../components/sanitizedHTMLWrapper";
+import { EMPTY_INPUT_SEND_MESSAGE } from "../../../../../constants/constants";
 import useAlertStore from "../../../../../stores/alertStore";
 import useFlowStore from "../../../../../stores/flowStore";
 import { chatMessagePropsType } from "../../../../../types/components";
 import { classNames, cn } from "../../../../../utils/utils";
 import FileCardWrapper from "./components/fileCardWrapper";
-import { EMPTY_INPUT_SEND_MESSAGE } from "../../../../../constants/constants";
 
 export default function ChatMessage({
   chat,
diff --git a/src/frontend/src/modals/IOModal/components/chatView/fileComponent/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/fileComponent/index.tsx
index 64dbf2c17..fa9c505ea 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/fileComponent/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/fileComponent/index.tsx
@@ -29,7 +29,7 @@ export default function FileCard({
 
   const imgSrc = `${BACKEND_URL.slice(
     0,
-    BACKEND_URL.length - 1
+    BACKEND_URL.length - 1,
   )}${BASE_URL_API}files/images/${content}`;
 
   if (showFile) {
diff --git a/src/frontend/src/modals/IOModal/components/chatView/fileComponent/utils/handle-download.tsx b/src/frontend/src/modals/IOModal/components/chatView/fileComponent/utils/handle-download.tsx
index e82bf3167..a4be91d50 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/fileComponent/utils/handle-download.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/fileComponent/utils/handle-download.tsx
@@ -20,8 +20,8 @@ export default async function handleDownload({
     const response = await fetch(
       `${BACKEND_URL.slice(
         0,
-        BACKEND_URL.length - 1
-      )}${BASE_URL_API}files/download/${content}`
+        BACKEND_URL.length - 1,
+      )}${BASE_URL_API}files/download/${content}`,
     );
     if (!response.ok) {
       throw new Error("Network response was not ok");
diff --git a/src/frontend/src/modals/IOModal/components/chatView/filePreviewChat/utils/format-file-name.tsx b/src/frontend/src/modals/IOModal/components/chatView/filePreviewChat/utils/format-file-name.tsx
index b474f8294..94258b6af 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/filePreviewChat/utils/format-file-name.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/filePreviewChat/utils/format-file-name.tsx
@@ -1,6 +1,6 @@
 export default function formatFileName(
   name: string,
-  numberToTruncate: number = 25
+  numberToTruncate: number = 25,
 ): string {
   if (name[numberToTruncate] === undefined) {
     return name;
diff --git a/src/frontend/src/modals/apiModal/index.tsx b/src/frontend/src/modals/apiModal/index.tsx
index 19f506459..ead038ad2 100644
--- a/src/frontend/src/modals/apiModal/index.tsx
+++ b/src/frontend/src/modals/apiModal/index.tsx
@@ -39,7 +39,7 @@ const ApiModal = forwardRef(
       open?: boolean;
       setOpen?: (a: boolean | ((o?: boolean) => boolean)) => void;
     },
-    ref
+    ref,
   ) => {
     const tweak = useTweaksStore((state) => state.tweak);
     const addTweaks = useTweaksStore((state) => state.setTweak);
@@ -57,18 +57,18 @@ const ApiModal = forwardRef(
       flow?.id,
       autoLogin,
       tweak,
-      flow?.endpoint_name
+      flow?.endpoint_name,
     );
     const curl_run_code = getCurlRunCode(
       flow?.id,
       autoLogin,
       tweak,
-      flow?.endpoint_name
+      flow?.endpoint_name,
     );
     const curl_webhook_code = getCurlWebhookCode(
       flow?.id,
       autoLogin,
-      flow?.endpoint_name
+      flow?.endpoint_name,
     );
     const pythonCode = getPythonCode(flow?.name, tweak);
     const widgetCode = getWidgetCode(flow?.id, flow?.name, autoLogin);
@@ -83,7 +83,7 @@ const ApiModal = forwardRef(
       pythonCode,
     ];
     const [tabs, setTabs] = useState(
-      createTabsArray(codesArray, includeWebhook)
+      createTabsArray(codesArray, includeWebhook),
     );
 
     const canShowTweaks =
@@ -132,7 +132,7 @@ const ApiModal = forwardRef(
               buildTweakObject(
                 nodeId,
                 element.data.node.template[templateField].value,
-                element.data.node.template[templateField]
+                element.data.node.template[templateField],
               );
             }
           });
@@ -149,7 +149,7 @@ const ApiModal = forwardRef(
     async function buildTweakObject(
       tw: string,
       changes: string | string[] | boolean | number | Object[] | Object,
-      template: TemplateVariableType
+      template: TemplateVariableType,
     ) {
       changes = getChangesType(changes, template);
 
@@ -191,7 +191,7 @@ const ApiModal = forwardRef(
         flow?.id,
         autoLogin,
         cloneTweak,
-        flow?.endpoint_name
+        flow?.endpoint_name,
       );
       const pythonCode = getPythonCode(flow?.name, cloneTweak);
       const widgetCode = getWidgetCode(flow?.id, flow?.name, autoLogin);
@@ -235,7 +235,7 @@ const ApiModal = forwardRef(
         </BaseModal.Content>
       </BaseModal>
     );
-  }
+  },
 );
 
 export default ApiModal;
diff --git a/src/frontend/src/modals/apiModal/utils/check-can-build-tweak-object.ts b/src/frontend/src/modals/apiModal/utils/check-can-build-tweak-object.ts
index 592a812c4..5a859cae8 100644
--- a/src/frontend/src/modals/apiModal/utils/check-can-build-tweak-object.ts
+++ b/src/frontend/src/modals/apiModal/utils/check-can-build-tweak-object.ts
@@ -6,7 +6,7 @@ export const checkCanBuildTweakObject = (element, templateField) => {
     templateField.charAt(0) !== "_" &&
     element.data.node.template[templateField].show &&
     LANGFLOW_SUPPORTED_TYPES.has(
-      element.data.node.template[templateField].type
+      element.data.node.template[templateField].type,
     ) &&
     templateField !== "code"
   );
diff --git a/src/frontend/src/modals/apiModal/utils/get-changes-types.ts b/src/frontend/src/modals/apiModal/utils/get-changes-types.ts
index 7e295e358..e8e912ff3 100644
--- a/src/frontend/src/modals/apiModal/utils/get-changes-types.ts
+++ b/src/frontend/src/modals/apiModal/utils/get-changes-types.ts
@@ -3,7 +3,7 @@ import { convertArrayToObj } from "../../../utils/reactflowUtils";
 
 export const getChangesType = (
   changes: string | string[] | boolean | number | Object[] | Object,
-  template: TemplateVariableType
+  template: TemplateVariableType,
 ) => {
   if (typeof changes === "string" && template.type === "float") {
     changes = parseFloat(changes);
diff --git a/src/frontend/src/modals/apiModal/utils/get-curl-code.tsx b/src/frontend/src/modals/apiModal/utils/get-curl-code.tsx
index 40257d73d..c17118d1a 100644
--- a/src/frontend/src/modals/apiModal/utils/get-curl-code.tsx
+++ b/src/frontend/src/modals/apiModal/utils/get-curl-code.tsx
@@ -8,14 +8,14 @@ export function getCurlRunCode(
   flowId: string,
   isAuth: boolean,
   tweaksBuildedObject,
-  endpointName?: string
+  endpointName?: string,
 ): string {
   const tweaksObject = tweaksBuildedObject[0];
   // show the endpoint name in the curl command if it exists
   return `curl -X POST \\
     "${window.location.protocol}//${window.location.host}/api/v1/run/${
-    endpointName || flowId
-  }?stream=false" \\
+      endpointName || flowId
+    }?stream=false" \\
     -H 'Content-Type: application/json'\\${
       !isAuth ? `\n  -H 'x-api-key: <your api key>'\\` : ""
     }
diff --git a/src/frontend/src/modals/apiModal/utils/get-nodes-with-default-value.ts b/src/frontend/src/modals/apiModal/utils/get-nodes-with-default-value.ts
index c09efdcc0..dc4fbaffc 100644
--- a/src/frontend/src/modals/apiModal/utils/get-nodes-with-default-value.ts
+++ b/src/frontend/src/modals/apiModal/utils/get-nodes-with-default-value.ts
@@ -13,8 +13,8 @@ export const getNodesWithDefaultValue = (flow) => {
           templateField.charAt(0) !== "_" &&
           node.data.node.template[templateField]?.show &&
           LANGFLOW_SUPPORTED_TYPES.has(
-            node.data.node.template[templateField].type
-          )
+            node.data.node.template[templateField].type,
+          ),
       )
       .map((n, i) => {
         arrNodesWithValues.push(node["id"]);
diff --git a/src/frontend/src/modals/apiModal/utils/get-python-api-code.tsx b/src/frontend/src/modals/apiModal/utils/get-python-api-code.tsx
index a876b18c3..9aa946746 100644
--- a/src/frontend/src/modals/apiModal/utils/get-python-api-code.tsx
+++ b/src/frontend/src/modals/apiModal/utils/get-python-api-code.tsx
@@ -10,7 +10,7 @@ export default function getPythonApiCode(
   flowId: string,
   isAuth: boolean,
   tweaksBuildedObject: any[],
-  endpointName?: string
+  endpointName?: string,
 ): string {
   let tweaksString = "{}";
   if (tweaksBuildedObject && tweaksBuildedObject.length > 0) {
diff --git a/src/frontend/src/modals/apiModal/utils/get-python-code.tsx b/src/frontend/src/modals/apiModal/utils/get-python-code.tsx
index 846a4c6e9..734e16bbe 100644
--- a/src/frontend/src/modals/apiModal/utils/get-python-code.tsx
+++ b/src/frontend/src/modals/apiModal/utils/get-python-code.tsx
@@ -6,7 +6,7 @@
  */
 export default function getPythonCode(
   flowName: string,
-  tweaksBuildedObject: any[]
+  tweaksBuildedObject: any[],
 ): string {
   let tweaksString = "{}";
   if (tweaksBuildedObject && tweaksBuildedObject.length > 0) {
diff --git a/src/frontend/src/modals/apiModal/utils/get-value.ts b/src/frontend/src/modals/apiModal/utils/get-value.ts
index 8db7666bf..df8e5bdde 100644
--- a/src/frontend/src/modals/apiModal/utils/get-value.ts
+++ b/src/frontend/src/modals/apiModal/utils/get-value.ts
@@ -5,7 +5,7 @@ export const getValue = (
   value: string,
   node: NodeType,
   template: TemplateVariableType,
-  tweak: Object[]
+  tweak: Object[],
 ) => {
   let returnValue = value ?? "";
 
diff --git a/src/frontend/src/modals/apiModal/utils/get-widget-code.tsx b/src/frontend/src/modals/apiModal/utils/get-widget-code.tsx
index a05dc192a..0d3d02f91 100644
--- a/src/frontend/src/modals/apiModal/utils/get-widget-code.tsx
+++ b/src/frontend/src/modals/apiModal/utils/get-widget-code.tsx
@@ -6,7 +6,7 @@
 export default function getWidgetCode(
   flowId: string,
   flowName: string,
-  isAuth: boolean
+  isAuth: boolean,
 ): string {
   return `<script src="https://cdn.jsdelivr.net/gh/langflow-ai/langflow-embedded-chat@1.0_alpha/dist/build/static/js/bundle.min.js"></script>
 
diff --git a/src/frontend/src/modals/apiModal/utils/tabs-array.tsx b/src/frontend/src/modals/apiModal/utils/tabs-array.tsx
index adc15f932..deed73332 100644
--- a/src/frontend/src/modals/apiModal/utils/tabs-array.tsx
+++ b/src/frontend/src/modals/apiModal/utils/tabs-array.tsx
@@ -1,7 +1,7 @@
 export function createTabsArray(
   codes,
   includeWebhookCurl = false,
-  includeTweaks = false
+  includeTweaks = false,
 ) {
   const tabs = [
     {
diff --git a/src/frontend/src/modals/baseModal/index.tsx b/src/frontend/src/modals/baseModal/index.tsx
index 728a74895..7fab2f2f9 100644
--- a/src/frontend/src/modals/baseModal/index.tsx
+++ b/src/frontend/src/modals/baseModal/index.tsx
@@ -37,7 +37,7 @@ const Content: React.FC<ContentProps> = ({ children, overflowHidden }) => {
     <div
       className={cn(
         `flex w-full flex-grow flex-col transition-all duration-300`,
-        overflowHidden ? "overflow-hidden" : "overflow-visible"
+        overflowHidden ? "overflow-hidden" : "overflow-visible",
       )}
     >
       {children}
@@ -122,7 +122,7 @@ interface BaseModalProps {
     React.ReactElement<ContentProps>,
     React.ReactElement<HeaderProps>,
     React.ReactElement<TriggerProps>?,
-    React.ReactElement<FooterProps>?
+    React.ReactElement<FooterProps>?,
   ];
   open?: boolean;
   setOpen?: (open: boolean) => void;
@@ -158,16 +158,16 @@ function BaseModal({
   onSubmit,
 }: BaseModalProps) {
   const headerChild = React.Children.toArray(children).find(
-    (child) => (child as React.ReactElement).type === Header
+    (child) => (child as React.ReactElement).type === Header,
   );
   const triggerChild = React.Children.toArray(children).find(
-    (child) => (child as React.ReactElement).type === Trigger
+    (child) => (child as React.ReactElement).type === Trigger,
   );
   const ContentChild = React.Children.toArray(children).find(
-    (child) => (child as React.ReactElement).type === Content
+    (child) => (child as React.ReactElement).type === Content,
   );
   const ContentFooter = React.Children.toArray(children).find(
-    (child) => (child as React.ReactElement).type === Footer
+    (child) => (child as React.ReactElement).type === Footer,
   );
 
   let { minWidth, height } = switchCaseModalSize(size);
@@ -189,7 +189,7 @@ function BaseModal({
   const contentClasses = cn(
     minWidth,
     height,
-    "flex flex-col duration-300 overflow-hidden"
+    "flex flex-col duration-300 overflow-hidden",
   );
 
   //UPDATE COLORS AND STYLE CLASSSES
diff --git a/src/frontend/src/modals/confirmationModal/index.tsx b/src/frontend/src/modals/confirmationModal/index.tsx
index 9f8efa165..dd7437693 100644
--- a/src/frontend/src/modals/confirmationModal/index.tsx
+++ b/src/frontend/src/modals/confirmationModal/index.tsx
@@ -54,10 +54,10 @@ function ConfirmationModal({
   }, [modalOpen]);
 
   const triggerChild = React.Children.toArray(children).find(
-    (child) => (child as React.ReactElement).type === Trigger
+    (child) => (child as React.ReactElement).type === Trigger,
   );
   const ContentChild = React.Children.toArray(children).find(
-    (child) => (child as React.ReactElement).type === Content
+    (child) => (child as React.ReactElement).type === Content,
   );
 
   return (
diff --git a/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx b/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx
index 83590f409..14263a9c6 100644
--- a/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx
+++ b/src/frontend/src/modals/editNodeModal/hooks/use-column-defs.tsx
@@ -8,7 +8,7 @@ const useColumnDefs = (
   handleOnNewValue: (newValue: any, name: string) => void,
   handleOnChangeDb: (value: boolean, key: string) => void,
   changeAdvanced: (n: string) => void,
-  open: boolean
+  open: boolean,
 ) => {
   const columnDefs: ColDef[] = useMemo(
     () => [
@@ -76,7 +76,7 @@ const useColumnDefs = (
         cellClass: "no-border",
       },
     ],
-    [open, myData]
+    [open, myData],
   );
 
   return columnDefs;
diff --git a/src/frontend/src/modals/exportModal/index.tsx b/src/frontend/src/modals/exportModal/index.tsx
index 61edb6f67..8904f79be 100644
--- a/src/frontend/src/modals/exportModal/index.tsx
+++ b/src/frontend/src/modals/exportModal/index.tsx
@@ -46,7 +46,7 @@ const ExportModal = forwardRef(
                 is_component: false,
               },
               name!,
-              description
+              description,
             );
             setNoticeData({
               title: API_WARNING_NOTICE_ALERT,
@@ -63,7 +63,7 @@ const ExportModal = forwardRef(
                 is_component: false,
               }),
               name!,
-              description
+              description,
             );
           setOpen(false);
         }}
@@ -104,6 +104,6 @@ const ExportModal = forwardRef(
         <BaseModal.Footer submit={{ label: "Export" }} />
       </BaseModal>
     );
-  }
+  },
 );
 export default ExportModal;
diff --git a/src/frontend/src/modals/foldersModal/hooks/submit-folder.tsx b/src/frontend/src/modals/foldersModal/hooks/submit-folder.tsx
index c35d7c450..71a8ac944 100644
--- a/src/frontend/src/modals/foldersModal/hooks/submit-folder.tsx
+++ b/src/frontend/src/modals/foldersModal/hooks/submit-folder.tsx
@@ -33,7 +33,7 @@ const useFolderSubmit = (setOpen, folderToEdit) => {
             getFoldersApi(true);
             setOpen(false);
           }
-        }
+        },
       );
     } else {
       addFolder(data).then(
@@ -49,7 +49,7 @@ const useFolderSubmit = (setOpen, folderToEdit) => {
           setErrorData({
             title: `Error creating folder.`,
           });
-        }
+        },
       );
     }
   };
diff --git a/src/frontend/src/modals/genericModal/index.tsx b/src/frontend/src/modals/genericModal/index.tsx
index ac49a93e3..11bf1043f 100644
--- a/src/frontend/src/modals/genericModal/index.tsx
+++ b/src/frontend/src/modals/genericModal/index.tsx
@@ -83,7 +83,7 @@ export default function GenericModal({
     }
 
     const filteredWordsHighlight = new Set(
-      matches.filter((word) => !invalid_chars.includes(word))
+      matches.filter((word) => !invalid_chars.includes(word)),
     );
 
     setWordsHighlight(filteredWordsHighlight);
@@ -134,7 +134,7 @@ export default function GenericModal({
         // to the first key of the custom_fields object
         if (field_name === "") {
           field_name = Array.isArray(
-            apiReturn.data?.frontend_node?.custom_fields?.[""]
+            apiReturn.data?.frontend_node?.custom_fields?.[""],
           )
             ? apiReturn.data?.frontend_node?.custom_fields?.[""][0] ?? ""
             : apiReturn.data?.frontend_node?.custom_fields?.[""] ?? "";
@@ -205,11 +205,7 @@ export default function GenericModal({
         />
       </BaseModal.Header>
       <BaseModal.Content overflowHidden>
-        <div
-          className={classNames(
-            "rounded-lg border flex h-full w-full"
-          )}
-        >
+        <div className={classNames("rounded-lg border flex h-full w-full")}>
           {type === TypeModal.PROMPT && isEdit && !readonly ? (
             <Textarea
               id={"modal-" + id}
diff --git a/src/frontend/src/modals/newFlowModal/components/undrawCards/index.tsx b/src/frontend/src/modals/newFlowModal/components/undrawCards/index.tsx
index 0830086c1..d872fabe3 100644
--- a/src/frontend/src/modals/newFlowModal/components/undrawCards/index.tsx
+++ b/src/frontend/src/modals/newFlowModal/components/undrawCards/index.tsx
@@ -1,11 +1,11 @@
 /// <reference types="vite-plugin-svgr/client" />
 import { useLocation, useNavigate } from "react-router-dom";
-import TransferFiles from "../../../../assets/undraw_transfer_files_re_a2a9.svg?react";
-import APIRequest from "../../../../assets/undraw_real_time_analytics_re_yliv.svg?react";
-import PromptChaining from "../../../../assets/undraw_cloud_docs_re_xjht.svg?react";
-import ChatBot from "../../../../assets/undraw_chat_bot_re_e2gj.svg?react";
 import BlogPost from "../../../../assets/undraw_blog_post_re_fy5x.svg?react";
+import ChatBot from "../../../../assets/undraw_chat_bot_re_e2gj.svg?react";
+import PromptChaining from "../../../../assets/undraw_cloud_docs_re_xjht.svg?react";
+import APIRequest from "../../../../assets/undraw_real_time_analytics_re_yliv.svg?react";
 import BasicPrompt from "../../../../assets/undraw_short_bio_re_fmx0.svg?react";
+import TransferFiles from "../../../../assets/undraw_transfer_files_re_a2a9.svg?react";
 
 import {
   Card,
diff --git a/src/frontend/src/modals/newFlowModal/index.tsx b/src/frontend/src/modals/newFlowModal/index.tsx
index b5134ddec..37a6afeeb 100644
--- a/src/frontend/src/modals/newFlowModal/index.tsx
+++ b/src/frontend/src/modals/newFlowModal/index.tsx
@@ -32,7 +32,7 @@ export default function NewFlowModal({
               key={0}
               flow={
                 examples.find(
-                  (e) => e.name == "Basic Prompting (Hello, World)"
+                  (e) => e.name == "Basic Prompting (Hello, World)",
                 )!
               }
             />
diff --git a/src/frontend/src/modals/shareModal/index.tsx b/src/frontend/src/modals/shareModal/index.tsx
index 2086e877c..13d50f0a9 100644
--- a/src/frontend/src/modals/shareModal/index.tsx
+++ b/src/frontend/src/modals/shareModal/index.tsx
@@ -131,14 +131,14 @@ export default function ShareModal({
             title: "Error sharing " + is_component ? "component" : "flow",
             list: [err["response"]["data"]["detail"]],
           });
-        }
+        },
       );
     else
       updateFlowStore(
         flow!,
         getTagsIds(selectedTags, tags),
         sharePublic,
-        unavaliableNames.find((e) => e.name === name)!.id
+        unavaliableNames.find((e) => e.name === name)!.id,
       ).then(successShare, (err) => {
         setErrorData({
           title: "Error sharing " + is_component ? "component" : "flow",
@@ -205,7 +205,7 @@ export default function ShareModal({
         setOpen={internalSetOpen}
         onSubmit={() => {
           const isNameAvailable = !unavaliableNames.some(
-            (element) => element.name === name
+            (element) => element.name === name,
           );
 
           if (isNameAvailable) {
diff --git a/src/frontend/src/modals/shareModal/utils/get-tags-ids.tsx b/src/frontend/src/modals/shareModal/utils/get-tags-ids.tsx
index 1eb1c650e..364d310a5 100644
--- a/src/frontend/src/modals/shareModal/utils/get-tags-ids.tsx
+++ b/src/frontend/src/modals/shareModal/utils/get-tags-ids.tsx
@@ -1,6 +1,6 @@
 export default function getTagsIds(
   tags: string[],
-  tagListId: { name: string; id: string }[]
+  tagListId: { name: string; id: string }[],
 ) {
   return tags
     .map((tag) => tagListId.find((tagObj) => tagObj.name === tag))!
diff --git a/src/frontend/src/modals/textModal/index.tsx b/src/frontend/src/modals/textModal/index.tsx
index e94255704..59be5cb25 100644
--- a/src/frontend/src/modals/textModal/index.tsx
+++ b/src/frontend/src/modals/textModal/index.tsx
@@ -10,14 +10,14 @@ import JsonView from "react18-json-view";
 import "react18-json-view/src/dark.css";
 import "react18-json-view/src/style.css";
 import IconComponent from "../../components/genericIconComponent";
+import { Button } from "../../components/ui/button";
 import {
   CODE_DICT_DIALOG_SUBTITLE,
   TEXT_DIALOG_SUBTITLE,
 } from "../../constants/constants";
+import TextOutputView from "../../shared/components/textOutputView";
 import { useDarkStore } from "../../stores/darkStore";
 import BaseModal from "../baseModal";
-import TextOutputView from "../../shared/components/textOutputView";
-import { Button } from "../../components/ui/button";
 
 export default function TextModal({
   children,
diff --git a/src/frontend/src/pages/AdminPage/index.tsx b/src/frontend/src/pages/AdminPage/index.tsx
index fcb732498..80c36adff 100644
--- a/src/frontend/src/pages/AdminPage/index.tsx
+++ b/src/frontend/src/pages/AdminPage/index.tsx
@@ -53,7 +53,7 @@ export default function AdminPage() {
   const { userData } = useContext(AuthContext);
   const [totalRowsCount, setTotalRowsCount] = useState(0);
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
 
   // set null id
@@ -114,7 +114,7 @@ export default function AdminPage() {
       setFilterUserList(userList.current);
     } else {
       const filteredList = userList.current.filter((user: Users) =>
-        user.username.toLowerCase().includes(input.toLowerCase())
+        user.username.toLowerCase().includes(input.toLowerCase()),
       );
       setFilterUserList(filteredList);
     }
@@ -331,7 +331,7 @@ export default function AdminPage() {
                                 handleDisableUser(
                                   user.is_active,
                                   user.id,
-                                  user
+                                  user,
                                 );
                               }}
                             >
@@ -363,7 +363,7 @@ export default function AdminPage() {
                                 handleSuperUserEdit(
                                   user.is_superuser,
                                   user.id,
-                                  user
+                                  user,
                                 );
                               }}
                             >
diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
index 437cce1ae..70f013f83 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
@@ -60,19 +60,19 @@ export default function Page({
 }): JSX.Element {
   const uploadFlow = useFlowsManagerStore((state) => state.uploadFlow);
   const autoSaveCurrentFlow = useFlowsManagerStore(
-    (state) => state.autoSaveCurrentFlow
+    (state) => state.autoSaveCurrentFlow,
   );
   const types = useTypesStore((state) => state.types);
   const templates = useTypesStore((state) => state.templates);
   const setFilterEdge = useFlowStore((state) => state.setFilterEdge);
   const reactFlowWrapper = useRef<HTMLDivElement>(null);
   const [showCanvas, setSHowCanvas] = useState(
-    Object.keys(templates).length > 0 && Object.keys(types).length > 0
+    Object.keys(templates).length > 0 && Object.keys(types).length > 0,
   );
 
   const reactFlowInstance = useFlowStore((state) => state.reactFlowInstance);
   const setReactFlowInstance = useFlowStore(
-    (state) => state.setReactFlowInstance
+    (state) => state.setReactFlowInstance,
   );
   const nodes = useFlowStore((state) => state.nodes);
   const edges = useFlowStore((state) => state.edges);
@@ -89,10 +89,10 @@ export default function Page({
   const paste = useFlowStore((state) => state.paste);
   const resetFlow = useFlowStore((state) => state.resetFlow);
   const lastCopiedSelection = useFlowStore(
-    (state) => state.lastCopiedSelection
+    (state) => state.lastCopiedSelection,
   );
   const setLastCopiedSelection = useFlowStore(
-    (state) => state.setLastCopiedSelection
+    (state) => state.setLastCopiedSelection,
   );
   const onConnect = useFlowStore((state) => state.onConnect);
   const currentFlowId = useFlowsManagerStore((state) => state.currentFlowId);
@@ -115,7 +115,7 @@ export default function Page({
         clonedSelection!,
         clonedNodes,
         clonedEdges,
-        getRandomName()
+        getRandomName(),
       );
       const newGroupNode = generateNodeFromFlow(newFlow, getNodeId);
       // const newEdges = reconnectEdges(newGroupNode, removedEdges);
@@ -123,8 +123,8 @@ export default function Page({
         ...clonedNodes.filter(
           (oldNodes) =>
             !clonedSelection?.nodes.some(
-              (selectionNode) => selectionNode.id === oldNodes.id
-            )
+              (selectionNode) => selectionNode.id === oldNodes.id,
+            ),
         ),
         newGroupNode,
       ]);
@@ -211,7 +211,7 @@ export default function Page({
         {
           x: position.current.x,
           y: position.current.y,
-        }
+        },
       );
     }
   }
@@ -292,7 +292,7 @@ export default function Page({
 
   useEffect(() => {
     setSHowCanvas(
-      Object.keys(templates).length > 0 && Object.keys(types).length > 0
+      Object.keys(templates).length > 0 && Object.keys(types).length > 0,
     );
   }, [templates, types]);
 
@@ -301,7 +301,7 @@ export default function Page({
       takeSnapshot();
       onConnect(params);
     },
-    [takeSnapshot, onConnect]
+    [takeSnapshot, onConnect],
   );
 
   const onNodeDragStart: NodeDragHandler = useCallback(() => {
@@ -342,7 +342,7 @@ export default function Page({
 
         // Extract the data from the drag event and parse it as a JSON object
         const data: { type: string; node?: APIClassType } = JSON.parse(
-          event.dataTransfer.getData("nodedata")
+          event.dataTransfer.getData("nodedata"),
         );
 
         const newId = getNodeId(data.type);
@@ -358,7 +358,7 @@ export default function Page({
         };
         paste(
           { nodes: [newNode], edges: [] },
-          { x: event.clientX, y: event.clientY }
+          { x: event.clientX, y: event.clientY },
         );
       } else if (event.dataTransfer.types.some((types) => types === "Files")) {
         takeSnapshot();
@@ -387,7 +387,7 @@ export default function Page({
       }
     },
     // Specify dependencies for useCallback
-    [getNodeId, setNodes, takeSnapshot, paste]
+    [getNodeId, setNodes, takeSnapshot, paste],
   );
 
   const onEdgeUpdateStart = useCallback(() => {
@@ -403,7 +403,7 @@ export default function Page({
         setEdges((els) => updateEdge(oldEdge, newConnection, els));
       }
     },
-    [setEdges]
+    [setEdges],
   );
 
   const onEdgeUpdateEnd = useCallback((_, edge: Edge): void => {
@@ -436,7 +436,7 @@ export default function Page({
     (flow: OnSelectionChangeParams): void => {
       setLastSelection(flow);
     },
-    []
+    [],
   );
 
   const onPaneClick = useCallback((flow) => {
diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/utils/get-random-name.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/utils/get-random-name.tsx
index a58b83ec3..d3bcf4d55 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/utils/get-random-name.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/utils/get-random-name.tsx
@@ -5,7 +5,7 @@ import { toTitleCase } from "../../../../../utils/utils";
 export default function getRandomName(
   retry: number = 0,
   noSpace: boolean = false,
-  maxRetries: number = 3
+  maxRetries: number = 3,
 ): string {
   const left: string[] = ADJECTIVES;
   const right: string[] = NOUNS;
diff --git a/src/frontend/src/pages/FlowPage/components/SelectionMenuComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/SelectionMenuComponent/index.tsx
index bb0979411..9d940b3c6 100644
--- a/src/frontend/src/pages/FlowPage/components/SelectionMenuComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/SelectionMenuComponent/index.tsx
@@ -1,9 +1,9 @@
 import { useEffect, useState } from "react";
 import { NodeToolbar } from "reactflow";
+import { Button } from "../../../../components/ui/button";
 import { GradientGroup } from "../../../../icons/GradientSparkles";
 import useFlowStore from "../../../../stores/flowStore";
 import { validateSelection } from "../../../../utils/reactflowUtils";
-import { Button } from "../../../../components/ui/button";
 export default function SelectionMenu({
   onClick,
   nodes,
diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
index ef446f082..32380b842 100644
--- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
@@ -41,7 +41,7 @@ export default function ExtraSidebar(): JSX.Element {
   const [search, setSearch] = useState("");
   function onDragStart(
     event: React.DragEvent<any>,
-    data: { type: string; node?: APIClassType }
+    data: { type: string; node?: APIClassType },
   ): void {
     //start drag event
     var crt = event.currentTarget.cloneNode(true);
@@ -67,7 +67,7 @@ export default function ExtraSidebar(): JSX.Element {
         let keys = Object.keys(data[d]).filter(
           (nd) =>
             nd.toLowerCase().includes(e.toLowerCase()) ||
-            data[d][nd].display_name?.toLowerCase().includes(e.toLowerCase())
+            data[d][nd].display_name?.toLowerCase().includes(e.toLowerCase()),
         );
         keys.forEach((element) => {
           ret[d][element] = data[d][element];
@@ -134,7 +134,7 @@ export default function ExtraSidebar(): JSX.Element {
 
             if (filtered.some((x) => x !== "")) {
               let keys = Object.keys(dataClone[d]).filter((nd) =>
-                filtered.includes(nd)
+                filtered.includes(nd),
               );
               Object.keys(dataClone[d]).forEach((element) => {
                 if (!keys.includes(element)) {
@@ -171,7 +171,7 @@ export default function ExtraSidebar(): JSX.Element {
 
             if (filtered.some((x) => x !== "")) {
               let keys = Object.keys(dataClone[d]).filter((nd) =>
-                filtered.includes(nd)
+                filtered.includes(nd),
               );
               Object.keys(dataClone[d]).forEach((element) => {
                 if (!keys.includes(element)) {
@@ -200,7 +200,7 @@ export default function ExtraSidebar(): JSX.Element {
             "extra-side-bar-buttons gap-[4px] text-sm font-semibold",
             !hasApiKey || !validApiKey || !hasStore
               ? "button-disable cursor-default text-muted-foreground"
-              : ""
+              : "",
           )}
         >
           <IconComponent
@@ -209,14 +209,14 @@ export default function ExtraSidebar(): JSX.Element {
               "-m-0.5 -ml-1 h-6 w-6",
               !hasApiKey || !validApiKey || !hasStore
                 ? "extra-side-bar-save-disable"
-                : ""
+                : "",
             )}
           />
           Share
         </button>
       </ShareModal>
     ),
-    [hasApiKey, validApiKey, currentFlow, hasStore]
+    [hasApiKey, validApiKey, currentFlow, hasStore],
   );
 
   const ExportMemo = useMemo(
@@ -227,7 +227,7 @@ export default function ExtraSidebar(): JSX.Element {
         </button>
       </ExportModal>
     ),
-    []
+    [],
   );
 
   const getIcon = useMemo(() => {
@@ -311,8 +311,8 @@ export default function ExtraSidebar(): JSX.Element {
                       .sort((a, b) =>
                         sensitiveSort(
                           dataFilter[SBSectionName][a].display_name,
-                          dataFilter[SBSectionName][b].display_name
-                        )
+                          dataFilter[SBSectionName][b].display_name,
+                        ),
                       )
                       .map((SBItemName: string, index) => (
                         <ShadTooltip
@@ -356,7 +356,7 @@ export default function ExtraSidebar(): JSX.Element {
               </>
             ) : (
               <div key={index}></div>
-            )
+            ),
           )}{" "}
         <ParentDisclosureComponent
           defaultOpen={search.length !== 0 || getFilterEdge.length !== 0}
@@ -393,8 +393,8 @@ export default function ExtraSidebar(): JSX.Element {
                         .sort((a, b) =>
                           sensitiveSort(
                             dataFilter[SBSectionName][a].display_name,
-                            dataFilter[SBSectionName][b].display_name
-                          )
+                            dataFilter[SBSectionName][b].display_name,
+                          ),
                         )
                         .map((SBItemName: string, index) => (
                           <ShadTooltip
@@ -468,7 +468,7 @@ export default function ExtraSidebar(): JSX.Element {
                 </>
               ) : (
                 <div key={index}></div>
-              )
+              ),
             )}
         </ParentDisclosureComponent>
       </div>
diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/sideBarDraggableComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/sideBarDraggableComponent/index.tsx
index a709929db..ed92defb9 100644
--- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/sideBarDraggableComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/sideBarDraggableComponent/index.tsx
@@ -37,11 +37,11 @@ export const SidebarDraggableComponent = forwardRef(
       onDragStart: DragEventHandler<HTMLDivElement>;
       official: boolean;
     },
-    ref
+    ref,
   ) => {
     const [open, setOpen] = useState(false);
     const deleteComponent = useFlowsManagerStore(
-      (state) => state.deleteComponent
+      (state) => state.deleteComponent,
     );
 
     const version = useDarkStore((state) => state.version);
@@ -67,8 +67,8 @@ export const SidebarDraggableComponent = forwardRef(
           downloadNode(
             createFlowComponent(
               { id: getNodeId(type), type, node: apiClass },
-              version
-            )
+              version,
+            ),
           );
           break;
         case "delete":
@@ -104,7 +104,7 @@ export const SidebarDraggableComponent = forwardRef(
             onDragStart={onDragStart}
             onDragEnd={() => {
               document.body.removeChild(
-                document.getElementsByClassName("cursor-grabbing")[0]
+                document.getElementsByClassName("cursor-grabbing")[0],
               );
             }}
           >
@@ -157,7 +157,7 @@ export const SidebarDraggableComponent = forwardRef(
         </div>
       </Select>
     );
-  }
+  },
 );
 
 export default SidebarDraggableComponent;
diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
index b8055f663..dfbd0a915 100644
--- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
@@ -50,7 +50,7 @@ export default function NodeToolbarComponent({
   const [showconfirmShare, setShowconfirmShare] = useState(false);
   const [showOverrideModal, setShowOverrideModal] = useState(false);
   const [flowComponent, setFlowComponent] = useState<FlowType>(
-    createFlowComponent(cloneDeep(data), version)
+    createFlowComponent(cloneDeep(data), version),
   );
   const preventDefault = true;
   const isMac = navigator.platform.toUpperCase().includes("MAC");
@@ -67,7 +67,7 @@ export default function NodeToolbarComponent({
         data.node.template[templateField]?.type === "Any" ||
         data.node.template[templateField]?.type === "int" ||
         data.node.template[templateField]?.type === "dict" ||
-        data.node.template[templateField]?.type === "NestedDict")
+        data.node.template[templateField]?.type === "NestedDict"),
   ).length;
 
   const hasStore = useStoreStore((state) => state.hasStore);
@@ -220,7 +220,7 @@ export default function NodeToolbarComponent({
   const updateNodeInternals = useUpdateNodeInternals();
 
   const setLastCopiedSelection = useFlowStore(
-    (state) => state.setLastCopiedSelection
+    (state) => state.setLastCopiedSelection,
   );
 
   const setSuccessData = useAlertStore((state) => state.setSuccessData);
@@ -295,7 +295,7 @@ export default function NodeToolbarComponent({
           edges,
           setNodes,
           setEdges,
-          data.node?.outputs
+          data.node?.outputs,
         );
         break;
       case "override":
@@ -322,14 +322,14 @@ export default function NodeToolbarComponent({
             y: 10,
             paneX: nodes.find((node) => node.id === data.id)?.position.x,
             paneY: nodes.find((node) => node.id === data.id)?.position.y,
-          }
+          },
         );
         break;
     }
   };
 
   const isSaved = flows.some((flow) =>
-    Object.values(flow).includes(data.node?.display_name!)
+    Object.values(flow).includes(data.node?.display_name!),
   );
 
   function displayShortcut({
@@ -347,7 +347,7 @@ export default function NodeToolbarComponent({
       }
     });
     const filteredShortcut = fixedShortcut.filter(
-      (key) => !key.toLowerCase().includes("shift")
+      (key) => !key.toLowerCase().includes("shift"),
     );
     let shortcutWPlus: string[] = [];
     if (!hasShift) shortcutWPlus = filteredShortcut.join("+").split(" ");
@@ -371,7 +371,7 @@ export default function NodeToolbarComponent({
   const setNode = useFlowStore((state) => state.setNode);
 
   const handleOnNewValue = (
-    newValue: string | string[] | boolean | Object[]
+    newValue: string | string[] | boolean | Object[],
   ): void => {
     if (data.node!.template[name].value !== newValue) {
       takeSnapshot();
@@ -427,8 +427,8 @@ export default function NodeToolbarComponent({
             <ShadTooltip
               content={displayShortcut(
                 shortcuts.find(
-                  ({ name }) => name.split(" ")[0].toLowerCase() === "code"
-                )!
+                  ({ name }) => name.split(" ")[0].toLowerCase() === "code",
+                )!,
               )}
               side="top"
             >
@@ -447,8 +447,8 @@ export default function NodeToolbarComponent({
             <ShadTooltip
               content={displayShortcut(
                 shortcuts.find(
-                  ({ name }) => name.split(" ")[0].toLowerCase() === "advanced"
-                )!
+                  ({ name }) => name.split(" ")[0].toLowerCase() === "advanced",
+                )!,
               )}
               side="top"
             >
@@ -487,14 +487,14 @@ export default function NodeToolbarComponent({
           <ShadTooltip
             content={displayShortcut(
               shortcuts.find(
-                ({ name }) => name.split(" ")[0].toLowerCase() === "freeze"
-              )!
+                ({ name }) => name.split(" ")[0].toLowerCase() === "freeze",
+              )!,
             )}
             side="top"
           >
             <button
               className={classNames(
-                "relative -ml-px inline-flex items-center bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10"
+                "relative -ml-px inline-flex items-center bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10",
               )}
               onClick={(event) => {
                 event.preventDefault();
@@ -515,7 +515,7 @@ export default function NodeToolbarComponent({
                 className={cn(
                   "h-4 w-4 transition-all",
                   // TODO UPDATE THIS COLOR TO BE A VARIABLE
-                  frozen ? "animate-wiggle text-ice" : ""
+                  frozen ? "animate-wiggle text-ice" : "",
                 )}
               />
             </button>
@@ -543,7 +543,7 @@ export default function NodeToolbarComponent({
                   <div
                     data-testid="more-options-modal"
                     className={classNames(
-                      "relative -ml-px inline-flex h-8 w-[31px] items-center rounded-r-md bg-background text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10"
+                      "relative -ml-px inline-flex h-8 w-[31px] items-center rounded-r-md bg-background text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10",
                     )}
                   >
                     <IconComponent
diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/toolbarSelectItem/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/toolbarSelectItem/index.tsx
index 82f88007f..377bc4cc4 100644
--- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/toolbarSelectItem/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/toolbarSelectItem/index.tsx
@@ -19,7 +19,7 @@ export default function ToolbarSelectItem({
     }
   });
   const filteredShortcut = fixedShortcut.filter(
-    (key) => !key.toLowerCase().includes("shift")
+    (key) => !key.toLowerCase().includes("shift"),
   );
   let shortcutWPlus: string[] = [];
   if (!hasShift) shortcutWPlus = filteredShortcut.join("+").split(" ");
diff --git a/src/frontend/src/pages/FlowPage/index.tsx b/src/frontend/src/pages/FlowPage/index.tsx
index e5a67bd35..49fdb1eca 100644
--- a/src/frontend/src/pages/FlowPage/index.tsx
+++ b/src/frontend/src/pages/FlowPage/index.tsx
@@ -10,7 +10,7 @@ import ExtraSidebar from "./components/extraSidebarComponent";
 
 export default function FlowPage({ view }: { view?: boolean }): JSX.Element {
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
   const version = useDarkStore((state) => state.version);
   const setOnFlowPage = useFlowStore((state) => state.setOnFlowPage);
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-delete-multiple.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-delete-multiple.tsx
index af78db50d..395088193 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-delete-multiple.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-delete-multiple.tsx
@@ -9,7 +9,7 @@ const useDeleteMultipleFlows = (
   myCollectionId,
   getFolderById,
   setSuccessData,
-  setErrorData
+  setErrorData,
 ) => {
   const handleDeleteMultiple = useCallback(() => {
     removeFlow(selectedFlowsComponentsCards)
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-filtered-flows.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-filtered-flows.tsx
index b391d9c8e..96b1757ff 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-filtered-flows.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-filtered-flows.tsx
@@ -4,7 +4,7 @@ import { useEffect } from "react";
 const useFilteredFlows = (
   flowsFromFolder,
   searchFlowsComponents,
-  setAllFlows
+  setAllFlows,
 ) => {
   useEffect(() => {
     const newFlows = cloneDeep(flowsFromFolder || []);
@@ -13,7 +13,7 @@ const useFilteredFlows = (
         f.name.toLowerCase().includes(searchFlowsComponents.toLowerCase()) ||
         f.description
           .toLowerCase()
-          .includes(searchFlowsComponents.toLowerCase())
+          .includes(searchFlowsComponents.toLowerCase()),
     );
 
     if (searchFlowsComponents === "") {
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-duplicate.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-duplicate.tsx
index 97e966b91..fc49fc0d1 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-duplicate.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-duplicate.tsx
@@ -12,16 +12,16 @@ const useDuplicateFlows = (
   setSuccessData,
   setSelectedFlowsComponentsCards,
   handleSelectAll,
-  cardTypes
+  cardTypes,
 ) => {
   const handleDuplicate = useCallback(() => {
     Promise.all(
       selectedFlowsComponentsCards.map((selectedFlow) =>
         addFlow(
           true,
-          allFlows.find((flow) => flow.id === selectedFlow)
-        )
-      )
+          allFlows.find((flow) => flow.id === selectedFlow),
+        ),
+      ),
     ).then(() => {
       resetFilter();
       getFoldersApi(true);
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-export.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-export.tsx
index a816c8f95..8edabc146 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-export.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-export.tsx
@@ -9,7 +9,7 @@ const useExportFlows = (
   setSuccessData,
   setSelectedFlowsComponentsCards,
   handleSelectAll,
-  cardTypes
+  cardTypes,
 ) => {
   const handleExport = useCallback(() => {
     selectedFlowsComponentsCards.forEach((selectedFlowId) => {
@@ -26,7 +26,7 @@ const useExportFlows = (
             is_component: false,
           }),
           selectedFlow.name,
-          selectedFlow.description
+          selectedFlow.description,
         );
       }
     });
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-select-all.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-select-all.tsx
index 5b20a4ddc..a81515e0a 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-select-all.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-handle-select-all.tsx
@@ -16,7 +16,7 @@ const useSelectAll = (flowsFromFolder, getValues, setValue) => {
         setValue(key, false);
       });
     },
-    [flowsFromFolder, getValues, setValue]
+    [flowsFromFolder, getValues, setValue],
   );
 
   return { handleSelectAll };
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-select-options-change.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-select-options-change.tsx
index b19ec4f4f..56dc204c7 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-select-options-change.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-select-options-change.tsx
@@ -5,7 +5,7 @@ const useSelectOptionsChange = (
   setErrorData,
   setOpenDelete,
   handleDuplicate,
-  handleExport
+  handleExport,
 ) => {
   const handleSelectOptionsChange = useCallback(
     (action) => {
@@ -31,7 +31,7 @@ const useSelectOptionsChange = (
       setOpenDelete,
       handleDuplicate,
       handleExport,
-    ]
+    ],
   );
 
   return { handleSelectOptionsChange };
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-selected-flows.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-selected-flows.tsx
index aa70b025f..b6f00934e 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-selected-flows.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/hooks/use-selected-flows.tsx
@@ -2,7 +2,7 @@ import { useEffect } from "react";
 
 const useSelectedFlows = (
   entireFormValues,
-  setSelectedFlowsComponentsCards
+  setSelectedFlowsComponentsCards,
 ) => {
   useEffect(() => {
     if (!entireFormValues || Object.keys(entireFormValues).length === 0) return;
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx
index 81d2aa18d..af13e2bb4 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx
@@ -40,22 +40,22 @@ export default function ComponentsComponent({
   const allFlows = useFlowsManagerStore((state) => state.allFlows);
 
   const flowsFromFolder = useFolderStore(
-    (state) => state.selectedFolder?.flows
+    (state) => state.selectedFolder?.flows,
   );
 
   const setSuccessData = useAlertStore((state) => state.setSuccessData);
   const setErrorData = useAlertStore((state) => state.setErrorData);
   const [openDelete, setOpenDelete] = useState(false);
   const searchFlowsComponents = useFlowsManagerStore(
-    (state) => state.searchFlowsComponents
+    (state) => state.searchFlowsComponents,
   );
 
   const setSelectedFlowsComponentsCards = useFlowsManagerStore(
-    (state) => state.setSelectedFlowsComponentsCards
+    (state) => state.setSelectedFlowsComponentsCards,
   );
 
   const selectedFlowsComponentsCards = useFlowsManagerStore(
-    (state) => state.selectedFlowsComponentsCards
+    (state) => state.selectedFlowsComponentsCards,
   );
 
   const [handleFileDrop] = useFileDrop(uploadFlow, type)!;
@@ -109,7 +109,7 @@ export default function ComponentsComponent({
   const { handleSelectAll } = useSelectAll(
     flowsFromFolder,
     getValues,
-    setValue
+    setValue,
   );
 
   const { handleDuplicate } = useDuplicateFlows(
@@ -124,7 +124,7 @@ export default function ComponentsComponent({
     setSuccessData,
     setSelectedFlowsComponentsCards,
     handleSelectAll,
-    cardTypes
+    cardTypes,
   );
 
   const version = useDarkStore((state) => state.version);
@@ -138,7 +138,7 @@ export default function ComponentsComponent({
     setSuccessData,
     setSelectedFlowsComponentsCards,
     handleSelectAll,
-    cardTypes
+    cardTypes,
   );
 
   const { handleSelectOptionsChange } = useSelectOptionsChange(
@@ -146,7 +146,7 @@ export default function ComponentsComponent({
     setErrorData,
     setOpenDelete,
     handleDuplicate,
-    handleExport
+    handleExport,
   );
 
   const { handleDeleteMultiple } = useDeleteMultipleFlows(
@@ -158,21 +158,21 @@ export default function ComponentsComponent({
     myCollectionId,
     getFolderById,
     setSuccessData,
-    setErrorData
+    setErrorData,
   );
 
   useSelectedFlows(entireFormValues, setSelectedFlowsComponentsCards);
 
   const descriptionModal = useDescriptionModal(
     selectedFlowsComponentsCards,
-    type
+    type,
   );
 
   const getTotalRowsCount = () => {
     if (type === "all") return allFlows?.length;
 
     return allFlows?.filter(
-      (f) => (f.is_component ?? false) === (type === "component")
+      (f) => (f.is_component ?? false) === (type === "component"),
     )?.length;
   };
 
diff --git a/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx b/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx
index b023216ab..c6ceb44c7 100644
--- a/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx
+++ b/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx
@@ -11,7 +11,7 @@ const HeaderTabsSearchComponent = ({}: HeaderTabsSearchComponentProps) => {
   const [inputValue, setInputValue] = useState("");
 
   const setSearchFlowsComponents = useFlowsManagerStore(
-    (state) => state.setSearchFlowsComponents
+    (state) => state.setSearchFlowsComponents,
   );
 
   return (
diff --git a/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/inputSearchComponent/index.tsx b/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/inputSearchComponent/index.tsx
index 1d85ed84b..898ad84a8 100644
--- a/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/inputSearchComponent/index.tsx
+++ b/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/inputSearchComponent/index.tsx
@@ -23,7 +23,7 @@ const InputSearchComponent = ({
   const pagePath = window.location.pathname;
   const allFlows = useFlowsManagerStore((state) => state.allFlows);
   const searchFlowsComponents = useFlowsManagerStore(
-    (state) => state.searchFlowsComponents
+    (state) => state.searchFlowsComponents,
   );
 
   const disableInputSearch =
diff --git a/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx b/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx
index 39add5211..6b4892d60 100644
--- a/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx
+++ b/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx
@@ -16,7 +16,7 @@ import useDropdownOptions from "../../hooks/use-dropdown-options";
 export default function HomePage(): JSX.Element {
   const uploadFlow = useFlowsManagerStore((state) => state.uploadFlow);
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
 
   const location = useLocation();
diff --git a/src/frontend/src/pages/MainPage/services/index.ts b/src/frontend/src/pages/MainPage/services/index.ts
index fbfc34389..3e1286d5e 100644
--- a/src/frontend/src/pages/MainPage/services/index.ts
+++ b/src/frontend/src/pages/MainPage/services/index.ts
@@ -30,12 +30,12 @@ export async function addFolder(data: AddFolderType): Promise<FolderType> {
 
 export async function updateFolder(
   body: FolderType,
-  folderId: string
+  folderId: string,
 ): Promise<FolderType> {
   try {
     const response = await api.patch(
       `${BASE_URL_API}folders/${folderId}`,
-      body
+      body,
     );
     return response?.data;
   } catch (error) {
@@ -68,7 +68,7 @@ export async function downloadFlowsFromFolders(folderId: string): Promise<{
 }> {
   try {
     const response = await api.get(
-      `${BASE_URL_API}folders/download/${folderId}`
+      `${BASE_URL_API}folders/download/${folderId}`,
     );
     if (response?.status !== 200) {
       throw new Error(`HTTP error! status: ${response?.status}`);
@@ -82,7 +82,7 @@ export async function downloadFlowsFromFolders(folderId: string): Promise<{
 }
 
 export async function uploadFlowsFromFolders(
-  flows: FormData
+  flows: FormData,
 ): Promise<FlowType[]> {
   try {
     const response = await api.post(`${BASE_URL_API}folders/upload/`, flows);
@@ -99,11 +99,11 @@ export async function uploadFlowsFromFolders(
 
 export async function moveFlowToFolder(
   flowId: string,
-  folderId: string
+  folderId: string,
 ): Promise<FlowType> {
   try {
     const response = await api.patch(
-      `${BASE_URL_API}folders/move_to_folder/${flowId}/${folderId}`
+      `${BASE_URL_API}folders/move_to_folder/${flowId}/${folderId}`,
     );
     return response?.data;
   } catch (error) {
diff --git a/src/frontend/src/pages/MainPage/utils/handle-download-folder.ts b/src/frontend/src/pages/MainPage/utils/handle-download-folder.ts
index d6a8e957c..6817622d0 100644
--- a/src/frontend/src/pages/MainPage/utils/handle-download-folder.ts
+++ b/src/frontend/src/pages/MainPage/utils/handle-download-folder.ts
@@ -11,7 +11,7 @@ export function handleDownloadFolderFn(folderId: string) {
     data.folder_description = folder?.description || "";
 
     const jsonString = `data:text/json;chatset=utf-8,${encodeURIComponent(
-      JSON.stringify(data)
+      JSON.stringify(data),
     )}`;
 
     const link = document.createElement("a");
diff --git a/src/frontend/src/pages/Playground/index.tsx b/src/frontend/src/pages/Playground/index.tsx
index d26147df6..4ea3cc506 100644
--- a/src/frontend/src/pages/Playground/index.tsx
+++ b/src/frontend/src/pages/Playground/index.tsx
@@ -11,7 +11,7 @@ export default function PlaygroundPage() {
   const currentFlow = useFlowsManagerStore((state) => state.currentFlow);
   const getFlowById = useFlowsManagerStore((state) => state.getFlowById);
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
   const currentFlowId = useFlowsManagerStore((state) => state.currentFlowId);
   const setCurrentFlow = useFlowsManagerStore((state) => state.setCurrentFlow);
diff --git a/src/frontend/src/pages/ProfileSettingsPage/index.tsx b/src/frontend/src/pages/ProfileSettingsPage/index.tsx
index c1635dc9e..5cedc5841 100644
--- a/src/frontend/src/pages/ProfileSettingsPage/index.tsx
+++ b/src/frontend/src/pages/ProfileSettingsPage/index.tsx
@@ -24,11 +24,11 @@ import { gradients } from "../../utils/styleUtils";
 import GradientChooserComponent from "../SettingsPage/pages/GeneralPage/components/ProfilePictureForm/components/profilePictureChooserComponent";
 export default function ProfileSettingsPage(): JSX.Element {
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
 
   const [inputState, setInputState] = useState<patchUserInputStateType>(
-    CONTROL_PATCH_USER_STATE
+    CONTROL_PATCH_USER_STATE,
   );
 
   // set null id
diff --git a/src/frontend/src/pages/SettingsPage/index.tsx b/src/frontend/src/pages/SettingsPage/index.tsx
index e6eb41b2f..2e8f49cfc 100644
--- a/src/frontend/src/pages/SettingsPage/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/index.tsx
@@ -8,7 +8,7 @@ import useFlowsManagerStore from "../../stores/flowsManagerStore";
 export default function SettingsPage(): JSX.Element {
   const pathname = location.pathname;
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
   useEffect(() => {
     setCurrentFlowId("");
diff --git a/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/hooks/use-handle-delete-key.tsx b/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/hooks/use-handle-delete-key.tsx
index 01b4b7415..74d5dae99 100644
--- a/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/hooks/use-handle-delete-key.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/hooks/use-handle-delete-key.tsx
@@ -10,7 +10,7 @@ const useDeleteApiKeys = (
   selectedRows,
   resetFilter,
   setSuccessData,
-  setErrorData
+  setErrorData,
 ) => {
   const handleDeleteKey = () => {
     Promise.all(selectedRows.map((selectedRow) => deleteApiKey(selectedRow)))
diff --git a/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/index.tsx b/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/index.tsx
index e5b224a58..af5280f72 100644
--- a/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/ApiKeysPage/index.tsx
@@ -25,7 +25,7 @@ export default function ApiKeysPage() {
     userData,
     setLoadingKeys,
     keysList,
-    setUserId
+    setUserId,
   );
 
   function resetFilter() {
@@ -36,7 +36,7 @@ export default function ApiKeysPage() {
     selectedRows,
     resetFilter,
     setSuccessData,
-    setErrorData
+    setErrorData,
   );
 
   const columnDefs = getColumnDefs();
diff --git a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/PasswordForm/index.tsx b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/PasswordForm/index.tsx
index d99752e7b..28edb2f09 100644
--- a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/PasswordForm/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/PasswordForm/index.tsx
@@ -17,7 +17,7 @@ type PasswordFormComponentProps = {
   handlePatchPassword: (
     password: string,
     cnfPassword: string,
-    handleInput: any
+    handleInput: any,
   ) => void;
 };
 const PasswordFormComponent = ({
diff --git a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/ProfilePictureForm/components/profilePictureChooserComponent/hooks/use-preload-images.tsx b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/ProfilePictureForm/components/profilePictureChooserComponent/hooks/use-preload-images.tsx
index 1948c9482..988af6ea9 100644
--- a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/ProfilePictureForm/components/profilePictureChooserComponent/hooks/use-preload-images.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/ProfilePictureForm/components/profilePictureChooserComponent/hooks/use-preload-images.tsx
@@ -14,8 +14,8 @@ const usePreloadImages = (profilePictures, setImagesLoaded) => {
             img.src = src;
             img.onload = resolve;
             img.onerror = resolve;
-          })
-      )
+          }),
+      ),
     );
   };
 
@@ -26,9 +26,9 @@ const usePreloadImages = (profilePictures, setImagesLoaded) => {
     Object.keys(profilePictures).flatMap((folder) =>
       profilePictures[folder].map((path) =>
         imageArray.push(
-          `${firstUrl}${BASE_URL_API}files/profile_pictures/${folder}/${path}`
-        )
-      )
+          `${firstUrl}${BASE_URL_API}files/profile_pictures/${folder}/${path}`,
+        ),
+      ),
     );
 
     preloadImages(imageArray).then(() => {
diff --git a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/StoreApiKeyForm/index.tsx b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/StoreApiKeyForm/index.tsx
index 1fbf34024..5bc5ea38b 100644
--- a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/StoreApiKeyForm/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/components/StoreApiKeyForm/index.tsx
@@ -47,8 +47,8 @@ const StoreApiKeyFormComponent = ({
               {(hasApiKey && !validApiKey
                 ? INVALID_API_KEY
                 : !hasApiKey
-                ? NO_API_KEY
-                : "") + INSERT_API_KEY}
+                  ? NO_API_KEY
+                  : "") + INSERT_API_KEY}
             </CardDescription>
           </CardHeader>
           <CardContent>
diff --git a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/index.tsx b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/index.tsx
index 917d61714..239103777 100644
--- a/src/frontend/src/pages/SettingsPage/pages/GeneralPage/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/GeneralPage/index.tsx
@@ -21,13 +21,13 @@ import StoreApiKeyFormComponent from "./components/StoreApiKeyForm";
 
 export default function GeneralPage() {
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
 
   const { scrollId } = useParams();
 
   const [inputState, setInputState] = useState<patchUserInputStateType>(
-    CONTROL_PATCH_USER_STATE
+    CONTROL_PATCH_USER_STATE,
   );
 
   const { autoLogin } = useContext(AuthContext);
@@ -48,7 +48,7 @@ export default function GeneralPage() {
   const { handlePatchPassword } = usePatchPassword(
     userData,
     setSuccessData,
-    setErrorData
+    setErrorData,
   );
 
   const { handleGetProfilePictures } = useGetProfilePictures(setErrorData);
@@ -57,7 +57,7 @@ export default function GeneralPage() {
     setSuccessData,
     setErrorData,
     userData,
-    setUserData
+    setUserData,
   );
 
   useScrollToElement(scrollId, setCurrentFlowId);
@@ -67,7 +67,7 @@ export default function GeneralPage() {
     setErrorData,
     setHasApiKey,
     setValidApiKey,
-    setLoadingApiKey
+    setLoadingApiKey,
   );
 
   function handleInput({
diff --git a/src/frontend/src/pages/SettingsPage/pages/GlobalVariablesPage/index.tsx b/src/frontend/src/pages/SettingsPage/pages/GlobalVariablesPage/index.tsx
index ba9c465d7..6f0dac836 100644
--- a/src/frontend/src/pages/SettingsPage/pages/GlobalVariablesPage/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/GlobalVariablesPage/index.tsx
@@ -14,13 +14,13 @@ import { useGlobalVariablesStore } from "../../../../stores/globalVariablesStore
 
 export default function GlobalVariablesPage() {
   const globalVariablesEntries = useGlobalVariablesStore(
-    (state) => state.globalVariablesEntries
+    (state) => state.globalVariablesEntries,
   );
   const removeGlobalVariable = useGlobalVariablesStore(
-    (state) => state.removeGlobalVariable
+    (state) => state.removeGlobalVariable,
   );
   const globalVariables = useGlobalVariablesStore(
-    (state) => state.globalVariables
+    (state) => state.globalVariables,
   );
   const setErrorData = useAlertStore((state) => state.setErrorData);
   const getVariableId = useGlobalVariablesStore((state) => state.getVariableId);
diff --git a/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/EditShortcutButton/index.tsx b/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/EditShortcutButton/index.tsx
index 05ea5b39d..883c99b34 100644
--- a/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/EditShortcutButton/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/EditShortcutButton/index.tsx
@@ -31,7 +31,7 @@ export default function EditShortcutButton({
       ? defaultShortcuts.find(
           (s) =>
             s.name.split(" ")[0].toLowerCase().toLowerCase() ===
-            shortcut[0]?.split(" ")[0].toLowerCase()
+            shortcut[0]?.split(" ")[0].toLowerCase(),
         )?.shortcut
       : "";
   const [key, setKey] = useState<string | null>(null);
@@ -50,7 +50,7 @@ export default function EditShortcutButton({
   }
 
   const setUniqueShortcut = useShortcutsStore(
-    (state) => state.updateUniqueShortcut
+    (state) => state.updateUniqueShortcut,
   );
 
   function editCombination(): void {
@@ -74,7 +74,7 @@ export default function EditShortcutButton({
         setShortcuts(newCombination);
         localStorage.setItem(
           "langflow-shortcuts",
-          JSON.stringify(newCombination)
+          JSON.stringify(newCombination),
         );
         setKey(null);
         setOpen(false);
@@ -116,7 +116,7 @@ export default function EditShortcutButton({
     const keysArr = keys.split(" ");
     let hasNewKey = false;
     return keysArr.some(
-      (k) => k.toLowerCase().trim() === keyToCompare.toLowerCase().trim()
+      (k) => k.toLowerCase().trim() === keyToCompare.toLowerCase().trim(),
     );
   }
 
@@ -137,7 +137,7 @@ export default function EditShortcutButton({
         if (checkForKeys(key, fixedKey)) return;
       }
       setKey((oldKey) =>
-        getFixedCombination({ oldKey: oldKey!, key: fixedKey })
+        getFixedCombination({ oldKey: oldKey!, key: fixedKey }),
       );
     }
 
diff --git a/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-gradient.tsx b/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-gradient.tsx
index 9adb923a7..ea61d4722 100644
--- a/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-gradient.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-gradient.tsx
@@ -9,7 +9,7 @@ const usePatchGradient = (
   setSuccessData,
   setErrorData,
   currentUserData,
-  setUserData
+  setUserData,
 ) => {
   const handlePatchGradient = async (gradient) => {
     try {
diff --git a/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-profile-picture.tsx b/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-profile-picture.tsx
index 537c579af..584300fdf 100644
--- a/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-profile-picture.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/hooks/use-patch-profile-picture.tsx
@@ -9,7 +9,7 @@ const usePatchProfilePicture = (
   setSuccessData,
   setErrorData,
   currentUserData,
-  setUserData
+  setUserData,
 ) => {
   const handlePatchProfilePicture = async (profile_picture) => {
     try {
diff --git a/src/frontend/src/pages/SettingsPage/pages/hooks/use-save-key.tsx b/src/frontend/src/pages/SettingsPage/pages/hooks/use-save-key.tsx
index bdd105fef..cf5871a26 100644
--- a/src/frontend/src/pages/SettingsPage/pages/hooks/use-save-key.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/hooks/use-save-key.tsx
@@ -11,7 +11,7 @@ const useSaveKey = (
   setErrorData,
   setHasApiKey,
   setValidApiKey,
-  setLoadingApiKey
+  setLoadingApiKey,
 ) => {
   const { storeApiKey } = useContext(AuthContext);
 
@@ -35,7 +35,7 @@ const useSaveKey = (
           setHasApiKey(false);
           setValidApiKey(false);
           setLoadingApiKey(false);
-        }
+        },
       );
     }
   };
diff --git a/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages.tsx b/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages.tsx
index f4de52cbb..d7f4d5202 100644
--- a/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages.tsx
@@ -5,7 +5,7 @@ const useRemoveMessages = (
   setSelectedRows,
   setSuccessData,
   setErrorData,
-  selectedRows
+  selectedRows,
 ) => {
   const deleteMessages = useMessagesStore((state) => state.removeMessages);
 
diff --git a/src/frontend/src/pages/SettingsPage/pages/messagesPage/index.tsx b/src/frontend/src/pages/SettingsPage/pages/messagesPage/index.tsx
index 61b084ad4..bb28ca1be 100644
--- a/src/frontend/src/pages/SettingsPage/pages/messagesPage/index.tsx
+++ b/src/frontend/src/pages/SettingsPage/pages/messagesPage/index.tsx
@@ -27,7 +27,7 @@ export default function MessagesPage() {
     setSelectedRows,
     setSuccessData,
     setErrorData,
-    selectedRows
+    selectedRows,
   );
 
   const { handleUpdate } = useUpdateMessage(setSuccessData, setErrorData);
@@ -61,7 +61,7 @@ export default function MessagesPage() {
           overlayNoRowsTemplate="No data available"
           onSelectionChanged={(event: SelectionChangedEvent) => {
             setSelectedRows(
-              event.api.getSelectedRows().map((row) => row.index)
+              event.api.getSelectedRows().map((row) => row.index),
             );
           }}
           rowSelection="multiple"
diff --git a/src/frontend/src/pages/StorePage/index.tsx b/src/frontend/src/pages/StorePage/index.tsx
index e3f5b56ce..926e6886d 100644
--- a/src/frontend/src/pages/StorePage/index.tsx
+++ b/src/frontend/src/pages/StorePage/index.tsx
@@ -46,7 +46,7 @@ export default function StorePage(): JSX.Element {
 
   const setErrorData = useAlertStore((state) => state.setErrorData);
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
   const currentFlowId = useFlowsManagerStore((state) => state.currentFlowId);
   const [loading, setLoading] = useState(true);
@@ -143,7 +143,7 @@ export default function StorePage(): JSX.Element {
           setTotalRowsCount(
             filteredCategories?.length === 0
               ? Number(res?.count ?? 0)
-              : res?.results?.length ?? 0
+              : res?.results?.length ?? 0,
           );
         }
       })
@@ -183,7 +183,7 @@ export default function StorePage(): JSX.Element {
           disabled={loading}
           className={cn(
             `${!validApiKey ? "animate-pulse border-error" : ""}`,
-            loading ? "cursor-not-allowed" : ""
+            loading ? "cursor-not-allowed" : "",
           )}
           variant="primary"
           onClick={() => {
diff --git a/src/frontend/src/pages/ViewPage/index.tsx b/src/frontend/src/pages/ViewPage/index.tsx
index 2e6ac9bac..5498b77bd 100644
--- a/src/frontend/src/pages/ViewPage/index.tsx
+++ b/src/frontend/src/pages/ViewPage/index.tsx
@@ -6,7 +6,7 @@ import Page from "../FlowPage/components/PageComponent";
 export default function ViewPage() {
   const currentFlow = useFlowsManagerStore((state) => state.currentFlow);
   const setCurrentFlowId = useFlowsManagerStore(
-    (state) => state.setCurrentFlowId
+    (state) => state.setCurrentFlowId,
   );
   const { id } = useParams();
 
diff --git a/src/frontend/src/routes.tsx b/src/frontend/src/routes.tsx
index 5623f0871..a1997e510 100644
--- a/src/frontend/src/routes.tsx
+++ b/src/frontend/src/routes.tsx
@@ -11,25 +11,25 @@ import MessagesPage from "./pages/SettingsPage/pages/messagesPage";
 const AdminPage = lazy(() => import("./pages/AdminPage"));
 const LoginAdminPage = lazy(() => import("./pages/AdminPage/LoginPage"));
 const ApiKeysPage = lazy(
-  () => import("./pages/SettingsPage/pages/ApiKeysPage")
+  () => import("./pages/SettingsPage/pages/ApiKeysPage"),
 );
 const DeleteAccountPage = lazy(() => import("./pages/DeleteAccountPage"));
 const FlowPage = lazy(() => import("./pages/FlowPage"));
 const LoginPage = lazy(() => import("./pages/LoginPage"));
 const MyCollectionComponent = lazy(
-  () => import("./pages/MainPage/components/myCollectionComponent")
+  () => import("./pages/MainPage/components/myCollectionComponent"),
 );
 const HomePage = lazy(() => import("./pages/MainPage/pages/mainPage"));
 const PlaygroundPage = lazy(() => import("./pages/Playground"));
 const SettingsPage = lazy(() => import("./pages/SettingsPage"));
 const GeneralPage = lazy(
-  () => import("./pages/SettingsPage/pages/GeneralPage")
+  () => import("./pages/SettingsPage/pages/GeneralPage"),
 );
 const GlobalVariablesPage = lazy(
-  () => import("./pages/SettingsPage/pages/GlobalVariablesPage")
+  () => import("./pages/SettingsPage/pages/GlobalVariablesPage"),
 );
 const ShortcutsPage = lazy(
-  () => import("./pages/SettingsPage/pages/ShortcutsPage")
+  () => import("./pages/SettingsPage/pages/ShortcutsPage"),
 );
 const SignUp = lazy(() => import("./pages/SignUpPage"));
 const StorePage = lazy(() => import("./pages/StorePage"));
diff --git a/src/frontend/src/stores/alertStore.ts b/src/frontend/src/stores/alertStore.ts
index e23a8d4e3..03a12050c 100644
--- a/src/frontend/src/stores/alertStore.ts
+++ b/src/frontend/src/stores/alertStore.ts
@@ -6,7 +6,7 @@ import { customStringify } from "../utils/reactflowUtils";
 
 const pushNotificationList = (
   list: AlertItemType[],
-  notification: AlertItemType
+  notification: AlertItemType,
 ) => {
   list.unshift(notification);
   return list;
@@ -147,7 +147,7 @@ const useAlertStore = create<AlertStoreType>((set, get) => ({
   removeFromNotificationList: (index: string) => {
     set({
       notificationList: get().notificationList.filter(
-        (item) => item.id !== index
+        (item) => item.id !== index,
       ),
     });
   },
@@ -160,7 +160,7 @@ const useAlertStore = create<AlertStoreType>((set, get) => ({
   removeFromTempNotificationList: (index: string) => {
     set({
       tempNotificationList: get().tempNotificationList.filter(
-        (item) => item.id !== index
+        (item) => item.id !== index,
       ),
     });
   },
diff --git a/src/frontend/src/stores/darkStore.ts b/src/frontend/src/stores/darkStore.ts
index 79f5518da..8c9c10951 100644
--- a/src/frontend/src/stores/darkStore.ts
+++ b/src/frontend/src/stores/darkStore.ts
@@ -36,7 +36,7 @@ export const useDarkStore = create<DarkStoreType>((set, get) => ({
         window.localStorage.setItem("githubStars", res?.toString() ?? "0");
         window.localStorage.setItem(
           "githubStarsLastUpdated",
-          new Date().toString()
+          new Date().toString(),
         );
         set(() => ({ stars: res, lastUpdated: new Date() }));
       });
diff --git a/src/frontend/src/stores/flowsManagerStore.ts b/src/frontend/src/stores/flowsManagerStore.ts
index 8006494bf..78444145c 100644
--- a/src/frontend/src/stores/flowsManagerStore.ts
+++ b/src/frontend/src/stores/flowsManagerStore.ts
@@ -87,12 +87,12 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
           if (dbData) {
             const { data, flows } = processFlows(dbData);
             const examples = flows.filter(
-              (flow) => flow.folder_id === starterFolderId
+              (flow) => flow.folder_id === starterFolderId,
             );
             get().setExamples(examples);
 
             const flowsWithoutStarterFolder = flows.filter(
-              (flow) => flow.folder_id !== starterFolderId
+              (flow) => flow.folder_id !== starterFolderId,
             );
 
             get().setFlows(flowsWithoutStarterFolder);
@@ -120,7 +120,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
     if (get().currentFlow) {
       get().saveFlow(
         { ...get().currentFlow!, data: { nodes, edges, viewport } },
-        true
+        true,
       );
     }
   },
@@ -146,7 +146,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
                   return updatedFlow;
                 }
                 return flow;
-              })
+              }),
             );
             //update tabs state
 
@@ -197,7 +197,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
     flow?: FlowType,
     override?: boolean,
     position?: XYPosition,
-    fromDragAndDrop?: boolean
+    fromDragAndDrop?: boolean,
   ): Promise<string | undefined> => {
     let flowData = flow
       ? processDataFromFlow(flow)
@@ -212,7 +212,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
         const newFlow = createNewFlow(
           flowData!,
           flow!,
-          folder_id || my_collection_id!
+          folder_id || my_collection_id!,
         );
         const { id } = await saveFlowToDatabase(newFlow);
         newFlow.id = id;
@@ -236,7 +236,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
       const newFlow = createNewFlow(
         flowData!,
         flow!,
-        folder_id || my_collection_id!
+        folder_id || my_collection_id!,
       );
 
       const newName = addVersionToDuplicates(newFlow, get().flows);
@@ -272,7 +272,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
         .getState()
         .paste(
           { nodes: flow!.data!.nodes, edges: flow!.data!.edges },
-          position ?? { x: 10, y: 10 }
+          position ?? { x: 10, y: 10 },
         );
     }
   },
@@ -282,7 +282,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
         multipleDeleteFlowsComponents(id)
           .then(() => {
             const { data, flows } = processFlows(
-              get().flows.filter((flow) => !id.includes(flow.id))
+              get().flows.filter((flow) => !id.includes(flow.id)),
             );
             get().setFlows(flows);
             set({ isLoading: false });
@@ -302,7 +302,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
           deleteFlowFromDatabase(id)
             .then(() => {
               const { data, flows } = processFlows(
-                get().flows.filter((flow) => flow.id !== id)
+                get().flows.filter((flow) => flow.id !== id),
               );
               get().setFlows(flows);
               set({ isLoading: false });
@@ -324,7 +324,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
     return new Promise<void>((resolve) => {
       let componentFlow = get().flows.find(
         (componentFlow) =>
-          componentFlow.is_component && componentFlow.name === key
+          componentFlow.is_component && componentFlow.name === key,
       );
 
       if (componentFlow) {
@@ -372,7 +372,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
               fileData,
               undefined,
               position,
-              true
+              true,
             );
             resolve(id);
           }
@@ -413,7 +413,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
     return get().addFlow(
       true,
       createFlowComponent(component, useDarkStore.getState().version),
-      override
+      override,
     );
   },
   takeSnapshot: () => {
@@ -434,7 +434,7 @@ const useFlowsManagerStore = create<FlowsManagerStoreType>((set, get) => ({
     if (pastLength > 0) {
       past[currentFlowId] = past[currentFlowId].slice(
         pastLength - defaultOptions.maxHistorySize + 1,
-        pastLength
+        pastLength,
       );
 
       past[currentFlowId].push(newState);
diff --git a/src/frontend/src/stores/foldersStore.tsx b/src/frontend/src/stores/foldersStore.tsx
index 8e42026b4..01db44247 100644
--- a/src/frontend/src/stores/foldersStore.tsx
+++ b/src/frontend/src/stores/foldersStore.tsx
@@ -18,18 +18,18 @@ export const useFolderStore = create<FoldersStoreType>((set, get) => ({
         getFolders().then(
           async (res) => {
             const foldersWithoutStarterProjects = res?.filter(
-              (folder) => folder.name !== STARTER_FOLDER_NAME
+              (folder) => folder.name !== STARTER_FOLDER_NAME,
             );
 
             const starterProjects = res?.find(
-              (folder) => folder.name === STARTER_FOLDER_NAME
+              (folder) => folder.name === STARTER_FOLDER_NAME,
             );
 
             set({ starterProjectId: starterProjects!.id ?? "" });
             set({ folders: foldersWithoutStarterProjects });
 
             const myCollectionId = res?.find(
-              (f) => f.name === DEFAULT_FOLDER
+              (f) => f.name === DEFAULT_FOLDER,
             )?.id;
 
             set({ myCollectionId });
@@ -55,7 +55,7 @@ export const useFolderStore = create<FoldersStoreType>((set, get) => ({
             set({ folders: [] });
             get().setIsLoadingFolders(false);
             reject(error);
-          }
+          },
         );
       }
     });
@@ -65,18 +65,18 @@ export const useFolderStore = create<FoldersStoreType>((set, get) => ({
       getFolders().then(
         async (res) => {
           const foldersWithoutStarterProjects = res?.filter(
-            (folder) => folder.name !== STARTER_FOLDER_NAME
+            (folder) => folder.name !== STARTER_FOLDER_NAME,
           );
 
           const starterProjects = res?.find(
-            (folder) => folder.name === STARTER_FOLDER_NAME
+            (folder) => folder.name === STARTER_FOLDER_NAME,
           );
 
           set({ starterProjectId: starterProjects!.id ?? "" });
           set({ folders: foldersWithoutStarterProjects });
 
           const myCollectionId = res?.find(
-            (f) => f.name === DEFAULT_FOLDER
+            (f) => f.name === DEFAULT_FOLDER,
           )?.id;
 
           set({ myCollectionId });
@@ -87,7 +87,7 @@ export const useFolderStore = create<FoldersStoreType>((set, get) => ({
           set({ folders: [] });
           get().setIsLoadingFolders(false);
           reject(error);
-        }
+        },
       );
     });
   },
diff --git a/src/frontend/src/stores/globalVariablesStore/globalVariables.ts b/src/frontend/src/stores/globalVariablesStore/globalVariables.ts
index c07813858..708f7ec09 100644
--- a/src/frontend/src/stores/globalVariablesStore/globalVariables.ts
+++ b/src/frontend/src/stores/globalVariablesStore/globalVariables.ts
@@ -45,5 +45,5 @@ export const useGlobalVariablesStore = create<GlobalVariablesStore>(
     getVariableId: (name) => {
       return get().globalVariables[name]?.id;
     },
-  })
+  }),
 );
diff --git a/src/frontend/src/stores/messagesStore.ts b/src/frontend/src/stores/messagesStore.ts
index c6bf2042b..349a1c447 100644
--- a/src/frontend/src/stores/messagesStore.ts
+++ b/src/frontend/src/stores/messagesStore.ts
@@ -5,7 +5,7 @@ export const useMessagesStore = create<MessagesStoreType>((set, get) => ({
   deleteSession: (id) => {
     set((state) => {
       const updatedMessages = state.messages.filter(
-        (msg) => msg.session_id !== id
+        (msg) => msg.session_id !== id,
       );
       return { messages: updatedMessages };
     });
@@ -29,7 +29,7 @@ export const useMessagesStore = create<MessagesStoreType>((set, get) => ({
   updateMessage: (message) => {
     set(() => ({
       messages: get().messages.map((msg) =>
-        msg.index === message.index ? message : msg
+        msg.index === message.index ? message : msg,
       ),
     }));
   },
@@ -41,7 +41,7 @@ export const useMessagesStore = create<MessagesStoreType>((set, get) => ({
       try {
         set((state) => {
           const updatedMessages = state.messages.filter(
-            (msg) => !ids.includes(msg.index)
+            (msg) => !ids.includes(msg.index),
           );
           get().setMessages(updatedMessages);
           resolve(updatedMessages);
diff --git a/src/frontend/src/types/store/index.ts b/src/frontend/src/types/store/index.ts
index a3b26cb64..54b7cb478 100644
--- a/src/frontend/src/types/store/index.ts
+++ b/src/frontend/src/types/store/index.ts
@@ -48,7 +48,7 @@ export type shortcutsStoreType = {
     shortcut: string;
   }>;
   setShortcuts: (
-    newShortcuts: Array<{ name: string; shortcut: string }>
+    newShortcuts: Array<{ name: string; shortcut: string }>,
   ) => void;
   getShortcutsFromStorage: () => void;
 };
diff --git a/src/frontend/src/types/tabs/index.ts b/src/frontend/src/types/tabs/index.ts
index f07bc7752..97693053b 100644
--- a/src/frontend/src/types/tabs/index.ts
+++ b/src/frontend/src/types/tabs/index.ts
@@ -18,12 +18,12 @@ export type FlowsContextType = {
     newProject: boolean,
     flow?: FlowType,
     override?: boolean,
-    position?: XYPosition
+    position?: XYPosition,
   ) => Promise<String | undefined>;
   downloadFlow: (
     flow: FlowType,
     flowName: string,
-    flowDescription?: string
+    flowDescription?: string,
   ) => void;
   //keep
   downloadFlows: () => void;
@@ -43,11 +43,11 @@ export type FlowsContextType = {
   }) => Promise<String | never>;
   tabsState: FlowsState;
   setTabsState: (
-    update: FlowsState | ((oldState: FlowsState) => FlowsState)
+    update: FlowsState | ((oldState: FlowsState) => FlowsState),
   ) => void;
   saveComponent: (
     component: NodeDataType,
-    override: boolean
+    override: boolean,
   ) => Promise<String | undefined>;
   deleteComponent: (key: string) => void;
   version: string;
diff --git a/src/frontend/src/types/zustand/flow/index.ts b/src/frontend/src/types/zustand/flow/index.ts
index e8b88e8d3..7449f7bc1 100644
--- a/src/frontend/src/types/zustand/flow/index.ts
+++ b/src/frontend/src/types/zustand/flow/index.ts
@@ -86,7 +86,7 @@ export type FlowStoreType = {
     state:
       | FlowState
       | undefined
-      | ((oldState: FlowState | undefined) => FlowState)
+      | ((oldState: FlowState | undefined) => FlowState),
   ) => void;
   nodes: Node[];
   edges: Edge[];
@@ -94,11 +94,11 @@ export type FlowStoreType = {
   onEdgesChange: OnEdgesChange;
   setNodes: (
     update: Node[] | ((oldState: Node[]) => Node[]),
-    skipSave?: boolean
+    skipSave?: boolean,
   ) => void;
   setEdges: (
     update: Edge[] | ((oldState: Edge[]) => Edge[]),
-    skipSave?: boolean
+    skipSave?: boolean,
   ) => void;
   setNode: (id: string, update: Node | ((oldState: Node) => Node)) => void;
   getNode: (id: string) => Node | undefined;
@@ -106,12 +106,12 @@ export type FlowStoreType = {
   deleteEdge: (edgeId: string | Array<string>) => void;
   paste: (
     selection: { nodes: any; edges: any },
-    position: { x: number; y: number; paneX?: number; paneY?: number }
+    position: { x: number; y: number; paneX?: number; paneY?: number },
   ) => void;
   lastCopiedSelection: { nodes: any; edges: any } | null;
   setLastCopiedSelection: (
     newSelection: { nodes: any; edges: any } | null,
-    isCrop?: boolean
+    isCrop?: boolean,
   ) => void;
   cleanFlow: () => void;
   setFilterEdge: (newState) => void;
@@ -138,7 +138,7 @@ export type FlowStoreType = {
       verticesLayers: VertexLayerElementType[][];
       runId: string;
       verticesToRun: string[];
-    } | null
+    } | null,
   ) => void;
   addToVerticesBuild: (vertices: string[]) => void;
   removeFromVerticesBuild: (vertices: string[]) => void;
@@ -156,7 +156,7 @@ export type FlowStoreType = {
   updateFlowPool: (
     nodeId: string,
     data: VertexBuildTypeAPI | ChatOutputType | ChatInputType,
-    buildId?: string
+    buildId?: string,
   ) => void;
   getNodePosition: (nodeId: string) => { x: number; y: number };
 };
diff --git a/src/frontend/src/types/zustand/flowsManager/index.ts b/src/frontend/src/types/zustand/flowsManager/index.ts
index e0770626e..aaafebb7b 100644
--- a/src/frontend/src/types/zustand/flowsManager/index.ts
+++ b/src/frontend/src/types/zustand/flowsManager/index.ts
@@ -17,12 +17,12 @@ export type FlowsManagerStoreType = {
   saveFlow: (flow: FlowType, silent?: boolean) => Promise<void> | undefined;
   saveFlowDebounce: (
     flow: FlowType,
-    silent?: boolean
+    silent?: boolean,
   ) => Promise<void> | undefined;
   autoSaveCurrentFlow: (
     nodes: Node[],
     edges: Edge[],
-    viewport: Viewport
+    viewport: Viewport,
   ) => void;
   uploadFlows: () => Promise<void>;
   uploadFlow: ({
@@ -41,13 +41,13 @@ export type FlowsManagerStoreType = {
     flow?: FlowType,
     override?: boolean,
     position?: XYPosition,
-    fromDragAndDrop?: boolean
+    fromDragAndDrop?: boolean,
   ) => Promise<string | undefined>;
   deleteComponent: (key: string) => Promise<void>;
   removeFlow: (id: string | string[]) => Promise<void>;
   saveComponent: (
     component: any,
-    override: boolean
+    override: boolean,
   ) => Promise<string | undefined>;
   undo: () => void;
   redo: () => void;
diff --git a/src/frontend/src/types/zustand/folders/index.ts b/src/frontend/src/types/zustand/folders/index.ts
index 45c1e0bd9..495d65b87 100644
--- a/src/frontend/src/types/zustand/folders/index.ts
+++ b/src/frontend/src/types/zustand/folders/index.ts
@@ -4,7 +4,7 @@ export type FoldersStoreType = {
   folders: FolderType[];
   getFoldersApi: (
     refetch?: boolean,
-    startupApplication?: boolean
+    startupApplication?: boolean,
   ) => Promise<void>;
   setFolders: (folders: FolderType[]) => void;
   isLoadingFolders: boolean;
diff --git a/src/frontend/src/types/zustand/globalVariables/index.ts b/src/frontend/src/types/zustand/globalVariables/index.ts
index 90817780f..4b178088c 100644
--- a/src/frontend/src/types/zustand/globalVariables/index.ts
+++ b/src/frontend/src/types/zustand/globalVariables/index.ts
@@ -21,7 +21,7 @@ export type GlobalVariablesStore = {
     id: string,
     type?: string,
     default_fields?: string[],
-    value?: string
+    value?: string,
   ) => void;
   removeGlobalVariable: (name: string) => Promise<void>;
   getVariableId: (name: string) => string | undefined;
diff --git a/src/frontend/src/utils/buildUtils.ts b/src/frontend/src/utils/buildUtils.ts
index 072a8ebf4..d3693a85f 100644
--- a/src/frontend/src/utils/buildUtils.ts
+++ b/src/frontend/src/utils/buildUtils.ts
@@ -17,7 +17,7 @@ type BuildVerticesParams = {
   onBuildUpdate?: (
     data: VertexBuildTypeAPI,
     status: BuildStatus,
-    buildId: string
+    buildId: string,
   ) => void; // Replace any with the actual type if it's not any
   onBuildComplete?: (allNodesValid: boolean) => void;
   onBuildError?: (title, list, idList: VertexLayerElementType[]) => void;
@@ -55,7 +55,7 @@ export async function updateVerticesOrder(
   startNodeId?: string | null,
   stopNodeId?: string | null,
   nodes?: Node[],
-  edges?: Edge[]
+  edges?: Edge[],
 ): Promise<{
   verticesLayers: VertexLayerElementType[][];
   verticesIds: string[];
@@ -71,7 +71,7 @@ export async function updateVerticesOrder(
         startNodeId,
         stopNodeId,
         nodes,
-        edges
+        edges,
       );
     } catch (error: any) {
       setErrorData({
@@ -128,7 +128,7 @@ export async function buildVertices({
     startNodeId,
     stopNodeId,
     nodes,
-    edges
+    edges,
   );
   if (onValidateNodes) {
     try {
@@ -190,14 +190,14 @@ export async function buildVertices({
             onBuildUpdate(
               getInactiveVertexData(element.id),
               BuildStatus.INACTIVE,
-              runId
+              runId,
             );
           }
           if (element.reference) {
             onBuildUpdate(
               getInactiveVertexData(element.reference),
               BuildStatus.INACTIVE,
-              runId
+              runId,
             );
           }
           buildResults.push(false);
@@ -223,7 +223,7 @@ export async function buildVertices({
         if (stop) {
           return;
         }
-      })
+      }),
     );
     // Once the current layer is built, move to the next layer
     currentLayerIndex += 1;
@@ -277,7 +277,7 @@ async function buildVertex({
         onBuildError!(
           "Error Building Component",
           errorMessages,
-          verticesIds.map((id) => ({ id }))
+          verticesIds.map((id) => ({ id })),
         );
         stopBuild();
       }
@@ -292,7 +292,7 @@ async function buildVertex({
         (error as AxiosError<any>).response?.data?.detail ??
           "An unexpected error occurred while building the Component. Please try again.",
       ],
-      verticesIds.map((id) => ({ id }))
+      verticesIds.map((id) => ({ id })),
     );
     buildResults.push(false);
     stopBuild();
diff --git a/src/frontend/src/utils/parameterUtils.ts b/src/frontend/src/utils/parameterUtils.ts
index a1d2f2154..d1d53dde7 100644
--- a/src/frontend/src/utils/parameterUtils.ts
+++ b/src/frontend/src/utils/parameterUtils.ts
@@ -21,7 +21,7 @@ export const handleUpdateValues = async (name: string, data: NodeDataType) => {
       code,
       template,
       name,
-      data.node?.template[name]?.value
+      data.node?.template[name]?.value,
     );
     if (res.status === 200 && data.node?.template) {
       return res.data.template;
@@ -34,5 +34,5 @@ export const handleUpdateValues = async (name: string, data: NodeDataType) => {
 
 export const debouncedHandleUpdateValues = debounce(
   handleUpdateValues,
-  SAVE_DEBOUNCE_TIME
+  SAVE_DEBOUNCE_TIME,
 );
diff --git a/src/frontend/src/utils/storeUtils.ts b/src/frontend/src/utils/storeUtils.ts
index 637e4331a..c8391b211 100644
--- a/src/frontend/src/utils/storeUtils.ts
+++ b/src/frontend/src/utils/storeUtils.ts
@@ -7,7 +7,7 @@ export default function cloneFLowWithParent(
   flow: FlowType,
   parent: string,
   is_component: boolean,
-  keepId = false
+  keepId = false,
 ) {
   let childFLow = cloneDeep(flow);
   childFLow.parent = parent;
diff --git a/src/frontend/src/utils/utils.ts b/src/frontend/src/utils/utils.ts
index 53dad718c..3cef4e48d 100644
--- a/src/frontend/src/utils/utils.ts
+++ b/src/frontend/src/utils/utils.ts
@@ -56,7 +56,7 @@ export function normalCaseToSnakeCase(str: string): string {
 
 export function toTitleCase(
   str: string | undefined,
-  isNodeField?: boolean
+  isNodeField?: boolean,
 ): string {
   if (!str) return "";
   let result = str
@@ -65,7 +65,7 @@ export function toTitleCase(
       if (isNodeField) return word;
       if (index === 0) {
         return checkUpperWords(
-          word[0].toUpperCase() + word.slice(1).toLowerCase()
+          word[0].toUpperCase() + word.slice(1).toLowerCase(),
         );
       }
       return checkUpperWords(word.toLowerCase());
@@ -78,7 +78,7 @@ export function toTitleCase(
       if (isNodeField) return word;
       if (index === 0) {
         return checkUpperWords(
-          word[0].toUpperCase() + word.slice(1).toLowerCase()
+          word[0].toUpperCase() + word.slice(1).toLowerCase(),
         );
       }
       return checkUpperWords(word.toLowerCase());
@@ -182,7 +182,7 @@ export function checkLocalStorageKey(key: string): boolean {
 
 export function IncrementObjectKey(
   object: object,
-  key: string
+  key: string,
 ): { newKey: string; increment: number } {
   let count = 1;
   const type = removeCountFromString(key);
@@ -217,7 +217,7 @@ export function groupByFamily(
   data: APIDataType,
   baseClasses: string,
   left: boolean,
-  flow?: NodeType[]
+  flow?: NodeType[],
 ): groupedObjType[] {
   const baseClassesSet = new Set(baseClasses.split("\n"));
   let arrOfPossibleInputs: Array<{
@@ -243,7 +243,7 @@ export function groupByFamily(
         baseClassesSet.has(template.type)) ||
         (template?.input_types &&
           template?.input_types.some((inputType) =>
-            baseClassesSet.has(inputType)
+            baseClassesSet.has(inputType),
           )))
     );
   };
@@ -263,7 +263,7 @@ export function groupByFamily(
         hasBaseClassInBaseClasses:
           foundNode?.hasBaseClassInBaseClasses ||
           nodeData.node!.base_classes?.some((baseClass) =>
-            baseClassesSet.has(baseClass)
+            baseClassesSet.has(baseClass),
           ), //seta como anterior ou verifica se o node tem base class
         displayName: nodeData.node?.display_name,
       });
@@ -280,10 +280,10 @@ export function groupByFamily(
       if (!foundNode) {
         foundNode = {
           hasBaseClassInTemplate: Object.values(node!.template).some(
-            checkBaseClass
+            checkBaseClass,
           ),
           hasBaseClassInBaseClasses: node!.base_classes?.some((baseClass) =>
-            baseClassesSet.has(baseClass)
+            baseClassesSet.has(baseClass),
           ),
           displayName: node?.display_name,
         };
@@ -355,7 +355,7 @@ export function isTimeStampString(str: string): boolean {
 export function extractColumnsFromRows(
   rows: object[],
   mode: "intersection" | "union",
-  excludeColumns?: Array<string>
+  excludeColumns?: Array<string>,
 ): (ColDef<any> | ColGroupDef<any>)[] {
   let columnsKeys: { [key: string]: ColDef<any> | ColGroupDef<any> } = {};
   if (rows.length === 0) {
diff --git a/src/frontend/tests/end-to-end/chatInputOutput.spec.ts b/src/frontend/tests/end-to-end/chatInputOutput.spec.ts
index aa43bfa8a..a5a1719fa 100644
--- a/src/frontend/tests/end-to-end/chatInputOutput.spec.ts
+++ b/src/frontend/tests/end-to-end/chatInputOutput.spec.ts
@@ -24,7 +24,7 @@ test("chat_io_teste", async ({ page }) => {
 
   const jsonContent = readFileSync(
     "src/frontend/tests/end-to-end/assets/ChatTest.json",
-    "utf-8"
+    "utf-8",
   );
 
   await page.getByTestId("blank-flow").click();
@@ -62,7 +62,7 @@ test("chat_io_teste", async ({ page }) => {
   // Click and hold on the first element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[8]/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[8]/button/div/div',
     )
     .hover();
   await page.mouse.down();
@@ -70,7 +70,7 @@ test("chat_io_teste", async ({ page }) => {
   // Move to the second element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[1]/div/div[2]/div[3]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[1]/div/div[2]/div[3]/div/button/div/div',
     )
     .hover();
 
diff --git a/src/frontend/tests/end-to-end/chatInputOutputUser.spec.ts b/src/frontend/tests/end-to-end/chatInputOutputUser.spec.ts
index c603d4c7b..a326a1947 100644
--- a/src/frontend/tests/end-to-end/chatInputOutputUser.spec.ts
+++ b/src/frontend/tests/end-to-end/chatInputOutputUser.spec.ts
@@ -58,7 +58,7 @@ test("user must interact with chat with Input/Output", async ({ page }) => {
     .getByTestId("textarea-input_value")
     .nth(1)
     .fill(
-      "testtesttesttesttesttestte;.;.,;,.;,.;.,;,..,;;;;;;;;;;;;;;;;;;;;;,;.;,.;,.,;.,;.;.,~~çççççççççççççççççççççççççççççççççççççççisdajfdasiopjfaodisjhvoicxjiovjcxizopjviopasjioasfhjaiohf23432432432423423sttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttestççççççççççççççççççççççççççççççççç,.,.,.,.,.,.,.,.,.,.,.,.,.,.,.,.,!"
+      "testtesttesttesttesttestte;.;.,;,.;,.;.,;,..,;;;;;;;;;;;;;;;;;;;;;,;.;,.;,.,;.,;.;.,~~çççççççççççççççççççççççççççççççççççççççisdajfdasiopjfaodisjhvoicxjiovjcxizopjviopasjioasfhjaiohf23432432432423423sttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttestççççççççççççççççççççççççççççççççç,.,.,.,.,.,.,.,.,.,.,.,.,.,.,.,.,!",
     );
   await page.getByText("Playground", { exact: true }).last().click();
   await page.getByTestId("icon-LucideSend").click();
@@ -99,9 +99,9 @@ test("user must interact with chat with Input/Output", async ({ page }) => {
     await page
       .getByText(
         "testtesttesttesttesttestte;.;.,;,.;,.;.,;,..,;;;;;;;;;;;;;;;;;;;;;,;.;,.;,.,;.,;.;.,~~çççççççççççççççççççççççççççççççççççççççisdajfdasiopjfaodisjhvoicxjiovjcxizopjviopasjioasfhjaiohf23432432432423423sttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttestççççççççççççççççççççççççççççççççç,.,.,.,.,.,.,.,.,.,.,.,.,.,.,.,.,!",
-        { exact: true }
+        { exact: true },
       )
-      .isVisible()
+      .isVisible(),
   );
 });
 
@@ -211,7 +211,7 @@ test("user must be able to send an image on chat", async ({ page }) => {
 
   const jsonContent = readFileSync(
     "src/frontend/tests/end-to-end/assets/chain.png",
-    "utf-8"
+    "utf-8",
   );
 
   // Create the DataTransfer and File
diff --git a/src/frontend/tests/end-to-end/curl_api_generation.spec.ts b/src/frontend/tests/end-to-end/curl_api_generation.spec.ts
index 4e8f3b8d9..396962afe 100644
--- a/src/frontend/tests/end-to-end/curl_api_generation.spec.ts
+++ b/src/frontend/tests/end-to-end/curl_api_generation.spec.ts
@@ -23,7 +23,7 @@ test("curl_api_generation", async ({ page, context }) => {
   await page.getByRole("tab", { name: "cURL" }).click();
   await page.getByTestId("icon-Copy").last().click();
   const handle = await page.evaluateHandle(() =>
-    navigator.clipboard.readText()
+    navigator.clipboard.readText(),
   );
   const clipboardContent = await handle.jsonValue();
   expect(clipboardContent.length).toBeGreaterThan(0);
diff --git a/src/frontend/tests/end-to-end/dragAndDrop.spec.ts b/src/frontend/tests/end-to-end/dragAndDrop.spec.ts
index 3e760901d..03d11aaf7 100644
--- a/src/frontend/tests/end-to-end/dragAndDrop.spec.ts
+++ b/src/frontend/tests/end-to-end/dragAndDrop.spec.ts
@@ -27,7 +27,7 @@ test.describe("drag and drop test", () => {
     // Read your file into a buffer.
     const jsonContent = readFileSync(
       "src/frontend/tests/end-to-end/assets/collection.json",
-      "utf-8"
+      "utf-8",
     );
 
     // Create the DataTransfer and File
@@ -47,7 +47,7 @@ test.describe("drag and drop test", () => {
       "drop",
       {
         dataTransfer,
-      }
+      },
     );
 
     const genericNoda = page.getByTestId("div-generic-node");
diff --git a/src/frontend/tests/end-to-end/dropdownComponent.spec.ts b/src/frontend/tests/end-to-end/dropdownComponent.spec.ts
index 0152ca7ed..6c0a7dd9e 100644
--- a/src/frontend/tests/end-to-end/dropdownComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/dropdownComponent.spec.ts
@@ -80,32 +80,32 @@ test("dropDownComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showcredentials_profile_name"]').click();
   expect(
-    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked()
+    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showcredentials_profile_name"]').click();
   expect(
-    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked()
+    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showendpoint_url"]').click();
   expect(
-    await page.locator('//*[@id="showendpoint_url"]').isChecked()
+    await page.locator('//*[@id="showendpoint_url"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showendpoint_url"]').click();
   expect(
-    await page.locator('//*[@id="showendpoint_url"]').isChecked()
+    await page.locator('//*[@id="showendpoint_url"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showregion_name"]').click();
   expect(
-    await page.locator('//*[@id="showregion_name"]').isChecked()
+    await page.locator('//*[@id="showregion_name"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showregion_name"]').click();
   expect(
-    await page.locator('//*[@id="showregion_name"]').isChecked()
+    await page.locator('//*[@id="showregion_name"]').isChecked(),
   ).toBeTruthy();
 
   // showmodel_id
@@ -115,7 +115,7 @@ test("dropDownComponent", async ({ page }) => {
   // showmodel_id
   await page.locator('//*[@id="showmodel_id"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_id"]').isChecked()
+    await page.locator('//*[@id="showmodel_id"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showcache"]').click();
@@ -126,32 +126,32 @@ test("dropDownComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showcredentials_profile_name"]').click();
   expect(
-    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked()
+    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showcredentials_profile_name"]').click();
   expect(
-    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked()
+    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showendpoint_url"]').click();
   expect(
-    await page.locator('//*[@id="showendpoint_url"]').isChecked()
+    await page.locator('//*[@id="showendpoint_url"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showendpoint_url"]').click();
   expect(
-    await page.locator('//*[@id="showendpoint_url"]').isChecked()
+    await page.locator('//*[@id="showendpoint_url"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showregion_name"]').click();
   expect(
-    await page.locator('//*[@id="showregion_name"]').isChecked()
+    await page.locator('//*[@id="showregion_name"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showregion_name"]').click();
   expect(
-    await page.locator('//*[@id="showregion_name"]').isChecked()
+    await page.locator('//*[@id="showregion_name"]').isChecked(),
   ).toBeTruthy();
 
   // showmodel_id
@@ -161,7 +161,7 @@ test("dropDownComponent", async ({ page }) => {
   // showmodel_id
   await page.locator('//*[@id="showmodel_id"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_id"]').isChecked()
+    await page.locator('//*[@id="showmodel_id"]').isChecked(),
   ).toBeTruthy();
 
   await page.getByTestId("dropdown-edit-model_id").click();
diff --git a/src/frontend/tests/end-to-end/fileUploadComponent.spec.ts b/src/frontend/tests/end-to-end/fileUploadComponent.spec.ts
index 93b471c43..00f761dea 100644
--- a/src/frontend/tests/end-to-end/fileUploadComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/fileUploadComponent.spec.ts
@@ -64,7 +64,7 @@ test("dropDownComponent", async ({ page }) => {
   // Click and hold on the first element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[1]/div/div[2]/div[6]/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[1]/div/div[2]/div[6]/button/div/div',
     )
     .hover();
   await page.mouse.down();
@@ -72,7 +72,7 @@ test("dropDownComponent", async ({ page }) => {
   // Move to the second element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[3]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[3]/div/button/div/div',
     )
     .hover();
 
diff --git a/src/frontend/tests/end-to-end/filterEdge.spec.ts b/src/frontend/tests/end-to-end/filterEdge.spec.ts
index 9cb5a567e..7edbc0436 100644
--- a/src/frontend/tests/end-to-end/filterEdge.spec.ts
+++ b/src/frontend/tests/end-to-end/filterEdge.spec.ts
@@ -40,7 +40,7 @@ test("LLMChain - Tooltip", async ({ page }) => {
 
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[3]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[3]/div/button/div/div',
     )
     .hover()
     .then(async () => {
@@ -60,17 +60,17 @@ test("LLMChain - Tooltip", async ({ page }) => {
   await page.getByTitle("zoom out").click();
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[4]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[4]/div/button/div/div',
     )
     .hover()
     .then(async () => {
       await expect(
-        page.getByTestId("tooltip-Model Specs").first()
+        page.getByTestId("tooltip-Model Specs").first(),
       ).toBeVisible();
       await page.waitForTimeout(2000);
 
       await expect(
-        page.getByTestId("tooltip-Model Specs").first()
+        page.getByTestId("tooltip-Model Specs").first(),
       ).toBeVisible();
 
       await page.getByTestId("icon-Search").click();
@@ -81,12 +81,12 @@ test("LLMChain - Tooltip", async ({ page }) => {
 
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[5]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[5]/div/button/div/div',
     )
     .hover()
     .then(async () => {
       await expect(
-        page.getByTestId("empty-tooltip-filter").first()
+        page.getByTestId("empty-tooltip-filter").first(),
       ).toBeVisible();
     });
 });
@@ -113,7 +113,7 @@ test("LLMChain - Filter", async ({ page }) => {
   await page.waitForTimeout(1000);
 
   await page.getByTestId(
-    "input-list-plus-btn-edit_metadata_indexing_include-2"
+    "input-list-plus-btn-edit_metadata_indexing_include-2",
   );
 
   await page.getByTestId("blank-flow").click();
@@ -136,7 +136,7 @@ test("LLMChain - Filter", async ({ page }) => {
 
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div/div/div[2]/div[4]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div/div/div[2]/div[4]/div/button/div/div',
     )
     .click();
 
@@ -149,14 +149,14 @@ test("LLMChain - Filter", async ({ page }) => {
   await expect(page.getByTestId("model_specsChatOpenAI")).toBeVisible();
   await expect(page.getByTestId("model_specsChatVertexAI")).toBeVisible();
   await expect(
-    page.getByTestId("model_specsGoogle Generative AI")
+    page.getByTestId("model_specsGoogle Generative AI"),
   ).toBeVisible();
   await expect(
-    page.getByTestId("model_specsHugging Face Inference API")
+    page.getByTestId("model_specsHugging Face Inference API"),
   ).toBeVisible();
   await expect(page.getByTestId("model_specsOllama")).toBeVisible();
   await expect(
-    page.getByTestId("model_specsQianfanChatEndpoint")
+    page.getByTestId("model_specsQianfanChatEndpoint"),
   ).toBeVisible();
   await expect(page.getByTestId("model_specsQianfanLLMEndpoint")).toBeVisible();
   await expect(page.getByTestId("model_specsVertexAI")).toBeVisible();
@@ -168,7 +168,7 @@ test("LLMChain - Filter", async ({ page }) => {
   await expect(page.getByTestId("model_specsAmazon Bedrock")).not.toBeVisible();
   await expect(page.getByTestId("modelsAzure OpenAI")).not.toBeVisible();
   await expect(
-    page.getByTestId("model_specsAzureChatOpenAI")
+    page.getByTestId("model_specsAzureChatOpenAI"),
   ).not.toBeVisible();
   await expect(page.getByTestId("model_specsChatAnthropic")).not.toBeVisible();
   await expect(page.getByTestId("model_specsChatLiteLLM")).not.toBeVisible();
@@ -178,13 +178,13 @@ test("LLMChain - Filter", async ({ page }) => {
 
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div/div/div[2]/div[7]/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div/div/div[2]/div[7]/button/div/div',
     )
     .click();
 
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div/div/div[2]/div[7]/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div/div/div[2]/div[7]/button/div/div',
     )
     .click();
 
diff --git a/src/frontend/tests/end-to-end/floatComponent.spec.ts b/src/frontend/tests/end-to-end/floatComponent.spec.ts
index 8a32ef652..126863a6b 100644
--- a/src/frontend/tests/end-to-end/floatComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/floatComponent.spec.ts
@@ -68,32 +68,32 @@ test("FloatComponent", async ({ page }) => {
 
   await page.getByTestId("showmirostat_eta").click();
   expect(
-    await page.locator('//*[@id="showmirostat_eta"]').isChecked()
+    await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
   ).toBeTruthy();
 
   await page.getByTestId("showmirostat_eta").click();
   expect(
-    await page.locator('//*[@id="showmirostat_eta"]').isChecked()
+    await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
   ).toBeFalsy();
 
   await page.getByTestId("showmirostat_eta").click();
   expect(
-    await page.locator('//*[@id="showmirostat_eta"]').isChecked()
+    await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
   ).toBeTruthy();
 
   await page.getByTestId("showmirostat_eta").click();
   expect(
-    await page.locator('//*[@id="showmirostat_eta"]').isChecked()
+    await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
   ).toBeFalsy();
 
   await page.getByTestId("showmirostat_tau").click();
   expect(
-    await page.locator('//*[@id="showmirostat_tau"]').isChecked()
+    await page.locator('//*[@id="showmirostat_tau"]').isChecked(),
   ).toBeTruthy();
 
   await page.getByTestId("showmirostat_tau").click();
   expect(
-    await page.locator('//*[@id="showmirostat_tau"]').isChecked()
+    await page.locator('//*[@id="showmirostat_tau"]').isChecked(),
   ).toBeFalsy();
 
   await page.getByText("Save Changes", { exact: true }).click();
@@ -109,7 +109,7 @@ test("FloatComponent", async ({ page }) => {
     // showtemperature
     await page.locator('//*[@id="showtemperature"]').click();
     expect(
-      await page.locator('//*[@id="showtemperature"]').isChecked()
+      await page.locator('//*[@id="showtemperature"]').isChecked(),
     ).toBeTruthy();
 
     await page.getByText("Save Changes", { exact: true }).click();
diff --git a/src/frontend/tests/end-to-end/flowSettings.spec.ts b/src/frontend/tests/end-to-end/flowSettings.spec.ts
index a2e9f25c0..25807ed88 100644
--- a/src/frontend/tests/end-to-end/flowSettings.spec.ts
+++ b/src/frontend/tests/end-to-end/flowSettings.spec.ts
@@ -29,7 +29,7 @@ test("flowSettings", async ({ page }) => {
   await page
     .getByPlaceholder("Flow name")
     .fill(
-      "Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test"
+      "Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test",
     );
 
   await page.getByText("Character limit reached").isVisible();
@@ -41,7 +41,7 @@ test("flowSettings", async ({ page }) => {
   await page
     .getByPlaceholder("Flow description")
     .fill(
-      "Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test"
+      "Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test Flow Name Test",
     );
 
   await page.getByTestId("save-flow-settings").click();
diff --git a/src/frontend/tests/end-to-end/folders.spec.ts b/src/frontend/tests/end-to-end/folders.spec.ts
index 70bdf6bca..99ed07669 100644
--- a/src/frontend/tests/end-to-end/folders.spec.ts
+++ b/src/frontend/tests/end-to-end/folders.spec.ts
@@ -58,7 +58,7 @@ test("add folder by drag and drop", async ({ page }) => {
 
   const jsonContent = readFileSync(
     "src/frontend/tests/end-to-end/assets/collection.json",
-    "utf-8"
+    "utf-8",
   );
 
   // Create the DataTransfer and File
@@ -78,7 +78,7 @@ test("add folder by drag and drop", async ({ page }) => {
     "drop",
     {
       dataTransfer,
-    }
+    },
   );
 
   await page.getByText("Getting Started").first().isVisible();
diff --git a/src/frontend/tests/end-to-end/inputComponent.spec.ts b/src/frontend/tests/end-to-end/inputComponent.spec.ts
index d944cffe5..3e6936b43 100644
--- a/src/frontend/tests/end-to-end/inputComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/inputComponent.spec.ts
@@ -60,69 +60,69 @@ test("InputComponent", async ({ page }) => {
   expect(
     await page
       .locator('//*[@id="showchroma_server_cors_allow_origins"]')
-      .isChecked()
+      .isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showchroma_server_grpc_port"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_grpc_port"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_grpc_port"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showchroma_server_host"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_host"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_host"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showchroma_server_http_port"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_http_port"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_http_port"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showchroma_server_ssl_enabled"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_ssl_enabled"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_ssl_enabled"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showcollection_name"]').click();
   expect(
-    await page.locator('//*[@id="showcollection_name"]').isChecked()
+    await page.locator('//*[@id="showcollection_name"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showindex_directory"]').click();
   expect(
-    await page.locator('//*[@id="showindex_directory"]').isChecked()
+    await page.locator('//*[@id="showindex_directory"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showchroma_server_cors_allow_origins"]').click();
   expect(
     await page
       .locator('//*[@id="showchroma_server_cors_allow_origins"]')
-      .isChecked()
+      .isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showchroma_server_grpc_port"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_grpc_port"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_grpc_port"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showchroma_server_host"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_host"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_host"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showchroma_server_http_port"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_http_port"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_http_port"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showchroma_server_ssl_enabled"]').click();
   expect(
-    await page.locator('//*[@id="showchroma_server_ssl_enabled"]').isChecked()
+    await page.locator('//*[@id="showchroma_server_ssl_enabled"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showindex_directory"]').click();
   expect(
-    await page.locator('//*[@id="showindex_directory"]').isChecked()
+    await page.locator('//*[@id="showindex_directory"]').isChecked(),
   ).toBeTruthy();
 
   let valueEditNode = await page
@@ -152,7 +152,7 @@ test("InputComponent", async ({ page }) => {
 
     await page.locator('//*[@id="showcollection_name"]').click();
     expect(
-      await page.locator('//*[@id="showcollection_name"]').isChecked()
+      await page.locator('//*[@id="showcollection_name"]').isChecked(),
     ).toBeTruthy();
 
     await page.getByText("Save Changes", { exact: true }).click();
diff --git a/src/frontend/tests/end-to-end/inputListComponent.spec.ts b/src/frontend/tests/end-to-end/inputListComponent.spec.ts
index 04d9bedb5..797289890 100644
--- a/src/frontend/tests/end-to-end/inputListComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/inputListComponent.spec.ts
@@ -41,19 +41,19 @@ test("InputListComponent", async ({ page }) => {
   await page.getByTestId("edit-button-modal").click();
 
   expect(
-    await page.getByTestId("showmetadata_indexing_exclude").isChecked()
+    await page.getByTestId("showmetadata_indexing_exclude").isChecked(),
   ).toBeFalsy();
   await page.getByTestId("showmetadata_indexing_exclude").click();
   expect(
-    await page.getByTestId("showmetadata_indexing_exclude").isChecked()
+    await page.getByTestId("showmetadata_indexing_exclude").isChecked(),
   ).toBeTruthy();
 
   expect(
-    await page.getByTestId("showmetadata_indexing_include").isChecked()
+    await page.getByTestId("showmetadata_indexing_include").isChecked(),
   ).toBeFalsy();
   await page.getByTestId("showmetadata_indexing_include").click();
   expect(
-    await page.getByTestId("showmetadata_indexing_include").isChecked()
+    await page.getByTestId("showmetadata_indexing_include").isChecked(),
   ).toBeTruthy();
 
   await page
@@ -93,7 +93,7 @@ test("InputListComponent", async ({ page }) => {
     .click();
 
   const plusButtonLocator = page.getByTestId(
-    "input-list-plus-btn_metadata_indexing_include-1"
+    "input-list-plus-btn_metadata_indexing_include-1",
   );
   const elementCount = await plusButtonLocator?.count();
 
@@ -164,12 +164,12 @@ test("InputListComponent", async ({ page }) => {
     .click();
 
   const plusButtonLocatorEdit0 = await page.getByTestId(
-    "input-list-plus-btn-edit_metadata_indexing_include-0"
+    "input-list-plus-btn-edit_metadata_indexing_include-0",
   );
   const elementCountEdit0 = await plusButtonLocatorEdit0?.count();
 
   const plusButtonLocatorEdit2 = await page.getByTestId(
-    "input-list-plus-btn-edit_metadata_indexing_include-2"
+    "input-list-plus-btn-edit_metadata_indexing_include-2",
   );
   const elementCountEdit2 = await plusButtonLocatorEdit2?.count();
 
@@ -178,13 +178,13 @@ test("InputListComponent", async ({ page }) => {
   }
 
   const minusButtonLocatorEdit1 = await page.getByTestId(
-    "input-list-minus-btn-edit_metadata_indexing_include-1"
+    "input-list-minus-btn-edit_metadata_indexing_include-1",
   );
 
   const elementCountMinusEdit1 = await minusButtonLocatorEdit1?.count();
 
   const minusButtonLocatorEdit2 = await page.getByTestId(
-    "input-list-minus-btn-edit_metadata_indexing_include-2"
+    "input-list-minus-btn-edit_metadata_indexing_include-2",
   );
 
   const elementCountMinusEdit2 = await minusButtonLocatorEdit2?.count();
diff --git a/src/frontend/tests/end-to-end/intComponent.spec.ts b/src/frontend/tests/end-to-end/intComponent.spec.ts
index 50fb0d648..aa54ac5b4 100644
--- a/src/frontend/tests/end-to-end/intComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/intComponent.spec.ts
@@ -87,77 +87,77 @@ test("IntComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showmodel_kwargs"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
+    await page.locator('//*[@id="showmodel_kwargs"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showmodel_name"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_name"]').isChecked()
+    await page.locator('//*[@id="showmodel_name"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showopenai_api_base"]').click();
   expect(
-    await page.locator('//*[@id="showopenai_api_base"]').isChecked()
+    await page.locator('//*[@id="showopenai_api_base"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showopenai_api_key"]').click();
   expect(
-    await page.locator('//*[@id="showopenai_api_key"]').isChecked()
+    await page.locator('//*[@id="showopenai_api_key"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showtemperature"]').click();
   expect(
-    await page.locator('//*[@id="showtemperature"]').isChecked()
+    await page.locator('//*[@id="showtemperature"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showmodel_kwargs"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
+    await page.locator('//*[@id="showmodel_kwargs"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showmodel_name"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_name"]').isChecked()
+    await page.locator('//*[@id="showmodel_name"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showopenai_api_base"]').click();
   expect(
-    await page.locator('//*[@id="showopenai_api_base"]').isChecked()
+    await page.locator('//*[@id="showopenai_api_base"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showopenai_api_key"]').click();
   expect(
-    await page.locator('//*[@id="showopenai_api_key"]').isChecked()
+    await page.locator('//*[@id="showopenai_api_key"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showtemperature"]').click();
   expect(
-    await page.locator('//*[@id="showtemperature"]').isChecked()
+    await page.locator('//*[@id="showtemperature"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showmodel_kwargs"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
+    await page.locator('//*[@id="showmodel_kwargs"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showmodel_name"]').click();
   expect(
-    await page.locator('//*[@id="showmodel_name"]').isChecked()
+    await page.locator('//*[@id="showmodel_name"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showopenai_api_base"]').click();
   expect(
-    await page.locator('//*[@id="showopenai_api_base"]').isChecked()
+    await page.locator('//*[@id="showopenai_api_base"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showopenai_api_key"]').click();
   expect(
-    await page.locator('//*[@id="showopenai_api_key"]').isChecked()
+    await page.locator('//*[@id="showopenai_api_key"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showtemperature"]').click();
   expect(
-    await page.locator('//*[@id="showtemperature"]').isChecked()
+    await page.locator('//*[@id="showtemperature"]').isChecked(),
   ).toBeFalsy();
 
   await page.getByText("Save Changes", { exact: true }).click();
@@ -172,7 +172,7 @@ test("IntComponent", async ({ page }) => {
 
     await page.locator('//*[@id="showtimeout"]').click();
     expect(
-      await page.locator('//*[@id="showtimeout"]').isChecked()
+      await page.locator('//*[@id="showtimeout"]').isChecked(),
     ).toBeTruthy();
 
     const valueEditNode = await page
diff --git a/src/frontend/tests/end-to-end/keyPairListComponent.spec.ts b/src/frontend/tests/end-to-end/keyPairListComponent.spec.ts
index 165dd685b..31a4521ae 100644
--- a/src/frontend/tests/end-to-end/keyPairListComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/keyPairListComponent.spec.ts
@@ -81,7 +81,7 @@ test("KeypairListComponent", async ({ page }) => {
   expect(await page.locator('//*[@id="showcache"]').isChecked()).toBeFalsy();
   await page.locator('//*[@id="showcredentials_profile_name"]').click();
   expect(
-    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked()
+    await page.locator('//*[@id="showcredentials_profile_name"]').isChecked(),
   ).toBeFalsy();
   await page.getByText("Save Changes", { exact: true }).click();
 
@@ -96,7 +96,7 @@ test("KeypairListComponent", async ({ page }) => {
 
     await page.locator('//*[@id="showcredentials_profile_name"]').click();
     expect(
-      await page.locator('//*[@id="showcredentials_profile_name"]').isChecked()
+      await page.locator('//*[@id="showcredentials_profile_name"]').isChecked(),
     ).toBeTruthy();
     await page.locator('//*[@id="showcache"]').click();
     expect(await page.locator('//*[@id="showcache"]').isChecked()).toBeTruthy();
diff --git a/src/frontend/tests/end-to-end/langflowShortcuts.spec.ts b/src/frontend/tests/end-to-end/langflowShortcuts.spec.ts
index 58615dd55..42b8744d1 100644
--- a/src/frontend/tests/end-to-end/langflowShortcuts.spec.ts
+++ b/src/frontend/tests/end-to-end/langflowShortcuts.spec.ts
@@ -61,7 +61,7 @@ test("LangflowShortcuts", async ({ page }) => {
 
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div[2]/div/div[1]/div/div[1]/div/div/div[1]'
+      '//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div[2]/div/div[1]/div/div[1]/div/div/div[1]',
     )
     .click();
   await page.keyboard.press("Backspace");
@@ -84,7 +84,7 @@ test("LangflowShortcuts", async ({ page }) => {
 
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div[2]/div/div[1]/div/div[1]/div/div/div[1]'
+      '//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div[2]/div/div[1]/div/div[1]/div/div/div[1]',
     )
     .click();
   await page.keyboard.press("Backspace");
diff --git a/src/frontend/tests/end-to-end/nestedComponent.spec.ts b/src/frontend/tests/end-to-end/nestedComponent.spec.ts
index 3cd319576..2df9c1b7b 100644
--- a/src/frontend/tests/end-to-end/nestedComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/nestedComponent.spec.ts
@@ -41,7 +41,7 @@ test("NestedComponent", async ({ page }) => {
   await page.locator('//*[@id="showpool_threads"]').click();
 
   expect(
-    await page.locator('//*[@id="showpool_threads"]').isChecked()
+    await page.locator('//*[@id="showpool_threads"]').isChecked(),
   ).toBeTruthy();
 
   //showtext_key
@@ -53,140 +53,140 @@ test("NestedComponent", async ({ page }) => {
   await page.locator('//*[@id="showindex_name"]').click();
 
   expect(
-    await page.locator('//*[@id="showindex_name"]').isChecked()
+    await page.locator('//*[@id="showindex_name"]').isChecked(),
   ).toBeFalsy();
 
   // shownamespace
   await page.locator('//*[@id="shownamespace"]').click();
 
   expect(
-    await page.locator('//*[@id="shownamespace"]').isChecked()
+    await page.locator('//*[@id="shownamespace"]').isChecked(),
   ).toBeFalsy();
 
   // showpinecone_api_key
   await page.locator('//*[@id="showpinecone_api_key"]').click();
 
   expect(
-    await page.locator('//*[@id="showpinecone_api_key"]').isChecked()
+    await page.locator('//*[@id="showpinecone_api_key"]').isChecked(),
   ).toBeFalsy();
 
   // showindex_name
   await page.locator('//*[@id="showindex_name"]').click();
 
   expect(
-    await page.locator('//*[@id="showindex_name"]').isChecked()
+    await page.locator('//*[@id="showindex_name"]').isChecked(),
   ).toBeTruthy();
 
   // shownamespace
   await page.locator('//*[@id="shownamespace"]').click();
 
   expect(
-    await page.locator('//*[@id="shownamespace"]').isChecked()
+    await page.locator('//*[@id="shownamespace"]').isChecked(),
   ).toBeTruthy();
 
   // showpinecone_api_key
   await page.locator('//*[@id="showpinecone_api_key"]').click();
 
   expect(
-    await page.locator('//*[@id="showpinecone_api_key"]').isChecked()
+    await page.locator('//*[@id="showpinecone_api_key"]').isChecked(),
   ).toBeTruthy();
 
   // showindex_name
   await page.locator('//*[@id="showindex_name"]').click();
 
   expect(
-    await page.locator('//*[@id="showindex_name"]').isChecked()
+    await page.locator('//*[@id="showindex_name"]').isChecked(),
   ).toBeFalsy();
 
   // shownamespace
   await page.locator('//*[@id="shownamespace"]').click();
 
   expect(
-    await page.locator('//*[@id="shownamespace"]').isChecked()
+    await page.locator('//*[@id="shownamespace"]').isChecked(),
   ).toBeFalsy();
 
   // showpinecone_api_key
   await page.locator('//*[@id="showpinecone_api_key"]').click();
 
   expect(
-    await page.locator('//*[@id="showpinecone_api_key"]').isChecked()
+    await page.locator('//*[@id="showpinecone_api_key"]').isChecked(),
   ).toBeFalsy();
 
   // showindex_name
   await page.locator('//*[@id="showindex_name"]').click();
 
   expect(
-    await page.locator('//*[@id="showindex_name"]').isChecked()
+    await page.locator('//*[@id="showindex_name"]').isChecked(),
   ).toBeTruthy();
 
   // shownamespace
   await page.locator('//*[@id="shownamespace"]').click();
 
   expect(
-    await page.locator('//*[@id="shownamespace"]').isChecked()
+    await page.locator('//*[@id="shownamespace"]').isChecked(),
   ).toBeTruthy();
 
   // showpinecone_api_key
   await page.locator('//*[@id="showpinecone_api_key"]').click();
 
   expect(
-    await page.locator('//*[@id="showpinecone_api_key"]').isChecked()
+    await page.locator('//*[@id="showpinecone_api_key"]').isChecked(),
   ).toBeTruthy();
 
   // showindex_name
   await page.locator('//*[@id="showindex_name"]').click();
 
   expect(
-    await page.locator('//*[@id="showindex_name"]').isChecked()
+    await page.locator('//*[@id="showindex_name"]').isChecked(),
   ).toBeFalsy();
 
   // shownamespace
   await page.locator('//*[@id="shownamespace"]').click();
 
   expect(
-    await page.locator('//*[@id="shownamespace"]').isChecked()
+    await page.locator('//*[@id="shownamespace"]').isChecked(),
   ).toBeFalsy();
 
   // showpinecone_api_key
   await page.locator('//*[@id="showpinecone_api_key"]').click();
 
   expect(
-    await page.locator('//*[@id="showpinecone_api_key"]').isChecked()
+    await page.locator('//*[@id="showpinecone_api_key"]').isChecked(),
   ).toBeFalsy();
 
   // showindex_name
   await page.locator('//*[@id="showindex_name"]').click();
 
   expect(
-    await page.locator('//*[@id="showindex_name"]').isChecked()
+    await page.locator('//*[@id="showindex_name"]').isChecked(),
   ).toBeTruthy();
 
   // shownamespace
   await page.locator('//*[@id="shownamespace"]').click();
 
   expect(
-    await page.locator('//*[@id="shownamespace"]').isChecked()
+    await page.locator('//*[@id="shownamespace"]').isChecked(),
   ).toBeTruthy();
 
   // showpinecone_api_key
   await page.locator('//*[@id="showpinecone_api_key"]').click();
 
   expect(
-    await page.locator('//*[@id="showpinecone_api_key"]').isChecked()
+    await page.locator('//*[@id="showpinecone_api_key"]').isChecked(),
   ).toBeTruthy();
 
   //showpool_threads
   await page.locator('//*[@id="showpool_threads"]').click();
 
   expect(
-    await page.locator('//*[@id="showpool_threads"]').isChecked()
+    await page.locator('//*[@id="showpool_threads"]').isChecked(),
   ).toBeFalsy();
 
   //showtext_key
   await page.locator('//*[@id="showtext_key"]').click();
 
   expect(
-    await page.locator('//*[@id="showtext_key"]').isChecked()
+    await page.locator('//*[@id="showtext_key"]').isChecked(),
   ).toBeTruthy();
 
   await page.getByText("Save Changes", { exact: true }).click();
diff --git a/src/frontend/tests/end-to-end/promptModalComponent.spec.ts b/src/frontend/tests/end-to-end/promptModalComponent.spec.ts
index cadb87eee..b91cb6ed5 100644
--- a/src/frontend/tests/end-to-end/promptModalComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/promptModalComponent.spec.ts
@@ -140,7 +140,7 @@ test("PromptTemplateComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showtemplate"]').click();
   expect(
-    await page.locator('//*[@id="showtemplate"]').isChecked()
+    await page.locator('//*[@id="showtemplate"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showprompt"]').click();
@@ -160,7 +160,7 @@ test("PromptTemplateComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showtemplate"]').click();
   expect(
-    await page.locator('//*[@id="showtemplate"]').isChecked()
+    await page.locator('//*[@id="showtemplate"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showprompt"]').click();
diff --git a/src/frontend/tests/end-to-end/python_api_generation.spec.ts b/src/frontend/tests/end-to-end/python_api_generation.spec.ts
index e9ad74578..849c4e9a9 100644
--- a/src/frontend/tests/end-to-end/python_api_generation.spec.ts
+++ b/src/frontend/tests/end-to-end/python_api_generation.spec.ts
@@ -23,7 +23,7 @@ test("python_api_generation", async ({ page, context }) => {
   await page.getByRole("tab", { name: "Python API" }).click();
   await page.getByTestId("icon-Copy").click();
   const handle = await page.evaluateHandle(() =>
-    navigator.clipboard.readText()
+    navigator.clipboard.readText(),
   );
   const clipboardContent = await handle.jsonValue();
   expect(clipboardContent.length).toBeGreaterThan(0);
diff --git a/src/frontend/tests/end-to-end/saveComponents.spec.ts b/src/frontend/tests/end-to-end/saveComponents.spec.ts
index f8484c722..fa9dbbc00 100644
--- a/src/frontend/tests/end-to-end/saveComponents.spec.ts
+++ b/src/frontend/tests/end-to-end/saveComponents.spec.ts
@@ -27,7 +27,7 @@ test.describe("save component tests", () => {
     // Read your file into a buffer.
     const jsonContent = readFileSync(
       "src/frontend/tests/end-to-end/assets/flow_group_test.json",
-      "utf-8"
+      "utf-8",
     );
 
     // Create the DataTransfer and File
@@ -49,7 +49,7 @@ test.describe("save component tests", () => {
       "drop",
       {
         dataTransfer,
-      }
+      },
     );
 
     const genericNoda = page.getByTestId("div-generic-node");
diff --git a/src/frontend/tests/end-to-end/store.spec.ts b/src/frontend/tests/end-to-end/store.spec.ts
index 13963d698..8e443ecdd 100644
--- a/src/frontend/tests/end-to-end/store.spec.ts
+++ b/src/frontend/tests/end-to-end/store.spec.ts
@@ -262,7 +262,7 @@ test("should share component with share button", async ({ page }) => {
   await page.getByText("Set workflow status to public").isVisible();
   await page
     .getByText(
-      "Attention: API keys in specified fields are automatically removed upon sharing."
+      "Attention: API keys in specified fields are automatically removed upon sharing.",
     )
     .isVisible();
   await page.getByText("Export").first().isVisible();
diff --git a/src/frontend/tests/end-to-end/textAreaModalComponent.spec.ts b/src/frontend/tests/end-to-end/textAreaModalComponent.spec.ts
index 3982ef07f..590d43933 100644
--- a/src/frontend/tests/end-to-end/textAreaModalComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/textAreaModalComponent.spec.ts
@@ -51,7 +51,7 @@ test("TextAreaModalComponent", async ({ page }) => {
   await page
     .getByTestId("textarea-text")
     .fill(
-      "test test test test test test test test test test test !@#%*)( 123456789101010101010101111111111 !!!!!!!!!!"
+      "test test test test test test test test test test test !@#%*)( 123456789101010101010101111111111 !!!!!!!!!!",
     );
 
   await page.getByTestId("textarea-text-ExternalLink").click();
diff --git a/src/frontend/tests/end-to-end/textInputOutput.spec.ts b/src/frontend/tests/end-to-end/textInputOutput.spec.ts
index abef18228..3d2823ebe 100644
--- a/src/frontend/tests/end-to-end/textInputOutput.spec.ts
+++ b/src/frontend/tests/end-to-end/textInputOutput.spec.ts
@@ -60,7 +60,7 @@ test("TextInputOutputComponent", async ({ page }) => {
   // Click and hold on the first element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[1]/div/div[2]/div[6]/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[1]/div/div[2]/div[6]/button/div/div',
     )
     .hover();
   await page.mouse.down();
@@ -68,7 +68,7 @@ test("TextInputOutputComponent", async ({ page }) => {
   // Move to the second element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[3]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[3]/div/button/div/div',
     )
     .hover();
 
@@ -92,7 +92,7 @@ test("TextInputOutputComponent", async ({ page }) => {
   // Click and hold on the first element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[13]/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[2]/div/div[2]/div[13]/button/div/div',
     )
     .hover();
   await page.mouse.down();
@@ -100,7 +100,7 @@ test("TextInputOutputComponent", async ({ page }) => {
   // Move to the second element
   await page
     .locator(
-      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[3]/div/div[2]/div[3]/div/button/div/div'
+      '//*[@id="react-flow-id"]/div/div[1]/div[1]/div/div[2]/div[3]/div/div[2]/div[3]/div/button/div/div',
     )
     .hover();
 
diff --git a/src/frontend/tests/end-to-end/toggleComponent.spec.ts b/src/frontend/tests/end-to-end/toggleComponent.spec.ts
index 5a8d9a36a..58d909af4 100644
--- a/src/frontend/tests/end-to-end/toggleComponent.spec.ts
+++ b/src/frontend/tests/end-to-end/toggleComponent.spec.ts
@@ -45,7 +45,7 @@ test("ToggleComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showload_hidden"]').click();
   expect(
-    await page.locator('//*[@id="showload_hidden"]').isChecked()
+    await page.locator('//*[@id="showload_hidden"]').isChecked(),
   ).toBeTruthy();
 
   await page.getByText("Save Changes", { exact: true }).click();
@@ -81,12 +81,12 @@ test("ToggleComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showload_hidden"]').click();
   expect(
-    await page.locator('//*[@id="showload_hidden"]').isChecked()
+    await page.locator('//*[@id="showload_hidden"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showmax_concurrency"]').click();
   expect(
-    await page.locator('//*[@id="showmax_concurrency"]').isChecked()
+    await page.locator('//*[@id="showmax_concurrency"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showpath"]').click();
@@ -94,22 +94,22 @@ test("ToggleComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showrecursive"]').click();
   expect(
-    await page.locator('//*[@id="showrecursive"]').isChecked()
+    await page.locator('//*[@id="showrecursive"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showsilent_errors"]').click();
   expect(
-    await page.locator('//*[@id="showsilent_errors"]').isChecked()
+    await page.locator('//*[@id="showsilent_errors"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showuse_multithreading"]').click();
   expect(
-    await page.locator('//*[@id="showuse_multithreading"]').isChecked()
+    await page.locator('//*[@id="showuse_multithreading"]').isChecked(),
   ).toBeTruthy();
 
   await page.locator('//*[@id="showmax_concurrency"]').click();
   expect(
-    await page.locator('//*[@id="showmax_concurrency"]').isChecked()
+    await page.locator('//*[@id="showmax_concurrency"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showpath"]').click();
@@ -117,17 +117,17 @@ test("ToggleComponent", async ({ page }) => {
 
   await page.locator('//*[@id="showrecursive"]').click();
   expect(
-    await page.locator('//*[@id="showrecursive"]').isChecked()
+    await page.locator('//*[@id="showrecursive"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showsilent_errors"]').click();
   expect(
-    await page.locator('//*[@id="showsilent_errors"]').isChecked()
+    await page.locator('//*[@id="showsilent_errors"]').isChecked(),
   ).toBeFalsy();
 
   await page.locator('//*[@id="showuse_multithreading"]').click();
   expect(
-    await page.locator('//*[@id="showuse_multithreading"]').isChecked()
+    await page.locator('//*[@id="showuse_multithreading"]').isChecked(),
   ).toBeFalsy();
 
   await page.getByText("Save Changes", { exact: true }).click();
@@ -144,38 +144,38 @@ test("ToggleComponent", async ({ page }) => {
 
     await page.locator('//*[@id="showload_hidden"]').click();
     expect(
-      await page.locator('//*[@id="showload_hidden"]').isChecked()
+      await page.locator('//*[@id="showload_hidden"]').isChecked(),
     ).toBeTruthy();
 
     expect(
-      await page.getByTestId("toggle-edit-load_hidden").isChecked()
+      await page.getByTestId("toggle-edit-load_hidden").isChecked(),
     ).toBeTruthy();
 
     await page.getByText("Save Changes", { exact: true }).click();
 
     await page.getByTestId("toggle-load_hidden").click();
     expect(
-      await page.getByTestId("toggle-load_hidden").isChecked()
+      await page.getByTestId("toggle-load_hidden").isChecked(),
     ).toBeFalsy();
 
     await page.getByTestId("toggle-load_hidden").click();
     expect(
-      await page.getByTestId("toggle-load_hidden").isChecked()
+      await page.getByTestId("toggle-load_hidden").isChecked(),
     ).toBeTruthy();
 
     await page.getByTestId("toggle-load_hidden").click();
     expect(
-      await page.getByTestId("toggle-load_hidden").isChecked()
+      await page.getByTestId("toggle-load_hidden").isChecked(),
     ).toBeFalsy();
 
     await page.getByTestId("toggle-load_hidden").click();
     expect(
-      await page.getByTestId("toggle-load_hidden").isChecked()
+      await page.getByTestId("toggle-load_hidden").isChecked(),
     ).toBeTruthy();
 
     await page.getByTestId("toggle-load_hidden").click();
     expect(
-      await page.getByTestId("toggle-load_hidden").isChecked()
+      await page.getByTestId("toggle-load_hidden").isChecked(),
     ).toBeFalsy();
   }
 });
diff --git a/src/frontend/tests/end-to-end/tweaks_test.spec.ts b/src/frontend/tests/end-to-end/tweaks_test.spec.ts
index b3d396f55..2d85cc8dc 100644
--- a/src/frontend/tests/end-to-end/tweaks_test.spec.ts
+++ b/src/frontend/tests/end-to-end/tweaks_test.spec.ts
@@ -24,7 +24,7 @@ test("curl_api_generation", async ({ page, context }) => {
   await page.getByRole("tab", { name: "cURL" }).click();
   await page.getByTestId("icon-Copy").click();
   const handle = await page.evaluateHandle(() =>
-    navigator.clipboard.readText()
+    navigator.clipboard.readText(),
   );
   const clipboardContent = await handle.jsonValue();
   const oldValue = clipboardContent;
@@ -50,7 +50,7 @@ test("curl_api_generation", async ({ page, context }) => {
   await page.getByRole("tab", { name: "cURL" }).click();
   await page.getByTestId("icon-Copy").click();
   const handle2 = await page.evaluateHandle(() =>
-    navigator.clipboard.readText()
+    navigator.clipboard.readText(),
   );
   const clipboardContent2 = await handle2.jsonValue();
   const newValue = clipboardContent2;