diff --git a/gui/pages/Dashboard/Content.js b/gui/pages/Dashboard/Content.js
index 3783596ee..95996600b 100644
--- a/gui/pages/Dashboard/Content.js
+++ b/gui/pages/Dashboard/Content.js
@@ -313,7 +313,7 @@ export default function Content({env, selectedView, selectedProjectId, organisat
         {(selectedView === 'agents' || selectedView === 'toolkits' || selectedView === 'knowledge') &&
           <div className={styles.item_list} style={{width: '13vw'}}>
             {selectedView === 'agents' && <div><Agents sendAgentData={addTab} agents={agents}/></div>}
-            {selectedView === 'toolkits' && <div><Toolkits sendToolkitData={addTab} toolkits={toolkits}/></div>}
+            {selectedView === 'toolkits' && <div><Toolkits env={env} sendToolkitData={addTab} toolkits={toolkits}/></div>}
             {selectedView === 'knowledge' && <div><Knowledge sendKnowledgeData={addTab} knowledge={knowledge}/></div>}
           </div>}
 
@@ -364,7 +364,7 @@ export default function Content({env, selectedView, selectedProjectId, organisat
             </div>
           </div>
         </div> : <div className={styles.main_workspace}
-                      style={(selectedView === 'agents' || selectedView === 'toolkits') ? {width: '80.5vw'} : {width: '100%'}}>
+                      style={(selectedView === 'agents' || selectedView === 'toolkits' || selectedView === 'knowledge') ? {width: '80.5vw'} : {width: '100%'}}>
           <div style={{display: 'flex', alignItems: 'center', justifyContent: 'center', width: '100%'}}>
             <div className={styles.tabs} ref={tabContainerRef}>
               {tabs.map((tab, index) => (
diff --git a/gui/pages/Dashboard/Dashboard.module.css b/gui/pages/Dashboard/Dashboard.module.css
index bba3c4845..528faf325 100644
--- a/gui/pages/Dashboard/Dashboard.module.css
+++ b/gui/pages/Dashboard/Dashboard.module.css
@@ -183,6 +183,7 @@
     order: 1;
     justify-content: flex-end;
     align-items: center;
+    height: 100%;
 }
 
 .empty_state_button {