diff --git a/web/src/app/home/components/processor-detail/ProcessorDetailWorkbench.tsx b/web/src/app/home/components/processor-detail/ProcessorDetailWorkbench.tsx
index 6efe628a8..aff94bce4 100644
--- a/web/src/app/home/components/processor-detail/ProcessorDetailWorkbench.tsx
+++ b/web/src/app/home/components/processor-detail/ProcessorDetailWorkbench.tsx
@@ -7,10 +7,12 @@ import {
TooltipContent,
TooltipTrigger,
} from '@/components/ui/tooltip';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { cn } from '@/lib/utils';
interface ProcessorMonitoringView {
label: string;
+ workbenchLabel: string;
content: ReactNode;
}
@@ -67,11 +69,37 @@ export default function ProcessorDetailWorkbench({
const hasDebug = Boolean(debugTitle && debugContent);
return (
-
+
+ setActiveView(value as 'workbench' | 'monitoring')
+ }
+ className="flex h-full min-h-0 min-w-0 flex-col gap-0"
+ >
{title}
{titleAction}
+ {monitoring && (
+
+
+
+ {monitoring.workbenchLabel}
+ {isDirty && (
+
+ {unsavedLabel}
+
+ )}
+
+
+
+ {monitoring.label}
+
+
+ )}
{status && (
@@ -117,20 +145,6 @@ export default function ProcessorDetailWorkbench({
)}
- {monitoring && (
-
- )}
{canSave && activeView === 'workbench' && (
- {activeView === 'monitoring' && monitoring ? (
-
- ) : (
-
-
- {hasDebug && (
-
-
-
-
- {debugTitle}
-
- {debugConnected !== undefined && (
-
-
- {debugConnected
- ? debugConnectedLabel
- : debugDisconnectedLabel}
-
- )}
-
-
- {debugContent}
-
-
- )}
+ {monitoring.content}
+
+
+ )}
+
+
+ {hasDebug && (
-
-
-
{configTitle}
- {isDirty && (
-
-
- {unsavedLabel}
+
+
+
+ {debugTitle}
+
+ {debugConnected !== undefined && (
+
+
+ {debugConnected
+ ? debugConnectedLabel
+ : debugDisconnectedLabel}
)}
-
- {configContent}
+
+ {debugContent}
-
+ )}
+
+
+
+
+ {configTitle}
+ {isDirty && (
+
+
+ {unsavedLabel}
+
+ )}
+
+
+ {configContent}
+
+
- )}
-
+
+
);
}
diff --git a/web/src/app/home/pipelines/PipelineDetailContent.tsx b/web/src/app/home/pipelines/PipelineDetailContent.tsx
index fb08c28f9..e2c98851b 100644
--- a/web/src/app/home/pipelines/PipelineDetailContent.tsx
+++ b/web/src/app/home/pipelines/PipelineDetailContent.tsx
@@ -200,6 +200,7 @@ export default function PipelineDetailContent({
canViewMonitoring
? {
label: t('pipelines.monitoring.title'),
+ workbenchLabel: t('pipelines.monitoring.workbench'),
content: (
{
await expect(page.getByText('No logs yet')).toBeVisible();
await page.goto('/home/agents?id=pipeline-1');
- await expect(page.getByRole('button', { name: 'Dashboard' })).toBeVisible();
+ await expect(page.getByRole('tab', { name: 'Run logs' })).toBeVisible();
await expect(page.getByRole('tab', { name: 'Debug Chat' })).toHaveCount(0);
await expect(page.getByRole('button', { name: /^Save$/ })).toHaveCount(0);
@@ -761,19 +761,18 @@ test.describe('pipeline advanced flows', () => {
page.getByRole('region', { name: 'Configuration' }),
).toBeVisible();
- // Switch to Monitoring tab (labeled "Dashboard" in the pipeline context)
- // Skip Debug tab as it requires WebSocket connection
- await page
- .getByRole('button', { name: 'Dashboard', exact: true })
- .last()
- .click();
- await expect(page.getByRole('region', { name: /Dashboard/ })).toBeVisible();
+ const viewSwitcher = page.getByRole('tablist', {
+ name: 'Configure & debug / Run logs',
+ });
+ const switcherPosition = await viewSwitcher.boundingBox();
+ await page.getByRole('tab', { name: 'Run logs' }).click();
+ await expect(page.getByRole('region', { name: 'Run logs' })).toBeVisible();
+ await expect
+ .poll(async () => (await viewSwitcher.boundingBox())?.x)
+ .toBe(switcherPosition?.x);
// Switch back to Configuration
- await page
- .getByRole('button', { name: 'Dashboard', exact: true })
- .last()
- .click();
+ await page.getByRole('tab', { name: 'Configure & debug' }).click();
await expect(
page.getByRole('region', { name: 'Configuration' }),
).toBeVisible();
diff --git a/web/tests/e2e/pipeline-monitoring-turns.spec.ts b/web/tests/e2e/pipeline-monitoring-turns.spec.ts
index df182890b..306398c62 100644
--- a/web/tests/e2e/pipeline-monitoring-turns.spec.ts
+++ b/web/tests/e2e/pipeline-monitoring-turns.spec.ts
@@ -163,7 +163,7 @@ test.describe('pipeline monitoring conversation turns', () => {
});
await page.goto(`/home/agents?id=${pipeline.id}`);
- await page.getByRole('tab', { name: 'Dashboard' }).click();
+ await page.getByRole('tab', { name: 'Run logs' }).click();
await expect(page.getByText('2 conversation turns')).toBeVisible();
await expect(