Skip to content

Commit 5535e55

Browse files
author
Jicheng Lu
committed
add agent links
1 parent c38d704 commit 5535e55

8 files changed

Lines changed: 312 additions & 27 deletions

File tree

src/lib/common/ProfileDropdown.svelte

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,8 @@
4242
>
4343
<img
4444
class="rounded-circle header-profile-user"
45-
src={`${buildUrl(PUBLIC_SERVICE_URL, user?.avatar)}?access_token=${$userStore?.token}`}
45+
src={`${user?.avatar && $userStore?.token ?
46+
`${buildUrl(PUBLIC_SERVICE_URL, user?.avatar)}?access_token=${$userStore?.token}` : ''}`}
4647
alt=""
4748
on:error={e => handleAvatarLoad(e)}
4849
/>

src/lib/helpers/types/agentTypes.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,13 @@
1010
* @property {string} content
1111
*/
1212

13+
/**
14+
* @typedef {Object} AgentLink
15+
* @property {string?} [uid]
16+
* @property {string} name
17+
* @property {string} content
18+
*/
19+
1320
/**
1421
* @typedef {Object} AgentLlmConfig
1522
* @property {boolean} is_inherit - Inherited from default Agent settings
@@ -65,6 +72,7 @@
6572
* @property {import('$pluginTypes').PluginDefModel} plugin
6673
* @property {FunctionDef[]} functions
6774
* @property {AgentTemplate[]} templates
75+
* @property {AgentLink[]} links
6876
* @property {Object[]} responses
6977
* @property {RoutingRule[]} routing_rules
7078
* @property {AgentRule[]} rules

src/lib/scss/custom/pages/_agent.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@
100100

101101
.agent-prompt-header {
102102
background-color: white;
103-
padding: 20px;
103+
padding: 15px;
104104
}
105105

106106
.agent-prompt-body {

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

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
import { goto } from '$app/navigation';
2020
import { AgentExtensions } from '$lib/helpers/utils/agent';
2121
import LocalStorageManager from '$lib/helpers/utils/storage-manager';
22-
import AgentTemplate from './agent-components/agent-template.svelte';
22+
import AgentPromptWrapper from './agent-components/agent-prompt-wrapper.svelte';
2323
2424
/** @type {import('$agentTypes').AgentModel} */
2525
let agent;
@@ -28,7 +28,7 @@
2828
/** @type {any} */
2929
let agentInstructionCmp = null;
3030
/** @type {any} */
31-
let agentTemplateCmp = null;
31+
let agentPromptWrapperCmp = null;
3232
/** @type {any} */
3333
let agentTabsCmp = null;
3434
/** @type {import('$agentTypes').AgentModel} */
@@ -94,7 +94,7 @@
9494
function handleAgentUpdate() {
9595
fetchJsonContent();
9696
fetchInstructions();
97-
fetchTemplates();
97+
fetchPromptWrapper();
9898
fetchTabData();
9999
100100
agent = {
@@ -115,7 +115,7 @@
115115
isComplete = true;
116116
deleteAgentDraft();
117117
refreshInstructions();
118-
refreshTemplates();
118+
refreshPromptWrapper();
119119
setTimeout(() => {
120120
isComplete = false;
121121
}, duration);
@@ -164,20 +164,22 @@
164164
}
165165
166166
// Templates
167-
function formatOriginalTemplates() {
168-
const obj = agentTemplateCmp?.fetchOriginalTemplates();
167+
function formatOriginalPromptWrapper() {
168+
const obj = agentPromptWrapperCmp?.fetchOriginalPromptWrapperData();
169169
return {
170-
templates: obj.templates || []
170+
templates: obj.templates || [],
171+
links: obj.links || []
171172
}
172173
}
173174
174-
function fetchTemplates() {
175-
const obj = agentTemplateCmp?.fetchTemplates();
175+
function fetchPromptWrapper() {
176+
const obj = agentPromptWrapperCmp?.fetchPromptWrapperData();
176177
agent.templates = obj.templates || [];
178+
agent.links = obj.links || [];
177179
}
178180
179-
function refreshTemplates() {
180-
agentTemplateCmp?.refresh();
181+
function refreshPromptWrapper() {
182+
agentPromptWrapperCmp?.refresh();
181183
}
182184
183185
@@ -232,7 +234,7 @@
232234
...agent,
233235
...formatJsonContent(),
234236
...formatOriginalInstructions(),
235-
...formatOriginalTemplates(),
237+
...formatOriginalPromptWrapper(),
236238
...formatOriginalTabData(),
237239
};
238240
saveAgentDraft(data);
@@ -244,7 +246,7 @@
244246
deleteAgentDraft();
245247
setTimeout(() => {
246248
refreshInstructions();
247-
refreshTemplates();
249+
refreshPromptWrapper();
248250
agentFunctionCmp?.refresh();
249251
agentTabsCmp?.refresh();
250252
});
@@ -286,8 +288,8 @@
286288
/>
287289
</div>
288290
<div class="agent-detail-section">
289-
<AgentTemplate
290-
bind:this={agentTemplateCmp}
291+
<AgentPromptWrapper
292+
bind:this={agentPromptWrapperCmp}
291293
agent={agent}
292294
{handleAgentChange}
293295
/>
Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
<script>
2+
import { onMount } from 'svelte';
3+
import { Card, CardBody } from '@sveltestrap/sveltestrap';
4+
import NavBar from "$lib/common/nav-bar/NavBar.svelte";
5+
import NavItem from '$lib/common/nav-bar/NavItem.svelte';
6+
import AgentTemplate from './agent-prompt/agent-template.svelte';
7+
import AgentLink from './agent-prompt/agent-link.svelte';
8+
9+
/** @type {import('$agentTypes').AgentModel} */
10+
export let agent;
11+
12+
/** @type {() => void} */
13+
export let handleAgentChange = () => {};
14+
15+
export const fetchPromptWrapperData = () => {
16+
const templates = agentTemplateCmp?.fetchTemplates();
17+
const links = agentLinkCmp?.fetchLinks();
18+
19+
return {
20+
templates: templates || [],
21+
links: links || []
22+
};
23+
};
24+
25+
export const fetchOriginalPromptWrapperData = () => {
26+
const templates = agentTemplateCmp?.fetchOriginalTemplates();
27+
const links = agentLinkCmp?.fetchOriginalLinks();
28+
29+
return {
30+
templates: templates || [],
31+
links: links || []
32+
};
33+
}
34+
35+
export const refresh = () => {
36+
agentTemplateCmp?.refresh();
37+
agentLinkCmp?.refresh();
38+
}
39+
40+
/** @type {any} */
41+
let agentTemplateCmp = null;
42+
/** @type {any} */
43+
let agentLinkCmp = null;
44+
45+
/** @type {string}*/
46+
let selectedTab;
47+
48+
/** @type {any[]}*/
49+
let tabs = [
50+
{ name: 'agent-template', displayText: 'Templates' },
51+
{ name: 'agent-link', displayText: 'Links' }
52+
];
53+
54+
onMount(() => {
55+
selectedTab = tabs[0]?.name;
56+
});
57+
58+
/** @param {string} selected */
59+
function handleTabClick(selected) {
60+
selectedTab = selected;
61+
}
62+
</script>
63+
64+
<Card>
65+
<CardBody>
66+
<NavBar
67+
disableDefaultStyles
68+
containerClasses={'nav-tabs-secondary'}
69+
>
70+
{#each tabs as tab, idx (idx) }
71+
<NavItem
72+
containerStyles={`flex: 0 1 calc(100% / ${tabs.length <= 2 ? tabs.length : 3})`}
73+
navBtnStyles={'text-transform: none;'}
74+
navBtnId={`${tab.name}-tab`}
75+
dataBsTarget={`#${tab.name}-tab`}
76+
ariaControls={`${tab.name}-tab-pane`}
77+
bind:navBtnText={tab.displayText}
78+
active={tab.name === selectedTab}
79+
onClick={() => handleTabClick(tab.name)}
80+
/>
81+
{/each}
82+
</NavBar>
83+
84+
<div class:hide={selectedTab !== 'agent-template'}>
85+
<AgentTemplate agent={agent} bind:this={agentTemplateCmp} {handleAgentChange} />
86+
</div>
87+
<div class:hide={selectedTab !== 'agent-link'}>
88+
<AgentLink agent={agent} bind:this={agentLinkCmp} {handleAgentChange} />
89+
</div>
90+
</CardBody>
91+
</Card>

0 commit comments

Comments
 (0)