diff --git a/gui/pages/Content/Agents/AgentCreate.js b/gui/pages/Content/Agents/AgentCreate.js
index 09e0f8063..f17368ca9 100644
--- a/gui/pages/Content/Agents/AgentCreate.js
+++ b/gui/pages/Content/Agents/AgentCreate.js
@@ -9,7 +9,9 @@ import {
   getOrganisationConfig,
   getLlmModels,
   updateExecution,
-  uploadFile, getAgentWorkflows
+  uploadFile,
+  getAgentDetails, editAgent,
+  getAgentWorkflows
 } from "@/pages/api/DashboardService";
 import {
   formatBytes,
@@ -34,7 +36,10 @@ export default function AgentCreate({
                                       template,
                                       internalId,
                                       sendKnowledgeData,
-                                      env
+                                      env,
+                                      edit,
+                                      editAgentId,
+                                      agents
                                     }) {
   const [advancedOptions, setAdvancedOptions] = useState(false);
   const [agentName, setAgentName] = useState("");
@@ -113,6 +118,8 @@ export default function AgentCreate({
   const [createModal, setCreateModal] = useState(false);
 
   const [scheduleData, setScheduleData] = useState(null);
+  const [editModal, setEditModal] = useState(false)
+
 
   useEffect(() => {
     getOrganisationConfig(organisationId, "model_api_key")
@@ -174,25 +181,18 @@ export default function AgentCreate({
       .catch((error) => {
         console.error('Error fetching agent workflows:', error);
       });
+    if (edit) {
+      editingAgent();
+    }
 
     if (template !== null) {
-      setLocalStorageValue("agent_name_" + String(internalId), template.name, setAgentName);
-      setLocalStorageValue("agent_description_" + String(internalId), template.description, setAgentDescription);
-      setLocalStorageValue("advanced_options_" + String(internalId), true, setAdvancedOptions);
+      fillDetails(template)
       setLocalStorageValue("agent_template_id_" + String(internalId), template.id, setAgentTemplateId);
 
       fetchAgentTemplateConfigLocal(template.id)
         .then((response) => {
           const data = response.data || [];
-          setLocalStorageArray("agent_goals_" + String(internalId), data.goal, setGoals);
-          setLocalStorageValue("agent_type_" + String(internalId), data.agent_type, setAgentType);
-          setLocalStorageArray("agent_constraints_" + String(internalId), data.constraints, setConstraints);
-          setLocalStorageValue("agent_iterations_" + String(internalId), data.max_iterations, setIterations);
-          setLocalStorageValue("agent_step_time_" + String(internalId), data.iteration_interval, setStepTime);
-          setLocalStorageValue("agent_permission_" + String(internalId), data.permission_type, setPermission);
-          setLocalStorageArray("agent_instructions_" + String(internalId), data.instruction, setInstructions);
-          setLocalStorageValue("agent_database_" + String(internalId), data.LTM_DB, setDatabase);
-          setLocalStorageValue("agent_model_" + String(internalId), data.model, setModel);
+          fillAdvancedDetails(data)
           setLocalStorageArray("tool_names_" + String(internalId), data.tools, setToolNames);
           setLocalStorageValue("is_agent_template_" + String(internalId), true, setShowButton);
           setShowButton(true);
@@ -255,6 +255,44 @@ export default function AgentCreate({
     setSearchValue('');
   };
 
+  const editingAgent = () => {
+    const isLoaded = localStorage.getItem('is_editing_agent_' + String(internalId));
+    const agent = agents.find(agent => agent.id === editAgentId);
+    if (!isLoaded) {
+      fillDetails(agent)
+    }
+    getAgentDetails(editAgentId, -1)
+        .then((response) => {
+          const data = response.data || []
+          if (!isLoaded) {
+            fillAdvancedDetails(data)
+            setLocalStorageArray("tool_names_" + String(internalId), data.tools.map(tool => tool.name), setToolNames);
+          }
+        })
+        .catch((error) => {
+          console.error('Error fetching agent details:', error);
+        });
+    localStorage.setItem('is_editing_agent_' + String(internalId), true);
+  };
+
+  const fillDetails = (agent) => {
+    setLocalStorageValue("agent_name_" + String(internalId), agent.name, setAgentName);
+    setLocalStorageValue("agent_description_" + String(internalId), agent.description, setAgentDescription);
+    setLocalStorageValue("advanced_options_" + String(internalId), true, setAdvancedOptions);
+  }
+  const fillAdvancedDetails = (data) => {
+    setLocalStorageArray("agent_goals_" + String(internalId), data.goal, setGoals);
+    setLocalStorageValue("agent_type_" + String(internalId), data.agent_type, setAgentType);
+    setLocalStorageArray("agent_constraints_" + String(internalId), data.constraints, setConstraints);
+    setLocalStorageValue("agent_iterations_" + String(internalId), data.max_iterations, setIterations);
+    setLocalStorageValue("agent_step_time_" + String(internalId), data.iteration_interval, setStepTime);
+    setLocalStorageValue("agent_permission_" + String(internalId), data.permission_type, setPermission);
+    setLocalStorageArray("agent_instructions_" + String(internalId), data.instruction, setInstructions);
+    setLocalStorageValue("agent_database_" + String(internalId), data.LTM_DB, setDatabase);
+    setLocalStorageValue("agent_model_" + String(internalId), data.model, setModel);
+  }
+
+
   const addToolkit = (toolkit) => {
     const updatedToolIds = [...selectedTools];
     const updatedToolNames = [...toolNames];
@@ -493,40 +531,73 @@ export default function AgentCreate({
       "schedule": scheduleData,
     }
 
-    createAgent(createModal ? scheduleAgentData : agentData, createModal)
-      .then((response) => {
-        const agentId = response.data.id;
-        const name = response.data.name;
-        const executionId = response.data.execution_id;
-        fetchAgents();
-
-        if (addResources && input.length > 0) {
-          const uploadPromises = input.map(fileData => {
-            return uploadResource(agentId, fileData)
-              .catch(error => {
-                console.error('Error uploading resource:', error);
-                return Promise.reject(error);
-              });
-          });
-
-          Promise.all(uploadPromises)
-            .then(() => {
-              runExecution(agentId, name, executionId, createModal);
+    if(edit){
+      agentData.agent_id = editAgentId;
+      const name = agentData.name
+      agentData.name = `New Run ${new Date()}`
+      editAgent(agentData)
+        .then((response) => {
+        if(response){
+          fetchAgents();
+          uploadResources(editAgentId, name)
+        }
+      })
+    }
+    else
+      {
+        createAgent(createModal ? scheduleAgentData : agentData, createModal)
+            .then((response) => {
+              const agentId = response.data.id;
+              const name = response.data.name;
+              const executionId = response.data.execution_id;
+              fetchAgents();
+              uploadResources(agentId, name, executionId)
             })
-            .catch(error => {
-              console.error('Error uploading files:', error);
+            .catch((error) => {
+              console.error('Error creating agent:', error);
               setCreateClickable(true);
             });
-        } else {
-          runExecution(agentId, name, executionId, createModal);
-        }
-      })
-      .catch((error) => {
-        console.error('Error creating agent:', error);
-        setCreateClickable(true);
-      });
+      }
   };
 
+  const uploadResources = (agentId, name, executionId) => {
+    if (addResources && input.length > 0) {
+      const uploadPromises = input.map(fileData => {
+        return uploadResource(agentId, fileData)
+            .catch(error => {
+              console.error('Error uploading resource:', error);
+              return Promise.reject(error);
+            });
+      });
+
+      Promise.all(uploadPromises)
+          .then(() => {
+            runDecision(agentId, name, executionId)
+          })
+          .catch(error => {
+            console.error('Error uploading files:', error);
+            setCreateClickable(true);
+          });
+    } else {
+      runDecision(agentId, name, executionId)
+    }
+  }
+
+  const runDecision = (agentId, name, executionId) => {
+    if(edit){
+      setEditModal(false)
+      sendAgentData({
+        id: editAgentId,
+        name: name,
+        contentType: "Agents",
+      });
+      removeTab(editAgentId, name, "Agents", internalId)
+    }
+    else {
+      runExecution(agentId, name, executionId, createModal);
+    }
+  }
+
   const finaliseAgentCreation = (agentId, name, executionId) => {
     toast.success('Agent created successfully', {autoClose: 1800});
     let timeoutValue = executionId ? 0 : 1500;
@@ -794,20 +865,20 @@ export default function AgentCreate({
       <div className="col-3"></div>
       <div className="col-6" style={{padding: '25px 20px'}}>
         <div>
-          <div className={styles.page_title}>Create new agent</div>
+          {!edit ? <div className={styles.page_title}>Create new agent</div> : <div className={styles.page_title}>Edit agent</div>}
         </div>
         <div style={{marginTop: '10px'}}>
           <div>
             <label className={styles.form_label}>Name</label>
-            <input className="input_medium" type="text" value={agentName} onChange={handleNameChange}/>
+            <input className="input_medium" type="text" value={agentName} disabled={edit}  onChange={handleNameChange}/>
           </div>
           <div style={{marginTop: '15px'}}>
             <label className={styles.form_label}>Description</label>
-            <textarea className="textarea_medium" rows={3} value={agentDescription} onChange={handleDescriptionChange}/>
+            <textarea className="textarea_medium" rows={3} value={agentDescription} disabled={edit} onChange={handleDescriptionChange}/>
           </div>
           <div style={{marginTop: '15px'}}>
             <div><label className={styles.form_label}>Goals</label></div>
-            {goals.map((goal, index) => (<div key={index} style={{
+            {goals?.map((goal, index) => (<div key={index} style={{
               marginBottom: '10px',
               display: 'flex',
               alignItems: 'center',
@@ -1120,7 +1191,7 @@ export default function AgentCreate({
               </div>
               <div style={{marginTop: '15px'}}>
                 <div><label className={styles.form_label}>Constraints</label></div>
-                {constraints.map((constraint, index) => (<div key={index} style={{
+                {constraints?.map((constraint, index) => (<div key={index} style={{
                   marginBottom: '10px',
                   display: 'flex',
                   alignItems: 'center',
@@ -1164,10 +1235,10 @@ export default function AgentCreate({
               {/*    </div>*/}
               {/*  </div>*/}
               {/*</div>*/}
-              <div style={{marginTop: '15px'}}>
-                <label className={styles.form_label}>Time between steps (in milliseconds)</label>
-                <input className="input_medium" type="number" value={stepTime} onChange={handleStepChange}/>
-              </div>
+              {/*<div style={{marginTop: '15px'}}>*/}
+              {/*  <label className={styles.form_label}>Time between steps (in milliseconds)</label>*/}
+              {/*  <input className="input_medium" type="number" value={stepTime} onChange={handleStepChange}/>*/}
+              {/*</div>*/}
               {/*<div style={{marginTop: '15px'}}>*/}
               {/*  <div style={{display:'flex'}}>*/}
               {/*    <input className="checkbox" type="checkbox" checked={longTermMemory} onChange={() => setLocalStorageValue("has_LTM_" + String(internalId), !longTermMemory, setLongTermMemory)} />*/}
@@ -1227,7 +1298,7 @@ export default function AgentCreate({
                 Update Template
               </button>
             )}
-            <div style={{display: 'flex', position: 'relative'}}>
+            {!edit ? <div style={{display: 'flex', position: 'relative'}}>
               {createDropdown && (<div className="create_agent_dropdown_options" onClick={() => {
                 setCreateModal(true);
                 setCreateDropdown(false);
@@ -1244,13 +1315,30 @@ export default function AgentCreate({
                          alt="expand-icon"/>
                 </button>
               </div>
-            </div>
+            </div>: <div className="primary_button" style={{backgroundColor: 'white', marginBottom: '4px', paddingLeft: '0', paddingRight: '5px'}}>
+              <button className="primary_button" style={{paddingRight: '5px'}}
+                      onClick={() => setEditModal(true)}>Update changes</button> </div>}
           </div>
 
           {createModal && (
             <AgentSchedule env={env} internalId={internalId} closeCreateModal={closeCreateModal} type="create_agent"/>
           )}
 
+          {editModal && (<div className="modal" onClick={() => setEditModal(!editModal)}>
+            <div className="modal-content w_35" onClick={preventDefault}>
+              <div className={styles.detail_name}>Update agent</div>
+              <div><label className={styles.form_label}>All the new runs of this agent will be updated with the latest changes. Are you sure you want to update changes?</label></div>
+              <div className="mt_20 justify_end display_flex">
+                <button className="secondary_button mr_10" onClick={() => setEditModal(false)}>
+                  Cancel
+                </button>
+                <button className={`${styles.run_button} h_32p padding_0_15 `} onClick={handleAddAgent}>
+                  Update changes
+                </button>
+              </div>
+            </div>
+          </div>)}
+
         </div>
       </div>
       <div className="col-3"></div>
diff --git a/gui/pages/Content/Agents/AgentWorkspace.js b/gui/pages/Content/Agents/AgentWorkspace.js
index ac9ba8d14..987874dea 100644
--- a/gui/pages/Content/Agents/AgentWorkspace.js
+++ b/gui/pages/Content/Agents/AgentWorkspace.js
@@ -9,7 +9,7 @@ import RunHistory from "./RunHistory";
 import ActionConsole from "./ActionConsole";
 import Details from "./Details";
 import ResourceManager from "./ResourceManager";
-import {preventDefault} from "@/utils/utils";
+import {createInternalId, preventDefault} from "@/utils/utils";
 import {
   getAgentDetails,
   getAgentExecutions,
@@ -25,7 +25,7 @@ import {EventBus} from "@/utils/eventBus";
 import 'moment-timezone';
 import AgentSchedule from "@/pages/Content/Agents/AgentSchedule";
 
-export default function AgentWorkspace({env, agentId, agentName, selectedView, agents, internalId}) {
+export default function AgentWorkspace({env, agentId, agentName, selectedView, agents, internalId, sendAgentData}) {
   const [leftPanel, setLeftPanel] = useState('activity_feed')
   const [rightPanel, setRightPanel] = useState('details')
   const [history, setHistory] = useState(true)
@@ -127,6 +127,8 @@ export default function AgentWorkspace({env, agentId, agentName, selectedView, a
       toast.error("Run name can't be blank", {autoClose: 1800});
       return
     }
+    setGoals(goals.length< 0 ? agentDetails.goal : goals)
+    setInstructions(instructions.length < 0 ? agentDetails.instruction : instructions)
 
     if (goals.length <= 0) {
       toast.error("Agent needs to have goals", {autoClose: 1800});
@@ -144,7 +146,7 @@ export default function AgentWorkspace({env, agentId, agentName, selectedView, a
       .then((response) => {
         setRunModal(false);
         fetchExecutions(agentId, response.data);
-        fetchAgentDetails(agentId);
+        fetchAgentDetails(agentId, selectedRun?.id);
         EventBus.emit('reFetchAgents', {});
         toast.success("New run created", {autoClose: 1800});
       })
@@ -209,25 +211,39 @@ export default function AgentWorkspace({env, agentId, agentName, selectedView, a
   };
 
   useEffect(() => {
-    fetchAgentDetails(agentId);
+    fetchAgentDetails(agentId, selectedRun?.id);
     fetchExecutions(agentId);
     fetchAgentScheduleComponent()
   }, [agentId])
 
   useEffect(() => {
-    fetchExecutionDetails(selectedRun?.id);
+    // fetchExecutionDetails(selectedRun?.id);
+    fetchAgentDetails(agentId, selectedRun?.id);
   }, [selectedRun?.id])
 
   useEffect(() => {
     if (agentDetails) {
-      setRightPanel(agentDetails.permission_type.includes('RESTRICTED') ? 'action_console' : 'details');
+      setRightPanel(agentDetails.permission_type === 'RESTRICTED' ? 'action_console' : 'details');
     }
   }, [agentDetails])
 
-  function fetchAgentDetails(agentId) {
-    getAgentDetails(agentId)
+  function setNewRunDetails() {
+    getAgentDetails(agentId,  -1)
       .then((response) => {
-        setAgentDetails(response.data);
+        setGoals(response.data.goal)
+        setInstructions(response.data.instruction)
+        setRunModal(true);
+      })
+      .catch((error) => {
+        console.error('Error fetching agent details:', error);
+      });
+  }
+
+  function fetchAgentDetails(agentId, runId) {
+    getAgentDetails(agentId, runId ? runId : -1)
+      .then((response) => {
+        const data = response.data
+        setAgentDetails(data);
       })
       .catch((error) => {
         console.error('Error fetching agent details:', error);
@@ -259,18 +275,18 @@ export default function AgentWorkspace({env, agentId, agentName, selectedView, a
       });
   }
 
-  function fetchExecutionDetails(executionId) {
-    getExecutionDetails(executionId || -1, agentId)
-      .then((response) => {
-        setGoals(response.data.goal);
-        setCurrentGoals(response.data.goal);
-        setInstructions(response.data.instruction);
-        setCurrentInstructions(response.data.instruction);
-      })
-      .catch((error) => {
-        console.error('Error fetching agent execution details:', error);
-      });
-  }
+  // function fetchExecutionDetails(executionId) {
+  //   getExecutionDetails(executionId || -1, agentId)
+  //     .then((response) => {
+  //       setGoals(response.data.goal);
+  //       setCurrentGoals(response.data.goal);
+  //       setInstructions(response.data.instruction);
+  //       setCurrentInstructions(response.data.instruction);
+  //     })
+  //     .catch((error) => {
+  //       console.error('Error fetching agent execution details:', error);
+  //     });
+  // }
 
   function saveAgentTemplate() {
     saveAgentAsTemplate(agentId)
@@ -347,7 +363,7 @@ export default function AgentWorkspace({env, agentId, agentName, selectedView, a
           </div>
           <div style={{display: 'flex'}}>
             <div>
-              <button className={styles.run_button} onClick={() => setRunModal(true)}>
+              <button className={styles.run_button} onClick={setNewRunDetails}>
                 <Image width={14} height={14} src="/images/run_icon.svg" alt="run-icon"/>&nbsp;New Run
               </button>
             </div>
@@ -379,6 +395,12 @@ export default function AgentWorkspace({env, agentId, agentName, selectedView, a
                       setCreateModal(true)
                     }}>Schedule Run</li>}
                 </div>)}
+                <li className="dropdown_item" onClick={() => sendAgentData({
+                  id: agentId,
+                  name: "Edit Agent",
+                  contentType: "Edit_Agent",
+                  internalId: createInternalId()
+                })}>Edit Agent</li>
                 <li className="dropdown_item" onClick={() => {
                   setDropdown(false);
                   setDeleteModal(true)
@@ -471,9 +493,8 @@ export default function AgentWorkspace({env, agentId, agentName, selectedView, a
                              pendingPermission={pendingPermission} setPendingPermissions={setPendingPermissions}/>
             </div>
           )}
-          {rightPanel === 'details' &&
-            <div className={styles.detail_content}><Details agentDetails={agentDetails} goals={currentGoals}
-                                                            instructions={currentInstructions}
+          {rightPanel === 'details' && agentDetails && agentDetails !== null &&
+            <div className={styles.detail_content}><Details agentDetails1={agentDetails}
                                                             runCount={agentExecutions?.length || 0}
                                                             agentScheduleDetails={agentScheduleDetails} agent={agent}/>
             </div>}
diff --git a/gui/pages/Content/Agents/Details.js b/gui/pages/Content/Agents/Details.js
index bf0123919..5f9c682df 100644
--- a/gui/pages/Content/Agents/Details.js
+++ b/gui/pages/Content/Agents/Details.js
@@ -4,13 +4,13 @@ import Image from "next/image";
 import {formatNumber} from "@/utils/utils";
 import {EventBus} from "@/utils/eventBus";
 
-export default function Details({agentDetails, runCount, goals, instructions, agentScheduleDetails, agent}) {
+export default function Details({agentDetails1, runCount, agentScheduleDetails, agent}) {
   const [showGoals, setShowGoals] = useState(false);
   const [showConstraints, setShowConstraints] = useState(false);
   const [showInstructions, setShowInstructions] = useState(false);
-  const [filteredInstructions, setFilteredInstructions] = useState(false);
+  const [filteredInstructions, setFilteredInstructions] = useState([]);
   const [scheduleText, setScheduleText] = useState('Agent is not Scheduled');
-
+  const [agentDetails, setAgentDetails] = useState(null)
   const info_text = {
     marginLeft: '7px',
   };
@@ -28,8 +28,13 @@ export default function Details({agentDetails, runCount, goals, instructions, ag
   }
 
   useEffect(() => {
-    setFilteredInstructions(instructions?.filter(instruction => instruction.trim() !== ''));
-  }, [instructions]);
+    if (Array.isArray(agentDetails?.instruction)) {
+      setFilteredInstructions(agentDetails.instruction.filter(instruction => instruction.trim() !== ''));
+    }
+  }, [agentDetails]);
+  useEffect(() => {
+    setAgentDetails(agentDetails1)
+  }, [agentDetails1]);
 
   useEffect(() => {
     if (agent?.is_scheduled) {
@@ -96,13 +101,13 @@ export default function Details({agentDetails, runCount, goals, instructions, ag
       <div className={styles.separator}></div>
       <div className={styles.agent_info_box}>
         <div><Image width={15} height={15} src="/images/flag.svg" alt="goals-icon"/></div>
-        <div style={info_text}>{goals ? goals.length : 0} Goals</div>
+        <div style={info_text}>{agentDetails?.goal?.length || 0} Goals</div>
       </div>
-      {goals && goals.length > 0 && <div>
+      {agentDetails?.goal && agentDetails?.goal?.length > 0 && <div>
         <div className={styles.large_text_box} style={!showGoals ? {overflow: 'hidden', display: '-webkit-box'} : {}}>
-          {goals.map((goal, index) => (<div key={index} style={{marginTop: '0'}}>
+          {agentDetails?.goal?.map((goal, index) => (<div key={index} style={{marginTop: '0'}}>
             <div>{index + 1}. {goal || ''}</div>
-            {index !== goals.length - 1 && <br/>}
+            {index !== agentDetails?.goal?.length - 1 && <br/>}
           </div>))}
         </div>
         <div className={styles.show_more_button} onClick={() => setShowGoals(!showGoals)}>
@@ -134,14 +139,14 @@ export default function Details({agentDetails, runCount, goals, instructions, ag
           <div style={info_text}>Tools assigned</div>
         </div>
         <div className={styles.agent_info_tools}>
-          {agentDetails.tools.map((tool, index) =>
+          {agentDetails?.tools?.map((tool, index) =>
             (<div onClick={() => openToolkitTab(tool.id)} key={index} className="tool_container"
                   style={{marginTop: '0', marginBottom: '5px', cursor: 'pointer'}}>
               <div className={styles.tool_text}>{tool.name || ''}</div>
             </div>))}
         </div>
       </div>}</div>}
-      {agentDetails && <div>{agentDetails.constraints && agentDetails.constraints.length > 0 && <div>
+      {agentDetails && <div>{agentDetails.constraints && agentDetails.constraints?.length > 0 && <div>
         <div className={styles.separator}></div>
         <div className={styles.agent_info_box}>
           <div><Image width={15} height={15} src="/images/close_fullscreen.svg" alt="constraint-icon"/></div>
@@ -149,7 +154,7 @@ export default function Details({agentDetails, runCount, goals, instructions, ag
         </div>
         <div className={styles.large_text_box}
              style={!showConstraints ? {overflow: 'hidden', display: '-webkit-box'} : {}}>
-          {agentDetails.constraints.map((constraint, index) => (<div key={index} style={{marginTop: '0'}}>
+          {agentDetails?.constraints?.map((constraint, index) => (<div key={index} style={{marginTop: '0'}}>
             <div>{index + 1}. {constraint || ''}</div>
             {index !== agentDetails.constraints.length - 1 && <br/>}
           </div>))}
@@ -180,7 +185,7 @@ export default function Details({agentDetails, runCount, goals, instructions, ag
       </div> */}
       <div className={styles.agent_info_box}>
         <div><Image width={15} height={15} src="/images/key.svg" alt="permission-type-icon"/></div>
-        <div style={info_text}>{agentDetails?.permission_type.replace(/\s*\([^)]*\)/g, '') || ''}</div>
+        <div style={info_text}>{agentDetails?.permission_type?.replace(/\s*\([^)]*\)/g, '') || ''}</div>
       </div>
       {agentDetails?.max_iterations && <div className={styles.agent_info_box}>
         <div><Image width={15} height={15} src="/images/info.svg" alt="info-icon"/></div>
diff --git a/gui/pages/Dashboard/Content.js b/gui/pages/Dashboard/Content.js
index 6c94c517e..4e86bbeab 100644
--- a/gui/pages/Dashboard/Content.js
+++ b/gui/pages/Dashboard/Content.js
@@ -4,6 +4,7 @@ import Knowledge from '../Content/Knowledge/Knowledge';
 import AddKnowledge from '../Content/Knowledge/AddKnowledge';
 import KnowledgeDetails from '../Content/Knowledge/KnowledgeDetails';
 import AgentWorkspace from '../Content/Agents/AgentWorkspace';
+import AgentCreate from '../Content/Agents/AgentCreate';
 import ToolkitWorkspace from '../Content/./Toolkits/ToolkitWorkspace';
 import Toolkits from '../Content/./Toolkits/Toolkits';
 import Settings from "./Settings/Settings";
@@ -39,7 +40,7 @@ export default function Content({env, selectedView, selectedProjectId, organisat
   const [toolkitDetails, setToolkitDetails] = useState({});
   const [starModal, setStarModal] = useState(false);
   const router = useRouter();
-  const multipleTabContentTypes = ['Create_Agent', 'Add_Toolkit', 'Add_Knowledge', 'Add_Database'];
+  const multipleTabContentTypes = ['Create_Agent', 'Add_Toolkit', 'Add_Knowledge', 'Add_Database','Edit_Agent'];
   const [isApmOpened, setIsApmOpened] = useState(false);
   const [prevView, setPrevView] = useState(null);
 
@@ -375,7 +376,7 @@ export default function Content({env, selectedView, selectedProjectId, organisat
                        selectTab(tab, index)
                      }}>
                   <div style={{display: 'flex', order: '0', overflowX: 'hidden'}}>
-                    {(tab.contentType === 'Agents' || tab.contentType === 'Create_Agent') &&
+                    {(tab.contentType === 'Agents' || tab.contentType === 'Create_Agent' || tab.contentType === 'Edit_Agent') &&
                       <div className={styles.tab_active}><Image width={13} height={13} src="/images/agents_light.svg"
                                                                 alt="agent-icon"/></div>}
                     {(tab.contentType === 'Toolkits' || tab.contentType === 'Add_Toolkit') &&
@@ -417,7 +418,7 @@ export default function Content({env, selectedView, selectedProjectId, organisat
                     {tab.contentType === 'Agents' &&
                       <AgentWorkspace env={env} internalId={tab.internalId || index} agentId={tab.id} agentName={tab.name}
                                       selectedView={selectedView}
-                                      agents={agents} fetchAgents={getAgentList}/>}
+                                      agents={agents} fetchAgents={getAgentList} sendAgentData={addTab} />}
                     {tab.contentType === 'Toolkits' &&
                       <ToolkitWorkspace env={env} internalId={tab.internalId || index}
                                         toolkitDetails={toolkitDetails}/>}
@@ -443,6 +444,11 @@ export default function Content({env, selectedView, selectedProjectId, organisat
                                           sendAgentData={addTab} selectedProjectId={selectedProjectId}
                                           fetchAgents={getAgentList} toolkits={toolkits} env={env} />}
                     {tab.contentType === 'APM' && <ApmDashboard />}
+                    {tab.contentType === 'Edit_Agent' &&
+                        <AgentCreate knowledge={knowledge} internalId={tab.internalId || index}
+                                     organisationId={organisationId} sendKnowledgeData={addTab}
+                                     sendAgentData={addTab} selectedProjectId={selectedProjectId} editAgentId={tab.id}
+                                     fetchAgents={getAgentList} toolkits={toolkits} template={null} edit={true} agents={agents}/>}
                   </div>}
                 </div>
               ))}
diff --git a/gui/pages/_app.css b/gui/pages/_app.css
index b197dd1c4..15e4c6c03 100644
--- a/gui/pages/_app.css
+++ b/gui/pages/_app.css
@@ -1001,6 +1001,7 @@ p {
 .w_12{width: 12%}
 .w_20{width: 20%}
 .w_22{width: 22%}
+.w_35{width: 35%}
 .w_56{width: 56%}
 .w_100{width: 100%}
 .w_inherit{width: inherit}
@@ -1012,6 +1013,7 @@ p {
 .h_100{height: 100%}
 .h_auto{height: auto}
 .h_75vh{height: 75vh}
+.h_32p{height: 32px}
 
 .mxh_78vh{max-height: 78vh}
 
@@ -1065,6 +1067,7 @@ p {
 .padding_8_6{padding: 8px 6px;}
 .padding_2_8{padding: 2px 8px;}
 .padding_0_8{padding: 0px 8px;}
+.padding_0_15{padding: 0px 15px;}
 
 .flex_wrap{flex-wrap: wrap;}
 
diff --git a/gui/pages/api/DashboardService.js b/gui/pages/api/DashboardService.js
index 0ad41b834..95decead6 100644
--- a/gui/pages/api/DashboardService.js
+++ b/gui/pages/api/DashboardService.js
@@ -28,8 +28,8 @@ export const getTools = () => {
   return api.get(`/tools/list`);
 };
 
-export const getAgentDetails = (agentId) => {
-  return api.get(`/agents/get/details/${agentId}`);
+export const getAgentDetails = (agentId, agentExecutionId) => {
+  return api.get(`/agent_executions_configs/details/agent_id/${agentId}/agent_execution_id/${agentExecutionId}`);
 };
 
 export const getAgentExecutions = (agentId) => {
@@ -48,6 +48,10 @@ export const createAgent = (agentData, scheduledCreate) => {
   return api.post(scheduledCreate ? `/agents/schedule` : `/agents/create`, agentData);
 };
 
+export const editAgent = (agentData) => {
+  return api.post( `/agentexecutions/add_run`, agentData);
+};
+
 export const addTool = (toolData) => {
   return api.post(`/toolkits/get/local/install`, toolData);
 };
diff --git a/gui/utils/utils.js b/gui/utils/utils.js
index 0fad9209a..899520965 100644
--- a/gui/utils/utils.js
+++ b/gui/utils/utils.js
@@ -285,6 +285,7 @@ const removeAgentInternalId = (internalId) => {
     localStorage.removeItem("agent_template_id_" + String(internalId));
     localStorage.removeItem("agent_knowledge_" + String(internalId));
     localStorage.removeItem("agent_knowledge_id_" + String(internalId));
+    localStorage.removeItem("is_editing_agent_" + String(internalId));
   }
 };