Dev rebase

config_template.yaml

@@ -68,8 +68,8 @@ WEAVIATE_USE_EMBEDDED: true
 GOOGLE_API_KEY: YOUR_GOOGLE_API_KEY
 SEARCH_ENGINE_ID: YOUR_SEARCH_ENIGNE_ID
 
-# IF YOU DONT HAVE GOOGLE SEARCH KEY, USE THIS
-SERP_API_KEY: YOUR_SERP_API_KEY
+# IF YOU DONT HAVE GOOGLE SEARCH KEY, YOU CAN USE SERPER.DEV KEYS
+SERP_API_KEY: YOUR_SERPER_API_KEY
 
 #ENTER YOUR EMAIL CREDENTIALS TO ACCESS EMAIL TOOL
 EMAIL_ADDRESS: YOUR_EMAIL_ADDRESS
@@ -118,4 +118,4 @@ ENGINE_ID: "stable-diffusion-xl-beta-v2-2-2"
 
 ## To use Qdrant for vector store
 #QDRANT_HOST_NAME: YOUR_QDRANT_HOST_NAME
-#QDRANT_PORT: YOUR_QDRANT_PORT
+#QDRANT_PORT: YOUR_QDRANT_PORT

gui/pages/Content/Agents/ActivityFeed.js

@@ -74,10 +74,9 @@ export default function ActivityFeed({selectedRunId, selectedView, setFetchedDat
   }, [runStatus])
 
   function fetchFeeds() {
-    console.log("In")
-    setIsLoading(true);
-    console.log(isLoading)
-    getExecutionFeeds(selectedRunId)
+    if (selectedRunId !== null) {
+      setIsLoading(true);
+      getExecutionFeeds(selectedRunId)
         .then((response) => {
           const data = response.data;
           setFeeds(data.feeds);
@@ -90,6 +89,7 @@ export default function ActivityFeed({selectedRunId, selectedView, setFetchedDat
           console.error('Error fetching execution feeds:', error);
           setIsLoading(false); // and this line
         });
+    }
   }
 
   useEffect(() => {
@@ -166,12 +166,10 @@ export default function ActivityFeed({selectedRunId, selectedView, setFetchedDat
         }
         {feeds.length < 1 && !agent?.is_running && !agent?.is_scheduled ?
             (isLoading ?
-                <div style={{display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100vh'}}>
+            <div style={{display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100vh'}}>
                   <ClipLoader/>
                 </div>
-                : <div style={{color: 'white', fontSize: '14px', display: 'flex', flexDirection: 'column', alignItems: 'center', textAlign: 'center', width: '100%'}}>
-                  The Agent is not scheduled
-                </div>): null
+                : <div style={{color: 'white', fontSize: '14px', display: 'flex', flexDirection: 'column', alignItems: 'center', textAlign: 'center', width: '100%'}}>The Agent is not scheduled</div>): null
         }
       </div>
       {feedContainerRef.current && feedContainerRef.current.scrollTop >= 1200 &&

gui/pages/Content/Agents/AgentCreate.js

@@ -8,6 +8,7 @@ import {
   editAgentTemplate,
   fetchAgentTemplateConfigLocal,
   getOrganisationConfig,
+  getLlmModels,
   updateExecution,
   uploadFile
 } from "@/pages/api/DashboardService";
@@ -16,22 +17,13 @@ import {
   openNewTab,
   removeTab,
   setLocalStorageValue,
-  setLocalStorageArray, returnResourceIcon, getUserTimezone, createInternalId, preventDefault
+  setLocalStorageArray, returnResourceIcon, getUserTimezone, createInternalId,preventDefault,excludedToolkits
 } from "@/utils/utils";
 import {EventBus} from "@/utils/eventBus";
 import 'moment-timezone';
 import AgentSchedule from "@/pages/Content/Agents/AgentSchedule";
 
-export default function AgentCreate({
-                                      sendAgentData,
-                                      selectedProjectId,
-                                      fetchAgents,
-                                      toolkits,
-                                      organisationId,
-                                      template,
-                                      internalId
-                                    }) {
-
+export default function AgentCreate({sendAgentData, selectedProjectId, fetchAgents, toolkits, organisationId, template, internalId, env}) {
   const [advancedOptions, setAdvancedOptions] = useState(false);
   const [agentName, setAgentName] = useState("");
   const [agentTemplateId, setAgentTemplateId] = useState(null);
@@ -59,8 +51,8 @@ export default function AgentCreate({
   const [goals, setGoals] = useState(['Describe the agent goals here']);
   const [instructions, setInstructions] = useState(['']);
 
-  const models = ['gpt-4', 'gpt-3.5-turbo', 'gpt-3.5-turbo-16k', 'gpt-4-32k', 'google-palm-bison-001']
-  const [model, setModel] = useState(models[1]);
+  const [modelsArray, setModelsArray] = useState([]);
+  const [model, setModel] = useState('');
   const modelRef = useRef(null);
   const [modelDropdown, setModelDropdown] = useState(false);
 
@@ -94,18 +86,12 @@ export default function AgentCreate({
   const toolkitRef = useRef(null);
   const [toolkitDropdown, setToolkitDropdown] = useState(false);
 
-  const excludedToolkits = ["Thinking Toolkit", "Human Input Toolkit", "Resource Toolkit"];
   const [hasAPIkey, setHasAPIkey] = useState(false);
 
   const [createDropdown, setCreateDropdown] = useState(false);
   const [createModal, setCreateModal] = useState(false);
 
   const [scheduleData, setScheduleData] = useState(null);
-  const [col6ScrollTop, setCol6ScrollTop] = useState(0);
-
-  const handleCol3Scroll = (event) => {
-    setCol6ScrollTop(event.target.scrollTop);
-  };
 
   useEffect(() => {
     getOrganisationConfig(organisationId, "model_api_key")
@@ -138,6 +124,21 @@ export default function AgentCreate({
   }, [toolNames]);
 
   useEffect(() => {
+    getLlmModels()
+      .then((response) => {
+        const models = response.data || [];
+        const selected_model = localStorage.getItem("agent_model_" + String(internalId)) || '';
+        setModelsArray(models);
+        if(models.length > 0 && !selected_model) {
+          setLocalStorageValue("agent_model_" + String(internalId), models[0], setModel);
+        } else {
+          setModel(selected_model);
+        }
+      })
+      .catch((error) => {
+        console.error('Error fetching models:', error);
+      });
+
     if (template !== null) {
       setLocalStorageValue("agent_name_" + String(internalId), template.name, setAgentName);
       setLocalStorageValue("agent_description_" + String(internalId), template.description, setAgentDescription);
@@ -266,8 +267,8 @@ export default function AgentCreate({
   };
 
   const handleModelSelect = (index) => {
-    setLocalStorageValue("agent_model_" + String(internalId), models[index], setModel);
-    if (models[index] === "google-palm-bison-001") {
+    setLocalStorageValue("agent_model_" + String(internalId), modelsArray[index], setModel);
+    if (modelsArray[index] === "google-palm-bison-001") {
       setAgentType("Fixed Task Queue")
     }
     setModelDropdown(false);
@@ -392,6 +393,10 @@ export default function AgentCreate({
       toast.error("Add atleast one tool", {autoClose: 1800});
       return false;
     }
+    if(!modelsArray.includes(model)) {
+      toast.error("Your key does not have access to the selected model", {autoClose: 1800});
+      return false;
+    }
     return true;
   }
 
@@ -716,7 +721,7 @@ export default function AgentCreate({
 
   return (<>
     <div className="row" style={{overflowY: 'scroll', height: 'calc(100vh - 92px)'}}>
-      <div className="col-3" onScroll={handleCol3Scroll}></div>
+      <div className="col-3"></div>
       <div className="col-6" style={{padding: '25px 20px'}}>
         <div>
           <div className={styles.page_title}>Create new agent</div>
@@ -787,7 +792,7 @@ export default function AgentCreate({
               </div>
               <div>
                 {modelDropdown && <div className="custom_select_options" ref={modelRef} style={{width: '100%'}}>
-                  {models.map((model, index) => (
+                  {modelsArray?.map((model, index) => (
                     <div key={index} className="custom_select_option" onClick={() => handleModelSelect(index)}
                          style={{padding: '12px 14px', maxWidth: '100%'}}>
                       {model}
@@ -826,7 +831,7 @@ export default function AgentCreate({
                 {toolkitDropdown && <div className="custom_select_options" ref={toolkitRef} style={{width: '100%'}}>
                   {toolkitList && toolkitList.filter((toolkit) => toolkit.tools ? toolkit.tools.some((tool) => tool.name.toLowerCase().includes(searchValue.toLowerCase())) : false).map((toolkit, index) => (
                     <div key={index}>
-                      {toolkit.name !== null && !excludedToolkits.includes(toolkit.name) && <div>
+                      {toolkit.name !== null && !excludedToolkits().includes(toolkit.name) && <div>
                         <div onClick={() => addToolkit(toolkit)} className="custom_select_option" style={{
                           padding: '10px 14px',
                           maxWidth: '100%',
@@ -1055,23 +1060,7 @@ export default function AgentCreate({
               </button>
             )}
             <div style={{display: 'flex', position: 'relative'}}>
-              {createDropdown && (<div className="custom_select_option" style={{
-                background: '#3B3B49',
-                borderRadius: '8px',
-                position: 'absolute',
-                top: '-40px',
-                right: '0',
-                zIndex: '1',
-                boxShadow: '0 2px 7px rgba(0,0,0,.4), 0 0 2px rgba(0,0,0,.22)',
-                height: '40px',
-                width: '150px',
-                paddingTop: '10px',
-                textAlign: 'center'
-              }}
-                                       onClick={() => {
-                                         setCreateModal(true);
-                                         setCreateDropdown(false);
-                                       }}>Create & Schedule Run
+              {createDropdown && (<div className="create_agent_dropdown_options" onClick={() => {setCreateModal(true);setCreateDropdown(false);}}>Create & Schedule Run
               </div>)}
               <div className="primary_button"
                    style={{backgroundColor: 'white', marginBottom: '4px', paddingLeft: '0', paddingRight: '5px'}}>
@@ -1088,7 +1077,7 @@ export default function AgentCreate({
           </div>
 
           {createModal && (
-            <AgentSchedule internalId={internalId} closeCreateModal={closeCreateModal} type="create_agent"/>
+            <AgentSchedule env={env} internalId={internalId} closeCreateModal={closeCreateModal} type="create_agent"/>
           )}
 
         </div>

gui/pages/Content/Agents/AgentSchedule.js

@@ -9,21 +9,14 @@ import {agentScheduleComponent, createAndScheduleRun, updateSchedule} from "@/pa
 import {EventBus} from "@/utils/eventBus";
 import moment from 'moment';
 
-export default function AgentSchedule({
-                                        internalId,
-                                        closeCreateModal,
-                                        type,
-                                        agentId,
-                                        setCreateModal,
-                                        setCreateEditModal
-                                      }) {
+export default function AgentSchedule({internalId, closeCreateModal, type, agentId, setCreateModal, setCreateEditModal, env}) {
   const [isRecurring, setIsRecurring] = useState(false);
   const [timeDropdown, setTimeDropdown] = useState(false);
   const [expiryDropdown, setExpiryDropdown] = useState(false);
 
   const [startTime, setStartTime] = useState('');
 
-  const timeUnitArray = ['Days', 'Hours', 'Minutes'];
+  const timeUnitArray = (env === 'PROD') ? ['Days', 'Hours'] : ['Days', 'Hours', 'Minutes'];
   const [timeUnit, setTimeUnit] = useState(timeUnitArray[1]);
   const [timeValue, setTimeValue] = useState(null);
 

gui/pages/Content/Agents/AgentTemplatesList.js

@@ -5,14 +5,7 @@ import {fetchAgentTemplateListLocal} from "@/pages/api/DashboardService";
 import AgentCreate from "@/pages/Content/Agents/AgentCreate";
 import {setLocalStorageValue, openNewTab} from "@/utils/utils";
 
-export default function AgentTemplatesList({
-                                             sendAgentData,
-                                             selectedProjectId,
-                                             fetchAgents,
-                                             toolkits,
-                                             organisationId,
-                                             internalId
-                                           }) {
+export default function AgentTemplatesList({sendAgentData, selectedProjectId, fetchAgents, toolkits, organisationId, internalId, env}) {
   const [agentTemplates, setAgentTemplates] = useState([])
   const [createAgentClicked, setCreateAgentClicked] = useState(false)
   const [sendTemplate, setSendTemplate] = useState(null)
@@ -112,7 +105,7 @@ export default function AgentTemplatesList({
           </div>
         </div> : <AgentCreate internalId={internalId} organisationId={organisationId} sendAgentData={sendAgentData}
                               selectedProjectId={selectedProjectId} fetchAgents={fetchAgents} toolkits={toolkits}
-                              template={sendTemplate}/>}
+                              template={sendTemplate} env={env} />}
     </div>
   )
 };

gui/pages/Content/Agents/AgentWorkspace.js

@@ -25,7 +25,7 @@ import {EventBus} from "@/utils/eventBus";
 import 'moment-timezone';
 import AgentSchedule from "@/pages/Content/Agents/AgentSchedule";
 
-export default function AgentWorkspace({agentId, agentName, selectedView, agents, internalId}) {
+export default function AgentWorkspace({env, agentId, agentName, selectedView, agents, internalId}) {
   const [leftPanel, setLeftPanel] = useState('activity_feed')
   const [rightPanel, setRightPanel] = useState('')
   const [history, setHistory] = useState(true)
@@ -235,7 +235,7 @@ export default function AgentWorkspace({agentId, agentName, selectedView, agents
   }
 
   function fetchAgentScheduleComponent() {
-    if (agent.is_scheduled) {
+    if (agent?.is_scheduled) {
       getDateTime(agentId)
         .then((response) => {
           setAgentScheduleDetails(response.data)
@@ -365,9 +365,9 @@ export default function AgentWorkspace({agentId, agentName, selectedView, agents
                   }}>Resume</li>}
                 {agentExecutions && agentExecutions.length > 1 && <li className="dropdown_item" onClick={() => {
                   updateRunStatus("TERMINATED")
-                }}>Delete</li>}
+                }}>Delete Run</li>}
 
-                {agent && agent.is_scheduled ? (<div>
+                {agent?.is_scheduled ? (<div>
                   <li className="dropdown_item" onClick={handleEditScheduleClick}>Edit Schedule</li>
                   <li className="dropdown_item" onClick={handleStopScheduleClick}>Stop Schedule</li>
                 </div>) : (<div>
@@ -379,10 +379,10 @@ export default function AgentWorkspace({agentId, agentName, selectedView, agents
             </div>}
 
             {createModal &&
-              <AgentSchedule internalId={internalId} closeCreateModal={closeCreateModal} type="schedule_agent"
+              <AgentSchedule env={env} internalId={internalId} closeCreateModal={closeCreateModal} type="schedule_agent"
                              agentId={agentId} setCreateModal={() => setCreateModal(false)}/>}
             {createEditModal &&
-              <AgentSchedule internalId={internalId} closeCreateModal={closeCreateModal} type="edit_schedule_agent"
+              <AgentSchedule env={env} internalId={internalId} closeCreateModal={closeCreateModal} type="edit_schedule_agent"
                              agentId={agentId} setCreateEditModal={() => setCreateEditModal(false)}/>}
             {createStopModal && (
               <div className="modal" onClick={closeCreateModal}>
@@ -406,7 +406,7 @@ export default function AgentWorkspace({agentId, agentName, selectedView, agents
         </div>
         <div className={styles.detail_body}>
           {leftPanel === 'activity_feed' && <div className={styles.detail_content}>
-            <ActivityFeed selectedView={selectedView} selectedRunId={selectedRun?.id || 0}
+            <ActivityFeed selectedView={selectedView} selectedRunId={selectedRun?.id || null}
                           setFetchedData={setFetchedData} agent={agent}/>
           </div>}
           {leftPanel === 'agent_type' &&

gui/pages/Content/Agents/Agents.js

@@ -30,7 +30,7 @@ export default function Agents({sendAgentData, agents}) {
                                                               src="/images/loading.gif" alt="active-icon"/></div>}
                 <div style={{display: 'flex', height: '15px'}}>
                   <div className={styles.text_block}><span className={styles.agent_text}>{agent.name}</span></div>
-                  {agent.is_scheduled &&
+                  {agent?.is_scheduled &&
                     <div style={{marginLeft: '8px'}}><Image style={{paddingBottom: '12px'}} width={20} height={28}
                                                             src="/images/event_repeat.svg" alt="check-icon"/></div>}
                 </div>

gui/pages/Content/Agents/Details.js

@@ -16,7 +16,7 @@ export default function Details({agentDetails, runCount, goals, instructions, ag
   }, [instructions]);
 
   useEffect(() => {
-    if (agent.is_scheduled) {
+    if (agent?.is_scheduled) {
       if (agentScheduleDetails?.recurrence_interval !== null) {
         if ((agentScheduleDetails?.expiry_runs === -1 || agentScheduleDetails?.expiry_runs == null) && agentScheduleDetails?.expiry_date !== null) {
           let expiryDate;
@@ -182,7 +182,7 @@ export default function Details({agentDetails, runCount, goals, instructions, ag
         <div><Image width={15} height={15} src="/images/info.svg" alt="info-icon"/></div>
         <div style={info_text}>Stop after {agentDetails.max_iterations} iterations</div>
       </div>}
-      {agent.is_scheduled && <div className={styles.agent_info_box}>
+      {agent?.is_scheduled && <div className={styles.agent_info_box}>
         <div><Image width={15} height={15} src="/images/event_repeat.svg" alt="info-icon"/></div>
         <div style={info_text}>{scheduleText}</div>
       </div>}