@datalayer/agent-runtimes 1.0.28 → 1.3.10

package/lib/examples/AgentCompactionExample.js

@@ -13,22 +13,20 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * and time taken).
  */
 /// <reference types="vite/client" />
-import { useEffect, useState, useCallback, useRef } from 'react';
+import { useMemo, useState, useRef } from 'react';
 import { Text, Spinner, Heading, Label, Button, FormControl, } from '@primer/react';
 import { HistoryIcon, ClockIcon, ArrowRightIcon, CheckCircleIcon, StackIcon, } from '@primer/octicons-react';
 import { Box } from '@datalayer/primer-addons';
-import { AuthRequiredView, ErrorView } from './components';
 import { ThemedProvider } from './utils/themedProvider';
 import { uniqueAgentId } from './utils/agentId';
-import { useSimpleAuthStore } from '@datalayer/core/lib/views/otel';
-import { Chat } from '../chat';
+import { LoopEmbed } from '../loop';
+import { createAgentCompactionPlugin } from '../loop/plugins/agent-compaction';
 import { useAgentRuntimeCompaction, agentRuntimeStore } from '../stores';
 import { getAgentspecs } from '../specs/agents';
 import { AI_MODEL_CATALOGUE } from '../specs';
-import { useExampleAgentRuntimesUrl } from './utils/useExampleAgentRuntimesUrl';
-import { useRuntimeTargetStore } from './utils/runtimeTargetStore';
+import { resolveExampleAgentRuntimesUrl } from './utils/useExampleAgentRuntimesUrl';
 const AGENT_NAME = 'compaction-example-agent';
-const AGENTSPEC_ID = 'example-monitoring';
+const AGENTSPEC_ID = 'example-compaction';
 const MIN_MAX_TOKENS = 1000;
 const DEFAULT_MAX_TOKENS = 4000;
 /** Resolve the agentspec model's token limit as the upper bound the user can set. */
@@ -70,99 +68,17 @@ const CompactionPanel = ({ maxTokens }) => {
                             fontSize: 0,
                         }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(Text, { sx: { color: 'fg.muted', minWidth: 64 }, children: "Tokens" }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: numberFmt.format(compaction.beforeTokens) }), _jsx(ArrowRightIcon, { size: 12 }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: numberFmt.format(compaction.afterTokens ?? compaction.beforeTokens) })] }), _jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(Text, { sx: { color: 'fg.muted', minWidth: 64 }, children: "Messages" }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: numberFmt.format(compaction.beforeMessages) }), _jsx(ArrowRightIcon, { size: 12 }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: numberFmt.format(compaction.afterMessages ?? compaction.beforeMessages) })] }), _jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(ClockIcon, { size: 12 }), _jsx(Text, { sx: { color: 'fg.muted', minWidth: 52 }, children: "Time" }), _jsxs(Text, { sx: { fontFamily: 'mono' }, children: [numberFmt.format(Math.round(compaction.durationMs ?? 0)), " ms"] })] }), typeof compaction.compactionCount === 'number' && (_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(Text, { sx: { color: 'fg.muted', minWidth: 64 }, children: "Total runs" }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: numberFmt.format(compaction.compactionCount) })] }))] })] }))] }));
 };
-const AgentCompactionInner = ({ onLogout, }) => {
-    const { token } = useSimpleAuthStore();
-    const runtimeTarget = useRuntimeTargetStore(state => state.target);
+const AgentCompactionInner = () => {
     const agentName = useRef(uniqueAgentId(AGENT_NAME)).current;
     const tokenLimit = useRef(resolveAgentspecTokenLimit()).current;
+    const agentBaseUrl = useMemo(() => resolveExampleAgentRuntimesUrl('local'), []);
     const [maxTokensInput, setMaxTokensInput] = useState(Math.min(DEFAULT_MAX_TOKENS, tokenLimit));
     const [launchedMaxTokens, setLaunchedMaxTokens] = useState(null);
-    const [runtimeStatus, setRuntimeStatus] = useState('idle');
-    const [isReady, setIsReady] = useState(false);
-    const [hookError, setHookError] = useState(null);
-    const [agentId, setAgentId] = useState(agentName);
-    const [isReconnectedAgent, setIsReconnectedAgent] = useState(false);
-    const agentBaseUrl = useExampleAgentRuntimesUrl();
-    const chatAuthToken = token === null ? undefined : token;
-    const authFetch = useCallback((url, opts = {}) => fetch(url, {
-        ...opts,
-        headers: {
-            'Content-Type': 'application/json',
-            ...(token ? { Authorization: `Bearer ${token}` } : {}),
-            ...(opts.headers ?? {}),
-        },
-    }), [token]);
-    useEffect(() => {
-        if (launchedMaxTokens === null)
-            return;
-        let isCancelled = false;
-        const createAgentForTarget = async () => {
-            setRuntimeStatus('launching');
-            setIsReady(false);
-            setHookError(null);
-            setIsReconnectedAgent(false);
-            // Clear any prior compaction status from a previous stream.
-            agentRuntimeStore.getState().setCompaction(null);
-            try {
-                const response = await authFetch(`${agentBaseUrl}/api/v1/agents`, {
-                    method: 'POST',
-                    body: JSON.stringify({
-                        name: agentName,
-                        description: 'Compaction example – history summarization under a token budget',
-                        agent_library: 'pydantic-ai',
-                        transport: 'vercel-ai',
-                        agent_spec_id: AGENTSPEC_ID,
-                        memory: 'ephemeral',
-                        enable_skills: true,
-                        tools: [],
-                        compactionMaxTokens: launchedMaxTokens,
-                    }),
-                });
-                let resolvedAgentId = agentName;
-                let isAlreadyRunning = false;
-                if (response.ok) {
-                    const data = await response.json();
-                    resolvedAgentId = data?.id || agentName;
-                }
-                else {
-                    const contentType = response.headers.get('content-type') || '';
-                    let detail = '';
-                    if (contentType.includes('application/json')) {
-                        const data = await response.json().catch(() => null);
-                        detail =
-                            (typeof data?.detail === 'string' && data.detail) ||
-                                (typeof data?.message === 'string' && data.message) ||
-                                '';
-                    }
-                    else {
-                        detail = await response.text();
-                    }
-                    if (response.status === 409 || /already exists/i.test(detail || '')) {
-                        isAlreadyRunning = true;
-                    }
-                    else {
-                        throw new Error(detail || `Failed to create local agent: ${response.status}`);
-                    }
-                }
-                if (!isCancelled) {
-                    setAgentId(resolvedAgentId);
-                    setIsReconnectedAgent(isAlreadyRunning);
-                    setIsReady(true);
-                    setRuntimeStatus('ready');
-                }
-            }
-            catch (error) {
-                if (!isCancelled) {
-                    setHookError(error instanceof Error ? error.message : 'Agent failed to start');
-                    setRuntimeStatus('error');
-                }
-            }
-        };
-        void createAgentForTarget();
-        return () => {
-            isCancelled = true;
-        };
-    }, [agentBaseUrl, authFetch, runtimeTarget, launchedMaxTokens, agentName]);
+    // The capacity for the chosen budget: the Loop creates the agent from its
+    // blueprint, compaction budget included, once the budget is picked.
+    const plugins = useMemo(() => launchedMaxTokens === null
+        ? []
+        : [createAgentCompactionPlugin(launchedMaxTokens)], [launchedMaxTokens]);
     // Setup phase: choose the compaction token budget before launching.
     if (launchedMaxTokens === null) {
         return (_jsx(Box, { sx: {
@@ -179,21 +95,11 @@ const AgentCompactionInner = ({ onLogout, }) => {
                     borderColor: 'border.default',
                     borderRadius: 2,
                     bg: 'canvas.subtle',
-                }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 2, mb: 2 }, children: [_jsx(HistoryIcon, { size: 20 }), _jsx(Heading, { as: "h3", sx: { fontSize: 3 }, children: "History Compaction" })] }), _jsx(Text, { as: "p", sx: { fontSize: 1, color: 'fg.muted', mt: 0, mb: 3 }, children: "Set the context token budget before launching. When the conversation grows past this budget, older messages are summarized so the input stays within the limit. A lower budget triggers compaction sooner." }), _jsxs(FormControl, { children: [_jsxs(FormControl.Label, { children: ["Max context tokens: ", numberFmt.format(maxTokensInput)] }), _jsx(Box, { sx: { mt: 2 }, children: _jsx("input", { type: "range", min: MIN_MAX_TOKENS, max: tokenLimit, step: 500, value: maxTokensInput, onChange: e => setMaxTokensInput(Number(e.target.value)), style: { width: '100%' } }) }), _jsxs(FormControl.Caption, { children: ["Agentspec max: ", numberFmt.format(tokenLimit), " tokens (model limit)"] })] }), _jsx(Box, { sx: { display: 'flex', justifyContent: 'flex-end', mt: 3 }, children: _jsx(Button, { variant: "primary", leadingVisual: HistoryIcon, onClick: () => setLaunchedMaxTokens(maxTokensInput), children: "Launch agent" }) })] }) }));
-    }
-    if (!isReady && runtimeStatus !== 'error') {
-        return (_jsxs(Box, { sx: {
-                display: 'flex',
-                flexDirection: 'column',
-                alignItems: 'center',
-                justifyContent: 'center',
-                height: '100%',
-                gap: 3,
-                bg: 'canvas.default',
-            }, children: [_jsx(Spinner, { size: "large" }), _jsxs(Text, { sx: { color: 'fg.muted' }, children: ["Launching compaction example agent (", runtimeTarget, ")..."] })] }));
-    }
-    if (runtimeStatus === 'error' || hookError) {
-        return _jsx(ErrorView, { error: hookError, onLogout: onLogout });
+                }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 2, mb: 2 }, children: [_jsx(HistoryIcon, { size: 20 }), _jsx(Heading, { as: "h3", sx: { fontSize: 3 }, children: "History Compaction" })] }), _jsx(Text, { as: "p", sx: { fontSize: 1, color: 'fg.muted', mt: 0, mb: 3 }, children: "Set the context token budget before launching. When the conversation grows past this budget, older messages are summarized so the input stays within the limit. A lower budget triggers compaction sooner." }), _jsxs(FormControl, { children: [_jsxs(FormControl.Label, { children: ["Max context tokens: ", numberFmt.format(maxTokensInput)] }), _jsx(Box, { sx: { mt: 2 }, children: _jsx("input", { type: "range", min: MIN_MAX_TOKENS, max: tokenLimit, step: 500, value: maxTokensInput, onChange: e => setMaxTokensInput(Number(e.target.value)), style: { width: '100%' } }) }), _jsxs(FormControl.Caption, { children: ["Agentspec max: ", numberFmt.format(tokenLimit), " tokens (model limit)"] })] }), _jsx(Box, { sx: { display: 'flex', justifyContent: 'flex-end', mt: 3 }, children: _jsx(Button, { variant: "primary", leadingVisual: HistoryIcon, "data-compaction-launch": true, onClick: () => {
+                                // Clear any prior compaction status from a previous stream.
+                                agentRuntimeStore.getState().setCompaction(null);
+                                setLaunchedMaxTokens(maxTokensInput);
+                            }, children: "Launch agent" }) })] }) }));
     }
     return (_jsxs(Box, { sx: {
             height: '100%',
@@ -209,20 +115,7 @@ const AgentCompactionInner = ({ onLogout, }) => {
                     borderBottom: '1px solid',
                     borderColor: 'border.default',
                     flexShrink: 0,
-                }, children: [_jsx(HistoryIcon, { size: 16 }), _jsx(Heading, { as: "h3", sx: { fontSize: 2, flex: 1 }, children: "Compaction Demo" }), isReconnectedAgent && (_jsx(Label, { variant: "secondary", size: "small", children: "Reconnected" })), _jsx(Label, { variant: "accent", children: runtimeTarget }), _jsxs(Label, { variant: "accent", children: [numberFmt.format(launchedMaxTokens), " tok budget"] })] }), _jsxs(Box, { sx: { flex: 1, minHeight: 0, display: 'flex' }, children: [_jsx(Box, { sx: { flex: 1, minWidth: 0 }, children: _jsx(Chat, { protocol: "vercel-ai", baseUrl: agentBaseUrl, agentId: agentId, authToken: chatAuthToken, title: "Compaction Agent", brandIcon: _jsx(HistoryIcon, { size: 16 }), placeholder: "Chat until the history exceeds the token budget...", description: "History summarization under a token budget", showHeader: true, kernelIndicatorPlacement: "right", autoFocus: true, height: "100%", runtimeId: agentId, historyEndpoint: `${agentBaseUrl}/api/v1/history`, suggestions: [
-                                {
-                                    title: 'Fill the context',
-                                    message: 'Write a detailed, multi-paragraph essay on the history of computing, covering hardware, software, and networking eras.',
-                                },
-                                {
-                                    title: 'Keep going',
-                                    message: 'Now expand each section with more detail and concrete examples, adding at least three paragraphs per era.',
-                                },
-                                {
-                                    title: 'Recall earlier',
-                                    message: 'Summarize everything we have discussed so far in this conversation.',
-                                },
-                            ], submitOnSuggestionClick: true }) }), _jsxs(Box, { sx: {
+                }, children: [_jsx(HistoryIcon, { size: 16 }), _jsx(Heading, { as: "h3", sx: { fontSize: 2, flex: 1 }, children: "Compaction Demo" }), _jsx(Label, { variant: "accent", children: "local" }), _jsxs(Label, { variant: "accent", children: [numberFmt.format(launchedMaxTokens), " tok budget"] })] }), _jsxs(Box, { sx: { flex: 1, minHeight: 0, display: 'flex' }, children: [_jsx(Box, { sx: { flex: 1, minWidth: 0 }, children: _jsx(LoopEmbed, { serverUrl: agentBaseUrl, target: "local", showAgentVariants: true, agentId: agentName, editors: false, showHeader: true, plugins: plugins }, launchedMaxTokens) }), _jsxs(Box, { sx: {
                             width: 320,
                             borderLeft: '1px solid',
                             borderColor: 'border.default',
@@ -231,14 +124,5 @@ const AgentCompactionInner = ({ onLogout, }) => {
                             overflow: 'auto',
                         }, children: [_jsx(CompactionPanel, { maxTokens: launchedMaxTokens }), _jsxs(Box, { sx: { p: 3 }, children: [_jsx(Heading, { as: "h4", sx: { fontSize: 1, mb: 2 }, children: "How It Works" }), _jsxs(Text, { as: "p", sx: { fontSize: 0, color: 'fg.muted', mb: 2 }, children: ["Before each model request, the compaction capability estimates the history size. When it exceeds a fraction of the", ' ', numberFmt.format(launchedMaxTokens), "-token budget, older messages are replaced by an LLM-generated summary while recent messages are preserved."] }), _jsxs(Text, { as: "p", sx: { fontSize: 0, color: 'fg.muted', mb: 0 }, children: ["The budget is capped at the agentspec model's token limit (", numberFmt.format(tokenLimit), "). Lower it to trigger compaction with a shorter conversation."] })] })] })] })] }));
 };
-const AgentCompactionExample = () => {
-    const { token, clearAuth } = useSimpleAuthStore();
-    const handleLogout = useCallback(() => {
-        clearAuth();
-    }, [clearAuth]);
-    if (!token) {
-        return (_jsx(ThemedProvider, { children: _jsx(AuthRequiredView, {}) }));
-    }
-    return (_jsx(ThemedProvider, { children: _jsx(AgentCompactionInner, { onLogout: handleLogout }) }));
-};
+const AgentCompactionExample = () => (_jsx(ThemedProvider, { children: _jsx(AgentCompactionInner, {}) }));
 export default AgentCompactionExample;

package/lib/examples/AgentEvalsExample.js

@@ -23,12 +23,15 @@ import { Box } from '@datalayer/primer-addons';
 import { AuthRequiredView, ErrorView } from './components';
 import { ThemedProvider } from './utils/themedProvider';
 import { uniqueAgentId } from './utils/agentId';
+import { waitForAgent } from './utils/waitForAgent';
 import { resolveExampleAgentRuntimesUrl, useExampleAgentRuntimesUrl, } from './utils/useExampleAgentRuntimesUrl';
-import { useRuntimeTargetStore, } from './utils/runtimeTargetStore';
+import { runtimeTargetCapabilities, useRuntimeTargetStore, } from './utils/runtimeTargetStore';
 import { useSimpleAuthStore } from '@datalayer/core/lib/views/otel';
 import { useCoreStore } from '@datalayer/core';
-import { Chat } from '../chat';
+import { LoopEmbed } from '../loop';
+import { AgentEvalsPlugin } from '../loop/plugins/agent-evals';
 import { useExampleAgentRuntimes as useAgentRuntimes } from './hooks/useExampleAgentRuntimes';
+const LOOP_PLUGINS_AGENTEVA = [AgentEvalsPlugin];
 const queryClient = new QueryClient();
 // ─── Constants ─────────────────────────────────────────────────────────────
 const AGENT_NAME = 'eval-example-agent';
@@ -80,17 +83,17 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
         if (configuredRuntimesUrl && !isLocalhostUrl(configuredRuntimesUrl)) {
             return configuredRuntimesUrl;
         }
-        return resolveExampleAgentRuntimesUrl('cloud');
+        return resolveExampleAgentRuntimesUrl('datalayer');
     }, [configuration?.runtimesUrl]);
     const { runtime, status: runtimeStatus, isReady, error: hookError, runtimeCreationBaseUrl, } = useAgentRuntimes({
         agentSpecId: AGENTSPEC_ID,
-        autoStart: executionTarget === 'cloud',
+        autoStart: executionTarget === 'datalayer',
         runtimeCreationTarget: executionTarget === 'local' ? 'local-agent-runtimes' : 'backend-services',
         runtimeCreationBaseUrl: executionTarget === 'local' ? localRuntimeBaseUrl : cloudRuntimeBaseUrl,
         agentConfig: {
             name: agentName,
             model: 'bedrock:us.anthropic.claude-sonnet-4-5-20250929-v1:0',
-            protocol: 'vercel-ai',
+            protocol: 'ag-ui',
             description: 'Agent with evaluation and quality scoring',
         },
     });
@@ -109,9 +112,9 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
     const agentId = executionTarget === 'local'
         ? localAgentId || agentName
         : runtime?.agentId || AGENT_NAME;
-    const podName = executionTarget === 'local'
+    const runtimeName = executionTarget === 'local'
         ? `local:${agentId}`
-        : runtime?.podName || '(launching…)';
+        : runtime?.runtimeName || '(launching…)';
     const controlPlaneBaseUrl = import.meta.env.VITE_RUN_URL ||
         configuration?.aiAgentsUrl ||
         (cloudAgentBaseUrl ? new URL(cloudAgentBaseUrl).origin : '');
@@ -161,49 +164,24 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
             return;
         }
         let isCancelled = false;
+        const controller = new AbortController();
         const createLocalAgent = async () => {
             setLocalStatus('launching');
             setLocalError(null);
             try {
-                const response = await authFetch(`${agentBaseUrl}/api/v1/agents`, {
-                    method: 'POST',
-                    body: JSON.stringify({
-                        name: agentName,
-                        description: 'Agent with evaluation and quality scoring',
-                        agent_library: 'pydantic-ai',
-                        transport: 'vercel-ai',
-                        agent_spec_id: AGENTSPEC_ID,
-                        enable_skills: true,
-                        tools: [],
-                    }),
+                // The Loop creates the agent from the capacity plugin's blueprint as
+                // it mounts; the page waits until the server has it before it talks
+                // to the eval API about it.
+                const found = await waitForAgent(agentBaseUrl, agentName, {
+                    signal: controller.signal,
                 });
-                let resolvedAgentId = agentName;
-                if (response.ok) {
-                    const payload = await response.json().catch(() => ({}));
-                    resolvedAgentId = payload?.id || agentName;
-                }
-                else {
-                    const contentType = response.headers.get('content-type') || '';
-                    let detail = '';
-                    if (contentType.includes('application/json')) {
-                        const payload = await response.json().catch(() => null);
-                        detail =
-                            (typeof payload?.detail === 'string' && payload.detail) ||
-                                (typeof payload?.message === 'string' && payload.message) ||
-                                '';
-                    }
-                    else {
-                        detail = await response.text();
-                    }
-                    if (response.status !== 409 &&
-                        !/already exists/i.test(detail || '')) {
-                        throw new Error(detail || `Failed to create local agent: ${response.status}`);
-                    }
-                }
-                if (!isCancelled) {
-                    setLocalAgentId(resolvedAgentId);
-                    setLocalStatus('ready');
+                if (isCancelled)
+                    return;
+                if (!found) {
+                    throw new Error(`The agent '${agentName}' did not appear on ${agentBaseUrl}.`);
                 }
+                setLocalAgentId(agentName);
+                setLocalStatus('ready');
             }
             catch (error) {
                 if (!isCancelled) {
@@ -215,8 +193,9 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
         void createLocalAgent();
         return () => {
             isCancelled = true;
+            controller.abort();
         };
-    }, [executionTarget, agentBaseUrl, agentName, authFetch]);
+    }, [executionTarget, agentBaseUrl, agentName]);
     useEffect(() => {
         if (!isAgentReady || !controlPlaneBaseUrl)
             return;
@@ -265,7 +244,7 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
                             config: {
                                 mode: 'offline',
                                 target_agent_id: agentId,
-                                target_pod_name: podName,
+                                target_runtime_name: runtimeName,
                             },
                             summary: {},
                             tags: ['example'],
@@ -287,7 +266,7 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
             }
         };
         void bootstrap();
-    }, [isAgentReady, controlPlaneBaseUrl, agentId, podName, evalApiFetch]);
+    }, [isAgentReady, controlPlaneBaseUrl, agentId, runtimeName, evalApiFetch]);
     // ── Poll eval results ─────────────────────────────────────────────────
     useEffect(() => {
         if (!isAgentReady || !controlPlaneBaseUrl || !experimentId)
@@ -328,7 +307,7 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
                         suite_name: 'default-suite',
                         passed,
                         failed,
-                        runtime_id: podName,
+                        runtime_id: runtimeName,
                     },
                     report: {
                         source: 'AgentEvalsExample',
@@ -356,12 +335,13 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
         experimentId,
         evalApiFetch,
         mapRuns,
-        podName,
+        runtimeName,
         evalId,
         agentId,
     ]);
     // ── Loading / Error ───────────────────────────────────────────────────
-    if (!isAgentReady && agentStatus !== 'error') {
+    // Local: the Loop must mount to create the agent, so no waiting screen.
+    if (executionTarget !== 'local' && !isAgentReady && agentStatus !== 'error') {
         return (_jsxs(Box, { sx: {
                 display: 'flex',
                 flexDirection: 'column',
@@ -370,9 +350,7 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
                 height: '100%',
                 gap: 3,
             }, children: [_jsx(Spinner, { size: "large" }), _jsx(Text, { sx: { color: 'fg.muted' }, children: agentStatus === 'launching'
-                        ? executionTarget === 'local'
-                            ? 'Launching local eval example agent…'
-                            : 'Launching runtime for eval agent…'
+                        ? 'Launching runtime for eval agent…'
                         : 'Creating eval example agent…' })] }));
     }
     if (agentStatus === 'error' || effectiveError) {
@@ -389,6 +367,7 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
             }, children: [_jsx(Spinner, { size: "large" }), _jsx(Text, { sx: { color: 'fg.muted' }, children: "Preparing hosted eval and experiment..." })] }));
     }
     const latestScore = evalRuns.length > 0 ? evalRuns[0].score : null;
+    void latestScore;
     return (_jsxs(Box, { sx: {
             height: '100%',
             minHeight: 0,
@@ -403,25 +382,14 @@ const AgentEvalsInner = ({ onLogout, executionTarget }) => {
                     borderBottom: '1px solid',
                     borderColor: 'border.default',
                     flexShrink: 0,
-                }, children: [_jsx(BeakerIcon, { size: 16 }), _jsxs(Box, { sx: { flex: 1, minWidth: 0 }, children: [_jsxs(Heading, { as: "h3", sx: { fontSize: 2 }, children: ["Evaluation \u2014 ", podName] }), _jsxs(Text, { sx: {
+                }, children: [_jsx(BeakerIcon, { size: 16 }), _jsxs(Box, { sx: { flex: 1, minWidth: 0 }, children: [_jsxs(Heading, { as: "h3", sx: { fontSize: 2 }, children: ["Evaluation \u2014 ", runtimeName] }), _jsxs(Text, { sx: {
                                     fontSize: 0,
                                     color: 'fg.muted',
                                     display: 'block',
                                     overflow: 'hidden',
                                     textOverflow: 'ellipsis',
                                     whiteSpace: 'nowrap',
-                                }, children: ["Runtime API: ", runtimeCreationBaseUrl, "/api/runtimes/v1/runtimes"] })] }), _jsxs(Label, { size: "small", variant: "accent", children: ["Target: ", executionTarget === 'cloud' ? 'Cloud' : 'Local'] })] }), _jsxs(Box, { sx: { flex: 1, minHeight: 0, display: 'flex' }, children: [_jsx(Box, { sx: { flex: 1, minWidth: 0 }, children: _jsx(Chat, { protocol: "vercel-ai", baseUrl: agentBaseUrl, agentId: agentId, title: "Eval Agent", brandIcon: _jsx(BeakerIcon, { size: 16 }), placeholder: "Chat with the agent, then run evaluations\u2026", description: latestScore != null
-                                ? `Last score: ${(latestScore * 100).toFixed(0)}%`
-                                : 'No evaluations run yet', showHeader: true, kernelIndicatorPlacement: "right", autoFocus: true, height: "100%", runtimeId: podName, historyEndpoint: `${agentBaseUrl}/api/v1/history`, suggestions: [
-                                {
-                                    title: 'Summarize KPIs',
-                                    message: 'Summarize the latest KPI data',
-                                },
-                                {
-                                    title: 'Run eval',
-                                    message: 'Evaluate your last 10 responses',
-                                },
-                            ], submitOnSuggestionClick: true }) }), _jsxs(Box, { sx: {
+                                }, children: ["Runtime API: ", runtimeCreationBaseUrl, "/api/runtimes/v1/runtimes"] })] }), _jsxs(Label, { size: "small", variant: "accent", children: ["Target: ", runtimeTargetCapabilities(executionTarget).label] })] }), _jsxs(Box, { sx: { flex: 1, minHeight: 0, display: 'flex' }, children: [_jsx(Box, { sx: { flex: 1, minWidth: 0 }, children: _jsx(LoopEmbed, { serverUrl: agentBaseUrl, target: "local", showAgentVariants: true, agentId: agentId, editors: false, showHeader: true, plugins: LOOP_PLUGINS_AGENTEVA }) }), _jsxs(Box, { sx: {
                             width: 350,
                             borderLeft: '1px solid',
                             borderColor: 'border.default',