Add dismiss functionality for cloud-init build status</message>

<message>Implement a new API endpoint to clear the build status to idle, allowing users to dismiss messages after a build is cancelled, completed, or errored. Update the dashboard UI to include a dismiss link that appears under relevant conditions, enhancing user experience by providing a clearer interface for managing build statuses. Modify the JavaScript to handle the dismissal action and ensure proper status updates are reflected in the UI.
This commit is contained in:
nearxos
2026-02-23 10:28:58 +02:00
parent ec973cc2b3
commit b1368b6e62
4 changed files with 59 additions and 5 deletions

View File

@@ -451,6 +451,7 @@
<button type="button" id="buildCloudInitCancelBtn" class="btn btn-outline" style="display:none; margin-left:0.5rem;">Cancel build</button>
</div>
<div id="buildCloudInitStatus" class="backups-mono" style="font-size:0.85rem; min-height:1.5em; margin-bottom:0.5rem;"></div>
<a href="#" id="buildCloudInitDismiss" style="display:none; font-size:0.85rem;">Dismiss</a>
<details style="margin-top:0.5rem;">
<summary>Cloud-init templates &amp; customize</summary>
<div class="inner" style="margin-top:0.5rem;">
@@ -895,10 +896,12 @@
var el = document.getElementById('buildCloudInitStatus');
var btn = document.getElementById('buildCloudInitBtn');
var cancelBtn = document.getElementById('buildCloudInitCancelBtn');
var dismissEl = document.getElementById('buildCloudInitDismiss');
if (!el) return;
var busy = ['resolving','downloading','decompressing','injecting','finalizing'].indexOf(d.phase) >= 0;
if (btn) btn.disabled = busy;
if (cancelBtn) { cancelBtn.style.display = busy ? 'inline-block' : 'none'; cancelBtn.disabled = false; }
if (dismissEl) dismissEl.style.display = (d.phase === 'done' || d.phase === 'error' || d.phase === 'cancelled') ? 'inline' : 'none';
if (d.phase === 'idle' && !d.message) {
el.textContent = '';
} else if (d.phase === 'done') {
@@ -909,7 +912,15 @@
el.textContent = 'Error: ' + (d.error || d.message || 'Unknown');
} else if (d.phase === 'cancelled') {
el.textContent = 'Build cancelled.';
if (btn) btn.disabled = false;
if (!window._buildClearScheduled) {
window._buildClearScheduled = true;
setTimeout(function() {
fetch('/api/build-cloudinit-status-clear', { method: 'POST', headers: { 'Content-Type': 'application/json' } }).then(function() { fetchBuildStatus(); }).finally(function() { window._buildClearScheduled = false; });
}, 3000);
}
} else {
window._buildClearScheduled = false;
el.textContent = (d.phase || '') + ': ' + (d.message || '');
}
if (busy) setTimeout(fetchBuildStatus, 5000);
@@ -1012,6 +1023,8 @@
if (buildBtn) buildBtn.onclick = startBuildCloudInit;
var cancelBuildBtn = document.getElementById('buildCloudInitCancelBtn');
if (cancelBuildBtn) cancelBuildBtn.onclick = cancelBuildCloudInit;
var dismissBuildBtn = document.getElementById('buildCloudInitDismiss');
if (dismissBuildBtn) dismissBuildBtn.onclick = function(e) { e.preventDefault(); fetch('/api/build-cloudinit-status-clear', { method: 'POST', headers: { 'Content-Type': 'application/json' } }).then(function() { fetchBuildStatus(); }); };
var variantSel = document.getElementById('buildVariant');
if (variantSel) variantSel.onchange = fetchRaspiosUrl;
var templateLoadBtn = document.getElementById('buildTemplateLoad');