feat(central-ui): FlowGraphView log-count badge and exception subtitle on failed nodes (D8)

This commit is contained in:
Joseph Doherty
2026-09-09 11:36:42 -04:00
parent 25b127b3e3
commit a4a35bfa97
4 changed files with 232 additions and 16 deletions
@@ -70,6 +70,7 @@
@foreach (var n in _layout.Nodes)
{
var node = n;
var logs = LogCounts(node.Step);
<g class="@NodeClass(node)" transform="translate(@F(node.X) @F(node.Y))"
role="button" tabindex="0"
aria-label="@(Eyebrow(node) + ": " + node.Title)"
@@ -86,18 +87,39 @@
<span class="fg-duration">@Duration(node)</span>
</div>
<div class="fg-title" data-test="flow-node-title">@WrapHints(node.DisplayTitle)</div>
@if (HasPill(node))
{
@* Outbound kinds: the folded outcome as a pill, then the call mode (node anatomy: "● Ok · sync"). *@
<div class="fg-status" data-test="flow-node-status">
<span class="@PillClass(node.Step!.Outcome)" data-test="flow-node-pill">@PillText(node.Step.Outcome)</span>
<span class="fg-mode">· @OutboundMode(node.Kind, node.Subtitle)</span>
</div>
}
else
{
<div class="fg-subtitle" data-test="flow-node-subtitle">@node.DisplaySubtitle</div>
}
@* Footer row: the pill-or-subtitle on the left, the log-count badge on the right
(step-logs design 2026-09-09 D8). A node with no lines shows no badge at all. *@
<div class="fg-foot">
@if (HasPill(node))
{
@* Outbound kinds: the folded outcome as a pill, then the call mode (node anatomy: "● Ok · sync"). *@
<div class="fg-status" data-test="flow-node-status">
<span class="@PillClass(node.Step!.Outcome)" data-test="flow-node-pill">@PillText(node.Step.Outcome)</span>
<span class="fg-mode">· @OutboundMode(node.Kind, node.Subtitle)</span>
</div>
}
else
{
<div class="fg-subtitle" data-test="flow-node-subtitle">@node.DisplaySubtitle</div>
}
@if (logs.Errors + logs.Warnings + logs.Info > 0)
{
<span class="fg-logs" data-test="flow-node-logs" title="@LogTitle(node)">
@if (logs.Errors > 0)
{
<i class="e">✕ @logs.Errors</i>
}
@if (logs.Warnings > 0)
{
<i class="w">! @logs.Warnings</i>
}
@if (logs.Info > 0)
{
<i class="i">≡ @logs.Info</i>
}
</span>
}
</div>
</div>
</foreignObject>
</g>