feat: trace data indicators, inline tap config, and detail tab gating
Trace data visibility: - ProcessorNode now includes hasTraceData flag computed from captured body/headers during tree conversion - ConfigBadge shows teal for tracing configured, green when data captured - Search results show green footprints icon for exchanges with trace data - New has_trace_data column on executions table (V11 migration with backfill) - OpenSearch documents and ExecutionSummary include the flag Inline tap configuration: - Extracted reusable TapConfigModal component from RouteDetail - Diagram context menu opens tap modal inline instead of navigating away - Toggle-trace action works immediately with toast feedback - Modal closes only on ESC, Cancel, Save, or Delete (not backdrop click) Detail panel tab gating: - Headers, Input, Output tabs disabled when no data is available - Works at both exchange and processor level - Falls back to Info tab when active tab becomes empty Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -2,16 +2,23 @@ import type { NodeConfig } from './types';
|
||||
|
||||
const BADGE_SIZE = 18;
|
||||
const BADGE_GAP = 4;
|
||||
const TRACE_ENABLED_COLOR = '#1A7F8E'; // teal — tracing configured
|
||||
const TRACE_DATA_COLOR = '#3D7C47'; // green — data captured
|
||||
|
||||
interface ConfigBadgeProps {
|
||||
nodeWidth: number;
|
||||
config: NodeConfig;
|
||||
/** True if actual trace data was captured for this processor */
|
||||
hasTraceData?: boolean;
|
||||
}
|
||||
|
||||
export function ConfigBadge({ nodeWidth, config }: ConfigBadgeProps) {
|
||||
export function ConfigBadge({ nodeWidth, config, hasTraceData }: ConfigBadgeProps) {
|
||||
const badges: { icon: 'tap' | 'trace'; color: string }[] = [];
|
||||
if (config.tapExpression) badges.push({ icon: 'tap', color: '#7C3AED' });
|
||||
if (config.traceEnabled) badges.push({ icon: 'trace', color: '#1A7F8E' });
|
||||
// Show trace badge if tracing is enabled OR data was captured
|
||||
if (config.traceEnabled || hasTraceData) {
|
||||
badges.push({ icon: 'trace', color: hasTraceData ? TRACE_DATA_COLOR : TRACE_ENABLED_COLOR });
|
||||
}
|
||||
if (badges.length === 0) return null;
|
||||
|
||||
let xOffset = nodeWidth;
|
||||
|
||||
@@ -138,7 +138,9 @@ export function DiagramNode({
|
||||
</g>
|
||||
|
||||
{/* Config badges */}
|
||||
{config && <ConfigBadge nodeWidth={w} config={config} />}
|
||||
{(config || executionState?.hasTraceData) && (
|
||||
<ConfigBadge nodeWidth={w} config={config ?? {}} hasTraceData={executionState?.hasTraceData} />
|
||||
)}
|
||||
|
||||
{/* Execution overlay: status badge inside card, top-right corner */}
|
||||
{isCompleted && (
|
||||
|
||||
Reference in New Issue
Block a user