fix(ui): land #30978 debug event log full-width payloads (@stozo04)

Landed from contributor PR #30978 by @stozo04.

Co-authored-by: stozo04 <stozo04@users.noreply.github.com>
This commit is contained in:
Peter Steinberger
2026-03-02 02:32:09 +00:00
parent 601d1ccd24
commit 8eac33d4e0
3 changed files with 22 additions and 4 deletions

View File

@@ -1191,6 +1191,21 @@
width: 100%;
}
/* Debug event log payloads should use full width like other debug sections. */
.debug-event-log__item {
grid-template-columns: minmax(0, 1fr);
}
.debug-event-log__meta {
min-width: 0;
text-align: left;
}
.debug-event-log__payload {
margin: 0;
max-width: 100%;
}
/* Cron jobs: allow long payload/state text and keep action buttons inside the card. */
.cron-job-payload,
.cron-job-agent,

View File

@@ -127,16 +127,18 @@ export function renderDebug(props: DebugProps) {
<div class="muted" style="margin-top: 12px">No events yet.</div>
`
: html`
<div class="list" style="margin-top: 12px;">
<div class="list debug-event-log" style="margin-top: 12px;">
${props.eventLog.map(
(evt) => html`
<div class="list-item">
<div class="list-item debug-event-log__item">
<div class="list-main">
<div class="list-title">${evt.event}</div>
<div class="list-sub">${new Date(evt.ts).toLocaleTimeString()}</div>
</div>
<div class="list-meta">
<pre class="code-block">${formatEventPayload(evt.payload)}</pre>
<div class="list-meta debug-event-log__meta">
<pre class="code-block debug-event-log__payload">${formatEventPayload(
evt.payload,
)}</pre>
</div>
</div>
`,