@elizaos/ui 2.0.0-alpha.43 → 2.0.0-alpha.430

package/packages/app-core/src/components/pages/TrajectoriesView.js

@@ -0,0 +1,278 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, PageLayout, PagePanel, SidebarContent, SidebarHeader, SidebarPanel, SidebarScrollRegion, TrajectorySidebarItem, } from "@elizaos/ui";
+import { Download, RefreshCw, Trash2, XCircle } from "lucide-react";
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, } from "react";
+import { client } from "../../api/client";
+import { useApp } from "../../state/useApp";
+import { formatTrajectoryDuration, formatTrajectoryTimestamp, formatTrajectoryTokenCount, } from "../../utils/trajectory-format";
+import { AppPageSidebar } from "../shared/AppPageSidebar";
+import { ConfirmDeleteControl } from "../shared/confirm-delete-control";
+import { TrajectoryDetailView } from "./TrajectoryDetailView";
+const STATUS_COLORS = {
+    active: { bg: "rgba(59, 130, 246, 0.15)", fg: "rgb(59, 130, 246)" },
+    completed: { bg: "rgba(34, 197, 94, 0.15)", fg: "rgb(34, 197, 94)" },
+    error: { bg: "rgba(239, 68, 68, 0.15)", fg: "rgb(239, 68, 68)" },
+};
+const SOURCE_COLORS = {
+    chat: { bg: "rgba(99, 102, 241, 0.15)", fg: "rgb(99, 102, 241)" },
+    autonomy: { bg: "rgba(245, 158, 11, 0.15)", fg: "rgb(245, 158, 11)" },
+    telegram: { bg: "rgba(34, 197, 94, 0.15)", fg: "rgb(34, 197, 94)" },
+    discord: { bg: "rgba(88, 101, 242, 0.15)", fg: "rgb(88, 101, 242)" },
+    api: { bg: "rgba(156, 163, 175, 0.15)", fg: "rgb(156, 163, 175)" },
+    orchestrator: { bg: "rgba(168, 85, 247, 0.15)", fg: "rgb(168, 85, 247)" },
+};
+function formatTrajectorySourceLabel(trajectory) {
+    const parts = [trajectory.source];
+    if (trajectory.scenarioId)
+        parts.push(trajectory.scenarioId);
+    if (trajectory.batchId)
+        parts.push(trajectory.batchId);
+    return parts.join(" • ");
+}
+export function TrajectoriesView({ contentHeader, selectedTrajectoryId: controlledId, onSelectTrajectory: controlledOnSelect, }) {
+    const { t, setActionNotice } = useApp();
+    const [loading, setLoading] = useState(true);
+    const [result, setResult] = useState(null);
+    const [error, setError] = useState(null);
+    // Self-manage selection when no external callback is provided (standalone mode).
+    const [internalId, setInternalId] = useState(null);
+    const selectedTrajectoryId = controlledOnSelect
+        ? (controlledId ?? null)
+        : internalId;
+    const onSelectTrajectory = controlledOnSelect ?? setInternalId;
+    const [searchQuery, setSearchQuery] = useState("");
+    const [page, setPage] = useState(0);
+    const pageSize = 50;
+    const previousSearchQueryRef = useRef(searchQuery);
+    const [exporting, setExporting] = useState(false);
+    const [deletingTrajectoryId, setDeletingTrajectoryId] = useState(null);
+    const [clearingAll, setClearingAll] = useState(false);
+    const loadTrajectories = useCallback(async () => {
+        setLoading(true);
+        setError(null);
+        for (let attempt = 0; attempt <= 3; attempt++) {
+            try {
+                const trajResult = await client.getTrajectories({
+                    limit: pageSize,
+                    offset: page * pageSize,
+                    search: searchQuery || undefined,
+                });
+                setResult(trajResult);
+                setLoading(false);
+                return;
+            }
+            catch (err) {
+                const status = err.status;
+                if (status === 503 && attempt < 3) {
+                    await new Promise((resolve) => setTimeout(resolve, 1000 * (attempt + 1)));
+                    continue;
+                }
+                setError(err instanceof Error
+                    ? err.message
+                    : t("trajectoriesview.FailedToLoad"));
+                setLoading(false);
+                return;
+            }
+        }
+    }, [page, searchQuery, t]);
+    useEffect(() => {
+        void loadTrajectories();
+    }, [loadTrajectories]);
+    useEffect(() => {
+        const previousSearchQuery = previousSearchQueryRef.current;
+        if (previousSearchQuery === searchQuery) {
+            return;
+        }
+        previousSearchQueryRef.current = searchQuery;
+        if (selectedTrajectoryId != null) {
+            onSelectTrajectory?.(null);
+        }
+    }, [searchQuery, selectedTrajectoryId, onSelectTrajectory]);
+    const handleExport = async (format, includePrompts) => {
+        setExporting(true);
+        try {
+            const blob = await client.exportTrajectories({ format, includePrompts });
+            const url = URL.createObjectURL(blob);
+            const anchor = document.createElement("a");
+            anchor.href = url;
+            anchor.download = `trajectories-${new Date().toISOString().split("T")[0]}.${format}`;
+            anchor.click();
+            URL.revokeObjectURL(url);
+        }
+        catch (err) {
+            setError(err instanceof Error
+                ? err.message
+                : t("trajectoriesview.FailedToExport"));
+        }
+        finally {
+            setExporting(false);
+        }
+    };
+    const hasActiveFilters = searchQuery !== "";
+    const trajectories = useMemo(() => result?.trajectories ?? [], [result]);
+    const total = result?.total ?? 0;
+    const totalPages = Math.ceil(total / pageSize);
+    useLayoutEffect(() => {
+        if (loading)
+            return;
+        if (trajectories.length === 0) {
+            if (selectedTrajectoryId != null)
+                onSelectTrajectory?.(null);
+            return;
+        }
+        if (selectedTrajectoryId == null) {
+            onSelectTrajectory?.(trajectories[0].id);
+            return;
+        }
+        if (page === 0 &&
+            !trajectories.some((tr) => tr.id === selectedTrajectoryId)) {
+            onSelectTrajectory?.(trajectories[0].id);
+        }
+    }, [loading, trajectories, selectedTrajectoryId, onSelectTrajectory, page]);
+    const detailTrajectoryId = trajectories.length === 0
+        ? null
+        : (selectedTrajectoryId ?? trajectories[0]?.id ?? null);
+    const deleteDisabled = loading ||
+        clearingAll ||
+        deletingTrajectoryId !== null ||
+        detailTrajectoryId === null;
+    const clearAllDisabled = loading || clearingAll || deletingTrajectoryId !== null || total === 0;
+    const handleDeleteTrajectory = useCallback(async (trajectoryId) => {
+        const normalizedId = trajectoryId.trim();
+        if (!normalizedId)
+            return;
+        setDeletingTrajectoryId(normalizedId);
+        setError(null);
+        try {
+            const response = await client.deleteTrajectories([normalizedId]);
+            const deletedCount = Number(response.deleted ?? 0);
+            if (selectedTrajectoryId === normalizedId) {
+                const remainingOnPage = trajectories.filter((trajectory) => trajectory.id !== normalizedId);
+                onSelectTrajectory?.(remainingOnPage[0]?.id ?? null);
+            }
+            if (page > 0 && trajectories.length <= 1) {
+                setPage((currentPage) => Math.max(0, currentPage - 1));
+            }
+            else {
+                await loadTrajectories();
+            }
+            if (deletedCount > 0) {
+                setActionNotice?.(t("trajectoriesview.TrajectoryDeleted", {
+                    defaultValue: "Trajectory deleted.",
+                }), "success", 2400);
+            }
+            else {
+                setActionNotice?.(t("trajectoriesview.NoTrajectoryDeleted", {
+                    defaultValue: "No trajectory was deleted.",
+                }), "info", 2400);
+            }
+        }
+        catch (err) {
+            const message = err instanceof Error
+                ? err.message
+                : t("trajectoriesview.FailedToDelete", {
+                    defaultValue: "Failed to delete trajectory",
+                });
+            setError(message);
+            setActionNotice?.(message, "error", 4200);
+        }
+        finally {
+            setDeletingTrajectoryId((currentId) => currentId === normalizedId ? null : currentId);
+        }
+    }, [
+        loadTrajectories,
+        onSelectTrajectory,
+        page,
+        selectedTrajectoryId,
+        setActionNotice,
+        t,
+        trajectories,
+    ]);
+    const handleClearAllTrajectories = useCallback(async () => {
+        setClearingAll(true);
+        setError(null);
+        try {
+            const response = await client.clearAllTrajectories();
+            setResult({
+                trajectories: [],
+                total: 0,
+                offset: 0,
+                limit: pageSize,
+            });
+            setPage(0);
+            onSelectTrajectory?.(null);
+            if (Number(response.deleted ?? 0) > 0) {
+                setActionNotice?.(t("trajectoriesview.TrajectoriesCleared", {
+                    defaultValue: "Trajectories cleared.",
+                }), "success", 2400);
+            }
+            else {
+                setActionNotice?.(t("trajectoriesview.NoTrajectoryDeleted", {
+                    defaultValue: "No trajectory was deleted.",
+                }), "info", 2400);
+            }
+        }
+        catch (err) {
+            const message = err instanceof Error
+                ? err.message
+                : t("trajectoriesview.FailedToClear", {
+                    defaultValue: "Failed to clear trajectories",
+                });
+            setError(message);
+            setActionNotice?.(message, "error", 4200);
+        }
+        finally {
+            setClearingAll(false);
+        }
+    }, [onSelectTrajectory, setActionNotice, t]);
+    const trajectoriesSidebar = (_jsx(AppPageSidebar, { testId: "trajectories-sidebar", collapsible: true, contentIdentity: "trajectories", "aria-label": t("trajectoriesview.Entries", {
+            defaultValue: "Entries",
+        }), header: _jsx(SidebarHeader, { search: {
+                value: searchQuery,
+                onChange: (event) => {
+                    setSearchQuery(event.target.value);
+                    setPage(0);
+                },
+                onClear: () => {
+                    setSearchQuery("");
+                    setPage(0);
+                },
+                placeholder: t("trajectoriesview.Search"),
+                "aria-label": t("trajectoriesview.Search"),
+            } }), children: _jsx(SidebarScrollRegion, { children: _jsxs(SidebarPanel, { children: [_jsxs(SidebarContent.Toolbar, { className: "mb-3 items-center justify-between gap-2", children: [_jsx(SidebarContent.SectionLabel, { children: t("trajectoriesview.Entries", {
+                                    defaultValue: "Entries",
+                                }) }), _jsxs(SidebarContent.ToolbarActions, { children: [_jsx(Button, { variant: "outline", size: "icon", type: "button", className: "h-7 w-7 rounded-full", onClick: () => void loadTrajectories(), disabled: loading, title: t("common.refresh"), children: _jsx(RefreshCw, { className: `h-3 w-3${loading ? " animate-spin" : ""}` }) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "icon", type: "button", className: "h-7 w-7 rounded-full", disabled: exporting || trajectories.length === 0, title: t("common.export"), children: _jsx(Download, { className: "h-3 w-3" }) }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-48", children: [_jsx(DropdownMenuItem, { onClick: () => handleExport("json", true), children: t("trajectoriesview.JSONWithPrompts") }), _jsx(DropdownMenuItem, { onClick: () => handleExport("json", false), children: t("trajectoriesview.JSONRedacted") }), _jsx(DropdownMenuItem, { onClick: () => handleExport("csv", false), children: t("trajectoriesview.CSVSummaryOnly") }), _jsx(DropdownMenuItem, { onClick: () => handleExport("zip", true), children: t("trajectoriesview.ZIPFolders") })] })] }), _jsx(ConfirmDeleteControl, { triggerVariant: "outline", triggerClassName: "h-7 w-7 rounded-full text-danger transition-all hover:bg-danger/10", confirmClassName: "h-7 rounded-full border border-danger/25 bg-danger/14 px-3 text-2xs font-bold text-danger transition-all hover:bg-danger/20", cancelClassName: "h-7 rounded-full border border-border/35 px-3 text-2xs font-bold text-muted-strong transition-all hover:border-border-strong hover:text-txt", disabled: deleteDisabled, triggerLabel: _jsx(Trash2, { className: "h-3 w-3" }), triggerTitle: t("trajectoriesview.DeleteCurrent", {
+                                            defaultValue: "Delete current",
+                                        }), promptText: t("trajectoriesview.DeleteCurrentPrompt", {
+                                            defaultValue: "Delete this trajectory?",
+                                        }), busyLabel: t("trajectoriesview.Deleting", {
+                                            defaultValue: "Deleting...",
+                                        }), onConfirm: () => {
+                                            if (detailTrajectoryId) {
+                                                void handleDeleteTrajectory(detailTrajectoryId);
+                                            }
+                                        } }), _jsx(ConfirmDeleteControl, { triggerVariant: "outline", triggerClassName: "h-7 w-7 rounded-full text-danger transition-all hover:bg-danger/10", confirmClassName: "h-7 rounded-full border border-danger/25 bg-danger/14 px-3 text-2xs font-bold text-danger transition-all hover:bg-danger/20", cancelClassName: "h-7 rounded-full border border-border/35 px-3 text-2xs font-bold text-muted-strong transition-all hover:border-border-strong hover:text-txt", disabled: clearAllDisabled, triggerLabel: _jsx(XCircle, { className: "h-3 w-3" }), triggerTitle: t("trajectoriesview.ClearAll", {
+                                            defaultValue: "Clear all",
+                                        }), promptText: t("trajectoriesview.ClearAllPrompt", {
+                                            defaultValue: "Delete all trajectories?",
+                                        }), busyLabel: t("trajectoriesview.Clearing", {
+                                            defaultValue: "Clearing...",
+                                        }), onConfirm: () => {
+                                            void handleClearAllTrajectories();
+                                        } })] })] }), loading && trajectories.length === 0 ? (_jsx(SidebarContent.EmptyState, { children: t("trajectoriesview.LoadingTrajectories") })) : trajectories.length === 0 ? (_jsx(SidebarContent.EmptyState, { children: hasActiveFilters
+                            ? t("trajectoriesview.NoTrajectoriesMatchingFilters")
+                            : t("trajectoriesview.NoTrajectoriesYet") })) : (_jsx("div", { className: "space-y-1.5", children: trajectories.map((trajectory) => {
+                            const selected = selectedTrajectoryId === trajectory.id;
+                            const statusColor = STATUS_COLORS[trajectory.status] ?? STATUS_COLORS.completed;
+                            const sourceColor = SOURCE_COLORS[trajectory.source] ?? SOURCE_COLORS.api;
+                            return (_jsx(TrajectorySidebarItem, { active: selected, onSelect: () => onSelectTrajectory?.(trajectory.id), callCount: trajectory.llmCallCount, title: formatTrajectoryTimestamp(trajectory.createdAt, "smart"), sourceLabel: formatTrajectorySourceLabel(trajectory), sourceColor: sourceColor.fg, statusLabel: trajectory.status, statusColor: statusColor.fg, tokenLabel: `${formatTrajectoryTokenCount(trajectory.totalPromptTokens +
+                                    trajectory.totalCompletionTokens, { emptyLabel: "0" })} tokens`, durationLabel: formatTrajectoryDuration(trajectory.durationMs) }, trajectory.id));
+                        }) })), totalPages > 1 && (_jsxs("div", { className: "mt-3 flex items-center justify-between gap-2 pt-3 text-xs text-muted", children: [_jsx("span", { className: "min-w-0", children: t("trajectoriesview.ShowingRange", {
+                                    start: page * pageSize + 1,
+                                    end: Math.min((page + 1) * pageSize, total),
+                                    total,
+                                }) }), _jsxs("div", { className: "flex gap-1.5", children: [_jsx(Button, { variant: "outline", size: "sm", type: "button", className: "h-8 rounded-full px-3 text-xs-tight", onClick: () => setPage((current) => Math.max(0, current - 1)), disabled: page === 0, children: t("common.prev") }), _jsx(Button, { variant: "outline", size: "sm", type: "button", className: "h-8 rounded-full px-3 text-xs-tight", onClick: () => setPage((current) => current + 1), disabled: page >= totalPages - 1, children: t("common.next") })] })] }))] }) }) }));
+    return (_jsxs(PageLayout, { sidebar: trajectoriesSidebar, contentHeader: contentHeader, contentInnerClassName: "mx-auto w-full max-w-[76rem]", "data-testid": "trajectories-view", children: [error ? (_jsx(PagePanel.Notice, { tone: "danger", className: "mb-4", children: error })) : null, loading && trajectories.length === 0 ? (_jsx(PagePanel.Loading, { variant: "surface", heading: t("trajectoriesview.LoadingTrajectories") })) : !loading && trajectories.length === 0 ? (_jsx(PagePanel.Empty, { variant: "surface", className: "min-h-[14rem] rounded-[1.6rem]", title: hasActiveFilters
+                    ? t("trajectoriesview.NoTrajectoriesMatchingFilters")
+                    : t("trajectoriesview.NoTrajectoriesYet") })) : detailTrajectoryId ? (_jsx(TrajectoryDetailView, { trajectoryId: detailTrajectoryId })) : null] }));
+}

package/packages/app-core/src/components/pages/TrajectoryDetailView.d.ts

@@ -0,0 +1,7 @@
+interface TrajectoryDetailViewProps {
+    trajectoryId: string;
+    onBack?: () => void;
+}
+export declare function TrajectoryDetailView({ trajectoryId, }: TrajectoryDetailViewProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=TrajectoryDetailView.d.ts.map

package/packages/app-core/src/components/pages/TrajectoryDetailView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrajectoryDetailView.d.ts","sourceRoot":"","sources":["../../../../../../../app-core/src/components/pages/TrajectoryDetailView.tsx"],"names":[],"mappings":"AAqFA,UAAU,yBAAyB;IACjC,YAAY,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAiCD,wBAAgB,oBAAoB,CAAC,EACnC,YAAY,GACb,EAAE,yBAAyB,2CA4U3B"}

package/packages/app-core/src/components/pages/TrajectoryDetailView.js

@@ -0,0 +1,173 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PagePanel, TrajectoryLlmCallCard, TrajectoryPipelineGraph, } from "@elizaos/ui";
+import { Brain, CheckCircle, MessageSquare, ShieldCheck, X, Zap, } from "lucide-react";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { client } from "../../api/client";
+import { useApp } from "../../state/useApp";
+import { formatTrajectoryDuration, formatTrajectoryTokenCount, } from "../../utils/trajectory-format";
+import { estimateTokenCost } from "../conversations/conversation-utils";
+// ---------------------------------------------------------------------------
+// Pipeline stage mapping
+// ---------------------------------------------------------------------------
+const STEP_TYPE_TO_STAGE = {
+    should_respond: "should_respond",
+    compose_state: "plan",
+    response: "plan",
+    reasoning: "plan",
+    orchestrator: "plan",
+    coordination: "plan",
+    action: "actions",
+    evaluation: "evaluators",
+    observation_extraction: "evaluators",
+    turn_complete: "evaluators",
+};
+function stageForCall(call) {
+    return STEP_TYPE_TO_STAGE[call.stepType ?? ""] ?? "plan";
+}
+const PIPELINE_STAGES = [
+    { id: "input", label: "Input", icon: MessageSquare },
+    { id: "should_respond", label: "Should Respond", icon: ShieldCheck },
+    { id: "plan", label: "Plan", icon: Brain },
+    { id: "actions", label: "Actions", icon: Zap },
+    { id: "evaluators", label: "Evaluators", icon: CheckCircle },
+];
+function buildPipelineNodes(llmCalls, trajectoryStatus) {
+    const counts = new Map();
+    for (const call of llmCalls) {
+        const stage = stageForCall(call);
+        counts.set(stage, (counts.get(stage) ?? 0) + 1);
+    }
+    return PIPELINE_STAGES.map(({ id, label, icon }) => {
+        const count = counts.get(id) ?? 0;
+        const status = id === "input"
+            ? "active"
+            : trajectoryStatus === "error" && count > 0
+                ? "error"
+                : count > 0
+                    ? "active"
+                    : "skipped";
+        return { id, label, callCount: count, status, icon };
+    });
+}
+function formatTrajectoryStepLabel(value, fallback) {
+    const normalized = typeof value === "string" ? value.trim() : "";
+    if (!normalized)
+        return fallback;
+    return normalized.replace(/_/g, " ");
+}
+function estimateCost(promptTokens, completionTokens, model) {
+    return estimateTokenCost(promptTokens, completionTokens, model);
+}
+function formatProviderPayload(value) {
+    if (value == null) {
+        return "null";
+    }
+    if (typeof value === "string") {
+        return value;
+    }
+    try {
+        return JSON.stringify(value, null, 2);
+    }
+    catch {
+        return String(value);
+    }
+}
+export function TrajectoryDetailView({ trajectoryId, }) {
+    const { t, copyToClipboard } = useApp();
+    const [loading, setLoading] = useState(true);
+    const [detail, setDetail] = useState(null);
+    const [error, setError] = useState(null);
+    const [activeStage, setActiveStage] = useState(null);
+    const loadDetail = useCallback(async () => {
+        setLoading(true);
+        setError(null);
+        try {
+            const result = await client.getTrajectoryDetail(trajectoryId);
+            setDetail(result);
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : "Failed to load trajectory");
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [trajectoryId]);
+    useEffect(() => {
+        void loadDetail();
+    }, [loadDetail]);
+    const llmCalls = detail?.llmCalls ?? [];
+    const providerAccesses = detail?.providerAccesses ?? [];
+    const trajectory = detail?.trajectory;
+    const pipelineNodes = useMemo(() => buildPipelineNodes(llmCalls, trajectory?.status ?? "active"), [llmCalls, trajectory?.status]);
+    const filteredCalls = useMemo(() => {
+        if (!activeStage || activeStage === "input")
+            return llmCalls;
+        return llmCalls.filter((call) => stageForCall(call) === activeStage);
+    }, [llmCalls, activeStage]);
+    const callIndexMap = useMemo(() => new Map(llmCalls.map((call, i) => [call.id, i])), [llmCalls]);
+    const handleStageClick = useCallback((stageId) => {
+        setActiveStage((prev) => prev === stageId || stageId === "input" ? null : stageId);
+    }, []);
+    if (loading) {
+        return (_jsx(PagePanel.Loading, { variant: "workspace", heading: t("trajectorydetailview.LoadingTrajectory"), description: t("trajectorydetailview.LoadingDescription") }));
+    }
+    if (error) {
+        return (_jsx(PagePanel.Empty, { variant: "workspace", title: t("trajectorydetailview.UnableToLoad"), description: error }));
+    }
+    if (!detail || !trajectory) {
+        return (_jsx(PagePanel.Empty, { variant: "workspace", title: t("trajectorydetailview.Unavailable"), description: t("trajectorydetailview.TrajectoryNotFound") }));
+    }
+    const totalPromptTokens = llmCalls.reduce((sum, call) => sum + (call.promptTokens ?? 0), 0);
+    const totalCompletionTokens = llmCalls.reduce((sum, call) => sum + (call.completionTokens ?? 0), 0);
+    const orchestrator = trajectory.metadata?.orchestrator;
+    const orchestratorData = orchestrator && typeof orchestrator === "object"
+        ? orchestrator
+        : null;
+    const _summaryCards = [
+        {
+            label: t("logsview.Source"),
+            value: trajectory.source,
+        },
+        {
+            label: t("common.status"),
+            value: trajectory.status,
+        },
+        {
+            label: t("common.duration"),
+            value: formatTrajectoryDuration(trajectory.durationMs),
+        },
+        {
+            label: t("trajectorydetailview.TotalTokens", {
+                defaultValue: "Total Tokens",
+            }),
+            value: formatTrajectoryTokenCount(totalPromptTokens + totalCompletionTokens, { emptyLabel: "—" }),
+        },
+    ];
+    return (_jsxs("div", { className: "flex h-full min-h-0 flex-col gap-4", children: [orchestratorData ? (_jsxs(PagePanel, { variant: "section", className: "p-5", children: [_jsx("div", { className: "text-xs-tight font-semibold uppercase tracking-[0.16em] text-muted/70", children: t("trajectorydetailview.Orchestrator") }), _jsxs("div", { className: "mt-4 grid gap-3 sm:grid-cols-2 xl:grid-cols-3", children: [_jsxs(PagePanel.SummaryCard, { compact: true, className: "px-4 py-3", children: [_jsx("div", { className: "text-xs-tight uppercase tracking-[0.14em] text-muted/70", children: t("trajectorydetailview.DecisionType") }), _jsx("div", { className: "mt-2 text-sm font-semibold text-txt", children: String(orchestratorData.decisionType ?? "—") })] }), _jsxs(PagePanel.SummaryCard, { compact: true, className: "px-4 py-3", children: [_jsx("div", { className: "text-xs-tight uppercase tracking-[0.14em] text-muted/70", children: t("trajectorydetailview.Task") }), _jsx("div", { className: "mt-2 text-sm font-semibold text-txt", children: String(orchestratorData.taskLabel ?? "—") })] }), _jsxs(PagePanel.SummaryCard, { compact: true, className: "px-4 py-3", children: [_jsx("div", { className: "text-xs-tight uppercase tracking-[0.14em] text-muted/70", children: t("trajectorydetailview.Session1") }), _jsx("div", { className: "mt-2 break-all font-mono text-xs-tight text-txt", children: String(orchestratorData.sessionId ?? "—") })] })] })] })) : null, trajectory.metadata &&
+                Object.keys(trajectory.metadata).length > 0 &&
+                formatProviderPayload(trajectory.metadata).trim().length > 0 ? (_jsxs(PagePanel, { variant: "section", className: "p-5", children: [_jsx("div", { className: "text-xs-tight font-semibold uppercase tracking-[0.16em] text-muted/70", children: t("trajectorydetailview.Metadata", {
+                            defaultValue: "Metadata",
+                        }) }), _jsx("pre", { className: "mt-4 max-h-[20rem] overflow-x-auto overflow-y-auto whitespace-pre-wrap break-words rounded-2xl border border-border/50 bg-bg/60 px-4 py-4 text-xs leading-6 text-txt", children: formatProviderPayload(trajectory.metadata) })] })) : null, llmCalls.length > 0 ? (_jsxs(PagePanel, { variant: "section", className: "px-5 py-4", children: [_jsx("div", { className: "mb-3 text-xs-tight font-semibold uppercase tracking-[0.16em] text-muted/70", children: t("trajectorydetailview.Pipeline", {
+                            defaultValue: "Pipeline",
+                        }) }), _jsx(TrajectoryPipelineGraph, { nodes: pipelineNodes, activeStageId: activeStage, onStageClick: handleStageClick }), activeStage && activeStage !== "input" ? (_jsxs("div", { className: "mt-3 flex items-center gap-2 text-xs text-muted", children: [_jsx("span", { children: t("trajectorydetailview.ShowingCalls", {
+                                    defaultValue: "Showing {{count}} {{stage}} calls",
+                                    count: filteredCalls.length,
+                                    stage: activeStage.replace(/_/g, " "),
+                                }) }), _jsx("button", { type: "button", onClick: () => setActiveStage(null), className: "rounded p-0.5 hover:bg-muted/10", children: _jsx(X, { className: "h-3 w-3" }) })] })) : null] })) : null, providerAccesses.length > 0 ? (_jsxs(PagePanel, { variant: "section", className: "px-5 py-4", children: [_jsx("div", { className: "mb-3 text-xs-tight font-semibold uppercase tracking-[0.16em] text-muted/70", children: t("trajectorydetailview.ProviderAccesses", {
+                            defaultValue: "Provider Accesses",
+                        }) }), _jsx("div", { className: "space-y-4", children: providerAccesses.map((access, index) => (_jsxs(PagePanel, { variant: "inset", className: "p-4", children: [_jsxs("div", { className: "flex flex-col gap-1", children: [_jsxs("div", { className: "text-[11px] font-semibold uppercase tracking-[0.16em] text-muted", children: [t("trajectorydetailview.ProviderAccess", {
+                                                    defaultValue: "Provider Access",
+                                                }), " ", "#", index + 1] }), _jsx("div", { className: "text-sm font-semibold text-txt", children: access.providerName || "unknown" }), _jsx("div", { className: "text-xs-tight text-muted", children: access.purpose || "—" })] }), access.query ? (_jsxs("div", { className: "mt-4", children: [_jsx("div", { className: "text-xs-tight font-semibold uppercase tracking-[0.14em] text-muted/70", children: t("trajectorydetailview.Query", {
+                                                defaultValue: "Query",
+                                            }) }), _jsx("pre", { className: "mt-2 max-h-[18rem] overflow-x-auto overflow-y-auto whitespace-pre-wrap break-words rounded-2xl border border-border/50 bg-bg/60 px-4 py-4 text-xs leading-6 text-txt", children: formatProviderPayload(access.query) })] })) : null, _jsxs("div", { className: "mt-4", children: [_jsx("div", { className: "text-xs-tight font-semibold uppercase tracking-[0.14em] text-muted/70", children: t("trajectorydetailview.Data", {
+                                                defaultValue: "Data",
+                                            }) }), _jsx("pre", { className: "mt-2 max-h-[18rem] overflow-x-auto overflow-y-auto whitespace-pre-wrap break-words rounded-2xl border border-border/50 bg-bg/60 px-4 py-4 text-xs leading-6 text-txt", children: formatProviderPayload(access.data) })] })] }, access.id))) })] })) : null, _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto pr-1", children: _jsx("div", { className: "space-y-4 pb-1", children: llmCalls.length === 0 ? (_jsx(PagePanel.Empty, { variant: "surface", className: "min-h-[18rem]", title: t("trajectorydetailview.NoCapturedCalls"), description: t("trajectorydetailview.NoLLMCallsRecorde") })) : (filteredCalls.map((call) => (_jsx(TrajectoryLlmCallCard, { callLabel: `#${(callIndexMap.get(call.id) ?? 0) + 1}`, model: call.model, purposeLabel: formatTrajectoryStepLabel(call.stepType || call.purpose || call.actionType, t("trajectorydetailview.Response")), latencyLabel: formatTrajectoryDuration(call.latencyMs), tokensLabel: t("common.tokens"), totalTokensValue: formatTrajectoryTokenCount((call.promptTokens ?? 0) + (call.completionTokens ?? 0), { emptyLabel: "—" }), tokenBreakdownMeta: `${formatTrajectoryTokenCount(call.promptTokens ?? 0, { emptyLabel: "—" })}↑ • ${formatTrajectoryTokenCount(call.completionTokens ?? 0, {
+                            emptyLabel: "—",
+                        })} ↓`, costLabel: t("trajectorydetailview.Cost"), costValue: estimateCost(call.promptTokens ?? 0, call.completionTokens ?? 0, call.model), temperatureLabel: t("trajectorydetailview.Temp"), temperatureValue: call.temperature, maxLabel: t("trajectorydetailview.Max"), maxValue: call.maxTokens > 0 ? call.maxTokens : "—", systemPrompt: call.systemPrompt, systemPromptButtonLabel: t("trajectorydetailview.SystemPrompt"), systemLabel: t("trajectorydetailview.System"), systemLinesLabel: `${call.systemPrompt?.split("\n").length ?? 0} ${t("trajectorydetailview.lines")}`, systemCollapseLabel: t("common.collapse", {
+                            defaultValue: "Collapse",
+                        }), systemExpandLabel: t("common.expand", {
+                            defaultValue: "Expand",
+                        }), inputLabel: t("trajectorydetailview.InputUser"), outputLabel: t("trajectorydetailview.OutputResponse"), inputLinesLabel: `${call.userPrompt.split("\n").length} ${t("trajectorydetailview.lines")}`, outputLinesLabel: `${call.response.split("\n").length} ${t("trajectorydetailview.lines")}`, tags: (call.tags ?? []).filter((tag) => tag !== "llm"), userPrompt: call.userPrompt, response: call.response, copyLabel: t("trajectorydetailview.Copy"), copyToClipboardLabel: t("trajectorydetailview.CopyToClipboard"), onCopy: (content) => {
+                            void copyToClipboard(content);
+                        } }, call.id)))) }) })] }));
+}

package/packages/app-core/src/components/pages/TriggersView.d.ts

@@ -0,0 +1,3 @@
+export { AutomationsView as TriggersView } from "./AutomationsView";
+export { HeartbeatsView } from "./HeartbeatsView";
+//# sourceMappingURL=TriggersView.d.ts.map

package/packages/app-core/src/components/pages/TriggersView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TriggersView.d.ts","sourceRoot":"","sources":["../../../../../../../app-core/src/components/pages/TriggersView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}

package/packages/app-core/src/components/pages/TriggersView.js

@@ -0,0 +1,2 @@
+export { AutomationsView as TriggersView } from "./AutomationsView";
+export { HeartbeatsView } from "./HeartbeatsView";

package/packages/app-core/src/components/pages/VectorBrowserView.d.ts

@@ -0,0 +1,13 @@
+import { THREE } from "@elizaos/app-companion";
+import type { ReactNode } from "react";
+import { type MemoryRecord } from "./vector-browser-utils";
+export declare function VectorGraph3D({ memories, onSelect, createRenderer, }: {
+    memories: MemoryRecord[];
+    onSelect: (mem: MemoryRecord) => void;
+    createRenderer?: () => Promise<THREE.WebGLRenderer>;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function VectorBrowserView({ leftNav, contentHeader, }: {
+    leftNav?: ReactNode;
+    contentHeader?: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=VectorBrowserView.d.ts.map

package/packages/app-core/src/components/pages/VectorBrowserView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VectorBrowserView.d.ts","sourceRoot":"","sources":["../../../../../../../app-core/src/components/pages/VectorBrowserView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAgB5E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAavC,OAAO,EAKL,KAAK,YAAY,EAOlB,MAAM,wBAAwB,CAAC;AAuPhC,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,QAAQ,EACR,cAA4C,GAC7C,EAAE;IACD,QAAQ,EAAE,YAAY,EAAE,CAAC;IACzB,QAAQ,EAAE,CAAC,GAAG,EAAE,YAAY,KAAK,IAAI,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;CACrD,2CAyfA;AAID,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,aAAa,GACd,EAAE;IACD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,aAAa,CAAC,EAAE,SAAS,CAAC;CAC3B,2CAslBA"}