Add auto-update system for DashCaddy instances
- self-updater.js: polls for new versions, downloads/verifies tarballs, triggers host-side rebuild via systemd path unit - dashcaddy-update.sh + systemd units: host-side container rebuild with automatic rollback on health check failure - 7 new /api/v1/system/* endpoints for version info, update check/apply, rollback, and update history - Frontend: DashCaddy tab in Updates modal with version display, changelog, update button, rollback, and notification dot - install.sh: updater service installation, volume mounts, env vars - build-release.sh + webhook-handler.js: release server pipeline (Gitea webhook → build tarball → deploy to get.dashcaddy.net) - Dockerfile: DASHCADDY_COMMIT build arg → VERSION file - Version bump to 1.1.0 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -12,6 +12,7 @@
|
||||
<button class="panel-tab active" data-panel="updates-available">Available</button>
|
||||
<button class="panel-tab" data-panel="updates-history">History</button>
|
||||
<button class="panel-tab" data-panel="updates-auto">Auto-Update</button>
|
||||
<button class="panel-tab" data-panel="updates-dashcaddy" id="updates-dashcaddy-tab">DashCaddy</button>
|
||||
</div>
|
||||
|
||||
<!-- Tab: Available Updates -->
|
||||
@@ -38,6 +39,32 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tab: DashCaddy Self-Update -->
|
||||
<div id="updates-dashcaddy" class="panel-section">
|
||||
<div id="dashcaddy-version-info" style="display: flex; align-items: center; gap: 16px; margin-bottom: 16px; padding: 12px; border-radius: 8px; background: var(--bg);">
|
||||
<div style="flex: 1;">
|
||||
<div style="font-weight: 600; font-size: 1rem;">DashCaddy</div>
|
||||
<div id="dashcaddy-current-version" style="color: var(--muted); font-size: 0.85rem;">Loading...</div>
|
||||
</div>
|
||||
<div id="dashcaddy-update-badge" style="display: none; padding: 4px 12px; border-radius: 12px; font-size: 0.78rem; font-weight: 600; background: var(--accent); color: var(--bg);">Update available</div>
|
||||
</div>
|
||||
<div id="dashcaddy-update-details" style="display: none; margin-bottom: 16px; padding: 12px; border-radius: 8px; border: 1px solid var(--border);">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;">
|
||||
<span style="font-weight: 600;">New version: <span id="dashcaddy-new-version"></span></span>
|
||||
<button id="dashcaddy-apply-btn" class="btn-accent-solid" style="padding: 6px 16px; font-size: 0.85rem;">Update Now</button>
|
||||
</div>
|
||||
<div id="dashcaddy-changelog" style="font-size: 0.8rem; color: var(--muted); max-height: 120px; overflow-y: auto; white-space: pre-wrap; font-family: var(--font-mono); line-height: 1.5;"></div>
|
||||
</div>
|
||||
<div id="dashcaddy-status-bar" style="display: none; margin-bottom: 16px; padding: 10px 12px; border-radius: 8px; font-size: 0.85rem;"></div>
|
||||
<div style="margin-bottom: 12px;">
|
||||
<button id="dashcaddy-check-btn" style="padding: 6px 14px; font-size: 0.82rem;">Check for Updates</button>
|
||||
<button id="dashcaddy-rollback-btn" style="padding: 6px 14px; font-size: 0.82rem; margin-left: 6px;">Rollback</button>
|
||||
</div>
|
||||
<div id="dashcaddy-history-container" style="max-height: 250px; overflow-y: auto;">
|
||||
<div class="panel-empty"><span class="empty-icon">📦</span>No self-update history.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel-bottom-bar">
|
||||
<span id="updates-last-check" class="text-auto-right"></span>
|
||||
</div>
|
||||
@@ -261,6 +288,187 @@
|
||||
}
|
||||
}
|
||||
|
||||
// ===== DASHCADDY SELF-UPDATE =====
|
||||
|
||||
const dcVersionInfo = document.getElementById('dashcaddy-current-version');
|
||||
const dcUpdateBadge = document.getElementById('dashcaddy-update-badge');
|
||||
const dcUpdateDetails = document.getElementById('dashcaddy-update-details');
|
||||
const dcNewVersion = document.getElementById('dashcaddy-new-version');
|
||||
const dcChangelog = document.getElementById('dashcaddy-changelog');
|
||||
const dcApplyBtn = document.getElementById('dashcaddy-apply-btn');
|
||||
const dcCheckBtn = document.getElementById('dashcaddy-check-btn');
|
||||
const dcRollbackBtn = document.getElementById('dashcaddy-rollback-btn');
|
||||
const dcStatusBar = document.getElementById('dashcaddy-status-bar');
|
||||
const dcHistoryContainer = document.getElementById('dashcaddy-history-container');
|
||||
|
||||
let dcLastCheck = null;
|
||||
|
||||
function dcShowStatus(msg, type) {
|
||||
if (!dcStatusBar) return;
|
||||
dcStatusBar.style.display = 'block';
|
||||
dcStatusBar.style.background = type === 'error' ? 'var(--bad-bg)' : type === 'success' ? 'var(--ok-bg)' : 'var(--bg)';
|
||||
dcStatusBar.style.color = type === 'error' ? 'var(--bad-fg)' : type === 'success' ? 'var(--ok-fg)' : 'var(--fg)';
|
||||
dcStatusBar.textContent = msg;
|
||||
}
|
||||
|
||||
async function dcLoadVersion() {
|
||||
try {
|
||||
const res = await fetch('/api/v1/system/version');
|
||||
const data = await res.json();
|
||||
if (data.success) {
|
||||
dcVersionInfo.textContent = 'v' + data.version + (data.commit ? ' (' + data.commit.substring(0, 7) + ')' : '');
|
||||
}
|
||||
} catch (_) {
|
||||
dcVersionInfo.textContent = 'Unable to fetch version';
|
||||
}
|
||||
}
|
||||
|
||||
async function dcCheckForUpdate(silent) {
|
||||
if (!silent) {
|
||||
dcCheckBtn.textContent = 'Checking...';
|
||||
dcCheckBtn.disabled = true;
|
||||
}
|
||||
try {
|
||||
const res = await fetch('/api/v1/system/update-check');
|
||||
const data = await res.json();
|
||||
dcLastCheck = data;
|
||||
|
||||
if (data.success && data.available && data.remote) {
|
||||
dcUpdateBadge.style.display = '';
|
||||
dcUpdateDetails.style.display = '';
|
||||
dcNewVersion.textContent = 'v' + data.remote.version;
|
||||
dcChangelog.textContent = data.remote.changelog || 'No changelog available.';
|
||||
|
||||
// Add notification dot to the Updates button
|
||||
const updatesBtn = document.getElementById('updates-btn');
|
||||
if (updatesBtn && !updatesBtn.querySelector('.update-dot')) {
|
||||
const dot = document.createElement('span');
|
||||
dot.className = 'update-dot';
|
||||
dot.style.cssText = 'position:absolute;top:2px;right:2px;width:8px;height:8px;border-radius:50%;background:var(--accent);';
|
||||
updatesBtn.style.position = 'relative';
|
||||
updatesBtn.appendChild(dot);
|
||||
}
|
||||
// Also add dot to the DashCaddy tab
|
||||
const dcTab = document.getElementById('updates-dashcaddy-tab');
|
||||
if (dcTab && !dcTab.querySelector('.update-dot')) {
|
||||
const dot = document.createElement('span');
|
||||
dot.className = 'update-dot';
|
||||
dot.style.cssText = 'display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-left:4px;vertical-align:middle;';
|
||||
dcTab.appendChild(dot);
|
||||
}
|
||||
} else {
|
||||
dcUpdateBadge.style.display = 'none';
|
||||
dcUpdateDetails.style.display = 'none';
|
||||
if (!silent) dcShowStatus('You are running the latest version.', 'success');
|
||||
}
|
||||
|
||||
if (!silent) {
|
||||
dcCheckBtn.textContent = 'Check for Updates';
|
||||
dcCheckBtn.disabled = false;
|
||||
}
|
||||
} catch (e) {
|
||||
if (!silent) {
|
||||
dcShowStatus('Failed to check: ' + e.message, 'error');
|
||||
dcCheckBtn.textContent = 'Check for Updates';
|
||||
dcCheckBtn.disabled = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function dcApplyUpdate() {
|
||||
if (!confirm('Apply DashCaddy update? The API container will restart.')) return;
|
||||
dcApplyBtn.textContent = 'Updating...';
|
||||
dcApplyBtn.disabled = true;
|
||||
dcShowStatus('Downloading and applying update...', 'info');
|
||||
try {
|
||||
const res = await secureFetch('/api/v1/system/update-apply', { method: 'POST' });
|
||||
const data = await res.json();
|
||||
if (data.success) {
|
||||
dcShowStatus('Update initiated: v' + (data.fromVersion || '?') + ' → v' + (data.toVersion || '?') + '. The container will restart shortly.', 'success');
|
||||
dcApplyBtn.textContent = 'Applied!';
|
||||
// Remove notification dots
|
||||
document.querySelectorAll('.update-dot').forEach(d => d.remove());
|
||||
} else {
|
||||
throw new Error(data.error || 'Update failed');
|
||||
}
|
||||
} catch (e) {
|
||||
dcShowStatus('Update failed: ' + e.message, 'error');
|
||||
dcApplyBtn.textContent = 'Update Now';
|
||||
dcApplyBtn.disabled = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function dcLoadHistory() {
|
||||
try {
|
||||
const res = await fetch('/api/v1/system/update-history');
|
||||
const data = await res.json();
|
||||
const history = data.success && data.history ? data.history : [];
|
||||
if (history.length === 0) {
|
||||
dcHistoryContainer.innerHTML = '<div class="panel-empty"><span class="empty-icon">📦</span>No self-update history.</div>';
|
||||
return;
|
||||
}
|
||||
let html = '<table style="width: 100%; border-collapse: collapse; font-size: 0.82rem;">';
|
||||
html += '<tr style="border-bottom: 1px solid var(--border); color: var(--muted);"><th style="padding: 6px; text-align: left;">When</th><th style="padding: 6px; text-align: left;">Version</th><th style="padding: 6px; text-align: left;">From</th><th style="padding: 6px; text-align: left;">Status</th></tr>';
|
||||
for (const h of history) {
|
||||
const st = h.status === 'success' ? '✓ success' : h.status === 'pending' ? '⏳ pending' : h.status === 'partial' ? '⚠ partial' : '✗ ' + h.status;
|
||||
const stColor = h.status === 'success' ? 'var(--ok-fg)' : h.status === 'pending' ? 'var(--muted)' : 'var(--bad-fg)';
|
||||
html += '<tr style="border-bottom: 1px solid var(--border);">';
|
||||
html += '<td style="padding: 6px; color: var(--muted);">' + timeAgo(h.timestamp) + '</td>';
|
||||
html += '<td style="padding: 6px; font-weight: 500;">v' + escapeHtml(h.version) + (h.rollback ? ' (rollback)' : '') + '</td>';
|
||||
html += '<td style="padding: 6px; color: var(--muted);">v' + escapeHtml(h.fromVersion || '?') + '</td>';
|
||||
html += '<td style="padding: 6px;"><span style="color: ' + stColor + ';">' + st + '</span></td>';
|
||||
html += '</tr>';
|
||||
if (h.error) {
|
||||
html += '<tr><td colspan="4" style="padding: 4px 6px 8px; font-size: 0.78rem; color: var(--bad-fg);">' + escapeHtml(h.error) + '</td></tr>';
|
||||
}
|
||||
if (h.note) {
|
||||
html += '<tr><td colspan="4" style="padding: 4px 6px 8px; font-size: 0.78rem; color: var(--muted);">' + escapeHtml(h.note) + '</td></tr>';
|
||||
}
|
||||
}
|
||||
html += '</table>';
|
||||
dcHistoryContainer.innerHTML = html;
|
||||
} catch (e) {
|
||||
dcHistoryContainer.innerHTML = '<div class="panel-empty" style="color: var(--bad-fg);">Failed: ' + escapeHtml(e.message) + '</div>';
|
||||
}
|
||||
}
|
||||
|
||||
async function dcShowRollback() {
|
||||
try {
|
||||
const res = await fetch('/api/v1/system/rollback-versions');
|
||||
const data = await res.json();
|
||||
const versions = data.success && data.versions ? data.versions : [];
|
||||
if (versions.length === 0) {
|
||||
showNotification('No rollback versions available.', 'info');
|
||||
return;
|
||||
}
|
||||
const version = prompt('Available rollback versions:\n' + versions.join('\n') + '\n\nEnter version to rollback to:');
|
||||
if (!version) return;
|
||||
if (!versions.includes(version)) {
|
||||
showNotification('Invalid version: ' + version, 'error');
|
||||
return;
|
||||
}
|
||||
if (!confirm('Rollback DashCaddy to v' + version + '? The container will restart.')) return;
|
||||
dcShowStatus('Rolling back to v' + version + '...', 'info');
|
||||
const r = await secureFetch('/api/v1/system/rollback', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ version })
|
||||
});
|
||||
const d = await r.json();
|
||||
if (d.success) {
|
||||
dcShowStatus('Rollback to v' + version + ' initiated. Container will restart.', 'success');
|
||||
} else {
|
||||
throw new Error(d.error || 'Rollback failed');
|
||||
}
|
||||
} catch (e) {
|
||||
dcShowStatus('Rollback failed: ' + e.message, 'error');
|
||||
}
|
||||
}
|
||||
|
||||
dcCheckBtn?.addEventListener('click', () => dcCheckForUpdate(false));
|
||||
dcApplyBtn?.addEventListener('click', dcApplyUpdate);
|
||||
dcRollbackBtn?.addEventListener('click', dcShowRollback);
|
||||
|
||||
checkBtn?.addEventListener('click', checkForUpdates);
|
||||
openBtn?.addEventListener('click', () => {
|
||||
modal?.classList.add('show');
|
||||
@@ -271,4 +479,12 @@
|
||||
// Lazy-load tabs
|
||||
document.querySelector('[data-panel="updates-history"]')?.addEventListener('click', loadHistory);
|
||||
document.querySelector('[data-panel="updates-auto"]')?.addEventListener('click', loadAutoConfig);
|
||||
document.querySelector('[data-panel="updates-dashcaddy"]')?.addEventListener('click', () => {
|
||||
dcLoadVersion();
|
||||
dcLoadHistory();
|
||||
if (!dcLastCheck) dcCheckForUpdate(true);
|
||||
});
|
||||
|
||||
// Non-blocking check on page load — just adds notification dot if update available
|
||||
setTimeout(() => dcCheckForUpdate(true), 5000);
|
||||
})();
|
||||
|
||||
Reference in New Issue
Block a user