feat(*): Handle initial thinking step alongside tools

This commit is contained in:
Josh Creek
2025-04-22 18:34:31 +01:00
parent 96b212b63c
commit fa69411829
2 changed files with 21 additions and 17 deletions
+13 -15
View File
@@ -23,7 +23,16 @@
};
// Build steps from toolEvents, filling in status, icon, and userDescription
$: agentThinking = toolEvents.length === 0;
$: steps = toolEvents.map((event, idx) => {
if (event.tool === 'thinking') {
return {
description: 'The AI Agent is analyzing your submission…',
icon: '💡',
status: toolEvents.length === 1 ? 'running' : 'done',
time: event.time
};
}
const meta = TOOL_META_MAP[event.tool];
return {
description: meta ? meta.userDescription : event.tool,
@@ -32,16 +41,12 @@
time: event.time
};
});
// If no events yet, show agent 'thinking'
$: agentThinking = toolEvents.length === 0;
$: statusMessage = agentThinking
? 'The AI Agent is analyzing your submission and selecting the best tools...'
: 'The AI Agent is now processing your submission...';
$: liveMessage = agentThinking
? statusMessage
: steps.length > 0
? steps[steps.length - 1].description
: statusMessage;
$: liveMessage = steps.length > 0
? steps[steps.length - 1].description
: statusMessage;
</script>
<style>
@@ -193,12 +198,6 @@
</div>
<div aria-live="polite" class="visually-hidden">{liveMessage}</div>
<ul class="tool-steps" aria-label="Processing steps">
{#if agentThinking}
<li class="tool-step-card" aria-current="step" tabindex="0">
<span class="tool-step-icon" aria-hidden="true">💡</span>
<span class="tool-step-desc">The AI Agent is analyzing your submission…</span>
</li>
{:else}
{#each steps as step, idx}
<li class="tool-step-card {step.status}" tabindex="0" aria-current={step.status === 'running' ? 'step' : undefined}>
<span class="tool-step-icon" aria-hidden="true">{step.icon}</span>
@@ -213,6 +212,5 @@
</span>
</li>
{/each}
{/if}
</ul>
</ul>
</div>
+8 -2
View File
@@ -37,7 +37,13 @@
submitting = true;
successMsg = '';
errorMsg = '';
toolEvents = [];
const THINKING_EVENT = { tool: 'thinking', time: new Date().toISOString() };
function ensureThinkingStep(events) {
// Remove any existing 'thinking' event
const filtered = events.filter(e => e.tool !== 'thinking');
return [THINKING_EVENT, ...filtered];
}
toolEvents = [THINKING_EVENT];
// Generate a unique roomId for this submission
roomId = crypto.randomUUID();
@@ -47,7 +53,7 @@
ws.onmessage = (event) => {
try {
const data = JSON.parse(event.data);
toolEvents = [...toolEvents, data];
toolEvents = ensureThinkingStep([...toolEvents, data]);
} catch {}
};