xinyin025/LangBot
1
0
Fork 0
mirror of https://github.com/langbot-app/LangBot.git synced 2026-08-28 13:17:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(agents): move debug event picker to input area

Browse Source
This commit is contained in:
RockChinQ
2026-08-27 15:52:59 +08:00
parent f3c1887e92
commit 21ffaf9a14
2 changed files with 86 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/app/home/agents/components/AgentDebugPanel.tsx
+74 -76
View File
@@ -280,82 +280,6 @@ export default function AgentDebugPanel({
return ( return (
<div className="flex h-full min-h-0 min-w-0 flex-col"> <div className="flex h-full min-h-0 min-w-0 flex-col">
<div className="shrink-0 space-y-3 border-b p-3">
<div className="flex items-end gap-2">
<div className="min-w-0 flex-1 space-y-1.5">
<Label>{t('agents.debugEventType')}</Label>
<Select value={preset} onValueChange={selectPreset}>
<SelectTrigger
className="w-full"
aria-label={t('agents.debugEventType')}
>
<SelectValue />
</SelectTrigger>
<SelectContent className="w-[var(--radix-select-trigger-width)] max-w-[calc(100vw-2rem)]">
{eventGroups.map((group) => (
<SelectGroup key={group.namespace}>
<SelectLabel>
{eventGroupLabel(group.namespace, t)}
</SelectLabel>
{group.patterns.map((event) => (
<SelectItem
key={event}
value={event}
description={eventPatternDescription(event, t)}
className="py-2"
>
<EventSelectOptionContent
event={event}
label={eventPatternLabel(event, t)}
/>
</SelectItem>
))}
</SelectGroup>
))}
{supportsCustomEvent && (
<SelectGroup>
<SelectLabel>{t('agents.debugCustomEvent')}</SelectLabel>
<SelectItem
value="custom"
description={t('bots.eventDescriptions.custom')}
className="py-2"
>
<EventSelectOptionContent
event="custom.event"
label={t('agents.debugCustomEvent')}
/>
</SelectItem>
</SelectGroup>
)}
</SelectContent>
</Select>
</div>
<Button
type="button"
variant="outline"
size="icon"
onClick={resetSession}
title={t('agents.debugResetSession')}
>
<RotateCcw className="size-4" />
</Button>
</div>
{preset === 'custom' && (
<div className="space-y-1.5">
<Label htmlFor="agent-debug-custom-event">
{t('agents.debugCustomEventType')}
</Label>
<Input
id="agent-debug-custom-event"
value={customEventType}
onChange={(event) => setCustomEventType(event.target.value)}
placeholder="custom.event"
/>
</div>
)}
</div>
<div className="min-h-0 flex-1 overflow-y-auto p-3"> <div className="min-h-0 flex-1 overflow-y-auto p-3">
<div className="mb-3"> <div className="mb-3">
<p className="text-sm font-medium">{t('agents.debugTranscript')}</p> <p className="text-sm font-medium">{t('agents.debugTranscript')}</p>
@@ -437,6 +361,80 @@ export default function AgentDebugPanel({
</div> </div>
<div className="shrink-0 space-y-3 border-t p-3"> <div className="shrink-0 space-y-3 border-t p-3">
<div className="flex items-end gap-2">
<div className="min-w-0 flex-1 space-y-1.5">
<Label>{t('agents.debugEventType')}</Label>
<Select value={preset} onValueChange={selectPreset}>
<SelectTrigger
className="w-full"
aria-label={t('agents.debugEventType')}
>
<SelectValue />
</SelectTrigger>
<SelectContent className="w-[var(--radix-select-trigger-width)] max-w-[calc(100vw-2rem)]">
{eventGroups.map((group) => (
<SelectGroup key={group.namespace}>
<SelectLabel>
{eventGroupLabel(group.namespace, t)}
</SelectLabel>
{group.patterns.map((event) => (
<SelectItem
key={event}
value={event}
description={eventPatternDescription(event, t)}
className="py-2"
>
<EventSelectOptionContent
event={event}
label={eventPatternLabel(event, t)}
/>
</SelectItem>
))}
</SelectGroup>
))}
{supportsCustomEvent && (
<SelectGroup>
<SelectLabel>{t('agents.debugCustomEvent')}</SelectLabel>
<SelectItem
value="custom"
description={t('bots.eventDescriptions.custom')}
className="py-2"
>
<EventSelectOptionContent
event="custom.event"
label={t('agents.debugCustomEvent')}
/>
</SelectItem>
</SelectGroup>
)}
</SelectContent>
</Select>
</div>
<Button
type="button"
variant="outline"
size="icon"
onClick={resetSession}
title={t('agents.debugResetSession')}
>
<RotateCcw className="size-4" />
</Button>
</div>
{preset === 'custom' && (
<div className="space-y-1.5">
<Label htmlFor="agent-debug-custom-event">
{t('agents.debugCustomEventType')}
</Label>
<Input
id="agent-debug-custom-event"
value={customEventType}
onChange={(event) => setCustomEventType(event.target.value)}
placeholder="custom.event"
/>
</div>
)}
<div className="space-y-1.5"> <div className="space-y-1.5">
<Label htmlFor="agent-debug-input"> <Label htmlFor="agent-debug-input">
{isMessageEvent {isMessageEvent
web/tests/e2e/processor-detail-workbench.spec.ts
+12
View File
@@ -31,6 +31,18 @@ test.describe('processor detail workbench', () => {
name: 'Event type', name: 'Event type',
}); });
await expect(debugEventPicker).toContainText('message.received'); await expect(debugEventPicker).toContainText('message.received');
const transcriptBox = await debugPanel
.getByText('Debug transcript', { exact: true })
.boundingBox();
const eventPickerBox = await debugEventPicker.boundingBox();
const conversationInputBox = await debugPanel
.getByRole('textbox', { name: 'Conversation input' })
.boundingBox();
expect(transcriptBox).not.toBeNull();
expect(eventPickerBox).not.toBeNull();
expect(conversationInputBox).not.toBeNull();
expect(eventPickerBox!.y).toBeGreaterThan(transcriptBox!.y);
expect(eventPickerBox!.y).toBeLessThan(conversationInputBox!.y);
await debugEventPicker.click(); await debugEventPicker.click();
await expect(page.getByRole('group', { name: 'Messages' })).toBeVisible(); await expect(page.getByRole('group', { name: 'Messages' })).toBeVisible();
await expect(page.getByRole('group', { name: 'Groups' })).toBeVisible(); await expect(page.getByRole('group', { name: 'Groups' })).toBeVisible();