diff --git a/src/frontend/src/components/AccordionComponent/index.tsx b/src/frontend/src/components/AccordionComponent/index.tsx
index d083bbaff..3cd836c1f 100644
--- a/src/frontend/src/components/AccordionComponent/index.tsx
+++ b/src/frontend/src/components/AccordionComponent/index.tsx
@@ -17,7 +17,6 @@ export default function AccordionComponent({
   );
 
   console.log(open);
-  
 
   function getOpenAccordion() {
     let value = "";
diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx
index 14eabd0bc..1d530ca6d 100644
--- a/src/frontend/src/modals/ApiModal/index.tsx
+++ b/src/frontend/src/modals/ApiModal/index.tsx
@@ -50,7 +50,6 @@ import { TabsContext } from "../../contexts/tabsContext";
 import { FlowType } from "../../types/flow/index";
 import { buildTweaks, classNames } from "../../utils";
 import BaseModal from "../baseModal";
-import { PopUpContext } from "../../contexts/popUpContext";
 
 const ApiModal = forwardRef(
   (
@@ -63,14 +62,13 @@ const ApiModal = forwardRef(
     },
     ref
   ) => {
-
     const [activeTab, setActiveTab] = useState("0");
+    const [open, setOpen] = useState(false);
     const [isCopied, setIsCopied] = useState<Boolean>(false);
     const [openAccordion, setOpenAccordion] = useState([]);
     const tweak = useRef([]);
     const tweaksList = useRef([]);
     const { setTweak, getTweak, tabsState } = useContext(TabsContext);
-    const { closePopUp } = useContext(PopUpContext);
 
     const copyToClipboard = () => {
       if (!navigator.clipboard || !navigator.clipboard.writeText) {
@@ -109,29 +107,25 @@ const ApiModal = forwardRef(
         image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
         code: pythonCode,
       },
-      
     ]);
 
-    function startState(){
+    function startState() {
       tweak.current = [];
       setTweak([]);
       tweaksList.current = [];
     }
 
     useEffect(() => {
-
-      if(flow["data"]["nodes"].length == 0){
+      if (flow["data"]["nodes"].length == 0) {
         startState();
-      }
-
-      else {
+      } else {
         tweak.current = [];
         const t = buildTweaks(flow);
         tweak.current.push(t);
       }
 
       filterNodes();
-      
+
       if (Object.keys(tweaksCode).length > 0) {
         setActiveTab("0");
         setTabs([
@@ -159,12 +153,9 @@ const ApiModal = forwardRef(
             mode: "python",
             image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
             code: pythonCode,
-          }
-    
-        ])
-      }
-
-      else{
+          },
+        ]);
+      } else {
         setTabs([
           {
             name: "cURL",
@@ -184,13 +175,10 @@ const ApiModal = forwardRef(
             mode: "python",
             image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
             code: pythonCode,
-          }
-    
-        ])
+          },
+        ]);
       }
-      
-    }, [flow["data"]["nodes"], closePopUp]);
-
+    }, [flow["data"]["nodes"], open]);
 
     function filterNodes() {
       let arrNodesWithValues = [];
@@ -309,20 +297,13 @@ const ApiModal = forwardRef(
         });
       });
 
-      if(accordionsToOpen.length == 0){
+      if (accordionsToOpen.length == 0) {
         setOpenAccordion([]);
       }
-      
     }
 
-    const setOpen = (x: boolean) => {
-      if(x) {
-        closePopUp();
-      }
-    };
-
     return (
-      <BaseModal setOpen={setOpen}>
+      <BaseModal open={open} setOpen={setOpen}>
         <BaseModal.Trigger>{children}</BaseModal.Trigger>
         <BaseModal.Header description={EXPORT_CODE_DIALOG}>
           <span className="pr-2">Code</span>
diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx
index 32ea676f0..d1c95e509 100644
--- a/src/frontend/src/modals/EditNodeModal/index.tsx
+++ b/src/frontend/src/modals/EditNodeModal/index.tsx
@@ -20,12 +20,12 @@ import {
   TableHeader,
   TableRow,
 } from "../../components/ui/table";
+import { PopUpContext } from "../../contexts/popUpContext";
 import { TabsContext } from "../../contexts/tabsContext";
 import { typesContext } from "../../contexts/typesContext";
 import { NodeDataType } from "../../types/flow";
 import { classNames, limitScrollFieldsModal } from "../../utils";
 import BaseModal from "../baseModal";
-import { PopUpContext } from "../../contexts/popUpContext";
 
 const EditNodeModal = forwardRef(
   (
@@ -76,7 +76,7 @@ const EditNodeModal = forwardRef(
     };
 
     const setOpen = (x: boolean) => {
-      if(!x) {
+      if (!x) {
         closePopUp();
       }
       if (nodeLength > 0) setModalOpen(x);
diff --git a/src/frontend/tailwind.config.js b/src/frontend/tailwind.config.js
index 54156f712..a3e0452c9 100644
--- a/src/frontend/tailwind.config.js
+++ b/src/frontend/tailwind.config.js
@@ -132,7 +132,7 @@ module.exports = {
       keyframes: {
         slideDown: {
           from: { height: 0 },
-          to: { height: '100vh' },
+          to: { height: "100vh" },
         },
         slideUp: {
           from: { height: "var(--radix-accordion-content-height)" },