@railtownai/railtracks-visualizer 0.0.66 → 0.0.67

package/dist/cjs/index.js

@@ -12939,7 +12939,7 @@ const createLucideIcon = (iconName, iconNode)=>{
     return Component;
 };
 
-const __iconNode$y = [
+const __iconNode$z = [
     [
         "path",
         {
@@ -12955,9 +12955,9 @@ const __iconNode$y = [
         }
     ]
 ];
-const ArrowLeft = createLucideIcon("arrow-left", __iconNode$y);
+const ArrowLeft = createLucideIcon("arrow-left", __iconNode$z);
 
-const __iconNode$x = [
+const __iconNode$y = [
     [
         "path",
         {
@@ -12973,9 +12973,9 @@ const __iconNode$x = [
         }
     ]
 ];
-const ArrowRight = createLucideIcon("arrow-right", __iconNode$x);
+const ArrowRight = createLucideIcon("arrow-right", __iconNode$y);
 
-const __iconNode$w = [
+const __iconNode$x = [
     [
         "path",
         {
@@ -13023,9 +13023,9 @@ const __iconNode$w = [
         }
     ]
 ];
-const Bot = createLucideIcon("bot", __iconNode$w);
+const Bot = createLucideIcon("bot", __iconNode$x);
 
-const __iconNode$v = [
+const __iconNode$w = [
     [
         "path",
         {
@@ -13059,9 +13059,9 @@ const __iconNode$v = [
         }
     ]
 ];
-const Calendar = createLucideIcon("calendar", __iconNode$v);
+const Calendar = createLucideIcon("calendar", __iconNode$w);
 
-const __iconNode$u = [
+const __iconNode$v = [
     [
         "path",
         {
@@ -13118,9 +13118,9 @@ const __iconNode$u = [
         }
     ]
 ];
-const ChartNetwork = createLucideIcon("chart-network", __iconNode$u);
+const ChartNetwork = createLucideIcon("chart-network", __iconNode$v);
 
-const __iconNode$t = [
+const __iconNode$u = [
     [
         "path",
         {
@@ -13129,9 +13129,9 @@ const __iconNode$t = [
         }
     ]
 ];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$t);
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$u);
 
-const __iconNode$s = [
+const __iconNode$t = [
     [
         "path",
         {
@@ -13140,9 +13140,9 @@ const __iconNode$s = [
         }
     ]
 ];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$s);
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$t);
 
-const __iconNode$r = [
+const __iconNode$s = [
     [
         "path",
         {
@@ -13158,9 +13158,9 @@ const __iconNode$r = [
         }
     ]
 ];
-const ChevronsDown = createLucideIcon("chevrons-down", __iconNode$r);
+const ChevronsDown = createLucideIcon("chevrons-down", __iconNode$s);
 
-const __iconNode$q = [
+const __iconNode$r = [
     [
         "path",
         {
@@ -13176,9 +13176,9 @@ const __iconNode$q = [
         }
     ]
 ];
-const ChevronsUp = createLucideIcon("chevrons-up", __iconNode$q);
+const ChevronsUp = createLucideIcon("chevrons-up", __iconNode$r);
 
-const __iconNode$p = [
+const __iconNode$q = [
     [
         "circle",
         {
@@ -13209,9 +13209,9 @@ const __iconNode$p = [
         }
     ]
 ];
-const CircleAlert = createLucideIcon("circle-alert", __iconNode$p);
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$q);
 
-const __iconNode$o = [
+const __iconNode$p = [
     [
         "path",
         {
@@ -13227,9 +13227,9 @@ const __iconNode$o = [
         }
     ]
 ];
-const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$o);
+const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$p);
 
-const __iconNode$n = [
+const __iconNode$o = [
     [
         "circle",
         {
@@ -13254,9 +13254,9 @@ const __iconNode$n = [
         }
     ]
 ];
-const CircleDollarSign = createLucideIcon("circle-dollar-sign", __iconNode$n);
+const CircleDollarSign = createLucideIcon("circle-dollar-sign", __iconNode$o);
 
-const __iconNode$m = [
+const __iconNode$n = [
     [
         "circle",
         {
@@ -13274,9 +13274,9 @@ const __iconNode$m = [
         }
     ]
 ];
-const Clock = createLucideIcon("clock", __iconNode$m);
+const Clock = createLucideIcon("clock", __iconNode$n);
 
-const __iconNode$l = [
+const __iconNode$m = [
     [
         "rect",
         {
@@ -13297,9 +13297,9 @@ const __iconNode$l = [
         }
     ]
 ];
-const Copy = createLucideIcon("copy", __iconNode$l);
+const Copy = createLucideIcon("copy", __iconNode$m);
 
-const __iconNode$k = [
+const __iconNode$l = [
     [
         "path",
         {
@@ -13407,9 +13407,9 @@ const __iconNode$k = [
         }
     ]
 ];
-const Cpu = createLucideIcon("cpu", __iconNode$k);
+const Cpu = createLucideIcon("cpu", __iconNode$l);
 
-const __iconNode$j = [
+const __iconNode$k = [
     [
         "line",
         {
@@ -13428,9 +13428,9 @@ const __iconNode$j = [
         }
     ]
 ];
-const DollarSign = createLucideIcon("dollar-sign", __iconNode$j);
+const DollarSign = createLucideIcon("dollar-sign", __iconNode$k);
 
-const __iconNode$i = [
+const __iconNode$j = [
     [
         "path",
         {
@@ -13460,9 +13460,9 @@ const __iconNode$i = [
         }
     ]
 ];
-const FileInput = createLucideIcon("file-input", __iconNode$i);
+const FileInput = createLucideIcon("file-input", __iconNode$j);
 
-const __iconNode$h = [
+const __iconNode$i = [
     [
         "path",
         {
@@ -13492,9 +13492,9 @@ const __iconNode$h = [
         }
     ]
 ];
-const FileOutput = createLucideIcon("file-output", __iconNode$h);
+const FileOutput = createLucideIcon("file-output", __iconNode$i);
 
-const __iconNode$g = [
+const __iconNode$h = [
     [
         "path",
         {
@@ -13552,9 +13552,9 @@ const __iconNode$g = [
         }
     ]
 ];
-const FoldVertical = createLucideIcon("fold-vertical", __iconNode$g);
+const FoldVertical = createLucideIcon("fold-vertical", __iconNode$h);
 
-const __iconNode$f = [
+const __iconNode$g = [
     [
         "line",
         {
@@ -13596,9 +13596,9 @@ const __iconNode$f = [
         }
     ]
 ];
-const Hash = createLucideIcon("hash", __iconNode$f);
+const Hash = createLucideIcon("hash", __iconNode$g);
 
-const __iconNode$e = [
+const __iconNode$f = [
     [
         "circle",
         {
@@ -13623,9 +13623,9 @@ const __iconNode$e = [
         }
     ]
 ];
-const Info = createLucideIcon("info", __iconNode$e);
+const Info = createLucideIcon("info", __iconNode$f);
 
-const __iconNode$d = [
+const __iconNode$e = [
     [
         "path",
         {
@@ -13662,7 +13662,39 @@ const __iconNode$d = [
         }
     ]
 ];
-const ListChecks = createLucideIcon("list-checks", __iconNode$d);
+const ListChecks = createLucideIcon("list-checks", __iconNode$e);
+
+const __iconNode$d = [
+    [
+        "path",
+        {
+            d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z",
+            key: "18887p"
+        }
+    ],
+    [
+        "path",
+        {
+            d: "M7 11h10",
+            key: "1twpyw"
+        }
+    ],
+    [
+        "path",
+        {
+            d: "M7 15h6",
+            key: "d9of3u"
+        }
+    ],
+    [
+        "path",
+        {
+            d: "M7 7h8",
+            key: "af5zfr"
+        }
+    ]
+];
+const MessageSquareText = createLucideIcon("message-square-text", __iconNode$d);
 
 const __iconNode$c = [
     [
@@ -116825,6 +116857,401 @@ function buildTreeFromProcessedData(latencyByTool, failureRateByTool, usageCount
     return buildTreeFromProcessedData(latencyByTool, failureRateByTool, usageCountByTool, latencyResults, failureResults, agentIdToSessionId);
 }
 
+const JUDGE_RESULT_PREFIX = "JudgeResult/";
+const JUDGE_REASONING_PREFIX = "JudgeReasoning/";
+/** Map agent node id -> session id from the agents array (new format only). */ function buildSessionByNodeId(agents) {
+    const map = new Map();
+    for (const agent of agents ?? []){
+        for (const entry of agent.agent_node_ids ?? []){
+            if (entry && typeof entry === "object" && "agent_node_id" in entry) {
+                map.set(entry.agent_node_id, entry.session_id);
+            }
+        }
+    }
+    return map;
+}
+/** Map `${nodeId}::${metricName}` -> reasoning text from JudgeReasoning/* results. */ function buildReasoningByKey(rawResults) {
+    const map = new Map();
+    for (const item of rawResults){
+        if (!isBaseResult(item)) continue;
+        if (!item.result_name?.startsWith(JUDGE_REASONING_PREFIX)) continue;
+        const metricName = item.result_name.slice(JUDGE_REASONING_PREFIX.length);
+        const nodeId = item.agent_data_id?.[0];
+        if (nodeId && typeof item.value === "string") {
+            map.set(`${nodeId}::${metricName}`, item.value);
+        }
+    }
+    return map;
+}
+function metricNameOf(agg) {
+    return agg.metric?.name ?? agg.name?.replace(/^Aggregate\//, "") ?? "Unknown";
+}
+/** Collect the JudgeResult leaf nodes (label + node id) grouped by label. */ function groupNodesByLabel(agg, nodes, rawResults, metricName, sessionByNodeId, reasoningByKey) {
+    const byLabel = new Map();
+    const seen = new Set();
+    const push = (label, nodeId)=>{
+        const dedupeKey = `${label}::${nodeId}`;
+        if (seen.has(dedupeKey)) return;
+        seen.add(dedupeKey);
+        const ref = {
+            nodeId,
+            sessionId: sessionByNodeId.get(nodeId),
+            reasoning: reasoningByKey.get(`${nodeId}::${metricName}`)
+        };
+        const existing = byLabel.get(label);
+        if (existing) existing.push(ref);
+        else byLabel.set(label, [
+            ref
+        ]);
+    };
+    // Preferred: walk the aggregate's children leaf nodes.
+    for (const childId of agg.children ?? []){
+        const child = nodes[childId];
+        if (child && isBaseResult(child)) {
+            const nodeId = child.agent_data_id?.[0];
+            if (nodeId) push(String(child.value), nodeId);
+        }
+    }
+    // Fallback: derive from raw JudgeResult/<metric> results when no children are present.
+    if (byLabel.size === 0) {
+        const resultName = `${JUDGE_RESULT_PREFIX}${metricName}`;
+        for (const item of rawResults){
+            if (isBaseResult(item) && item.result_name === resultName) {
+                const nodeId = item.agent_data_id?.[0];
+                if (nodeId) push(String(item.value), nodeId);
+            }
+        }
+    }
+    return byLabel;
+}
+/** Build the Judge view model: one entry per categorical metric. */ function buildJudgeMetricsFromAggregate(input) {
+    const { roots, nodes, agents, rawResults = [] } = input;
+    const sessionByNodeId = buildSessionByNodeId(agents);
+    const reasoningByKey = buildReasoningByKey(rawResults);
+    // Prefer roots; fall back to scanning all nodes for categorical aggregates.
+    const rootAggregates = roots.map((id)=>nodes[id]).filter((n)=>isAggregateCategorical(n));
+    const aggregates = rootAggregates.length > 0 ? rootAggregates : Object.values(nodes).filter((n)=>isAggregateCategorical(n));
+    return aggregates.map((agg, index)=>{
+        const metricName = metricNameOf(agg);
+        const counts = agg.counts ?? {};
+        const categories = agg.categories ?? agg.metric?.categories ?? Object.keys(counts);
+        const byLabel = groupNodesByLabel(agg, nodes, rawResults, metricName, sessionByNodeId, reasoningByKey);
+        // Order labels by the metric's category order, then any extras found in the data.
+        const orderedLabels = [
+            ...categories
+        ];
+        for (const label of byLabel.keys()){
+            if (!orderedLabels.includes(label)) orderedLabels.push(label);
+        }
+        const labels = orderedLabels.map((labelName)=>{
+            const nodesForLabel = byLabel.get(labelName) ?? [];
+            return {
+                labelName,
+                count: counts[labelName] ?? nodesForLabel.length,
+                nodes: nodesForLabel
+            };
+        });
+        const total = labels.reduce((sum, l)=>sum + l.count, 0);
+        return {
+            key: agg.identifier ?? `${metricName}-${index}`,
+            metricName,
+            description: agg.metric?.description ?? undefined,
+            mostCommon: agg.most_common_label ?? undefined,
+            leastCommon: agg.least_common_label ?? undefined,
+            total,
+            labels
+        };
+    });
+}
+
+const SHORT_ID_LENGTH = 8;
+const shortenId = (id)=>id.length > SHORT_ID_LENGTH ? id.slice(0, SHORT_ID_LENGTH) : id;
+const NodeRow = ({ node, metricName, onAgentNodeClick })=>{
+    const { theme } = useTheme$1();
+    const [showReasoning, setShowReasoning] = React.useState(false);
+    const clickable = !!onAgentNodeClick;
+    const open = ()=>onAgentNodeClick?.(node.sessionId, node.nodeId);
+    return /*#__PURE__*/ React.createElement("div", {
+        style: {
+            display: "flex",
+            flexDirection: "column",
+            gap: 8
+        }
+    }, /*#__PURE__*/ React.createElement("div", {
+        style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 10,
+            flexWrap: "wrap"
+        }
+    }, /*#__PURE__*/ React.createElement(Tooltip, {
+        title: clickable ? `Inspect run · ${node.nodeId}` : node.nodeId
+    }, /*#__PURE__*/ React.createElement("span", {
+        role: clickable ? "button" : undefined,
+        tabIndex: clickable ? 0 : undefined,
+        onClick: clickable ? open : undefined,
+        onKeyDown: clickable ? (e)=>{
+            if (e.key === "Enter" || e.key === " ") {
+                e.preventDefault();
+                open();
+            }
+        } : undefined,
+        style: {
+            display: "inline-flex",
+            alignItems: "center",
+            gap: 6,
+            padding: "3px 10px",
+            borderRadius: 6,
+            fontFamily: "monospace",
+            fontSize: 12,
+            fontWeight: 500,
+            background: theme.colors.tagLlminference?.bg ?? theme.colors.muted,
+            color: theme.colors.tagLlminference?.color ?? theme.colors.foreground,
+            border: `1px solid ${theme.colors.tagLlminference?.border ?? theme.colors.border}`,
+            cursor: clickable ? "pointer" : "default"
+        }
+    }, /*#__PURE__*/ React.createElement(Bot, {
+        size: 13,
+        style: {
+            flexShrink: 0
+        }
+    }), shortenId(node.nodeId))), node.reasoning && /*#__PURE__*/ React.createElement("button", {
+        type: "button",
+        onClick: ()=>setShowReasoning((s)=>!s),
+        style: {
+            display: "inline-flex",
+            alignItems: "center",
+            gap: 5,
+            padding: "3px 9px",
+            borderRadius: 6,
+            fontSize: 12,
+            cursor: "pointer",
+            background: "transparent",
+            color: theme.colors.primary,
+            border: `1px solid ${theme.colors.primary}`
+        }
+    }, /*#__PURE__*/ React.createElement(MessageSquareText, {
+        size: 12
+    }), showReasoning ? "Hide reasoning" : "Show reasoning")), node.reasoning && showReasoning && /*#__PURE__*/ React.createElement("div", {
+        style: {
+            padding: "10px 14px",
+            background: theme.colors.muted,
+            border: `1px solid ${theme.colors.border}`,
+            borderRadius: 6,
+            fontSize: 13,
+            lineHeight: 1.5,
+            whiteSpace: "pre-wrap",
+            color: theme.colors.foreground
+        }
+    }, /*#__PURE__*/ React.createElement("div", {
+        style: {
+            fontWeight: 600,
+            marginBottom: 6,
+            color: theme.colors.mutedForeground
+        }
+    }, "Judge reasoning · ", metricName), node.reasoning));
+};
+const LabelPanelHeader = ({ label })=>{
+    const { theme } = useTheme$1();
+    const isEmpty = label.count === 0;
+    return /*#__PURE__*/ React.createElement("div", {
+        style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 10
+        }
+    }, /*#__PURE__*/ React.createElement("span", {
+        style: {
+            width: 7,
+            height: 7,
+            borderRadius: "50%",
+            flexShrink: 0,
+            background: isEmpty ? theme.colors.border : theme.colors.primary
+        }
+    }), /*#__PURE__*/ React.createElement("span", {
+        style: {
+            fontSize: 13,
+            fontWeight: 600,
+            color: isEmpty ? theme.colors.mutedForeground : undefined
+        }
+    }, label.labelName), /*#__PURE__*/ React.createElement("span", {
+        style: {
+            marginLeft: "auto",
+            fontSize: 12,
+            color: theme.colors.mutedForeground
+        }
+    }, label.count, " ", label.count === 1 ? "node" : "nodes"));
+};
+const MetricCard = ({ metric, onAgentNodeClick })=>{
+    const { theme } = useTheme$1();
+    const items = metric.labels.map((label)=>({
+            key: label.labelName,
+            label: /*#__PURE__*/ React.createElement(LabelPanelHeader, {
+                label: label
+            }),
+            collapsible: label.count === 0 ? "disabled" : undefined,
+            children: label.nodes.length === 0 ? /*#__PURE__*/ React.createElement("span", {
+                style: {
+                    fontSize: 12,
+                    fontStyle: "italic",
+                    color: theme.colors.mutedForeground
+                }
+            }, "No evaluations") : /*#__PURE__*/ React.createElement("div", {
+                style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: 12
+                }
+            }, label.nodes.map((node)=>/*#__PURE__*/ React.createElement(NodeRow, {
+                    key: node.nodeId,
+                    node: node,
+                    metricName: metric.metricName,
+                    onAgentNodeClick: onAgentNodeClick
+                })))
+        }));
+    return /*#__PURE__*/ React.createElement("div", {
+        style: {
+            background: theme.colors.card,
+            border: `1px solid ${theme.colors.border}`,
+            borderRadius: 8,
+            overflow: "hidden"
+        }
+    }, /*#__PURE__*/ React.createElement("div", {
+        style: {
+            padding: "14px 18px",
+            borderBottom: `1px solid ${theme.colors.border}`,
+            background: theme.colors.secondary
+        }
+    }, /*#__PURE__*/ React.createElement("div", {
+        style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 12,
+            flexWrap: "wrap"
+        }
+    }, /*#__PURE__*/ React.createElement(Scale, {
+        size: 16,
+        style: {
+            color: theme.colors.primary,
+            flexShrink: 0
+        }
+    }), /*#__PURE__*/ React.createElement("span", {
+        style: {
+            fontSize: 15,
+            fontWeight: 600
+        }
+    }, metric.metricName), /*#__PURE__*/ React.createElement("div", {
+        style: {
+            display: "flex",
+            flexWrap: "wrap",
+            gap: 6,
+            marginLeft: 4
+        }
+    }, metric.labels.map((label)=>/*#__PURE__*/ React.createElement(Tag, {
+            key: label.labelName,
+            style: {
+                margin: 0,
+                borderRadius: 12,
+                fontSize: 12,
+                ...label.count > 0 ? {
+                    background: theme.colors.tagLlminference?.bg ?? theme.colors.muted,
+                    color: theme.colors.tagLlminference?.color ?? theme.colors.foreground,
+                    border: `1px solid ${theme.colors.tagLlminference?.border ?? theme.colors.border}`
+                } : {
+                    background: "transparent",
+                    color: theme.colors.mutedForeground,
+                    border: `1px solid ${theme.colors.border}`
+                }
+            }
+        }, label.labelName, " ", /*#__PURE__*/ React.createElement("strong", null, label.count)))), /*#__PURE__*/ React.createElement("div", {
+        style: {
+            display: "flex",
+            gap: 20,
+            marginLeft: "auto",
+            flexShrink: 0
+        }
+    }, /*#__PURE__*/ React.createElement(Meta, {
+        label: "Most common",
+        value: metric.mostCommon
+    }), /*#__PURE__*/ React.createElement(Meta, {
+        label: "Least common",
+        value: metric.leastCommon
+    }), /*#__PURE__*/ React.createElement(Meta, {
+        label: "Evaluations",
+        value: String(metric.total)
+    }))), metric.description && /*#__PURE__*/ React.createElement("div", {
+        style: {
+            marginTop: 6,
+            fontSize: 12,
+            color: theme.colors.mutedForeground
+        }
+    }, metric.description)), /*#__PURE__*/ React.createElement(Collapse, {
+        items: items,
+        bordered: false,
+        style: {
+            background: theme.colors.card
+        }
+    }));
+};
+const Meta = ({ label, value })=>{
+    const { theme } = useTheme$1();
+    return /*#__PURE__*/ React.createElement("span", {
+        style: {
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "flex-end",
+            gap: 1
+        }
+    }, /*#__PURE__*/ React.createElement("span", {
+        style: {
+            fontSize: 10,
+            textTransform: "uppercase",
+            letterSpacing: 0.4,
+            color: theme.colors.mutedForeground
+        }
+    }, label), /*#__PURE__*/ React.createElement("span", {
+        style: {
+            fontSize: 13,
+            fontWeight: 500
+        }
+    }, value ?? "—"));
+};
+const JudgeAggregateView = ({ metrics, onAgentNodeClick })=>{
+    const { theme } = useTheme$1();
+    if (!metrics.length) {
+        return /*#__PURE__*/ React.createElement("div", {
+            style: {
+                padding: 24,
+                textAlign: "center",
+                color: theme.colors.mutedForeground,
+                fontSize: 14
+            }
+        }, "No judge metrics available");
+    }
+    return /*#__PURE__*/ React.createElement("div", {
+        style: {
+            width: "100%",
+            minWidth: 0
+        }
+    }, /*#__PURE__*/ React.createElement("h3", {
+        style: {
+            margin: "0 0 16px",
+            fontSize: 16,
+            fontWeight: 600
+        }
+    }, "Judge Evaluator - Aggregate View"), /*#__PURE__*/ React.createElement("div", {
+        style: {
+            display: "flex",
+            flexDirection: "column",
+            gap: 12
+        }
+    }, metrics.map((metric)=>/*#__PURE__*/ React.createElement(MetricCard, {
+            key: metric.key,
+            metric: metric,
+            onAgentNodeClick: onAgentNodeClick
+        }))));
+};
+
 function detectAggregateType(nodes) {
     const values = Object.values(nodes);
     if (values.some((n)=>n?.type === "ToolAggregate")) return "ToolUse";
@@ -116845,22 +117272,6 @@ function buildLLMInferenceFlatRows(nodes) {
             count: agg.values?.length ?? 0
         }));
 }
-function buildJudgeRows(nodes) {
-    const values = Object.values(nodes);
-    const aggregates = values.filter((n)=>isAggregateCategorical(n));
-    return aggregates.map((agg)=>{
-        const counts = agg.counts ?? {};
-        const total = Object.values(counts).reduce((a, b)=>a + b, 0);
-        return {
-            key: agg.identifier ?? agg.metric?.name ?? "unknown",
-            metric: agg.metric?.name ?? "Unknown",
-            mostCommon: agg.most_common_label ?? "-",
-            leastCommon: agg.least_common_label ?? "-",
-            counts,
-            total
-        };
-    });
-}
 // --- Shared helpers ---
 function getAllExpandableKeys(rows) {
     const keys = [];
@@ -116932,7 +117343,12 @@ const AggregateResultsTable = ({ rawResults = [], aggregateResults, agents, titl
             if (type === "Judge") {
                 return {
                     aggregateType: type,
-                    dataSource: buildJudgeRows(aggregateResults.nodes),
+                    dataSource: buildJudgeMetricsFromAggregate({
+                        roots: aggregateResults.roots,
+                        nodes: aggregateResults.nodes,
+                        agents,
+                        rawResults
+                    }),
                     llmIsTree: false,
                     llmExpandableKeys: []
                 };
@@ -117265,86 +117681,10 @@ const AggregateResultsTable = ({ rawResults = [], aggregateResults, agents, titl
         }));
     }
     if (aggregateType === "Judge") {
-        const rows = dataSource;
-        const columns = [
-            {
-                title: "METRIC",
-                dataIndex: "metric",
-                key: "metric",
-                render: (metric)=>/*#__PURE__*/ React.createElement("span", {
-                        style: {
-                            fontFamily: "monospace",
-                            fontSize: 13
-                        }
-                    }, /*#__PURE__*/ React.createElement(Scale, {
-                        size: 14,
-                        style: {
-                            marginRight: 8,
-                            verticalAlign: "middle",
-                            color: theme.colors.primary
-                        }
-                    }), metric)
-            },
-            {
-                title: "MOST COMMON",
-                dataIndex: "mostCommon",
-                key: "mostCommon",
-                render: (v)=>/*#__PURE__*/ React.createElement(Tag, {
-                        style: {
-                            background: theme.colors.success,
-                            color: theme.colors.successForeground,
-                            border: "none"
-                        }
-                    }, v)
-            },
-            {
-                title: "LEAST COMMON",
-                dataIndex: "leastCommon",
-                key: "leastCommon",
-                render: (v)=>/*#__PURE__*/ React.createElement("span", {
-                        style: {
-                            color: theme.colors.mutedForeground
-                        }
-                    }, v)
-            },
-            {
-                title: "DISTRIBUTION",
-                key: "distribution",
-                render: (_, row)=>{
-                    const entries = Object.entries(row.counts).sort((a, b)=>b[1] - a[1]);
-                    return /*#__PURE__*/ React.createElement("span", {
-                        style: {
-                            fontSize: 12,
-                            color: theme.colors.mutedForeground
-                        }
-                    }, entries.map(([label, count])=>`${label}: ${count}`).join(" · "));
-                }
-            }
-        ];
-        return /*#__PURE__*/ React.createElement("div", {
-            style: {
-                width: "100%",
-                minWidth: 0,
-                overflow: "hidden"
-            }
-        }, /*#__PURE__*/ React.createElement("h3", {
-            style: {
-                margin: "0 0 16px",
-                fontSize: 16,
-                fontWeight: 600
-            }
-        }, resolvedTitle), /*#__PURE__*/ React.createElement(ForwardTable, {
-            dataSource: rows,
-            columns: columns,
-            rowKey: "key",
-            pagination: false,
-            size: "small",
-            style: {
-                width: "100%",
-                background: theme.colors.card,
-                border: `1px solid ${theme.colors.border}`
-            }
-        }));
+        return /*#__PURE__*/ React.createElement(JudgeAggregateView, {
+            metrics: dataSource,
+            onAgentNodeClick: onAgentNodeClick
+        });
     }
     // ToolUse (tree table)
     const toolRows = dataSource;
@@ -117897,7 +118237,7 @@ const EvaluatorResult = ({ evaluation, evaluatorId, backHref, onAgentNodeClick }
             minWidth: 0
         }
     }, /*#__PURE__*/ React.createElement(AggregateResultsTable, {
-        rawResults: rawResults.filter((r)=>isToolResult(r) || isToolAggregate(r)),
+        rawResults: rawResults,
         aggregateResults: aggregateResults,
         agents: evaluation.agents,
         evaluatorName: evaluatorName,