diff --git a/frontend/src/components/Flow/FlowNode.tsx b/frontend/src/components/Flow/FlowNode.tsx index c87029c..a85f7e4 100644 --- a/frontend/src/components/Flow/FlowNode.tsx +++ b/frontend/src/components/Flow/FlowNode.tsx @@ -226,11 +226,14 @@ function FlowNodeComponent({ data, selected }: NodeProps) { {typeLabel} - {/* Each control sits in a slot that is there whether the control - is or not. They come and go with what the node is doing — and a - node running many times a second comes and goes that often — so - in the flex row itself they would resize the card on every - execution, which reads as a flickering shape. */} + {/* This and the dot below sit in slots that are there whether the + control is or not: both come and go on their own — a node running + many times a second mounts and unmounts this on every execution — + and in the flex row itself that resizes the card each time, which + reads as a flickering shape. The traceback button below is left + in the row on purpose: it appears when a node newly fails and + goes when someone acknowledges it, which is a thing to notice + rather than a flicker, and a slot for it costs the title 34px. */} {running ? ( @@ -259,48 +262,46 @@ function FlowNodeComponent({ data, selected }: NodeProps) { ) : null} - - {(status === "error" || failedEarlier) && onShowLogs ? ( - - - - - - {failedEarlier - ? `Failed at ${failedAt} — show the traceback` - : "Show the traceback"} - - - ) : null} - + {(status === "error" || failedEarlier) && onShowLogs ? ( + + + + + + {failedEarlier + ? `Failed at ${failedAt} — show the traceback` + : "Show the traceback"} + + + ) : null} {style ? (