Merge pull request #155 from iceljc/features/refine-chat-window

add agent utility

Author: Oceania2018

src/lib/helpers/types.js

@@ -122,7 +122,7 @@
  * @property {boolean} allow_routing
  * @property {string} icon_url - Icon
  * @property {string[]} profiles - The agent profiles.
- * @property {string[]} tools - The agent tools.
+ * @property {string[]} utilities - The agent utilities.
  * @property {Date} created_datetime
  * @property {Date} updated_datetime
  * @property {AgentLlmConfig} llm_config - LLM settings.

src/lib/services/agent-service.js

@@ -77,11 +77,11 @@ export async function createAgent(agent) {
 }
 
 /**
- * Get agent tools
+ * Get agent utilities
  * @returns {Promise<string[]>}
  */
-export async function getAgentTools() {
-    const url = endpoints.agentToolsUrl;
+export async function getAgentUtilities() {
+    const url = endpoints.agentUtilitiesUrl;
     const response = await axios.get(url);
     return response.data;
 }

src/lib/services/api-endpoints.js

@@ -24,7 +24,7 @@ export const endpoints = {
     agentDetailUrl: `${host}/agent/{id}`,
     agentRefreshUrl: `${host}/refresh-agents`,
     agentCreateUrl: `${host}/agent`,
-    agentToolsUrl: `${host}/agent/tools`,
+    agentUtilitiesUrl: `${host}/agent/utilities`,
 
     // agent task
     agentTaskListUrl: `${host}/agent/tasks`,

src/routes/page/agent/[agentId]/+page.svelte

@@ -129,7 +129,7 @@
 {#if agent}
 <Row>
     <Col style="flex: 30%;">
-        <AgentOverview agent={agent} profiles={agent.profiles || []} tools={agent.tools || []} />
+        <AgentOverview agent={agent} profiles={agent.profiles || []} utilities={agent.utilities || []} />
         <AgentLlmConfig agent={agent} />
         {#if agent.routing_rules?.length > 0}
             <AgentRouting agent={agent} />

src/routes/page/agent/[agentId]/agent-overview.svelte

@@ -3,7 +3,7 @@
     import InPlaceEdit from '$lib/common/InPlaceEdit.svelte'
     import { format } from '$lib/helpers/datetime';
 	import { onMount } from 'svelte';
-	import { getAgentTools } from '$lib/services/agent-service';
+	import { getAgentUtilities } from '$lib/services/agent-service';
 
     /** @type {import('$types').AgentModel} */
     export let agent;
@@ -12,18 +12,18 @@
     export let profiles = [];
 
     /** @type {string[]} */
-    export let tools = [];
+    export let utilities = [];
 
     /** @type {string[]} */
-    let toolOptions = [];
+    let utilityOptions = [];
 
     const profileLimit = 10;
-    const toolLimit = 10;
+    const utilityLimit = 10;
 
     onMount(() => {
-        getAgentTools().then(data => {
-            const tools = data?.filter(x => x?.trim()?.length > 0) || [];
-            toolOptions = ["", ...tools];
+        getAgentUtilities().then(data => {
+            const list = data?.filter(x => x?.trim()?.length > 0) || [];
+            utilityOptions = ["", ...list];
         });
     });
 
@@ -42,19 +42,19 @@
         agent.profiles = profiles;
     }
 
-    function addTool() {
+    function addUtility() {
         if (!!!agent) return;
 
-        tools = [...tools, ''];
-        agent.tools = tools;
+        utilities = [...utilities, ''];
+        agent.utilities = utilities;
     }
 
     /**
 	 * @param {number} index
 	 */
-    function removeTool(index) {
-        tools = tools.filter((x, idx) => idx !== index);
-        agent.tools = tools;
+    function removeUtility(index) {
+        utilities = utilities.filter((x, idx) => idx !== index);
+        agent.utilities = utilities;
     }
 
     function chatWithAgent() {
@@ -153,14 +153,14 @@
                         </td>
                     </tr>
                     <tr>
-                        <th class="agent-prop-key">Tools</th>
+                        <th class="agent-prop-key">Utilities</th>
                         <td>
                             <div class="agent-prop-list-container">
-                                {#each tools as tool, index}
+                                {#each utilities as utility, index}
                                 <div class="edit-wrapper">
-                                    <Input type="select" class="edit-text-box" bind:value={tool}>
-                                        {#each toolOptions as option}
-                                            <option selected={tool === option}>{option}</option>
+                                    <Input type="select" class="edit-text-box" bind:value={utility}>
+                                        {#each utilityOptions as option}
+                                            <option selected={utility === option}>{option}</option>
                                         {/each}
                                     </Input>
                                     <div class="delete-icon">
@@ -169,19 +169,19 @@
                                             role="link"
                                             tabindex="0"
                                             on:keydown={() => {}}
-                                            on:click={() => removeTool(index)}
+                                            on:click={() => removeUtility(index)}
                                         />
                                     </div>
                                 </div>
                                 {/each}
-                                {#if tools?.length < toolLimit}
+                                {#if utilities?.length < utilityLimit}
                                 <div class="list-add">
                                     <i
                                         class="bx bx bx-list-plus"
                                         role="link"
                                         tabindex="0"
                                         on:keydown={() => {}}
-                                        on:click={() => addTool()}
+                                        on:click={() => addUtility()}
                                     />
                                 </div>
                                 {/if}