diff --git a/src/frontend/package-lock.json b/src/frontend/package-lock.json
index 673f56f10..0edd88d0d 100644
--- a/src/frontend/package-lock.json
+++ b/src/frontend/package-lock.json
@@ -1212,15 +1212,15 @@
       "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ=="
     },
     "node_modules/@mui/system": {
-      "version": "5.13.5",
-      "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.13.5.tgz",
-      "integrity": "sha512-n0gzUxoZ2ZHZgnExkh2Htvo9uW2oakofgPRQrDoa/GQOWyRD0NH9MDszBwOb6AAoXZb+OV5TE7I4LeZ/dzgHYA==",
+      "version": "5.13.6",
+      "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.13.6.tgz",
+      "integrity": "sha512-G3Xr28uLqU3DyF6r2LQkHGw/ku4P0AHzlKVe7FGXOPl7X1u+hoe2xxj8Vdiq/69II/mh9OP21i38yBWgWb7WgQ==",
       "dependencies": {
-        "@babel/runtime": "^7.21.0",
+        "@babel/runtime": "^7.22.5",
         "@mui/private-theming": "^5.13.1",
         "@mui/styled-engine": "^5.13.2",
         "@mui/types": "^7.2.4",
-        "@mui/utils": "^5.13.1",
+        "@mui/utils": "^5.13.6",
         "clsx": "^1.2.1",
         "csstype": "^3.1.2",
         "prop-types": "^15.8.1"
@@ -1280,11 +1280,11 @@
       }
     },
     "node_modules/@mui/utils": {
-      "version": "5.13.1",
-      "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.13.1.tgz",
-      "integrity": "sha512-6lXdWwmlUbEU2jUI8blw38Kt+3ly7xkmV9ljzY4Q20WhsJMWiNry9CX8M+TaP/HbtuyR8XKsdMgQW7h7MM3n3A==",
+      "version": "5.13.6",
+      "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.13.6.tgz",
+      "integrity": "sha512-ggNlxl5NPSbp+kNcQLmSig6WVB0Id+4gOxhx644987v4fsji+CSXc+MFYLocFB/x4oHtzCUlSzbVHlJfP/fXoQ==",
       "dependencies": {
-        "@babel/runtime": "^7.21.0",
+        "@babel/runtime": "^7.22.5",
         "@types/prop-types": "^15.7.5",
         "@types/react-is": "^18.2.0",
         "prop-types": "^15.8.1",
@@ -3444,7 +3444,7 @@
       "version": "16.18.12",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.12.tgz",
       "integrity": "sha512-vzLe5NaNMjIE3mcddFVGlAXN1LEWueUsMsOJWaT6wWMJGyljHAWHznqfnKUQWGzu7TLPrGvWdNAsvQYW+C0xtw==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/@types/parse-json": {
       "version": "4.0.0",
@@ -3714,9 +3714,9 @@
       }
     },
     "node_modules/aria-query": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.2.1.tgz",
-      "integrity": "sha512-7uFg4b+lETFgdaJyETnILsXgnnzVnkHcgRbwbPwevm5x/LmUlt3MjczMRe1zg824iBgXZNRPTBftNYyRSKLp2g==",
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
+      "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
       "dev": true,
       "dependencies": {
         "dequal": "^2.0.3"
@@ -5010,9 +5010,9 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.438",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.438.tgz",
-      "integrity": "sha512-x94U0FhphEsHsOloCvlsujHCvoir0ZQ73ZAs/QN4PLx98uNvyEU79F75rq1db75Bx/atvuh7KPeuxelh+xfYJw=="
+      "version": "1.4.440",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.440.tgz",
+      "integrity": "sha512-r6dCgNpRhPwiWlxbHzZQ/d9swfPaEJGi8ekqRBwQYaR3WmA5VkqQfBWSDDjuJU1ntO+W9tHx8OHV/96Q8e0dVw=="
     },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
@@ -5504,6 +5504,7 @@
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
       "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "dev": true,
       "hasInstallScript": true,
       "optional": true,
       "os": [
@@ -6745,9 +6746,9 @@
       }
     },
     "node_modules/katex": {
-      "version": "0.16.7",
-      "resolved": "https://registry.npmjs.org/katex/-/katex-0.16.7.tgz",
-      "integrity": "sha512-Xk9C6oGKRwJTfqfIbtr0Kes9OSv6IFsuhFGc7tW4urlpMJtuh+7YhzU6YEG9n8gmWKcMAFzkp7nr+r69kV0zrA==",
+      "version": "0.16.8",
+      "resolved": "https://registry.npmjs.org/katex/-/katex-0.16.8.tgz",
+      "integrity": "sha512-ftuDnJbcbOckGY11OO+zg3OofESlbR5DRl2cmN8HeWeeFIV7wTXvAOx8kEjZjobhA+9wh2fbKeO6cdcA9Mnovg==",
       "funding": [
         "https://opencollective.com/katex",
         "https://github.com/sponsors/katex"
diff --git a/src/frontend/src/components/dropdownComponent/index.tsx b/src/frontend/src/components/dropdownComponent/index.tsx
index 605a24041..e252e1b21 100644
--- a/src/frontend/src/components/dropdownComponent/index.tsx
+++ b/src/frontend/src/components/dropdownComponent/index.tsx
@@ -16,7 +16,6 @@ export default function Dropdown({
 }: DropDownComponentType) {
   const { closePopUp } = useContext(PopUpContext);
 
-
   let [internalValue, setInternalValue] = useState(
     value === "" || !value ? "Choose an option" : value
   );
@@ -87,9 +86,7 @@ export default function Dropdown({
                         )
                       }
                       value={option}
-                      
                     >
-
                       {({ selected, active }) => (
                         <>
                           <span
diff --git a/src/frontend/src/components/floatComponent/index.tsx b/src/frontend/src/components/floatComponent/index.tsx
index c1ad3e7e9..a7b382c31 100644
--- a/src/frontend/src/components/floatComponent/index.tsx
+++ b/src/frontend/src/components/floatComponent/index.tsx
@@ -30,7 +30,6 @@ export default function FloatComponent({
     setMyValue(value);
   }, [closePopUp]);
 
-
   return (
     <div
       className={
diff --git a/src/frontend/src/components/inputListComponent/index.tsx b/src/frontend/src/components/inputListComponent/index.tsx
index f50626e15..6a048cd2c 100644
--- a/src/frontend/src/components/inputListComponent/index.tsx
+++ b/src/frontend/src/components/inputListComponent/index.tsx
@@ -26,9 +26,7 @@ export default function InputListComponent({
   useEffect(() => {
     setInputList(value);
   }, [closePopUp]);
-  
 
-  
   return (
     <div
       className={
diff --git a/src/frontend/src/components/intComponent/index.tsx b/src/frontend/src/components/intComponent/index.tsx
index 0c043a6bf..7ed484b3b 100644
--- a/src/frontend/src/components/intComponent/index.tsx
+++ b/src/frontend/src/components/intComponent/index.tsx
@@ -28,7 +28,6 @@ export default function IntComponent({
     setMyValue(value);
   }, [closePopUp]);
 
-
   return (
     <div
       className={
diff --git a/src/frontend/src/contexts/tabsContext.tsx b/src/frontend/src/contexts/tabsContext.tsx
index 7637699e3..fe5160332 100644
--- a/src/frontend/src/contexts/tabsContext.tsx
+++ b/src/frontend/src/contexts/tabsContext.tsx
@@ -192,26 +192,28 @@ export function TabsProvider({ children }: { children: ReactNode }) {
   }
 
   function processFlowEdges(flow) {
-    if(!flow.data || !flow.data.edges) return;
+    if (!flow.data || !flow.data.edges) return;
     flow.data.edges.forEach((edge) => {
       edge.className = "";
       edge.style = { stroke: "#555555" };
     });
   }
-  function updateDisplay_name(node:NodeType,template:APIClassType) {
-    node.data.node.display_name = template["display_name"]?template["display_name"]:node.data.type;
+  function updateDisplay_name(node: NodeType, template: APIClassType) {
+    node.data.node.display_name = template["display_name"]
+      ? template["display_name"]
+      : node.data.type;
   }
 
   function processFlowNodes(flow) {
-    if(!flow.data || !flow.data.nodes) return;
-    flow.data.nodes.forEach((node:NodeType) => {
+    if (!flow.data || !flow.data.nodes) return;
+    flow.data.nodes.forEach((node: NodeType) => {
       const template = templates[node.data.type];
       if (!template) {
         setErrorData({ title: `Unknown node type: ${node.data.type}` });
         return;
       }
       if (Object.keys(template["template"]).length > 0) {
-        updateDisplay_name(node,template);
+        updateDisplay_name(node, template);
         updateNodeBaseClasses(node, template);
         updateNodeEdges(flow, node, template);
         updateNodeDescription(node, template);
@@ -220,11 +222,15 @@ export function TabsProvider({ children }: { children: ReactNode }) {
     });
   }
 
-  function updateNodeBaseClasses(node:NodeType,template:APIClassType) {
+  function updateNodeBaseClasses(node: NodeType, template: APIClassType) {
     node.data.node.base_classes = template["base_classes"];
   }
 
-  function updateNodeEdges(flow:FlowType, node:NodeType,template:APIClassType) {
+  function updateNodeEdges(
+    flow: FlowType,
+    node: NodeType,
+    template: APIClassType
+  ) {
     flow.data.edges.forEach((edge) => {
       if (edge.source === node.id) {
         edge.sourceHandle = edge.sourceHandle
@@ -236,11 +242,11 @@ export function TabsProvider({ children }: { children: ReactNode }) {
     });
   }
 
-  function updateNodeDescription(node:NodeType,template:APIClassType) {
+  function updateNodeDescription(node: NodeType, template: APIClassType) {
     node.data.node.description = template["description"];
   }
 
-  function updateNodeTemplate(node:NodeType,template:APIClassType) {
+  function updateNodeTemplate(node: NodeType, template: APIClassType) {
     node.data.node.template = updateTemplate(
       template["template"] as unknown as APITemplateType,
       node.data.node.template as APITemplateType
@@ -404,7 +410,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
           y: insidePosition.y + n.position.y - minimumY,
         },
         data: {
-          ...n.data,
+          ..._.cloneDeep(n.data),
           id: newId,
         },
       };
diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx
index 8b373c4e2..d6fff5d9f 100644
--- a/src/frontend/src/modals/ApiModal/index.tsx
+++ b/src/frontend/src/modals/ApiModal/index.tsx
@@ -103,7 +103,9 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
           <div className="flex items-center justify-between px-2">
             <TabsList>
               {tabs.map((tab, index) => (
-                <TabsTrigger key={index} value={index.toString()}>{tab.name}</TabsTrigger>
+                <TabsTrigger key={index} value={index.toString()}>
+                  {tab.name}
+                </TabsTrigger>
               ))}
             </TabsList>
             <div className="float-right">
diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx
index fa7563bfb..e2f9c7bca 100644
--- a/src/frontend/src/modals/EditNodeModal/index.tsx
+++ b/src/frontend/src/modals/EditNodeModal/index.tsx
@@ -79,7 +79,7 @@ export default function EditNodeModal({ data }: { data: NodeDataType }) {
   }
 
   return (
-    <Dialog open={true} onOpenChange={setModalOpen} >
+    <Dialog open={true} onOpenChange={setModalOpen}>
       <DialogTrigger asChild></DialogTrigger>
       <DialogContent className="lg:max-w-[700px] ">
         <DialogHeader>