Files
cameleer-server/.superpowers/brainstorm/2048-1774541143/content/appconfig-traces-taps-merged.html
hsiegeln 673f0958c5
All checks were successful
CI / cleanup-branch (push) Has been skipped
CI / build (push) Successful in 1m4s
CI / docker (push) Successful in 58s
CI / deploy-feature (push) Has been skipped
CI / deploy (push) Successful in 38s
revert: temporarily revert EIP_CIRCUIT_BREAKER compound rendering
Reverting e8039f9 to diagnose compound rendering regression affecting
all compound types (SPLIT, CHOICE, LOOP, DO_TRY) and error handlers.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-29 18:15:10 +02:00

78 lines
4.4 KiB
HTML

<h2>AppConfigDetailPage — Merged "Traces & Taps" Section</h2>
<p class="subtitle">Single table combining traced processors and data extraction taps</p>
<div class="mockup">
<div class="mockup-header">Traces & Taps — Merged Table</div>
<div class="mockup-body" style="background:#1a1a2e;color:#e0e0e0;padding:20px;font-family:system-ui,-apple-system,sans-serif;font-size:13px;">
<div style="background:#1e1e3a;border:1px solid #2d2d50;border-radius:8px;padding:16px;">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;">
<div style="font-size:12px;font-weight:600;color:#9ca3af;text-transform:uppercase;letter-spacing:0.5px;">Traces & Taps</div>
<span style="font-size:11px;color:#6b7280;">2 traced · 3 taps · manage taps on route pages</span>
</div>
<table style="width:100%;border-collapse:collapse;font-size:12px;">
<thead>
<tr style="border-bottom:1px solid #2d2d50;">
<th style="text-align:left;padding:8px;color:#9ca3af;font-size:11px;font-weight:500;">Processor</th>
<th style="text-align:left;padding:8px;color:#9ca3af;font-size:11px;font-weight:500;">Capture</th>
<th style="text-align:left;padding:8px;color:#9ca3af;font-size:11px;font-weight:500;">Taps</th>
</tr>
</thead>
<tbody>
<!-- Processor with both trace + taps -->
<tr style="border-bottom:1px solid #161630;">
<td style="padding:8px;font-family:monospace;font-size:11px;color:#60a5fa;">unmarshal1</td>
<td style="padding:8px;">
<span style="background:#2d1f3b;color:#d8b4fe;padding:1px 8px;border-radius:4px;font-size:10px;">BOTH</span>
</td>
<td style="padding:8px;">
<div style="display:flex;gap:6px;flex-wrap:wrap;">
<span style="background:#1e3a5f;color:#7dd3fc;padding:1px 8px;border-radius:10px;font-size:10px;font-family:monospace;">orderId <span style="color:#4ade80;margin-left:2px;">&#10003;</span></span>
<span style="background:#1e3a5f;color:#7dd3fc;padding:1px 8px;border-radius:10px;font-size:10px;font-family:monospace;">customerId <span style="color:#4ade80;margin-left:2px;">&#10003;</span></span>
</div>
</td>
</tr>
<!-- Processor with trace only -->
<tr style="border-bottom:1px solid #161630;">
<td style="padding:8px;font-family:monospace;font-size:11px;color:#60a5fa;">toDatabase</td>
<td style="padding:8px;">
<span style="background:#1e3a5f;color:#7dd3fc;padding:1px 8px;border-radius:4px;font-size:10px;">INPUT</span>
</td>
<td style="padding:8px;">
<span style="color:#6b7280;font-size:11px;"></span>
</td>
</tr>
<!-- Processor with tap only (no trace override) -->
<tr>
<td style="padding:8px;font-family:monospace;font-size:11px;color:#60a5fa;">enrichPrice</td>
<td style="padding:8px;">
<span style="color:#6b7280;font-size:11px;"></span>
</td>
<td style="padding:8px;">
<div style="display:flex;gap:6px;flex-wrap:wrap;">
<span style="background:#3b2f1f;color:#fcd34d;padding:1px 8px;border-radius:10px;font-size:10px;font-family:monospace;">orderTotal <span style="color:#6b7280;margin-left:2px;">&#10007;</span></span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div style="margin-top:16px;"></div>
<div class="section">
<h3>Design Notes</h3>
<ul style="font-size:14px;line-height:1.8;">
<li><strong>One row per processor</strong> that has either a capture override or taps (or both)</li>
<li><strong>Capture column:</strong> shows the trace capture mode badge, or em-dash if default</li>
<li><strong>Taps column:</strong> attribute name badges with enabled/disabled indicator (&#10003; / &#10007;), or em-dash if none</li>
<li><strong>Tap badges color-coded by language:</strong> blue = simple, yellow = jsonpath (matches RouteDetail tap table)</li>
<li><strong>Edit mode:</strong> capture column becomes a dropdown, taps remain read-only (manage on route pages)</li>
<li><strong>Empty state:</strong> "No processor-specific traces or taps configured" with link to route pages</li>
</ul>
</div>