Skip to content

improve task-flow. #35

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jan 29, 2024
Merged

improve task-flow. #35

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/lib/services/api-endpoints.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@ export const endpoints = {
// plugin
pluginListUrl: `${host}/plugins`,
pluginMenuUrl: `${host}/plugin/menu`,
pluginEnableUrl: `${host}/plugin/{id}/enable`,
pluginDisableUrl: `${host}/plugin/{id}/disable`,
pluginInstallUrl: `${host}/plugin/{id}/install`,
pluginRemoveUrl: `${host}/plugin/{id}/remove`,

// agent
agentSettingUrl: `${host}/agent/settings`,
Expand Down
2 changes: 1 addition & 1 deletion src/lib/services/instruct-service.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,6 @@ import axios from 'axios';
* @param {import('$types').InstructMessageModel} instruction
*/
export async function executeAgentInstruction(agentId, instruction) {
let url = replaceUrl(endpoints.conversationInitUrl, {agentId: agentId});
let url = replaceUrl(endpoints.instructCompletionUrl, {agentId: agentId});
await axios.post(url, instruction);
}
8 changes: 4 additions & 4 deletions src/lib/services/plugin-service.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@ export async function getPluginMenu() {
* @param {string} id
* @returns {Promise<import('$types').PluginDefModel>}
*/
export async function enablePlugin(id) {
let url = replaceUrl(endpoints.pluginEnableUrl, {id: id});
export async function installPlugin(id) {
let url = replaceUrl(endpoints.pluginInstallUrl, {id: id});
const response = await axios.post(url);
return response.data;
}
Expand All @@ -43,8 +43,8 @@ export async function enablePlugin(id) {
* @param {string} id
* @returns {Promise<import('$types').PluginDefModel>}
*/
export async function disablePlugin(id) {
let url = replaceUrl(endpoints.pluginDisableUrl, {id: id});
export async function removePlugin(id) {
let url = replaceUrl(endpoints.pluginRemoveUrl, {id: id});
const response = await axios.post(url);
return response.data;
}
60 changes: 47 additions & 13 deletions src/routes/page/agent/[agentId]/task/task-flow.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,16 @@
import 'drawflow/dist/drawflow.min.css';
import '$lib/drawflow/drawflow.css';
import { onMount, createEventDispatcher } from 'svelte';

import { replaceNewLine } from '$lib/helpers/http';
import { newConversation } from '$lib/services/conversation-service';
import { conversationStore, getConversationStore } from '$lib/helpers/store.js';

/** @type {import('$types').AgentModel} */
export let agent;
/** @type {import('$types').AgentTemplate[]} */
let taskNodes = [];
/** @type {DrawflowNode} */
let selectedNode;

const dispatch = createEventDispatcher();

Expand All @@ -27,6 +32,7 @@
editor.on('nodeSelected', function(id) {
console.log("Node selected " + id);
// emit event
selectedNode = editor.getNodeFromId(id);
});
renderTaskFlow(editor);
}
Expand All @@ -37,23 +43,30 @@
let posX = 0;
const nodeSpaceX = 300, nodeSpaceY = 120;

let posY = nodeSpaceY * (agent.templates.length + 1) / 2;
const templates = agent.templates.filter(t => t.name.startsWith("task."));
let posY = nodeSpaceY * (templates.length + 1) / 2;

// add end-user node
// add agent node
let agentNodeHtml = agent.icon_url ? `<img src=${agent.icon_url} height="30" />` : "";
agentNodeHtml += `<span class="h6 ms-2">${agent.name}</span>`;
let agentNodeId = editor.addNode('agent', 0, 1, posX, posY, 'agent',
{
id: ""
}, `<img src=${agent.icon_url} height="30" /><span class="h6">${agent.name}</span>`, false);
is_agent: true,
agent: agent.name
}, agentNodeHtml, false);

posY = 100;
posX += nodeSpaceX;
agent.templates.forEach(template => {
const chatTestLinkHtml = `<a href= "/page/agent/${agent.id}/task/${template.name}" class="btn btn-primary float-end" target="_blank"><i class="bx bx-run"></i></a>`;
let html = `<span class="h6">${template.name}</span>${chatTestLinkHtml}`;

// render tasks
templates.forEach(template => {
const actionLink = `/page/agent/${agent.id}/task/${template.name}`;
let html = `<span class="h6">${template.name}</span>`;
html += `<hr/><div style="max-height: 50px; overflow: hidden;">${replaceNewLine(template.content)}</div>`;

const data = {
id: agent.id,
agent: agent.name
agent: agent.name,
task: template.name,
};
let nid = editor.addNode('agent', 1, 0, posX, posY, 'enabled-node', data, html, false);
editor.addConnection(agentNodeId, nid, "output_1", "input_1");
Expand All @@ -62,12 +75,33 @@
});
}

/** @param {import('$types').AgentModel} router */
function getPlannerName(router) {
const planner = router.routing_rules.find(p => p.type == "planner");
/** @param {import('$types').AgentModel} agent */
function getPlannerName(agent) {
const planner = agent.routing_rules.find(p => p.type == "planner");
return planner?.field ?? "NaviePlanner";
}

async function handleTestInChat() {
window.location.href = `/chat/${agent.id}`;
}

async function handleRunTask() {
const conversation = await newConversation(agent.id);
conversationStore.set(conversation);
}
</script>

<div>
{#if selectedNode && selectedNode.data.is_agent}
<button class="btn btn-primary" on:click={handleTestInChat}><i class="bx bx-chat"></i> Test in chat</button>
{/if}
<button class="btn btn-primary" on:click={handleRunTask}><i class="bx bx-run"></i> Run:
{#if selectedNode && selectedNode.data.task}
{selectedNode.data.task}
{:else}
select a task to run
{/if}
</button>
</div>
<div id="drawflow" style="height: 75vh; width: 100%">
</div>
27 changes: 16 additions & 11 deletions src/routes/page/agent/router/routing-flow.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,16 +87,19 @@
let nodeId = editor.addNode('router', 1, 1, posX, routerPosY, 'router', data, `${html}`, false);;
// connect user and router
editor.addConnection(userNodeId, nodeId, `output_1`, `input_1`);
routerPosY += nodeSpaceY * (agents.length - 1) / 2;
routerPosY += nodeSpaceY + 50;
});

posY = 100;
posX += nodeSpaceX;
agents.forEach(agent => {
let profiles = [];
const chatTestLinkHtml = `<a href= "/chat/${agent.id}" class="btn btn-primary float-end" target="_blank"><i class="bx bx-chat"></i></a>`;
const taskLinkHtml = `<a href= "/page/agent/${agent.id}/task" class="btn btn-primary float-end" target="_blank"><i class="bx bx-task"></i></a>`;
let html = `<span class="h6">${agent.name}</span>${chatTestLinkHtml}${taskLinkHtml}`;
let html = `<span class="h6">${agent.name}</span>${chatTestLinkHtml}`;
if (agent.type == "static") {
const taskLinkHtml = `<a href= "/page/agent/${agent.id}/task" class="btn btn-primary float-end" target="_blank"><i class="bx bx-task"></i></a>`;
html += taskLinkHtml;
}
if (agent.profiles.length > 0) {
profiles = agent.profiles;
html += `<br/><i class="mdi mdi-folder font-size-16 text-info me-2"></i>` + profiles.join(', ');
Expand Down Expand Up @@ -144,15 +147,17 @@
// fallback
const fallback = agent.routing_rules.find(p => p.type == "fallback");
if (fallback) {
let router = agentNodes.find(ag => ag.id == fallback.redirectTo);
editor.addNodeOutput(nid);
editor.addNodeInput(router.nid);
var inputs = editor.getNodeFromId(router.nid).inputs;
let inputId = 0;
for (let prop in inputs) {
inputId++;
let router = agentNodes.find(ag => ag.id == fallback.redirectTo);
if (router) {
editor.addNodeInput(router.nid);
var inputs = editor.getNodeFromId(router.nid).inputs;
let inputId = 0;
for (let prop in inputs) {
inputId++;
}
editor.addConnection(nid, router.nid, `output_1`, `input_${inputId}`);
}
editor.addConnection(nid, router.nid, `output_1`, `input_${inputId}`);
}
});
}
Expand All @@ -164,5 +169,5 @@
}
</script>

<div id="drawflow" style="height: 75vh; width: 100%">
<div id="drawflow" style="height: 80vh; width: 100%">
</div>
6 changes: 3 additions & 3 deletions src/routes/page/plugin/plugin-list.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
Col,
Row,
} from '@sveltestrap/sveltestrap';
import { enablePlugin, disablePlugin } from '$lib/services/plugin-service';
import { installPlugin, removePlugin } from '$lib/services/plugin-service';
import { goto } from '$app/navigation';

/** @type {import('$types').PluginDefModel[]} */
Expand All @@ -18,9 +18,9 @@
*/
async function handlePluginStatus(id, enable) {
if (enable) {
await enablePlugin(id);
await installPlugin(id);
} else {
await disablePlugin(id);
await removePlugin(id);
}

const path = window.location.pathname;
Expand Down