Skip to content

Commit 3b7e1b7

Browse files
author
Jicheng Lu
committed
refine instruction testing
1 parent 98bfef9 commit 3b7e1b7

5 files changed

Lines changed: 138 additions & 19 deletions

File tree

‎src/lib/common/modals/StateModal.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -217,7 +217,7 @@
217217
<div class="min-w-0" style="flex: 0.4;">
218218
{#if idx === 0}
219219
<label for={`stm-key-${idx}`} class="stm-label">
220-
{`Key ${validateKey ? '*' : ''}`}
220+
{`Name ${validateKey ? '*' : ''}`}
221221
</label>
222222
{/if}
223223
<input

‎src/routes/page/instruction/instruction-components/instruction-agent.svelte‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
* @type {{
66
* agents?: import('$agentTypes').AgentModel[],
77
* disabled?: boolean,
8-
* onSelectAgent?: (detail: { agent: import('$agentTypes').AgentModel | null, template: any }) => void
8+
* onSelectAgent?: (detail: { agent: import('$agentTypes').AgentModel | null, template: any, llmConfig: any }) => void
99
* }}
1010
*/
1111
let {
@@ -45,7 +45,8 @@
4545
name: x.name,
4646
label: x.name,
4747
value: x.name,
48-
content: x.content
48+
content: x.content,
49+
llm_config: x.llm_config || null
4950
})) || [];
5051
5152
fireSelectAgent();
@@ -62,7 +63,8 @@
6263
function fireSelectAgent() {
6364
onSelectAgent?.({
6465
agent: selectedAgent || null,
65-
template: selectedTemplate || null
66+
template: selectedTemplate || null,
67+
llmConfig: selectedTemplate?.llm_config || selectedAgent?.llm_config || null
6668
});
6769
}
6870
</script>

‎src/routes/page/instruction/instruction-components/instruction-llm.svelte‎

Lines changed: 93 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,35 @@
11
<script>
22
import Select from '$lib/common/dropdowns/Select.svelte';
3+
import { INTEGER_REGEX } from '$lib/helpers/constants';
4+
import { ReasoningEffortLevel } from '$lib/helpers/enums';
35
46
/**
57
* @type {{
68
* llmConfigs?: import('$commonTypes').LlmConfig[],
79
* disabled?: boolean,
810
* selectedProvider?: import('$commonTypes').LlmConfig | null | undefined,
911
* selectedModel?: string | null,
10-
* onSelectLlm?: (detail: { provider: import('$commonTypes').LlmConfig | null, model: string | null }) => void
12+
* selectedReasoningEffortLevel?: string | null,
13+
* selectedMaxOutputTokens?: number | null,
14+
* onSelectLlm?: (detail: { provider: import('$commonTypes').LlmConfig | null, model: string | null, reasoning_effort_level: string | null, max_output_tokens: number | null }) => void
1115
* }}
1216
*/
1317
let {
1418
llmConfigs = [],
1519
disabled = false,
1620
selectedProvider = $bindable(null),
1721
selectedModel = $bindable(null),
22+
selectedReasoningEffortLevel = $bindable(null),
23+
selectedMaxOutputTokens = $bindable(null),
1824
onSelectLlm
1925
} = $props();
2026
27+
/** @type {import('$commonTypes').LabelValuePair[]} */
28+
const defaultReasonLevelOptions = Object.entries(ReasoningEffortLevel).map(([k, v]) => ({
29+
value: v,
30+
label: v
31+
}));
32+
2133
/** @type {import('$commonTypes').LabelValuePair[]} */
2234
let providerOptions = $derived(
2335
llmConfigs?.map(x => ({
@@ -34,12 +46,32 @@
3446
}))?.sort((a, b) => a.label.localeCompare(b.label)) || []
3547
);
3648
49+
let selectedModelSetting = $derived(
50+
selectedProvider?.models?.find(x => x.name === selectedModel) || null
51+
);
52+
53+
let isReasoningModel = $derived(selectedModelSetting?.reasoning != null);
54+
55+
/** @type {import('$commonTypes').LabelValuePair[]} */
56+
let reasoningLevelOptions = $derived.by(() => {
57+
if (!isReasoningModel) {
58+
return defaultReasonLevelOptions;
59+
}
60+
const customOptions = selectedModelSetting?.reasoning?.parameters?.EffortLevel?.options;
61+
if (customOptions?.length > 0) {
62+
// @ts-ignore
63+
return customOptions.map(x => ({ value: x, label: x }));
64+
}
65+
return defaultReasonLevelOptions;
66+
});
67+
3768
/** @param {any} e */
3869
function selectProvider(e) {
3970
// @ts-ignore
4071
const selectedValues = e.detail.selecteds?.map(x => x.value) || [];
4172
selectedProvider = selectedValues.length > 0 ? llmConfigs?.find(x => x.provider === selectedValues[0]) || null : null;
4273
selectedModel = null;
74+
selectedReasoningEffortLevel = null;
4375
fireSelectLlm();
4476
}
4577
@@ -48,13 +80,39 @@
4880
// @ts-ignore
4981
const selectedValues = e.detail.selecteds?.map(x => x.value) || [];
5082
selectedModel = selectedValues.length > 0 ? modelOptions.find(x => x.value === selectedValues[0])?.value : null;
83+
selectedReasoningEffortLevel = null;
84+
fireSelectLlm();
85+
}
86+
87+
/** @param {any} e */
88+
function selectReasoningEffortLevel(e) {
89+
// @ts-ignore
90+
const selectedValues = e.detail.selecteds?.map(x => x.value) || [];
91+
selectedReasoningEffortLevel = selectedValues.length > 0 ? selectedValues[0] : null;
92+
fireSelectLlm();
93+
}
94+
95+
/** @param {any} e */
96+
function changeMaxOutputTokens(e) {
97+
const value = Number(e.target.value) || 0;
98+
selectedMaxOutputTokens = value > 0 ? value : null;
5199
fireSelectLlm();
52100
}
53101
102+
/** @param {any} e */
103+
function validateIntegerInput(e) {
104+
const reg = new RegExp(INTEGER_REGEX, 'g');
105+
if (e.key !== 'Backspace' && !reg.test(e.key)) {
106+
e.preventDefault();
107+
}
108+
}
109+
54110
function fireSelectLlm() {
55111
onSelectLlm?.({
56112
provider: selectedProvider || null,
57-
model: selectedModel
113+
model: selectedModel,
114+
reasoning_effort_level: selectedReasoningEffortLevel || null,
115+
max_output_tokens: selectedMaxOutputTokens || null
58116
});
59117
}
60118
</script>
@@ -92,4 +150,37 @@
92150
onselect={e => selectModel(e)}
93151
/>
94152
</div>
153+
154+
<div>
155+
<label for="max-output-tokens" class="mb-1.5 inline-flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wider text-primary">
156+
<i class="mdi mdi-counter text-sm leading-none"></i>
157+
Max output tokens
158+
</label>
159+
<input
160+
id="max-output-tokens"
161+
type="number"
162+
class="form-control block w-full"
163+
disabled={disabled}
164+
value={selectedMaxOutputTokens || ''}
165+
onkeydown={e => validateIntegerInput(e)}
166+
onchange={e => changeMaxOutputTokens(e)}
167+
/>
168+
</div>
169+
170+
{#if isReasoningModel}
171+
<div>
172+
<label for="reasoning-effort-select" class="mb-1.5 inline-flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wider text-primary">
173+
<i class="mdi mdi-brain text-sm leading-none"></i>
174+
Reasoning level
175+
</label>
176+
<Select
177+
tag={'reasoning-effort-select'}
178+
placeholder={'Select a level'}
179+
disabled={disabled}
180+
selectedValues={selectedReasoningEffortLevel ? [selectedReasoningEffortLevel] : []}
181+
options={reasoningLevelOptions}
182+
onselect={e => selectReasoningEffortLevel(e)}
183+
/>
184+
</div>
185+
{/if}
95186
</div>

‎src/routes/page/instruction/instruction-components/instruction-state.svelte‎

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

3838
<div class="flex flex-col py-3">
3939
<div class="grid grid-cols-[1fr_1fr_auto] gap-2 px-1 pb-1">
40-
<div class="text-xs font-semibold uppercase tracking-wider text-primary">{'Key'}</div>
40+
<div class="text-xs font-semibold uppercase tracking-wider text-primary">{'Name'}</div>
4141
<div class="text-xs font-semibold uppercase tracking-wider text-primary">{'Value'}</div>
4242
<div class="w-5"></div>
4343
</div>

‎src/routes/page/instruction/testing/+page.svelte‎

Lines changed: 38 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,12 @@
5151
/** @type {string | null} */
5252
let selectedModel = $state(null);
5353
54+
/** @type {string | null} */
55+
let selectedReasoningEffortLevel = $state(null);
56+
57+
/** @type {number | null} */
58+
let selectedMaxOutputTokens = $state(null);
59+
5460
/** @type {string | null} */
5561
let selectedTemplate = $state(null);
5662
@@ -102,7 +108,14 @@
102108
isThinking = true;
103109
requestDone = false;
104110
elapsedTime = '';
105-
const formattedStates = formatKeyValues(states);
111+
const clonedStates = [
112+
{ key: 'reasoning_effort_level', value: selectedReasoningEffortLevel ? selectedReasoningEffortLevel : 'disable' }
113+
];
114+
if (selectedMaxOutputTokens && selectedMaxOutputTokens > 0) {
115+
clonedStates.push({ key: 'max_tokens', value: selectedMaxOutputTokens.toString() });
116+
}
117+
118+
const formattedStates = formatKeyValues(states, clonedStates);
106119
const formatedArgs = formatKeyValues(args);
107120
const start = new Date();
108121
const agentId = selectedAgent?.id || '';
@@ -113,10 +126,10 @@
113126
model: selectedModel,
114127
template: selectedTemplate,
115128
states: formattedStates,
116-
codeOptions: {
129+
codeOptions: selectedCodeScript?.name ? {
117130
script_name: selectedCodeScript?.name,
118131
arguments: formatedArgs
119-
}
132+
} : null
120133
}).then(res => {
121134
result = res?.text || '';
122135
}).finally(() => {
@@ -127,14 +140,20 @@
127140
});
128141
}
129142
130-
/** @param {import('$commonTypes').KeyValuePair[]} kvs */
131-
function formatKeyValues(kvs) {
132-
return kvs?.filter(x => !!util.trim(x.key) && !!util.trim(x.value)).map(x => {
143+
/**
144+
* @param {import('$commonTypes').KeyValuePair[]} kvs
145+
* @param {import('$commonTypes').KeyValuePair[]} [defaults]
146+
*/
147+
function formatKeyValues(kvs, defaults) {
148+
const primary = kvs || [];
149+
const primaryKeys = new Set(primary.map(x => util.trim(x.key)).filter(k => !!k));
150+
const merged = [...(defaults || []).filter(x => !primaryKeys.has(util.trim(x.key))), ...primary];
151+
return merged.filter(x => !!util.trim(x.key) && !!util.trim(x.value)).map(x => {
133152
return {
134153
key: util.trim(x.key),
135154
value: util.trim(x.value)
136155
};
137-
}) || [];
156+
});
138157
}
139158
140159
/** @param {KeyboardEvent} e */
@@ -156,7 +175,7 @@
156175
elapsedTime = ''
157176
}
158177
159-
/** @param {{ agent: import('$agentTypes').AgentModel | null, template: any }} detail */
178+
/** @param {{ agent: import('$agentTypes').AgentModel | null, template: any, llmConfig: any }} detail */
160179
function onAgentSelected(detail) {
161180
selectedAgent = detail.agent || null;
162181
let localText = selectedAgent?.instruction;
@@ -168,10 +187,13 @@
168187
}
169188
170189
instruction = localText || '';
171-
const providerName = selectedAgent?.llm_config?.provider || null;
172-
const modelName = selectedAgent?.llm_config?.model || null;
190+
const llmConfig = detail?.llmConfig || null;
191+
const providerName = llmConfig?.provider || null;
192+
const modelName = llmConfig?.model || null;
173193
selectedProvider = llmConfigs?.find(x => x.provider === providerName) || null;
174194
selectedModel = modelName;
195+
selectedReasoningEffortLevel = llmConfig?.reasoning_effort_level || null;
196+
selectedMaxOutputTokens = llmConfig?.max_output_tokens || null;
175197
176198
if (selectedAgent?.id) {
177199
initAgentCodeScripts(selectedAgent.id);
@@ -180,10 +202,12 @@
180202
}
181203
}
182204
183-
/** @param {{ provider: import('$commonTypes').LlmConfig | null, model: string | null }} detail */
205+
/** @param {{ provider: import('$commonTypes').LlmConfig | null, model: string | null, reasoning_effort_level: string | null, max_output_tokens: number | null }} detail */
184206
function onLlmSelected(detail) {
185207
selectedProvider = detail.provider || null;
186208
selectedModel = detail.model || '';
209+
selectedReasoningEffortLevel = detail.reasoning_effort_level || null;
210+
selectedMaxOutputTokens = detail.max_output_tokens || null;
187211
}
188212
189213
/** @param {string} agentId */
@@ -246,7 +270,7 @@
246270
</span>
247271
{/if}
248272
</div>
249-
<div>{text?.length || 0}/{formatNumber(maxLength)}</div>
273+
<div>{formatNumber(text?.length || 0)}/{formatNumber(maxLength)}</div>
250274
</div>
251275
252276
<div class="mt-3 flex justify-end">
@@ -378,6 +402,8 @@
378402
disabled={isThinking}
379403
bind:selectedProvider={selectedProvider}
380404
bind:selectedModel={selectedModel}
405+
bind:selectedReasoningEffortLevel={selectedReasoningEffortLevel}
406+
bind:selectedMaxOutputTokens={selectedMaxOutputTokens}
381407
onSelectLlm={detail => onLlmSelected(detail)}
382408
/>
383409
</div>

0 commit comments

Comments
 (0)