Skip to content

Commit dcbd3b0

Browse files
author
Jicheng Lu
committed
refine routing flow
1 parent 280fac2 commit dcbd3b0

File tree

2 files changed

+108
-65
lines changed

2 files changed

+108
-65
lines changed

‎src/routes/page/agent/router/+page.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@
6767
<Col>
6868
<RoutingFlow
6969
routers={routers}
70-
singleMode={!!targetAgentId}
70+
viewMode={!!targetAgentId}
7171
on:userNodeSelected={(e) => handleUserNodeSelected()}
7272
on:routerNodeSelected={(e) => handleRouterNodeSelected(e.detail.agent)}
7373
on:agentNodeSelected={(e) => handleAgentNodeSelected(e.detail.agent)}/>

‎src/routes/page/agent/router/routing-flow.svelte‎

Lines changed: 107 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@
1010
let includePlannerAgent = false;
1111
let includeTaskAgent = false;
1212
let includeStaticAgent = false;
13-
let disabled = false;
1413
1514
/** @type {any[]} */
1615
let agents = [];
@@ -20,28 +19,26 @@
2019
2120
/** @type {import('$agentTypes').AgentFilter} */
2221
const filter = {
23-
pager: { page: 1, size: 20, count: 0 },
22+
pager: { page: 1, size: 100, count: 0 },
2423
disabled: false,
25-
types: includeTaskAgent ? [AgentType.Task] : ["none"]
24+
types: [AgentType.Planning, AgentType.Task]
2625
};
2726
2827
/** @type {import('$agentTypes').AgentModel[]} */
2928
export let routers;
3029
3130
/** @type {boolean} */
32-
export let singleMode = false;
31+
export let viewMode = false;
3332
3433
/** @type {Drawflow} */
3534
let editor;
3635
const dispatch = createEventDispatcher();
37-
38-
$: {
39-
// disabled = !!targetAgentId;
40-
}
4136
4237
onMount(async () => {
43-
// const response = await getAgents(filter);
44-
// agents = response?.items || [];
38+
if (viewMode) {
39+
const response = await getAgents(filter);
40+
agents = response?.items || [];
41+
}
4542
4643
const container = document.getElementById("drawflow");
4744
if (container) {
@@ -74,7 +71,7 @@
7471
nodeSpaceY * (agents.length + 1) / 2;
7572
7673
// add end-user node
77-
let userNodeId = editor.addNode('user', 0, 1, posX, posY, 'user',
74+
const userNodeId = editor.addNode('user', 0, 1, posX, posY, 'user',
7875
{
7976
id: "",
8077
profiles: [],
@@ -83,7 +80,8 @@
8380
8481
// add router node
8582
posX += nodeSpaceX;
86-
let routerPosY = nodeSpaceY * (agents.length > 0 ? agents.length : 1) / (routers.length > 0 ? routers.length : 1);
83+
let routerPosY = viewMode ? posY : nodeSpaceY * (agents.length > 0 ? agents.length : 1) / (routers.length > 0 ? routers.length : 1);
84+
8785
routers.forEach(router => {
8886
/** @type {string[]} */
8987
let profiles = [];
@@ -108,7 +106,8 @@
108106
if (router.is_host) {
109107
html =`<img src="images/users/bot.png" height="30">${html}`;
110108
}
111-
let nodeId = editor.addNode('router', 1, 1, posX, routerPosY, 'router', data, `${html}`, false);;
109+
110+
const nodeId = editor.addNode('router', 1, 1, posX, routerPosY, 'router', data, `${html}`, false);;
112111
// connect user and router
113112
editor.addConnection(userNodeId, nodeId, `output_1`, `input_1`);
114113
routerPosY += nodeSpaceY + 50;
@@ -117,9 +116,11 @@
117116
const plannerAgents = agents.filter(x => x.type === 'planning');
118117
const otherAgnets = agents.filter(x => x.type !== 'planning');
119118
120-
posY = 100;
119+
posY = 120;
121120
posX += nodeSpaceX;
122121
plannerAgents.forEach(agent => {
122+
/**@type {any} */
123+
let nodeId = null;
123124
let html = `<span class="h6">${agent.name}</span>`;
124125
125126
if (agent.profiles.length > 0) {
@@ -131,17 +132,28 @@
131132
agent: agent.name
132133
};
133134
134-
const nid = editor.addNode('agent', 1, 0, posX, posY, 'enabled-node', data, html, false);
135135
const routers = agentNodes.filter(x => x.type === AgentType.Routing && x.profiles?.includes('planning') && getPlannerName(x) === agent.name);
136+
if (!viewMode || routers.length > 0) {
137+
nodeId = editor.addNode('agent', 1, 0, posX, posY, 'enabled-node', data, html, false);
138+
}
139+
136140
routers.forEach(r => {
137-
editor.addConnection(r.nid, nid, `output_1`, `input_1`);
141+
if (nodeId) {
142+
editor.addConnection(r.nid, nodeId, `output_1`, `input_1`);
143+
}
138144
});
139-
posY += nodeSpaceY;
145+
146+
if (!!nodeId) {
147+
posY += nodeSpaceY;
148+
}
140149
});
141150
142-
posY = 100;
143-
posX += nodeSpaceX;
144-
otherAgnets.forEach(agent => {
151+
posY = viewMode ? posY + 30 : 120;
152+
posX += viewMode ? 0 : nodeSpaceX;
153+
otherAgnets.forEach(agent => {
154+
/**@type {any} */
155+
let nodeId = null;
156+
/**@type {any[]} */
145157
let profiles = [];
146158
147159
const chatTestLinkHtml = agent.is_public ?
@@ -166,51 +178,71 @@
166178
agent: agent.name,
167179
profiles: profiles
168180
};
169-
const nid = editor.addNode('agent', 1, 0, posX, posY, 'enabled-node', data, html, false);
170-
171-
// connect by profile
172-
if (profiles.length > 0) {
173-
// match profile
174-
profiles.forEach((/** @type {string} */ profile) => {
175-
if (profile == 'planning') return;
176-
177-
agentNodes.filter(ag => ag.type == AgentType.Routing).forEach(r => {
178-
if (r.profiles.find((/** @type {string} */ p) => p == profile)) {
179-
editor.addConnection(r.nid, nid, `output_1`, `input_1`);
180-
} else {
181-
// editor.removeNodeInput(nid, "input_2");
182-
// editor.addConnection(userNodeId, nid, `output_1`, `input_1`);
183-
}
181+
182+
183+
if (viewMode && profiles.length > 0) {
184+
const filteredProfiles = profiles.filter((/** @type {string} */ profile) => profile !== 'planning');
185+
const foundNodes = agentNodes.filter(ag => ag.type == AgentType.Routing
186+
&& !!ag.profiles?.some((/** @type {any} */ p) => filteredProfiles.includes(p)));
187+
188+
if (foundNodes.length > 0) {
189+
nodeId = editor.addNode('agent', 1, 0, posX, posY, 'enabled-node', data, html, false);
190+
filteredProfiles.forEach((/** @type {string} */ profile) => {
191+
foundNodes.forEach(r => {
192+
if (r.profiles.find((/** @type {string} */ p) => p == profile)) {
193+
editor.addConnection(r.nid, nodeId, `output_1`, `input_1`);
194+
}
195+
});
184196
});
185-
});
186-
} else {
187-
// profile is empty
188-
/*agentNodes.filter(ag => ag.type == "routing" && ag.profiles.length == 0)
189-
.forEach(r => {
190-
editor.addConnection(r.nid, nid, `output_1`, `input_1`);
191-
});*/
192-
193-
editor.addConnection(userNodeId, nid, `output_1`, `input_1`);
197+
}
198+
} else if (!viewMode) {
199+
nodeId = editor.addNode('agent', 1, 0, posX, posY, 'enabled-node', data, html, false);
200+
201+
// connect by profile
202+
if (profiles.length > 0) {
203+
// match profile
204+
const filteredProfiles = profiles.filter((/** @type {string} */ profile) => profile !== 'planning');
205+
filteredProfiles.forEach((/** @type {string} */ profile) => {
206+
agentNodes.filter(ag => ag.type == AgentType.Routing).forEach(r => {
207+
if (r.profiles.find((/** @type {string} */ p) => p == profile)) {
208+
editor.addConnection(r.nid, nodeId, `output_1`, `input_1`);
209+
} else {
210+
// editor.removeNodeInput(nid, "input_2");
211+
// editor.addConnection(userNodeId, nid, `output_1`, `input_1`);
212+
}
213+
});
214+
});
215+
} else {
216+
// profile is empty
217+
/*agentNodes.filter(ag => ag.type == "routing" && ag.profiles.length == 0)
218+
.forEach(r => {
219+
editor.addConnection(r.nid, nid, `output_1`, `input_1`);
220+
});*/
221+
222+
editor.addConnection(userNodeId, nodeId, `output_1`, `input_1`);
223+
}
194224
}
195225
196-
posY += nodeSpaceY;
226+
if (!!nodeId) {
227+
posY += nodeSpaceY;
228+
}
197229
198230
// draw fallback routing
199231
// fallback
200-
const fallback = agent.routing_rules.find((/** @type {any} */ p) => p.type == "fallback");
201-
if (fallback) {
202-
editor.addNodeOutput(nid);
203-
let router = agentNodes.find(ag => ag.id == fallback.redirectTo);
204-
if (router) {
205-
editor.addNodeInput(router.nid);
206-
var inputs = editor.getNodeFromId(router.nid).inputs;
207-
let inputId = 0;
208-
for (let prop in inputs) {
209-
inputId++;
210-
}
211-
editor.addConnection(nid, router.nid, `output_1`, `input_${inputId}`);
212-
}
213-
}
232+
// const fallback = agent.routing_rules.find((/** @type {any} */ p) => p.type == "fallback");
233+
// if (fallback) {
234+
// editor.addNodeOutput(nid);
235+
// let router = agentNodes.find(ag => ag.id == fallback.redirectTo);
236+
// if (router) {
237+
// editor.addNodeInput(router.nid);
238+
// var inputs = editor.getNodeFromId(router.nid).inputs;
239+
// let inputId = 0;
240+
// for (let prop in inputs) {
241+
// inputId++;
242+
// }
243+
// editor.addConnection(nid, router.nid, `output_1`, `input_${inputId}`);
244+
// }
245+
// }
214246
});
215247
}
216248
@@ -261,15 +293,26 @@
261293
</script>
262294
263295
<div class="btn-group" role="group">
264-
<input type="checkbox" class="btn-check active" id="btncheck1" autocomplete="off"/>
265-
<label class={`btn btn-${includeRoutingAgent ? "" : "outline-"}primary`} for="btncheck1">Routing Agent</label>
296+
<input
297+
type="checkbox"
298+
class="btn-check active"
299+
id="btncheck1"
300+
autocomplete="off"
301+
disabled={viewMode}
302+
/>
303+
<label
304+
class={`btn btn-${includeRoutingAgent && !viewMode ? "" : "outline-"}primary`}
305+
for="btncheck1"
306+
>
307+
Routing Agent
308+
</label>
266309
267310
<input
268311
type="checkbox"
269312
class="btn-check active"
270313
id="btncheck2"
271314
autocomplete="off"
272-
disabled={disabled}
315+
disabled={viewMode}
273316
on:click={() => handlePlannerAgentSelected()}
274317
/>
275318
<label
@@ -284,7 +327,7 @@
284327
class="btn-check"
285328
id="btncheck3"
286329
autocomplete="off"
287-
disabled={disabled}
330+
disabled={viewMode}
288331
on:click={() => handleTaskAgentSelected()}
289332
/>
290333
<label
@@ -299,7 +342,7 @@
299342
class="btn-check"
300343
id="btncheck4"
301344
autocomplete="off"
302-
disabled={disabled}
345+
disabled={viewMode}
303346
on:click={() => handleStaticAgentSelected()}
304347
/>
305348
<label

0 commit comments

Comments
 (0)