feat(templates): expandable failure details in detail history tab
Rows with errors, blockers, or warnings now show a '▶ click for details' hint and expand inline on click, matching the behaviour in History & Audit. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
1c5b131f19
commit
4f9cb43ac8
|
|
@ -444,23 +444,50 @@ function _renderDetailTab(t, tabKey) {
|
|||
if (!records.length) {
|
||||
content.innerHTML = `<div class="callout info"><span class="callout-icon">ℹ️</span>No migration history for this template yet.</div>`;
|
||||
} else {
|
||||
const rows = [...records].reverse().map(r => {
|
||||
const hasDetail = r.error || (r.blockers||[]).length || (r.warnings||[]).length;
|
||||
const detailHtml = hasDetail ? `
|
||||
<tr class="row-expanded-content" style="display:none">
|
||||
<td colspan="4">
|
||||
<div class="row-expand-body">
|
||||
${(r.blockers||[]).map(b => `<div style="color:var(--error);font-size:12px">🚫 ${escHtml(b)}</div>`).join('')}
|
||||
${(r.warnings||[]).map(w => `<div style="color:var(--warning);font-size:12px">⚠ ${escHtml(w)}</div>`).join('')}
|
||||
${r.error ? `<div style="color:var(--error);font-size:12px">❌ ${escHtml(r.error)}</div>` : ''}
|
||||
</div>
|
||||
</td>
|
||||
</tr>` : '';
|
||||
return `
|
||||
<tr class="${hasDetail ? 'row-expandable' : ''}" style="${hasDetail ? 'cursor:pointer' : ''}">
|
||||
<td>${(r.timestamp||'').slice(0,19).replace('T',' ')}</td>
|
||||
<td>${escHtml(r.action||'—')}</td>
|
||||
<td>
|
||||
<span class="badge ${r.status==='success'?'badge-green':'badge-red'}">${r.status}</span>
|
||||
${hasDetail ? '<span style="font-size:10px;color:var(--text-muted);margin-left:4px">▶ click for details</span>' : ''}
|
||||
</td>
|
||||
<td class="mono">${escHtml(r.docusign_template_id||'—')}</td>
|
||||
</tr>${detailHtml}`;
|
||||
}).join('');
|
||||
|
||||
content.innerHTML = `
|
||||
<div class="card">
|
||||
<div class="table-wrap">
|
||||
<table>
|
||||
<thead><tr><th>Time</th><th>Action</th><th>Status</th><th>Docusign ID</th></tr></thead>
|
||||
<tbody>
|
||||
${[...records].reverse().map(r => `
|
||||
<tr>
|
||||
<td>${(r.timestamp||'').slice(0,19).replace('T',' ')}</td>
|
||||
<td>${escHtml(r.action||'—')}</td>
|
||||
<td><span class="badge ${r.status==='success'?'badge-green':'badge-red'}">${r.status}</span></td>
|
||||
<td class="mono">${escHtml(r.docusign_template_id||'—')}</td>
|
||||
</tr>`).join('')}
|
||||
</tbody>
|
||||
<tbody>${rows}</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
content.querySelectorAll('.row-expandable').forEach(row => {
|
||||
row.addEventListener('click', () => {
|
||||
const next = row.nextElementSibling;
|
||||
if (next?.classList.contains('row-expanded-content')) {
|
||||
const open = next.style.display !== 'none';
|
||||
next.style.display = open ? 'none' : 'table-row';
|
||||
row.querySelector('span[style*="text-muted"]').textContent = open ? '▶ click for details' : '▼ hide details';
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}).catch(() => {
|
||||
content.innerHTML = `<div class="callout error"><span class="callout-icon">❌</span>Failed to load history.</div>`;
|
||||
|
|
|
|||
Loading…
Reference in New Issue