diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx
index 4b911369e..ea081a1f8 100644
--- a/src/frontend/src/modals/EditNodeModal/index.tsx
+++ b/src/frontend/src/modals/EditNodeModal/index.tsx
@@ -30,29 +30,16 @@ const EditNodeModal = forwardRef(
   (
     {
       data,
+      nodeLength,
       children,
     }: {
       data: NodeDataType;
+      nodeLength: number;
       children: ReactNode;
     },
     ref
   ) => {
     const [modalOpen, setModalOpen] = useState(false);
-
-    const [nodeLength, setNodeLength] = useState(
-      Object.keys(data.node.template).filter(
-        (t) =>
-          t.charAt(0) !== "_" &&
-          data.node.template[t].show &&
-          (data.node.template[t].type === "str" ||
-            data.node.template[t].type === "bool" ||
-            data.node.template[t].type === "float" ||
-            data.node.template[t].type === "code" ||
-            data.node.template[t].type === "prompt" ||
-            data.node.template[t].type === "file" ||
-            data.node.template[t].type === "int")
-      ).length
-    );
     const [nodeValue, setNodeValue] = useState(null);
     const { types } = useContext(typesContext);
     const { setTabsState, tabId } = useContext(TabsContext);
@@ -86,8 +73,12 @@ const EditNodeModal = forwardRef(
       });
     };
 
+    const setOpen = (x: boolean) => {
+      if (nodeLength > 0) setModalOpen(x);
+    };
+
     return (
-      <BaseModal size="large-h-full" open={modalOpen} setOpen={setModalOpen}>
+      <BaseModal size="large-h-full" open={modalOpen} setOpen={setOpen}>
         <BaseModal.Trigger>{children}</BaseModal.Trigger>
         <BaseModal.Header description={data.node?.description}>
           <span className="pr-2">{data.type}</span>
diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
index f91c0db08..820d7f360 100644
--- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
@@ -95,24 +95,17 @@ const NodeToolbarComponent = (props) => {
           </ShadTooltip>
 
           <ShadTooltip content="Edit" side="top">
-            <EditNodeModal data={props.data}>
-
-            <button
-              className={classNames(
-                "relative -ml-px inline-flex items-center rounded-r-md 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" +
-                  (nodeLength == 0
-                    ? " text-muted-foreground"
-                    : " text-foreground")
-              )}
-              onClick={(event) => {
-                if (nodeLength == 0) {
-                  event.preventDefault();
-                }
-              }}
-            >
-              <Settings2 className="h-4 w-4 "></Settings2>
-            </button>
-
+            <EditNodeModal data={props.data} nodeLength={nodeLength}>
+              <div
+                className={classNames(
+                  "relative -ml-px inline-flex items-center rounded-r-md 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" +
+                    (nodeLength == 0
+                      ? " text-muted-foreground"
+                      : " text-foreground")
+                )}
+              >
+                <Settings2 className="h-4 w-4 "></Settings2>
+              </div>
             </EditNodeModal>
           </ShadTooltip>
         </span>