diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index c35fd869b..915ab41ae 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -227,8 +227,8 @@ export default function ParameterComponent({
           </div>
         ) : left === true && type === "code" ? (
           <CodeAreaComponent
-          setTemplate={(template)=>{data.node.template = template}}
-            template={data.node.template}
+          setNodeClass={(nodeClass)=>{data.node = nodeClass}}
+            nodeClass={data.node}
             disabled={disabled}
             value={data.node.template[name].value ?? ""}
             onChange={handleOnNewValue}
diff --git a/src/frontend/src/components/codeAreaComponent/index.tsx b/src/frontend/src/components/codeAreaComponent/index.tsx
index a4b7231c8..14e444ccc 100644
--- a/src/frontend/src/components/codeAreaComponent/index.tsx
+++ b/src/frontend/src/components/codeAreaComponent/index.tsx
@@ -11,8 +11,8 @@ export default function CodeAreaComponent({
   onChange,
   disabled,
   editNode = false,
-  template,
-  setTemplate,
+  nodeClass,
+  setNodeClass,
 }: CodeAreaComponentType) {
   const [myValue, setMyValue] = useState(value);
   const { openPopUp } = useContext(PopUpContext);
@@ -39,8 +39,8 @@ export default function CodeAreaComponent({
             openPopUp(
               <CodeAreaModal
                 value={myValue}
-                template={template}
-                setTemplate={setTemplate}
+                nodeClass={nodeClass}
+                setNodeClass={setNodeClass}
                 setValue={(t: string) => {
                   setMyValue(t);
                   onChange(t);
@@ -63,9 +63,9 @@ export default function CodeAreaComponent({
           onClick={() => {
             openPopUp(
               <CodeAreaModal
-              setTemplate={setTemplate}
+              setNodeClass={setNodeClass}
                 value={myValue}
-                template={template}
+                nodeClass={nodeClass}
                 setValue={(t: string) => {
                   setMyValue(t);
                   onChange(t);
diff --git a/src/frontend/src/controllers/API/index.ts b/src/frontend/src/controllers/API/index.ts
index 516e34201..df285f419 100644
--- a/src/frontend/src/controllers/API/index.ts
+++ b/src/frontend/src/controllers/API/index.ts
@@ -4,6 +4,7 @@ import {
   errorsTypeAPI,
   InitTypeAPI,
   APITemplateType,
+  APIClassType,
 } from "./../../types/api/index";
 import { APIObjectType, sendAllProps } from "../../types/api/index";
 import axios, { AxiosResponse } from "axios";
@@ -321,8 +322,6 @@ export async function postBuildInit(
   return await axios.post(`/api/v1/build/init`, flow);
 }
 
-export async function postCustomComponent(
-  code: string
-): Promise<AxiosResponse<{ template: APITemplateType }>> {
-  return await axios.post(`/api/v1/custom_component`, { code });
+export async function UpdateTemplate(type:string, template:APITemplateType):Promise<AxiosResponse<{template:APITemplateType}>>{
+  return await axios.get(`/dynamic_node`);
 }
diff --git a/src/frontend/src/modals/codeAreaModal/index.tsx b/src/frontend/src/modals/codeAreaModal/index.tsx
index 536404fcc..a2015f5d2 100644
--- a/src/frontend/src/modals/codeAreaModal/index.tsx
+++ b/src/frontend/src/modals/codeAreaModal/index.tsx
@@ -21,18 +21,19 @@ import {
 } from "../../components/ui/dialog";
 import { Button } from "../../components/ui/button";
 import { CODE_PROMPT_DIALOG_SUBTITLE } from "../../constants";
-import { APITemplateType } from "../../types/api";
+import Loading from "../../components/ui/loading";
+import { APIClassType, APITemplateType } from "../../types/api";
 
 export default function CodeAreaModal({
   value,
   setValue,
-  template,
-  setTemplate,
+  nodeClass,
+  setNodeClass
 }: {
   setValue: (value: string) => void;
   value: string;
-  template: APITemplateType;
-  setTemplate: (template: APITemplateType) => void;
+  nodeClass: APIClassType,
+  setNodeClass: (Class: APIClassType) => void;
 }) {
   const [open, setOpen] = useState(true);
   const [code, setCode] = useState(value);
@@ -86,14 +87,16 @@ export default function CodeAreaModal({
       .catch((_) => {
         setLoading(false);
         setErrorData({
-          title: "There is something wrong with this code, please review it",
-        });
-      });
-    postCustomComponent(code).then((apiReturn) => {
+          title:
+            "There is something wrong with this code, please review it",
+        })
+      }
+      );
+    UpdateTemplate('code',nodeClass).then((apiReturn) => {
       const data = apiReturn.data;
-      if (data.template) {
-        console.log("updated");
-        setTemplate(data.template);
+      if (data) {
+        console.log(data)   
+        setNodeClass(data);
         setModalOpen(false);
       }
     });
diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts
index 5b31d63f1..845b853c8 100644
--- a/src/frontend/src/types/components/index.ts
+++ b/src/frontend/src/types/components/index.ts
@@ -1,7 +1,7 @@
 import { ForwardRefExoticComponent, ReactElement, ReactNode } from "react";
 import { NodeDataType } from "../flow/index";
 import { typesContextType } from "../typesContext";
-import { APITemplateType } from "../api";
+import { APIClassType, APITemplateType } from "../api";
 export type InputComponentType = {
   value: string;
   disabled?: boolean;
@@ -56,8 +56,8 @@ export type CodeAreaComponentType = {
   onChange: (value: string[] | string) => void;
   value: string;
   editNode?: boolean;
-  template: APITemplateType;
-  setTemplate: (value: APITemplateType) => void;
+  nodeClass: APIClassType;
+  setNodeClass: (value: APIClassType) => void;
 };
 
 export type FileComponentType = {