@roj-ai/debug 0.1.3 → 0.1.4

package/dist/components/debug/pages/EventsPage.d.ts

@@ -1 +1,2 @@
 export declare function EventsPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=EventsPage.d.ts.map

package/dist/components/debug/pages/EventsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventsPage.d.ts","sourceRoot":"","sources":["../../../../src/components/debug/pages/EventsPage.tsx"],"names":[],"mappings":"AA6BA,wBAAgB,UAAU,4CA2GzB"}

package/dist/components/debug/pages/EventsPage.js

@@ -0,0 +1,137 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo, useState } from 'react';
+import { DebugLink, useDebugSessionId } from '../DebugNavigation';
+import { api, unwrap } from '@roj-ai/client';
+import { useEvents, useEventStore } from '../../../stores/event-store';
+const EVENT_TYPES = [
+    'all',
+    'session_created',
+    'session_closed',
+    'agent_spawned',
+    'agent_state_changed',
+    'mailbox_message',
+    'mailbox_consumed',
+    'inference_started',
+    'inference_completed',
+    'inference_failed',
+    'tool_started',
+    'tool_completed',
+    'tool_failed',
+    'context_compacted',
+    'user_question_asked',
+    'user_message_sent',
+    'communicator_linked',
+    'session_restarted',
+];
+const PAGE_SIZE = 50;
+export function EventsPage() {
+    const sessionId = useDebugSessionId();
+    // Get events from event store (already loaded by DebugLayout)
+    const allEvents = useEvents();
+    const isLoading = useEventStore((s) => s.isLoading);
+    const error = useEventStore((s) => s.error);
+    const [typeFilter, setTypeFilter] = useState('all');
+    const [offset, setOffset] = useState(0);
+    // Wrap events with original index for fork API
+    const indexedEvents = useMemo(() => allEvents.map((event, originalIndex) => ({ event, originalIndex })), [allEvents]);
+    // Filter events locally
+    const filteredEvents = useMemo(() => {
+        if (typeFilter === 'all')
+            return indexedEvents;
+        return indexedEvents.filter((e) => e.event.type === typeFilter);
+    }, [indexedEvents, typeFilter]);
+    // Apply pagination
+    const paginatedEvents = useMemo(() => {
+        return filteredEvents.slice(offset, offset + PAGE_SIZE);
+    }, [filteredEvents, offset]);
+    const handleFork = useCallback(async (eventIndex) => {
+        if (!sessionId)
+            return;
+        const result = unwrap(await api.call('sessions.fork', { sessionId, eventIndex }));
+        const newUrl = window.location.pathname.replace(sessionId, result.sessionId);
+        window.open(newUrl, '_blank');
+    }, [sessionId]);
+    const total = filteredEvents.length;
+    const totalPages = Math.ceil(total / PAGE_SIZE);
+    const currentPage = Math.floor(offset / PAGE_SIZE) + 1;
+    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("label", { className: "text-sm text-slate-600", children: ["Filter by type:", _jsx("select", { value: typeFilter, onChange: (e) => {
+                                    setTypeFilter(e.target.value);
+                                    setOffset(0); // Reset pagination when filter changes
+                                }, className: "ml-2 border border-slate-300 rounded px-2 py-1 text-sm", children: EVENT_TYPES.map((type) => (_jsx("option", { value: type, children: type === 'all' ? 'All Events' : type }, type))) })] }), _jsxs("span", { className: "text-sm text-slate-500", children: [total, " events total"] })] }), error && _jsx("div", { className: "text-red-500 text-sm", children: error }), _jsx("div", { className: "bg-white rounded-md border border-slate-200 overflow-hidden", children: isLoading && allEvents.length === 0
+                    ? _jsx("div", { className: "p-4 text-slate-500 text-sm", children: "Loading..." })
+                    : paginatedEvents.length === 0
+                        ? _jsx("div", { className: "p-4 text-slate-500 text-sm", children: "No events found" })
+                        : (_jsx("div", { className: "divide-y divide-slate-200", children: paginatedEvents.map(({ event, originalIndex }) => (_jsx(EventRow, { event: event, eventIndex: originalIndex, onFork: handleFork }, `${event.timestamp}-${originalIndex}`))) })) }), totalPages > 1 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("button", { onClick: () => setOffset(Math.max(0, offset - PAGE_SIZE)), disabled: offset === 0, className: "px-3 py-1 text-sm border border-slate-300 rounded hover:bg-slate-50 disabled:opacity-50 disabled:cursor-not-allowed", children: "Previous" }), _jsxs("span", { className: "text-sm text-slate-600", children: ["Page ", currentPage, " of ", totalPages] }), _jsx("button", { onClick: () => setOffset(offset + PAGE_SIZE), disabled: currentPage >= totalPages, className: "px-3 py-1 text-sm border border-slate-300 rounded hover:bg-slate-50 disabled:opacity-50 disabled:cursor-not-allowed", children: "Next" })] }))] }));
+}
+function EventRow({ event, eventIndex, onFork, }) {
+    const [expanded, setExpanded] = useState(false);
+    const [forking, setForking] = useState(false);
+    const typeColors = {
+        session_created: 'bg-green-100 text-green-700',
+        session_closed: 'bg-slate-100 text-slate-700',
+        agent_spawned: 'bg-blue-100 text-blue-700',
+        agent_state_changed: 'bg-yellow-100 text-yellow-700',
+        mailbox_message: 'bg-purple-100 text-purple-700',
+        mailbox_consumed: 'bg-purple-50 text-purple-600',
+        inference_started: 'bg-orange-100 text-orange-700',
+        inference_completed: 'bg-green-100 text-green-700',
+        inference_failed: 'bg-red-100 text-red-700',
+        tool_started: 'bg-cyan-100 text-cyan-700',
+        tool_completed: 'bg-green-100 text-green-700',
+        tool_failed: 'bg-red-100 text-red-700',
+        context_compacted: 'bg-slate-100 text-slate-700',
+        user_question_asked: 'bg-yellow-100 text-yellow-700',
+        user_message_sent: 'bg-blue-100 text-blue-700',
+    };
+    const llmCallId = (event.type === 'inference_completed' || event.type === 'inference_failed')
+        && event.llmCallId;
+    const agentId = 'agentId' in event ? event.agentId : null;
+    return (_jsxs("div", { className: "text-sm", children: [_jsxs("button", { onClick: () => setExpanded(!expanded), className: "w-full p-3 hover:bg-slate-50 flex items-center gap-3 text-left", children: [_jsx("span", { className: "text-xs text-slate-400 font-mono w-20 shrink-0", children: new Date(event.timestamp).toLocaleTimeString() }), _jsx("span", { className: `text-xs px-2 py-0.5 rounded-full font-medium shrink-0 ${typeColors[event.type] || 'bg-slate-100'}`, children: event.type }), _jsx("span", { className: "text-slate-600 truncate flex-1", children: getEventSummary(event) }), _jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [agentId && (_jsx(DebugLink, { to: `agents/${agentId}`, className: "text-xs text-violet-600 hover:underline", children: "Agent" })), llmCallId && (_jsx(DebugLink, { to: `llm-calls/${llmCallId}`, className: "text-xs text-violet-600 hover:underline", children: "LLM Call" })), _jsx("button", { onClick: async (e) => {
+                                    e.stopPropagation();
+                                    setForking(true);
+                                    try {
+                                        await onFork(eventIndex);
+                                    }
+                                    finally {
+                                        setForking(false);
+                                    }
+                                }, disabled: forking, className: "text-xs text-violet-600 hover:underline disabled:opacity-50", children: forking ? 'Forking...' : 'Fork' })] }), _jsx("span", { className: "text-slate-400 shrink-0", children: expanded ? '▼' : '▶' })] }), expanded && (_jsx("div", { className: "px-3 pb-3 bg-slate-50", children: _jsx("pre", { className: "text-xs overflow-x-auto p-3 bg-white border border-slate-200 rounded-md", children: JSON.stringify(event, null, 2) }) }))] }));
+}
+function getEventSummary(event) {
+    const e = event;
+    switch (e.type) {
+        case 'session_created':
+            return `Preset: ${e.presetId}`;
+        case 'session_closed':
+            return 'Session closed';
+        case 'agent_spawned':
+            return `${e.definitionName} (${e.agentId.slice(0, 8)})`;
+        case 'agent_state_changed':
+            return `${e.fromState} → ${e.toState}`;
+        case 'mailbox_message':
+            return `To: ${e.toAgentId.slice(0, 8)}`;
+        case 'mailbox_consumed':
+            return `${e.messageIds.length} messages`;
+        case 'inference_started':
+            return `Agent: ${e.agentId.slice(0, 8)}`;
+        case 'inference_completed':
+            return `${e.metrics.totalTokens} tokens, ${e.metrics.model}`;
+        case 'inference_failed':
+            return e.error;
+        case 'tool_started':
+            return `${e.toolName}`;
+        case 'tool_completed':
+            return `${e.toolCallId.slice(0, 8)} completed`;
+        case 'tool_failed':
+            return `${e.toolCallId.slice(0, 8)}: ${e.error}`;
+        case 'context_compacted':
+            return `${e.originalTokens} → ${e.compactedTokens} tokens`;
+        case 'user_question_asked':
+            return e.question.slice(0, 50) + (e.question.length > 50 ? '...' : '');
+        case 'user_message_sent':
+            return e.message.slice(0, 50) + (e.message.length > 50 ? '...' : '');
+        default:
+            return '';
+    }
+}
+//# sourceMappingURL=EventsPage.js.map

package/dist/components/debug/pages/EventsPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventsPage.js","sourceRoot":"","sources":["../../../../src/components/debug/pages/EventsPage.tsx"],"names":[],"mappings":"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"}

package/dist/components/debug/pages/FilesPage.d.ts

@@ -1 +1,2 @@
 export declare function FilesPage(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=FilesPage.d.ts.map

package/dist/components/debug/pages/FilesPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilesPage.d.ts","sourceRoot":"","sources":["../../../../src/components/debug/pages/FilesPage.tsx"],"names":[],"mappings":"AAsCA,wBAAgB,SAAS,mDAgSxB"}

package/dist/components/debug/pages/FilesPage.js

@@ -0,0 +1,187 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from 'react';
+import { api, getApiBaseUrl } from '@roj-ai/client';
+import { useDebugSessionId } from '../DebugNavigation';
+function formatFileSize(bytes) {
+    if (bytes === 0)
+        return '0 B';
+    const units = ['B', 'KB', 'MB', 'GB'];
+    const i = Math.floor(Math.log(bytes) / Math.log(1024));
+    const size = bytes / Math.pow(1024, i);
+    return `${size.toFixed(i > 0 ? 1 : 0)} ${units[i]}`;
+}
+function isImageMime(mimeType) {
+    return mimeType?.startsWith('image/') ?? false;
+}
+function isTextMime(mimeType) {
+    if (!mimeType)
+        return false;
+    return mimeType.startsWith('text/')
+        || mimeType === 'application/json'
+        || mimeType === 'application/javascript';
+}
+export function FilesPage() {
+    const sessionId = useDebugSessionId();
+    const [root, setRoot] = useState('session');
+    const [currentPath, setCurrentPath] = useState('');
+    const [listing, setListing] = useState(null);
+    const [listingError, setListingError] = useState(null);
+    const [listingLoading, setListingLoading] = useState(false);
+    const [selectedFile, setSelectedFile] = useState(null);
+    const [fileContent, setFileContent] = useState(null);
+    const [fileUrl, setFileUrl] = useState(null);
+    const [fileLoading, setFileLoading] = useState(false);
+    const [fileError, setFileError] = useState(null);
+    const fetchListing = useCallback(async (r, path) => {
+        if (!sessionId)
+            return;
+        setListingLoading(true);
+        setListingError(null);
+        try {
+            const method = r === 'session' ? 'filesystem.listSession' : 'filesystem.listWorkspace';
+            const result = await api.call(method, { sessionId, path: path || undefined });
+            if (!result.ok) {
+                setListingError(result.error.message);
+                setListing(null);
+                return;
+            }
+            setListing(result.value);
+        }
+        catch (e) {
+            setListingError(e instanceof Error ? e.message : 'Failed to fetch listing');
+            setListing(null);
+        }
+        finally {
+            setListingLoading(false);
+        }
+    }, [sessionId]);
+    // Fetch listing when root or path changes
+    useEffect(() => {
+        fetchListing(root, currentPath);
+    }, [root, currentPath, fetchListing]);
+    // Fetch file content when a file is selected
+    useEffect(() => {
+        if (!selectedFile || !sessionId) {
+            setFileContent(null);
+            setFileUrl(null);
+            setFileError(null);
+            return;
+        }
+        const baseUrl = getApiBaseUrl();
+        const routePrefix = root === 'session' ? 'files' : 'workspace';
+        const url = `${baseUrl}/sessions/${sessionId}/${routePrefix}/${selectedFile.path}`;
+        if (isImageMime(selectedFile.entry.mimeType)) {
+            setFileUrl(url);
+            setFileContent(null);
+            setFileLoading(false);
+            setFileError(null);
+            return;
+        }
+        if (isTextMime(selectedFile.entry.mimeType)) {
+            setFileLoading(true);
+            setFileError(null);
+            setFileUrl(null);
+            fetch(url)
+                .then(async (res) => {
+                if (!res.ok)
+                    throw new Error(`HTTP ${res.status}`);
+                return res.text();
+            })
+                .then((text) => {
+                setFileContent(text);
+                setFileLoading(false);
+            })
+                .catch((e) => {
+                setFileError(e instanceof Error ? e.message : 'Failed to fetch file');
+                setFileLoading(false);
+            });
+            return;
+        }
+        // Non-text, non-image: just show info + download link
+        setFileUrl(url);
+        setFileContent(null);
+        setFileLoading(false);
+        setFileError(null);
+    }, [selectedFile, sessionId, root]);
+    const handleNavigate = (entry) => {
+        if (entry.type === 'directory') {
+            const newPath = currentPath ? `${currentPath}/${entry.name}` : entry.name;
+            setCurrentPath(newPath);
+            setSelectedFile(null);
+        }
+        else {
+            const filePath = currentPath ? `${currentPath}/${entry.name}` : entry.name;
+            setSelectedFile({ path: filePath, entry });
+        }
+    };
+    const handleRootChange = (newRoot) => {
+        setRoot(newRoot);
+        setCurrentPath('');
+        setSelectedFile(null);
+    };
+    const handleBreadcrumbClick = (index) => {
+        if (index === -1) {
+            setCurrentPath('');
+        }
+        else {
+            const parts = currentPath.split('/');
+            setCurrentPath(parts.slice(0, index + 1).join('/'));
+        }
+        setSelectedFile(null);
+    };
+    if (!sessionId)
+        return null;
+    const pathParts = currentPath ? currentPath.split('/') : [];
+    return (_jsxs("div", { className: "h-full flex gap-4", children: [_jsxs("div", { className: "w-80 shrink-0 bg-white rounded-md border border-slate-200 flex flex-col", children: [_jsxs("div", { className: "flex border-b border-slate-200", children: [_jsx("button", { onClick: () => handleRootChange('session'), className: `flex-1 px-4 py-2 text-sm font-medium transition-colors ${root === 'session'
+                                    ? 'text-violet-700 border-b-2 border-violet-600 bg-violet-50'
+                                    : 'text-slate-500 hover:text-slate-700 hover:bg-slate-50'}`, children: "Session" }), _jsx("button", { onClick: () => handleRootChange('workspace'), className: `flex-1 px-4 py-2 text-sm font-medium transition-colors ${root === 'workspace'
+                                    ? 'text-violet-700 border-b-2 border-violet-600 bg-violet-50'
+                                    : 'text-slate-500 hover:text-slate-700 hover:bg-slate-50'}`, children: "Workspace" })] }), _jsxs("div", { className: "px-3 py-2 border-b border-slate-100 flex items-center gap-1 text-sm overflow-x-auto", children: [_jsx("button", { onClick: () => handleBreadcrumbClick(-1), className: "text-violet-600 hover:underline shrink-0", children: "/" }), pathParts.map((part, i) => (_jsxs("span", { className: "flex items-center gap-1 shrink-0", children: [_jsx("span", { className: "text-slate-400", children: "/" }), i < pathParts.length - 1
+                                        ? (_jsx("button", { onClick: () => handleBreadcrumbClick(i), className: "text-violet-600 hover:underline", children: part }))
+                                        : _jsx("span", { className: "text-slate-700 font-medium", children: part })] }, i)))] }), _jsx("div", { className: "flex-1 overflow-auto", children: listingLoading
+                            ? _jsx("div", { className: "p-3 text-slate-500 text-sm", children: "Loading..." })
+                            : listingError
+                                ? _jsx("div", { className: "p-3 text-red-500 text-sm", children: listingError })
+                                : !listing || listing.entries.length === 0
+                                    ? _jsx("div", { className: "p-3 text-slate-500 text-sm", children: "Empty directory" })
+                                    : (_jsxs("div", { className: "divide-y divide-slate-100", children: [currentPath && (_jsxs("button", { onClick: () => {
+                                                    const parts = currentPath.split('/');
+                                                    parts.pop();
+                                                    setCurrentPath(parts.join('/'));
+                                                    setSelectedFile(null);
+                                                }, className: "w-full flex items-center gap-2 px-3 py-2 text-sm text-slate-500 hover:bg-slate-50 text-left", children: [_jsx(FolderUpIcon, {}), _jsx("span", { children: ".." })] })), listing.entries.map((entry) => {
+                                                const isSelected = selectedFile
+                                                    && entry.type === 'file'
+                                                    && selectedFile.entry.name === entry.name
+                                                    && selectedFile.path === (currentPath ? `${currentPath}/${entry.name}` : entry.name);
+                                                return (_jsxs("button", { onClick: () => handleNavigate(entry), className: `w-full flex items-center gap-2 px-3 py-2 text-sm text-left transition-colors ${isSelected
+                                                        ? 'bg-violet-50 text-violet-700'
+                                                        : 'text-slate-700 hover:bg-slate-50'}`, children: [entry.type === 'directory' ? _jsx(FolderIcon, {}) : _jsx(FileIcon, {}), _jsx("span", { className: "truncate flex-1", children: entry.name }), entry.type === 'file' && (_jsx("span", { className: "text-xs text-slate-400 shrink-0", children: formatFileSize(entry.size) }))] }, entry.name));
+                                            })] })) })] }), _jsxs("div", { className: "flex-1 bg-white rounded-md border border-slate-200 flex flex-col min-w-0", children: [_jsxs("div", { className: "p-3 border-b border-slate-200", children: [_jsx("h2", { className: "font-medium text-slate-900", children: selectedFile ? selectedFile.path : 'File Viewer' }), selectedFile && (_jsxs("div", { className: "flex items-center gap-3 mt-1 text-xs text-slate-500", children: [_jsx("span", { children: selectedFile.entry.mimeType ?? 'unknown type' }), _jsx("span", { children: formatFileSize(selectedFile.entry.size) })] }))] }), _jsx("div", { className: "flex-1 overflow-auto p-4", children: !selectedFile
+                            ? (_jsx("div", { className: "text-slate-500 text-sm", children: "Select a file from the directory browser to view its contents" }))
+                            : fileLoading
+                                ? _jsx("div", { className: "text-slate-500 text-sm", children: "Loading file..." })
+                                : fileError
+                                    ? _jsx("div", { className: "text-red-500 text-sm", children: fileError })
+                                    : fileContent !== null
+                                        ? (_jsx("pre", { className: "text-xs font-mono whitespace-pre-wrap break-words bg-slate-50 p-4 rounded-md border border-slate-200 overflow-auto max-h-full", children: fileContent }))
+                                        : fileUrl && isImageMime(selectedFile.entry.mimeType)
+                                            ? (_jsx("div", { className: "flex items-center justify-center", children: _jsx("img", { src: fileUrl, alt: selectedFile.entry.name, className: "max-w-full max-h-[70vh] object-contain rounded border border-slate-200" }) }))
+                                            : fileUrl
+                                                ? (_jsxs("div", { className: "space-y-3", children: [_jsx("p", { className: "text-sm text-slate-600", children: "This file type cannot be previewed." }), _jsxs("a", { href: fileUrl, download: selectedFile.entry.name, className: "inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-violet-700 bg-violet-50 rounded-md hover:bg-violet-100 transition-colors", children: [_jsx(DownloadIcon, {}), "Download ", selectedFile.entry.name] })] }))
+                                                : null })] })] }));
+}
+// Icons
+function FolderIcon() {
+    return (_jsx("svg", { className: "w-4 h-4 text-yellow-500 shrink-0", fill: "currentColor", viewBox: "0 0 20 20", children: _jsx("path", { d: "M2 6a2 2 0 012-2h5l2 2h5a2 2 0 012 2v6a2 2 0 01-2 2H4a2 2 0 01-2-2V6z" }) }));
+}
+function FolderUpIcon() {
+    return (_jsx("svg", { className: "w-4 h-4 text-slate-400 shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 10h18M3 10l6-6m-6 6l6 6" }) }));
+}
+function FileIcon() {
+    return (_jsx("svg", { className: "w-4 h-4 text-slate-400 shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" }) }));
+}
+function DownloadIcon() {
+    return (_jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) }));
+}
+//# sourceMappingURL=FilesPage.js.map

package/dist/components/debug/pages/FilesPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilesPage.js","sourceRoot":"","sources":["../../../../src/components/debug/pages/FilesPage.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACxD,OAAO,EAAE,GAAG,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAiBtD,SAAS,cAAc,CAAC,KAAa;IACpC,IAAI,KAAK,KAAK,CAAC;QAAE,OAAO,KAAK,CAAA;IAC7B,MAAM,KAAK,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAA;IACrC,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAA;IACtD,MAAM,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,CAAA;IACtC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;AACpD,CAAC;AAED,SAAS,WAAW,CAAC,QAA4B;IAChD,OAAO,QAAQ,EAAE,UAAU,CAAC,QAAQ,CAAC,IAAI,KAAK,CAAA;AAC/C,CAAC;AAED,SAAS,UAAU,CAAC,QAA4B;IAC/C,IAAI,CAAC,QAAQ;QAAE,OAAO,KAAK,CAAA;IAC3B,OAAO,QAAQ,CAAC,UAAU,CAAC,OAAO,CAAC;WAC/B,QAAQ,KAAK,kBAAkB;WAC/B,QAAQ,KAAK,wBAAwB,CAAA;AAC1C,CAAC;AAED,MAAM,UAAU,SAAS;IACxB,MAAM,SAAS,GAAG,iBAAiB,EAAE,CAAA;IACrC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAO,SAAS,CAAC,CAAA;IACjD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAA;IAClD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAA0B,IAAI,CAAC,CAAA;IACrE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAA;IACrE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC3D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAiD,IAAI,CAAC,CAAA;IACtG,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAA;IACnE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAA;IAC3D,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACrD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAA;IAE/D,MAAM,YAAY,GAAG,WAAW,CAAC,KAAK,EAAE,CAAO,EAAE,IAAY,EAAE,EAAE;QAChE,IAAI,CAAC,SAAS;YAAE,OAAM;QACtB,iBAAiB,CAAC,IAAI,CAAC,CAAA;QACvB,eAAe,CAAC,IAAI,CAAC,CAAA;QAErB,IAAI,CAAC;YACJ,MAAM,MAAM,GAAG,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,0BAA0B,CAAA;YACtF,MAAM,MAAM,GAAG,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,IAAI,SAAS,EAAE,CAAC,CAAA;YAC7E,IAAI,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC;gBAChB,eAAe,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA;gBACrC,UAAU,CAAC,IAAI,CAAC,CAAA;gBAChB,OAAM;YACP,CAAC;YACD,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;QACzB,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACZ,eAAe,CAAC,CAAC,YAAY,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAA;YAC3E,UAAU,CAAC,IAAI,CAAC,CAAA;QACjB,CAAC;gBAAS,CAAC;YACV,iBAAiB,CAAC,KAAK,CAAC,CAAA;QACzB,CAAC;IACF,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAEf,0CAA0C;IAC1C,SAAS,CAAC,GAAG,EAAE;QACd,YAAY,CAAC,IAAI,EAAE,WAAW,CAAC,CAAA;IAChC,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC,CAAA;IAErC,6CAA6C;IAC7C,SAAS,CAAC,GAAG,EAAE;QACd,IAAI,CAAC,YAAY,IAAI,CAAC,SAAS,EAAE,CAAC;YACjC,cAAc,CAAC,IAAI,CAAC,CAAA;YACpB,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,YAAY,CAAC,IAAI,CAAC,CAAA;YAClB,OAAM;QACP,CAAC;QAED,MAAM,OAAO,GAAG,aAAa,EAAE,CAAA;QAC/B,MAAM,WAAW,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAA;QAC9D,MAAM,GAAG,GAAG,GAAG,OAAO,aAAa,SAAS,IAAI,WAAW,IAAI,YAAY,CAAC,IAAI,EAAE,CAAA;QAElF,IAAI,WAAW,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC9C,UAAU,CAAC,GAAG,CAAC,CAAA;YACf,cAAc,CAAC,IAAI,CAAC,CAAA;YACpB,cAAc,CAAC,KAAK,CAAC,CAAA;YACrB,YAAY,CAAC,IAAI,CAAC,CAAA;YAClB,OAAM;QACP,CAAC;QAED,IAAI,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC7C,cAAc,CAAC,IAAI,CAAC,CAAA;YACpB,YAAY,CAAC,IAAI,CAAC,CAAA;YAClB,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,KAAK,CAAC,GAAG,CAAC;iBACR,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;gBACnB,IAAI,CAAC,GAAG,CAAC,EAAE;oBAAE,MAAM,IAAI,KAAK,CAAC,QAAQ,GAAG,CAAC,MAAM,EAAE,CAAC,CAAA;gBAClD,OAAO,GAAG,CAAC,IAAI,EAAE,CAAA;YAClB,CAAC,CAAC;iBACD,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE;gBACd,cAAc,CAAC,IAAI,CAAC,CAAA;gBACpB,cAAc,CAAC,KAAK,CAAC,CAAA;YACtB,CAAC,CAAC;iBACD,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE;gBACZ,YAAY,CAAC,CAAC,YAAY,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAA;gBACrE,cAAc,CAAC,KAAK,CAAC,CAAA;YACtB,CAAC,CAAC,CAAA;YACH,OAAM;QACP,CAAC;QAED,sDAAsD;QACtD,UAAU,CAAC,GAAG,CAAC,CAAA;QACf,cAAc,CAAC,IAAI,CAAC,CAAA;QACpB,cAAc,CAAC,KAAK,CAAC,CAAA;QACrB,YAAY,CAAC,IAAI,CAAC,CAAA;IACnB,CAAC,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC,CAAA;IAEnC,MAAM,cAAc,GAAG,CAAC,KAAqB,EAAE,EAAE;QAChD,IAAI,KAAK,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;YAChC,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAA;YACzE,cAAc,CAAC,OAAO,CAAC,CAAA;YACvB,eAAe,CAAC,IAAI,CAAC,CAAA;QACtB,CAAC;aAAM,CAAC;YACP,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAA;YAC1E,eAAe,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAA;QAC3C,CAAC;IACF,CAAC,CAAA;IAED,MAAM,gBAAgB,GAAG,CAAC,OAAa,EAAE,EAAE;QAC1C,OAAO,CAAC,OAAO,CAAC,CAAA;QAChB,cAAc,CAAC,EAAE,CAAC,CAAA;QAClB,eAAe,CAAC,IAAI,CAAC,CAAA;IACtB,CAAC,CAAA;IAED,MAAM,qBAAqB,GAAG,CAAC,KAAa,EAAE,EAAE;QAC/C,IAAI,KAAK,KAAK,CAAC,CAAC,EAAE,CAAC;YAClB,cAAc,CAAC,EAAE,CAAC,CAAA;QACnB,CAAC;aAAM,CAAC;YACP,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;YACpC,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;QACpD,CAAC;QACD,eAAe,CAAC,IAAI,CAAC,CAAA;IACtB,CAAC,CAAA;IAED,IAAI,CAAC,SAAS;QAAE,OAAO,IAAI,CAAA;IAE3B,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAE3D,OAAO,CACN,eAAK,SAAS,EAAC,mBAAmB,aAEjC,eAAK,SAAS,EAAC,yEAAyE,aAEvF,eAAK,SAAS,EAAC,gCAAgC,aAC9C,iBACC,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,SAAS,CAAC,EAC1C,SAAS,EAAE,0DACV,IAAI,KAAK,SAAS;oCACjB,CAAC,CAAC,2DAA2D;oCAC7D,CAAC,CAAC,uDACJ,EAAE,wBAGM,EACT,iBACC,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,WAAW,CAAC,EAC5C,SAAS,EAAE,0DACV,IAAI,KAAK,WAAW;oCACnB,CAAC,CAAC,2DAA2D;oCAC7D,CAAC,CAAC,uDACJ,EAAE,0BAGM,IACJ,EAGN,eAAK,SAAS,EAAC,qFAAqF,aACnG,iBACC,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,EACxC,SAAS,EAAC,0CAA0C,kBAG5C,EACR,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CAC3B,gBAAc,SAAS,EAAC,kCAAkC,aACzD,eAAM,SAAS,EAAC,gBAAgB,kBAAS,EACxC,CAAC,GAAG,SAAS,CAAC,MAAM,GAAG,CAAC;wCACxB,CAAC,CAAC,CACD,iBACC,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAC,EACvC,SAAS,EAAC,iCAAiC,YAE1C,IAAI,GACG,CACT;wCACD,CAAC,CAAC,eAAM,SAAS,EAAC,4BAA4B,YAAE,IAAI,GAAQ,KAXnD,CAAC,CAYL,CACP,CAAC,IACG,EAGN,cAAK,SAAS,EAAC,sBAAsB,YACnC,cAAc;4BACd,CAAC,CAAC,cAAK,SAAS,EAAC,4BAA4B,2BAAiB;4BAC9D,CAAC,CAAC,YAAY;gCACd,CAAC,CAAC,cAAK,SAAS,EAAC,0BAA0B,YAAE,YAAY,GAAO;gCAChE,CAAC,CAAC,CAAC,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC;oCAC1C,CAAC,CAAC,cAAK,SAAS,EAAC,4BAA4B,gCAAsB;oCACnE,CAAC,CAAC,CACD,eAAK,SAAS,EAAC,2BAA2B,aACxC,WAAW,IAAI,CACf,kBACC,OAAO,EAAE,GAAG,EAAE;oDACb,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;oDACpC,KAAK,CAAC,GAAG,EAAE,CAAA;oDACX,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;oDAC/B,eAAe,CAAC,IAAI,CAAC,CAAA;gDACtB,CAAC,EACD,SAAS,EAAC,6FAA6F,aAEvG,KAAC,YAAY,KAAG,EAChB,gCAAe,IACP,CACT,EACA,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;gDAC9B,MAAM,UAAU,GAAG,YAAY;uDAC3B,KAAK,CAAC,IAAI,KAAK,MAAM;uDACrB,YAAY,CAAC,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI;uDACtC,YAAY,CAAC,IAAI,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;gDAErF,OAAO,CACN,kBAEC,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,EACpC,SAAS,EAAE,gFACV,UAAU;wDACT,CAAC,CAAC,8BAA8B;wDAChC,CAAC,CAAC,kCACJ,EAAE,aAED,KAAK,CAAC,IAAI,KAAK,WAAW,CAAC,CAAC,CAAC,KAAC,UAAU,KAAG,CAAC,CAAC,CAAC,KAAC,QAAQ,KAAG,EAC3D,eAAM,SAAS,EAAC,iBAAiB,YAAE,KAAK,CAAC,IAAI,GAAQ,EACpD,KAAK,CAAC,IAAI,KAAK,MAAM,IAAI,CACzB,eAAM,SAAS,EAAC,iCAAiC,YAC/C,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,GACrB,CACP,KAdI,KAAK,CAAC,IAAI,CAeP,CACT,CAAA;4CACF,CAAC,CAAC,IACG,CACN,GACG,IACD,EAGN,eAAK,SAAS,EAAC,0EAA0E,aACxF,eAAK,SAAS,EAAC,+BAA+B,aAC7C,aAAI,SAAS,EAAC,4BAA4B,YACxC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,aAAa,GAC7C,EACJ,YAAY,IAAI,CAChB,eAAK,SAAS,EAAC,qDAAqD,aACnE,yBAAO,YAAY,CAAC,KAAK,CAAC,QAAQ,IAAI,cAAc,GAAQ,EAC5D,yBAAO,cAAc,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC,GAAQ,IACjD,CACN,IACI,EACN,cAAK,SAAS,EAAC,0BAA0B,YACvC,CAAC,YAAY;4BACb,CAAC,CAAC,CACD,cAAK,SAAS,EAAC,wBAAwB,8EAEjC,CACN;4BACD,CAAC,CAAC,WAAW;gCACb,CAAC,CAAC,cAAK,SAAS,EAAC,wBAAwB,gCAAsB;gCAC/D,CAAC,CAAC,SAAS;oCACX,CAAC,CAAC,cAAK,SAAS,EAAC,sBAAsB,YAAE,SAAS,GAAO;oCACzD,CAAC,CAAC,WAAW,KAAK,IAAI;wCACtB,CAAC,CAAC,CACD,cAAK,SAAS,EAAC,+HAA+H,YAC5I,WAAW,GACP,CACN;wCACD,CAAC,CAAC,OAAO,IAAI,WAAW,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,CAAC;4CACrD,CAAC,CAAC,CACD,cAAK,SAAS,EAAC,kCAAkC,YAChD,cACC,GAAG,EAAE,OAAO,EACZ,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,IAAI,EAC5B,SAAS,EAAC,wEAAwE,GACjF,GACG,CACN;4CACD,CAAC,CAAC,OAAO;gDACT,CAAC,CAAC,CACD,eAAK,SAAS,EAAC,WAAW,aACzB,YAAG,SAAS,EAAC,wBAAwB,oDAEjC,EACJ,aACC,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,YAAY,CAAC,KAAK,CAAC,IAAI,EACjC,SAAS,EAAC,4IAA4I,aAEtJ,KAAC,YAAY,KAAG,eACN,YAAY,CAAC,KAAK,CAAC,IAAI,IAC9B,IACC,CACN;gDACD,CAAC,CAAC,IAAI,GACF,IACD,IACD,CACN,CAAA;AACF,CAAC;AAED,QAAQ;AAER,SAAS,UAAU;IAClB,OAAO,CACN,cAAK,SAAS,EAAC,kCAAkC,EAAC,IAAI,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,YACxF,eAAM,CAAC,EAAC,uEAAuE,GAAG,GAC7E,CACN,CAAA;AACF,CAAC;AAED,SAAS,YAAY;IACpB,OAAO,CACN,cAAK,SAAS,EAAC,iCAAiC,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,YACrG,eAAM,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,EAAE,CAAC,EAAE,CAAC,EAAC,4BAA4B,GAAG,GAC/F,CACN,CAAA;AACF,CAAC;AAED,SAAS,QAAQ;IAChB,OAAO,CACN,cAAK,SAAS,EAAC,iCAAiC,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,YACrG,eACC,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAE,CAAC,EACd,CAAC,EAAC,4GAA4G,GAC7G,GACG,CACN,CAAA;AACF,CAAC;AAED,SAAS,YAAY;IACpB,OAAO,CACN,cAAK,SAAS,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,YAC7E,eAAM,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,EAAE,CAAC,EAAE,CAAC,EAAC,iIAAiI,GAAG,GACpM,CACN,CAAA;AACF,CAAC"}

package/dist/components/debug/pages/LLMCallPage.d.ts

@@ -1 +1,2 @@
 export declare function LLMCallPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=LLMCallPage.d.ts.map

package/dist/components/debug/pages/LLMCallPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LLMCallPage.d.ts","sourceRoot":"","sources":["../../../../src/components/debug/pages/LLMCallPage.tsx"],"names":[],"mappings":"AAGA,wBAAgB,WAAW,4CA4B1B"}

package/dist/components/debug/pages/LLMCallPage.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DebugLink, useDebugParams, useDebugSessionId } from '../DebugNavigation';
+import { LLMCallDetail } from '../LLMCallDetail';
+export function LLMCallPage() {
+    const sessionId = useDebugSessionId();
+    const { callId } = useDebugParams();
+    if (!callId) {
+        return _jsx("div", { className: "text-slate-500", children: "Invalid URL" });
+    }
+    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center gap-2 text-sm", children: [_jsx(DebugLink, { to: "llm-calls", className: "text-violet-600 hover:underline", children: "LLM Calls" }), _jsx("span", { className: "text-slate-400", children: "/" }), _jsxs("span", { className: "text-slate-600 font-mono", children: [callId.slice(0, 12), "..."] })] }), _jsx("div", { className: "bg-white rounded-md border border-slate-200 p-6", children: _jsx(LLMCallDetail, { sessionId: sessionId, callId: callId }) })] }));
+}
+//# sourceMappingURL=LLMCallPage.js.map

package/dist/components/debug/pages/LLMCallPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LLMCallPage.js","sourceRoot":"","sources":["../../../../src/components/debug/pages/LLMCallPage.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AACjF,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAEhD,MAAM,UAAU,WAAW;IAC1B,MAAM,SAAS,GAAG,iBAAiB,EAAE,CAAA;IACrC,MAAM,EAAE,MAAM,EAAE,GAAG,cAAc,EAAsB,CAAA;IAEvD,IAAI,CAAC,MAAM,EAAE,CAAC;QACb,OAAO,cAAK,SAAS,EAAC,gBAAgB,4BAAkB,CAAA;IACzD,CAAC;IAED,OAAO,CACN,eAAK,SAAS,EAAC,WAAW,aAEzB,eAAK,SAAS,EAAC,iCAAiC,aAC/C,KAAC,SAAS,IACT,EAAE,EAAC,WAAW,EACd,SAAS,EAAC,iCAAiC,0BAGhC,EACZ,eAAM,SAAS,EAAC,gBAAgB,kBAAS,EACzC,gBAAM,SAAS,EAAC,0BAA0B,aAAE,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,WAAW,IACrE,EAGN,cAAK,SAAS,EAAC,iDAAiD,YAC/D,KAAC,aAAa,IAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,GAAI,GAClD,IACD,CACN,CAAA;AACF,CAAC"}

package/dist/components/debug/pages/LLMCallsPage.d.ts

@@ -1 +1,2 @@
 export declare function LLMCallsPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=LLMCallsPage.d.ts.map

package/dist/components/debug/pages/LLMCallsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LLMCallsPage.d.ts","sourceRoot":"","sources":["../../../../src/components/debug/pages/LLMCallsPage.tsx"],"names":[],"mappings":"AAkBA,wBAAgB,YAAY,4CAiT3B"}

package/dist/components/debug/pages/LLMCallsPage.js

@@ -0,0 +1,200 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { api, unwrap } from '@roj-ai/client';
+import { useEventStore } from '../../../stores/event-store';
+import { DebugLink, useDebugSessionId } from '../DebugNavigation';
+function isLLMCallLogEntry(data) {
+    return typeof data === 'object' && data !== null && 'id' in data && 'status' in data && 'request' in data;
+}
+const PAGE_SIZE = 50;
+const FETCH_LIMIT = 1000;
+export function LLMCallsPage() {
+    const sessionId = useDebugSessionId();
+    const [calls, setCalls] = useState([]);
+    const [total, setTotal] = useState(0);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    const [offset, setOffset] = useState(0);
+    const [agentFilter, setAgentFilter] = useState('all');
+    const [statusFilter, setStatusFilter] = useState('all');
+    const [providerFilter, setProviderFilter] = useState('all');
+    const [modelFilter, setModelFilter] = useState('all');
+    const [sortField, setSortField] = useState('time');
+    const [sortDirection, setSortDirection] = useState('desc');
+    const agentProjection = useEventStore((s) => s.agentDetailProjectionState);
+    const agentNameById = useMemo(() => {
+        const map = new Map();
+        for (const agent of agentProjection.agents.values()) {
+            map.set(agent.id, agent.definitionName);
+        }
+        return map;
+    }, [agentProjection]);
+    const resolveAgentName = useCallback((agentId) => agentNameById.get(agentId) ?? agentId, [agentNameById]);
+    const load = useCallback(async () => {
+        if (!sessionId)
+            return;
+        try {
+            const data = unwrap(await api.call('llm.getCalls', {
+                sessionId,
+                limit: FETCH_LIMIT,
+                offset: 0,
+            }));
+            setCalls(data.calls.filter(isLLMCallLogEntry));
+            setTotal(data.total);
+            setError(null);
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : 'Failed to load LLM calls');
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [sessionId]);
+    useEffect(() => {
+        load();
+        const interval = setInterval(load, 5000);
+        return () => clearInterval(interval);
+    }, [load]);
+    const uniqueAgents = useMemo(() => {
+        const ids = new Set();
+        for (const call of calls)
+            ids.add(call.agentId);
+        return Array.from(ids)
+            .map((id) => ({ id, name: resolveAgentName(id) }))
+            .sort((a, b) => a.name.localeCompare(b.name));
+    }, [calls, resolveAgentName]);
+    const uniqueProviders = useMemo(() => {
+        const set = new Set();
+        for (const call of calls) {
+            const p = call.metrics?.provider;
+            if (p)
+                set.add(p);
+        }
+        return Array.from(set).sort();
+    }, [calls]);
+    const uniqueModels = useMemo(() => {
+        const set = new Set();
+        for (const call of calls)
+            set.add(call.request.model);
+        return Array.from(set).sort();
+    }, [calls]);
+    const filteredCalls = useMemo(() => {
+        return calls.filter((call) => {
+            if (agentFilter !== 'all' && call.agentId !== agentFilter)
+                return false;
+            if (statusFilter !== 'all' && call.status !== statusFilter)
+                return false;
+            if (providerFilter !== 'all' && (call.metrics?.provider ?? '') !== providerFilter)
+                return false;
+            if (modelFilter !== 'all' && call.request.model !== modelFilter)
+                return false;
+            return true;
+        });
+    }, [calls, agentFilter, statusFilter, providerFilter, modelFilter]);
+    const sortedCalls = useMemo(() => {
+        const sorted = [...filteredCalls];
+        const direction = sortDirection === 'asc' ? 1 : -1;
+        sorted.sort((a, b) => {
+            let aVal;
+            let bVal;
+            switch (sortField) {
+                case 'time':
+                    aVal = a.createdAt;
+                    bVal = b.createdAt;
+                    break;
+                case 'duration':
+                    aVal = a.metrics?.latencyMs ?? a.durationMs ?? 0;
+                    bVal = b.metrics?.latencyMs ?? b.durationMs ?? 0;
+                    break;
+                case 'tokens':
+                    aVal = a.metrics?.totalTokens ?? 0;
+                    bVal = b.metrics?.totalTokens ?? 0;
+                    break;
+                case 'cost':
+                    aVal = a.metrics?.cost ?? 0;
+                    bVal = b.metrics?.cost ?? 0;
+                    break;
+            }
+            return (aVal - bVal) * direction;
+        });
+        return sorted;
+    }, [filteredCalls, sortField, sortDirection]);
+    const paginatedCalls = useMemo(() => sortedCalls.slice(offset, offset + PAGE_SIZE), [sortedCalls, offset]);
+    const filteredTotal = sortedCalls.length;
+    const totalPages = Math.max(1, Math.ceil(filteredTotal / PAGE_SIZE));
+    const currentPage = Math.floor(offset / PAGE_SIZE) + 1;
+    useEffect(() => {
+        if (offset >= filteredTotal && offset > 0)
+            setOffset(0);
+    }, [filteredTotal, offset]);
+    const totalTokens = sortedCalls.reduce((sum, c) => sum + (c.metrics?.totalTokens ?? 0), 0);
+    const totalCost = sortedCalls.reduce((sum, c) => sum + (c.metrics?.cost ?? 0), 0);
+    const toggleSort = (field) => {
+        if (sortField === field) {
+            setSortDirection(sortDirection === 'asc' ? 'desc' : 'asc');
+        }
+        else {
+            setSortField(field);
+            setSortDirection('desc');
+        }
+        setOffset(0);
+    };
+    const resetPagination = () => setOffset(0);
+    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center gap-6 text-sm", children: [_jsxs("span", { className: "text-slate-600", children: [_jsx("span", { className: "font-medium text-slate-900", children: filteredTotal }), filteredTotal !== total && _jsxs("span", { className: "text-slate-400", children: [" / ", total] }), " calls"] }), _jsxs("span", { className: "text-slate-600", children: [_jsx("span", { className: "font-medium text-slate-900", children: totalTokens.toLocaleString() }), " tokens"] }), totalCost > 0 && (_jsxs("span", { className: "text-slate-600", children: [_jsxs("span", { className: "font-medium text-green-600", children: ["$", totalCost.toFixed(4)] }), " cost"] }))] }), _jsxs("div", { className: "flex flex-wrap items-center gap-3 text-sm", children: [_jsx(FilterSelect, { label: 'Agent', value: agentFilter, onChange: (v) => {
+                            setAgentFilter(v);
+                            resetPagination();
+                        }, options: [
+                            { value: 'all', label: 'All agents' },
+                            ...uniqueAgents.map((a) => ({ value: a.id, label: a.name })),
+                        ] }), _jsx(FilterSelect, { label: 'Status', value: statusFilter, onChange: (v) => {
+                            setStatusFilter(v);
+                            resetPagination();
+                        }, options: [
+                            { value: 'all', label: 'All statuses' },
+                            { value: 'running', label: 'running' },
+                            { value: 'success', label: 'success' },
+                            { value: 'error', label: 'error' },
+                        ] }), _jsx(FilterSelect, { label: 'Provider', value: providerFilter, onChange: (v) => {
+                            setProviderFilter(v);
+                            resetPagination();
+                        }, options: [
+                            { value: 'all', label: 'All providers' },
+                            ...uniqueProviders.map((p) => ({ value: p, label: p })),
+                        ] }), _jsx(FilterSelect, { label: 'Model', value: modelFilter, onChange: (v) => {
+                            setModelFilter(v);
+                            resetPagination();
+                        }, options: [
+                            { value: 'all', label: 'All models' },
+                            ...uniqueModels.map((m) => ({ value: m, label: m })),
+                        ] })] }), error && _jsx("div", { className: "text-red-500 text-sm", children: error }), _jsx("div", { className: "bg-white rounded-md border border-slate-200 overflow-hidden", children: loading && calls.length === 0
+                    ? _jsx("div", { className: "p-4 text-slate-500 text-sm", children: "Loading..." })
+                    : paginatedCalls.length === 0
+                        ? _jsx("div", { className: "p-4 text-slate-500 text-sm", children: "No LLM calls found" })
+                        : (_jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-slate-50 border-b border-slate-200", children: _jsxs("tr", { children: [_jsx(SortableHeader, { label: 'Time', field: 'time', sortField: sortField, sortDirection: sortDirection, onClick: toggleSort, align: 'left' }), _jsx("th", { className: "px-3 py-2 text-left font-medium text-slate-600", children: "Status" }), _jsx("th", { className: "px-3 py-2 text-left font-medium text-slate-600", children: "Provider" }), _jsx("th", { className: "px-3 py-2 text-left font-medium text-slate-600", children: "Model" }), _jsx(SortableHeader, { label: 'Duration', field: 'duration', sortField: sortField, sortDirection: sortDirection, onClick: toggleSort, align: 'right' }), _jsx(SortableHeader, { label: 'Tokens', field: 'tokens', sortField: sortField, sortDirection: sortDirection, onClick: toggleSort, align: 'right' }), _jsx(SortableHeader, { label: 'Cost', field: 'cost', sortField: sortField, sortDirection: sortDirection, onClick: toggleSort, align: 'right' }), _jsx("th", { className: "px-3 py-2 text-left font-medium text-slate-600", children: "Agent" })] }) }), _jsx("tbody", { className: "divide-y divide-slate-200", children: paginatedCalls.map((call) => (_jsx(CallRow, { call: call, agentName: resolveAgentName(call.agentId) }, call.id))) })] }) })) }), totalPages > 1 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("button", { onClick: () => setOffset(Math.max(0, offset - PAGE_SIZE)), disabled: offset === 0, className: "px-3 py-1 text-sm border border-slate-300 rounded hover:bg-slate-50 disabled:opacity-50 disabled:cursor-not-allowed", children: "Previous" }), _jsxs("span", { className: "text-sm text-slate-600", children: ["Page ", currentPage, " of ", totalPages] }), _jsx("button", { onClick: () => setOffset(offset + PAGE_SIZE), disabled: currentPage >= totalPages, className: "px-3 py-1 text-sm border border-slate-300 rounded hover:bg-slate-50 disabled:opacity-50 disabled:cursor-not-allowed", children: "Next" })] }))] }));
+}
+function FilterSelect({ label, value, onChange, options, }) {
+    return (_jsxs("label", { className: "text-slate-600 flex items-center gap-2", children: [_jsxs("span", { children: [label, ":"] }), _jsx("select", { value: value, onChange: (e) => onChange(e.target.value), className: "border border-slate-300 rounded px-2 py-1 text-sm bg-white", children: options.map((opt) => (_jsx("option", { value: opt.value, children: opt.label }, opt.value))) })] }));
+}
+function SortableHeader({ label, field, sortField, sortDirection, onClick, align, }) {
+    const active = sortField === field;
+    const arrow = active ? (sortDirection === 'asc' ? '▲' : '▼') : '';
+    return (_jsx("th", { className: `px-3 py-2 font-medium text-slate-600 ${align === 'right' ? 'text-right' : 'text-left'}`, children: _jsxs("button", { type: 'button', onClick: () => onClick(field), className: `inline-flex items-center gap-1 hover:text-slate-900 ${active ? 'text-slate-900' : ''}`, children: [_jsx("span", { children: label }), arrow && _jsx("span", { className: "text-xs", children: arrow })] }) }));
+}
+function CallRow({ call, agentName }) {
+    const metrics = call.metrics;
+    const promptTokens = metrics?.promptTokens ?? 0;
+    const completionTokens = metrics?.completionTokens ?? 0;
+    const totalTokens = promptTokens + completionTokens;
+    const cost = metrics?.cost;
+    const latency = metrics?.latencyMs ?? call.durationMs;
+    return (_jsxs("tr", { className: "hover:bg-slate-50", children: [_jsx("td", { className: "px-3 py-2 font-mono text-xs text-slate-500", children: _jsx(DebugLink, { to: `llm-calls/${call.id}`, className: "hover:text-violet-600", children: new Date(call.createdAt).toLocaleTimeString() }) }), _jsx("td", { className: "px-3 py-2", children: _jsx(StatusBadge, { status: call.status }) }), _jsx("td", { className: "px-3 py-2 text-xs text-slate-500", children: call.metrics?.provider ?? '—' }), _jsx("td", { className: "px-3 py-2", children: _jsx(DebugLink, { to: `llm-calls/${call.id}`, className: "font-mono text-xs hover:text-violet-600", children: call.request.model.split('/').pop() }) }), _jsx("td", { className: "px-3 py-2 text-right font-mono text-xs", children: latency !== undefined ? `${(latency / 1000).toFixed(2)}s` : '—' }), _jsxs("td", { className: "px-3 py-2 text-right", children: [_jsxs("div", { className: "font-mono text-xs", children: [_jsx("span", { className: "text-green-600", children: promptTokens.toLocaleString() }), _jsx("span", { className: "text-slate-400", children: "/" }), _jsx("span", { className: "text-violet-600", children: completionTokens.toLocaleString() })] }), _jsxs("div", { className: "text-xs text-slate-500", children: [totalTokens.toLocaleString(), " total"] })] }), _jsx("td", { className: "px-3 py-2 text-right font-mono text-xs", children: cost !== undefined ? _jsxs("span", { className: "text-green-600", children: ["$", cost.toFixed(5)] }) : _jsx("span", { className: "text-slate-400", children: "\u2014" }) }), _jsx("td", { className: "px-3 py-2", children: _jsx("span", { title: call.agentId, children: _jsx(DebugLink, { to: `agents/${call.agentId}`, className: "text-xs text-slate-600 hover:text-violet-600 whitespace-nowrap", children: agentName }) }) })] }));
+}
+function StatusBadge({ status }) {
+    const styles = {
+        running: 'bg-yellow-100 text-yellow-700',
+        success: 'bg-green-100 text-green-700',
+        error: 'bg-red-100 text-red-700',
+    };
+    return (_jsx("span", { className: `text-xs px-2 py-0.5 rounded-full font-medium ${styles[status]}`, children: status }));
+}
+//# sourceMappingURL=LLMCallsPage.js.map