- // - A Delete action alongside Restore (per-app card only offers
- // Restore — delete lives in the global view)
- _renderSnapshotRow(r) {
- const hasApp = r.app && r.app !== '—';
- const deepLink = hasApp
- ? `/app/${encodeURIComponent(r.app)}/backups?snapshot=${encodeURIComponent(r.id)}`
- : null;
- const iconUrl = hasApp ? `/core/icons/apps/${encodeURIComponent(r.app)}.svg` : '/core/icons/apps/libreportal.svg';
- const displayName = hasApp ? this.appMeta(r.app).displayName : 'Configs';
- const appChip = hasApp
- ? `${this.escape(displayName)} `
- : `${this.escape(displayName)} `;
- const sid = String(r.id);
-
- // Restic stamps app=/host=/engine= into the snapshot tags; surface
- // those as their own fields and keep any remaining tags as chips.
- const tagMap = {};
- (r.tags || []).forEach(t => { const i = t.indexOf('='); if (i > 0) tagMap[t.slice(0, i)] = t.slice(i + 1); });
- const engineName = tagMap.engine ? this.engineDisplayName(tagMap.engine) : null;
- const otherTags = (r.tags || []).filter(t => !/^(app|host|engine|paths?)=/.test(t));
- const field = (label, valueHtml) =>
- `${label} ${valueHtml}
`;
-
- return `
- `;
- }
-
- _fmtShortTime(iso) {
- if (!iso) return '';
- const d = new Date(iso);
- if (isNaN(d.getTime())) return String(iso);
- return d.toLocaleString();
- }
- _fmtFullTime(iso) {
- if (!iso) return '';
- const d = new Date(iso);
- if (isNaN(d.getTime())) return String(iso);
- return d.toString();
- }
- _fmtNiceTime(iso) {
- if (!iso) return '';
- const d = new Date(iso);
- if (isNaN(d.getTime())) return String(iso);
- return d.toLocaleString(undefined, { dateStyle: 'medium', timeStyle: 'short' });
- }
-
- renderConfiguration() {
- const body = document.getElementById('backup-configuration-body');
- if (!body) return;
-
- // Dismissed state is persisted server-side via Dismissible
- // (data/ui-state.json), so it follows the user across browsers/devices.
- // Banner + its divider are omitted entirely once dismissed.
- const warningDismissed = !!window.Dismissible?.isDismissed('backup-config-warning');
- const warningHTML = warningDismissed ? '' : `
-
-
-
-
- Keep your LibrePortal config backed up offline.
- Repository passwords live inside the config directory. Without that backup, the others cannot be decrypted by anyone — including you.
-
-
-
-
-
-
- `;
-
- body.innerHTML = `
- ${warningHTML}
-
- `;
-
- this.invokeConfigManager();
- }
-
- async exportRepositoryPasswords(triggerBtn) {
- const restoreBtn = () => {
- if (triggerBtn) {
- triggerBtn.disabled = false;
- triggerBtn.dataset.busy = '';
- }
- };
- if (triggerBtn) {
- triggerBtn.disabled = true;
- triggerBtn.dataset.busy = '1';
- }
-
- try {
- const task = await this.taskManager?.createTask(
- 'libreportal webui generate backup',
- 'webui',
- null
- );
- if (task?.id) {
- await this.waitForTask(task.id, 20000);
- }
- const res = await fetch(`/data/backup/generated/passwords.txt?t=${Date.now()}`, {
- credentials: 'same-origin'
- });
- if (!res.ok) throw new Error(`HTTP ${res.status}`);
- const text = await res.text();
- if (!text || !text.includes('CFG_BACKUP_LOC_')) {
- throw new Error('Password file is empty — no locations configured?');
- }
- const blob = new Blob([text], { type: 'text/plain;charset=utf-8' });
- const url = URL.createObjectURL(blob);
- const a = document.createElement('a');
- const host = (window.systemConfigs?.CFG_INSTALL_NAME || 'libreportal').replace(/[^a-z0-9_-]/gi, '_');
- const stamp = new Date().toISOString().slice(0, 19).replace(/[:T]/g, '-');
- a.href = url;
- a.download = `libreportal-backup-passwords-${host}-${stamp}.txt`;
- document.body.appendChild(a);
- a.click();
- document.body.removeChild(a);
- URL.revokeObjectURL(url);
- this.notify('Password export downloaded — store it offline.', 'success');
- } catch (err) {
- this.notify(`Export failed: ${err.message || err}`, 'error');
- } finally {
- restoreBtn();
- }
- }
-
- waitForTask(taskId, timeoutMs = 15000) {
- return new Promise((resolve) => {
- let done = false;
- const finish = () => {
- if (done) return;
- done = true;
- window.removeEventListener('taskCompleted', onComplete);
- clearTimeout(timer);
- resolve();
- };
- const onComplete = (e) => {
- if (e?.detail?.taskId === taskId) finish();
- };
- window.addEventListener('taskCompleted', onComplete);
- const timer = setTimeout(finish, timeoutMs);
- });
- }
-
- async invokeConfigManager(attempt = 0) {
- if (window.configManager && typeof window.configManager.renderConfig === 'function') {
- try {
- await window.configManager.renderConfig('backup');
- this.enhanceConfigurationWithPresets();
- } catch (err) {
- console.error('Backup configuration render failed:', err);
- }
- return;
- }
- if (attempt >= 20) {
- const sec = document.getElementById('config-section');
- if (sec) sec.innerHTML = `Configuration system not loaded. Try refreshing the page.
`;
- return;
- }
- setTimeout(() => this.invokeConfigManager(attempt + 1), 150);
- }
/* Post-render polish on the dynamic /config render: wrap the five raw
retention number fields in a persona-preset dropdown. The five inputs
stay in the DOM (so /config's save flow captures them unchanged) but
are hidden under "Custom…" by default. */
- enhanceConfigurationWithPresets() {
- this.enhanceEngineDetailsButton();
- const lastInput = document.querySelector('#config-section [name="CFG_BACKUP_KEEP_LAST"]');
- if (!lastInput) return;
-
- const section = lastInput.closest('.config-category');
- if (!section || section.dataset.backupPresetEnhanced === '1') return;
- section.dataset.backupPresetEnhanced = '1';
-
- const fieldNames = [
- 'CFG_BACKUP_KEEP_LAST',
- 'CFG_BACKUP_KEEP_DAILY',
- 'CFG_BACKUP_KEEP_WEEKLY',
- 'CFG_BACKUP_KEEP_MONTHLY',
- 'CFG_BACKUP_KEEP_YEARLY'
- ];
- const inputs = fieldNames
- .map(n => section.querySelector(`[name="${n}"]`))
- .filter(Boolean);
- if (inputs.length < 5) return;
-
- const wrappers = inputs.map(input => {
- return input.closest('.config-field, .field-group, .form-group') || input.parentElement;
- });
-
- const extraCustomFields = ['CFG_BACKUP_PRUNE_AFTER_FORGET'];
- extraCustomFields.forEach(name => {
- const el = section.querySelector(`[name="${name}"]`);
- if (el) {
- const wrap = el.closest('.config-field, .field-group, .form-group') || el.parentElement;
- if (wrap) wrappers.push(wrap);
- }
- });
-
- const readVals = () => ({
- last: inputs[0].value || '',
- daily: inputs[1].value || '',
- weekly: inputs[2].value || '',
- monthly: inputs[3].value || '',
- yearly: inputs[4].value || ''
- });
-
- const preset = backupRetentionDetectPreset(readVals());
- const meta = BACKUP_RETENTION_PRESET_META[preset];
- const presetOptions = this.retentionPresetOptions(preset, false);
-
- const block = document.createElement('div');
- block.className = 'backup-retention-preset-block';
- block.innerHTML = `
-
- Backup style ℹ️
- ${presetOptions}
-
- `;
-
- const fieldsGrid = section.querySelector('.config-fields');
- if (fieldsGrid) {
- fieldsGrid.prepend(block);
- } else {
- section.prepend(block);
- }
-
- const applyVisibility = (presetKey) => {
- const isCustom = presetKey === 'custom';
- wrappers.forEach(w => { if (w) w.style.display = isCustom ? '' : 'none'; });
- };
- applyVisibility(preset);
-
- const select = block.querySelector('[data-backup-retention-preset]');
- const tooltipEl = block.querySelector('[data-retention-tooltip]');
- select.addEventListener('change', () => {
- const chosen = select.value;
- if (tooltipEl) tooltipEl.title = BACKUP_RETENTION_PRESET_META[chosen]?.hint || '';
- applyVisibility(chosen);
- if (chosen === 'custom') return;
- const p = BACKUP_RETENTION_PRESETS[chosen];
- const map = { last: 0, daily: 1, weekly: 2, monthly: 3, yearly: 4 };
- Object.entries(map).forEach(([k, i]) => {
- inputs[i].value = p[k];
- inputs[i].dispatchEvent(new Event('input', { bubbles: true }));
- inputs[i].dispatchEvent(new Event('change', { bubbles: true }));
- });
- });
- }
/* Build the list for a "Backup style" dropdown. The scope's
default preset is tagged "(default)" and floated to the top; the rest
follow in declared order. inherit-global only makes sense per-location
(there's nothing to inherit at the global level), so it's omitted when
includeInherit is false. */
- retentionPresetOptions(selected, includeInherit = false) {
- const defaultKey = includeInherit ? 'inherit-global' : 'self-hosting';
- const keys = Object.keys(BACKUP_RETENTION_PRESET_META)
- .filter(k => k !== 'inherit-global' || includeInherit);
- const ordered = [defaultKey, ...keys.filter(k => k !== defaultKey)];
- return ordered.map(k => {
- const base = BACKUP_RETENTION_PRESET_META[k].label;
- const label = k === defaultKey ? `${base} (default)` : base;
- return ` ${this.escape(label)} `;
- }).join('');
- }
/* Retention preset dropdown + hidden underlying fields.
`prefix` is the CFG name prefix, e.g. 'CFG_BACKUP_' or 'CFG_BACKUP_LOC_3_'.
@@ -1376,535 +561,62 @@ class BackupPage {
written: false when inherit, true otherwise. The five raw KEEP_* inputs
are always rendered (so the save flow captures them) but hidden until
"Custom…" is selected. */
- formRetention(prefix, values, includeInherit = false) {
- const preset = backupRetentionDetectPreset(values, includeInherit);
- const meta = BACKUP_RETENTION_PRESET_META[preset];
- const presetOptions = this.retentionPresetOptions(preset, includeInherit);
- const customRetentionHidden = includeInherit
- ? `
-
- Backup style ℹ️
- ${presetOptions}
-
- ${customRetentionHidden}
-
-
-
- ${this.formInput(`${prefix}KEEP_LAST`, 'Keep last', values.last, 'number', '', 'backups')}
- ${this.formInput(`${prefix}KEEP_DAILY`, 'Keep daily', values.daily, 'number', '', 'days')}
- ${this.formInput(`${prefix}KEEP_WEEKLY`, 'Keep weekly', values.weekly, 'number', '', 'weeks')}
- ${this.formInput(`${prefix}KEEP_MONTHLY`, 'Keep monthly', values.monthly, 'number', '', 'months')}
- ${this.formInput(`${prefix}KEEP_YEARLY`, 'Keep yearly', values.yearly, 'number', '', 'years')}
-
-
${inputHTML}${this.escape(unit)}
` : inputHTML;
- return `
-
- ${escLabel}
- ${wrapped}
-
- `;
- }
-
- formSelect(name, label, value, options) {
- const escLabel = this.escape(label);
- const opts = options.map(([v, lbl]) => `${this.escape(lbl)} `).join('');
- return `
-
- ${escLabel}
- ${opts}
-
- `;
- }
-
- formToggle(name, label, checked) {
- const escLabel = this.escape(label);
- return `
-
- ${escLabel}
-
-
-
- `;
- }
/* Append a "Details" button next to every Engine field (global or
per-location). The button reads its engine id from a sibling input
at click time so per-location selects work even before save. */
- enhanceEngineDetailsButton() {
- const selector = '[name="CFG_BACKUP_ENGINE"], [name^="CFG_BACKUP_LOC_"][name$="_ENGINE"]';
- document.querySelectorAll(`#config-section ${selector}, .backup-location-details ${selector}`).forEach((engineInput) => {
- const customSelect = engineInput.closest('.custom-select');
- const wrapTarget = customSelect || engineInput;
- const group = wrapTarget.closest('.field-group') || wrapTarget.parentElement;
- if (!group || group.dataset.engineDetailsBound === '1') return;
- group.dataset.engineDetailsBound = '1';
- const btn = document.createElement('button');
- btn.type = 'button';
- btn.className = 'backup-secondary-btn backup-engine-details-btn';
- btn.dataset.action = 'open-engine-details';
- btn.innerHTML = `
-
-
- Details
- `;
- const wrap = document.createElement('div');
- wrap.className = 'backup-engine-input-row';
- wrapTarget.parentNode.insertBefore(wrap, wrapTarget);
- wrap.appendChild(wrapTarget);
- wrap.appendChild(btn);
- });
- }
- async openEngineDetailsModal(triggerEl) {
- const modal = document.getElementById('backup-engine-modal');
- const body = document.getElementById('backup-engine-modal-body');
- const title = document.getElementById('backup-engine-modal-title');
- if (!modal || !body) return;
-
- // Find the engine select adjacent to the Details button that fired
- // this event so per-location Details work even when the user has
- // changed the select but not saved yet.
- let engineId = (window.systemConfigs?.CFG_BACKUP_ENGINE || 'restic').trim();
- const row = triggerEl?.closest('.backup-engine-input-row');
- const sel = row?.querySelector('select, input');
- if (sel && sel.value) engineId = sel.value.trim();
- body.innerHTML = `Loading engine details…
`;
- modal.classList.add('open');
-
- const data = await this.fetchJson(`/data/backup/generated/engines/${encodeURIComponent(engineId)}.json?t=${Date.now()}`);
- if (!data) {
- body.innerHTML = `
-
- No details file for engine "${this.escape(engineId)} ".scripts/backup/engines/${this.escape(engineId)}.json and run the WebUI regen.
-
- `;
- return;
- }
-
- if (title) title.textContent = `Backup engine: ${data.name || engineId}`;
- const propsHTML = (data.properties || []).map(p =>
- `${this.escape(p.label)} ${this.escape(p.value)} ${this.escape(f)} `).join('');
- const docsHTML = data.docs_url
- ? `${this.escape(data.docs_url)} ↗ `
- : '';
- const logoHTML = data.logo
- ? `
- ${logoHTML}
-
-
${this.escape(data.name || engineId)}
-
${this.escape(data.tagline || '')}
-
-
Highlights ` : ''}
- ${docsHTML ? `Documentation ${docsHTML}
` : ''}
- `;
- }
-
- formCrontab(name, label, value) {
- if (typeof ConfigShared === 'undefined' || !ConfigShared.createCrontabField) {
- return this.formInput(name, label, value, 'text', 'minute hour day month weekday');
- }
- const fieldId = `config-${name}`;
- let cronHtml = ConfigShared.createCrontabField(fieldId, name, value, label, '');
- cronHtml = cronHtml.replace(`name="${name}"`, `name="${name}" data-backup-field`);
- return `
-
- ${this.escape(label)}
- ${cronHtml}
-
- `;
- }
-
- formReadOnly(label, value) {
- return `
-
- ${this.escape(label)}
- ${this.escape(value)}
-
- `;
- }
/* ----- Location modal (edit / add) ----- */
- openLocationModal_unused(idx) {
- const loc = (this.locations?.locations || []).find(l => l.idx === idx);
- if (!loc) return;
- const modal = document.getElementById('backup-location-modal');
- const body = document.getElementById('backup-location-modal-body');
- const title = document.getElementById('backup-location-modal-title');
- if (!modal || !body) return;
- modal.dataset.locIdx = idx;
- title.textContent = `Edit location: ${loc.name}`;
-
- body.innerHTML = `
-
-
-
Retention
-
When to delete old backups from this location.
-
-
Inherits the global retention policy from the Configuration tab.
- `;
- this.tagFieldsForSave(container);
- return;
- }
-
- const values = {
- last: loc.keep_last || '',
- daily: loc.keep_daily || '',
- weekly: loc.keep_weekly || '',
- monthly: loc.keep_monthly || '',
- yearly: loc.keep_yearly || ''
- };
- container.innerHTML = `
- ${toggleField}
- ${this.formRetention(`CFG_BACKUP_LOC_${idx}_`, values)}
- `;
- this.tagFieldsForSave(container);
- }
/* Render a list of CFG_BACKUP_LOC_${idx}_${suffix} fields via the same
ConfigShared.generateField machinery /config uses, so widgets and
styling match pixel-for-pixel. Values are picked up from the location
object (locations.json) using the camelCase mirrors of each suffix. */
- renderLocFields(idx, suffixes, loc) {
- if (typeof ConfigShared === 'undefined' || !ConfigShared.generateField) {
- return `Configuration system not loaded.
`;
- }
- const locValueLookup = {
- NAME: loc.name, ENABLED: loc.enabled ? 'true' : 'false', TYPE: loc.type,
- ENGINE: loc.engine || 'restic',
- PATH_MODE: loc.path_mode || 'custom',
- PATH: loc.path, URI: loc.uri, SSH_USER: loc.ssh_user, SSH_HOST: loc.ssh_host,
- SSH_PORT: loc.ssh_port, SSH_PATH: loc.ssh_path,
- SSH_AUTH: loc.ssh_auth || 'key', SSH_PASS: '',
- S3_ACCESS_KEY: '', S3_SECRET_KEY: '',
- B2_ACCOUNT_ID: '', B2_ACCOUNT_KEY: '',
- APPEND_ONLY: loc.append_only ? 'true' : 'false',
- CUSTOM_RETENTION: loc.custom_retention ? 'true' : 'false',
- KEEP_LAST: loc.keep_last, KEEP_DAILY: loc.keep_daily,
- KEEP_WEEKLY: loc.keep_weekly, KEEP_MONTHLY: loc.keep_monthly,
- KEEP_YEARLY: loc.keep_yearly
- };
-
- // Field metadata comes from configs.json (window.configData) via
- // locFieldMeta; the basic/advanced split is decided by the caller, which
- // renders each group into its own tab (Connection vs Advanced).
- let html = '';
- for (const suffix of suffixes) {
- const m = this.locFieldMeta(idx, suffix);
- if (!m.exists) continue;
- const value = (locValueLookup[suffix] ?? '').toString();
- html += ConfigShared.generateField(`config-${m.key}`, m.key, value, m.title, m.description, {}, {});
- }
- html += '
';
- return html;
- }
/* Resolve a location field's metadata. Source of truth is configs.json
(window.configData) — titles/descriptions/options + a per-field "advanced"
flag; BACKUP_LOC_FIELD_DEFS is the fallback for sparse location.configs.
LOC_ADVANCED_SUFFIXES keeps the known overrides advanced even on legacy
locations whose config predates the **ADVANCED** marker. */
- locFieldMeta(idx, suffix) {
- const key = `CFG_BACKUP_LOC_${idx}_${suffix}`;
- const cfg = window.configData?.config?.[key] || {};
- const def = BACKUP_LOC_FIELD_DEFS[suffix] || {};
- return {
- key,
- exists: !!(cfg.title || cfg.description || BACKUP_LOC_FIELD_DEFS[suffix]),
- title: cfg.title || def.title || suffix,
- description: cfg.description ?? def.description ?? '',
- advanced: LOC_ADVANCED_SUFFIXES.has(suffix) || cfg.advanced === true
- };
- }
/* Ordered field list for a location type. Primary source is the generator-
emitted schema.json (this.locSchema); BACKUP_LOC_FIELDS_BY_TYPE is the
fallback if that file didn't load. */
- locFieldsForType(type) {
- return this.locSchema?.types?.[type]
- || BACKUP_LOC_FIELDS_BY_TYPE[type]
- || BACKUP_LOC_FIELDS_BY_TYPE.local;
- }
/* Split a type's fields into the Connection tab vs the Advanced tab. */
- locFieldGroups(idx, type) {
- const suffixes = this.locFieldsForType(type);
- const connection = [];
- const advanced = [];
- for (const suffix of suffixes) {
- const m = this.locFieldMeta(idx, suffix);
- if (!m.exists) continue;
- (m.advanced ? advanced : connection).push(suffix);
- }
- return { connection, advanced };
- }
/* Connection-tab body: the generic fields plus, for sftp, the SSH key card.
Used both on first render and when the Type select changes. */
- renderConnectionInner(idx, type, loc, connectionSuffixes) {
- let html = this.renderLocFields(idx, connectionSuffixes, loc);
- if (type === 'sftp') html += this.renderBackupSshKeyCard(loc);
- return html;
- }
/* SSH key card for an sftp location. LibrePortal holds the private key in
the location's ssh.key file; only the public key is shown — that's what
you paste into the remote server's authorized_keys. Hidden by
applySshAuthVisibility when SSH auth = password. */
- renderBackupSshKeyCard(l) {
- const idx = l.idx;
- const hasKey = l.ssh_key_exists === true;
- const pub = l.ssh_public_key || '';
- const body = hasKey ? `
- Add this public key to the remote server's ~/.ssh/authorized_keys:
-
-
- Copy public key
- Delete key
-
` : `
- Paste an existing private key, or generate one and we'll show the public key to add on the remote.
-
-
- Save key
- Generate keypair
-
`;
- return `
-
-
- SSH key
- ${hasKey ? '✓ Key configured' : 'No key yet'}
-
- ${body}
-
- ${this.formSelect('__add_type', 'Type', 'local', [
- ['local', 'Local / mounted path'],
- ['sftp', 'SFTP'],
- ['rest', 'REST server'],
- ['s3', 'S3'],
- ['b2', 'Backblaze B2'],
- ['gs', 'Google Cloud Storage'],
- ['azure', 'Azure'],
- ['rclone', 'rclone']
- ])}
- ${this.formInput('__add_name', 'Friendly name', '', 'text', 'e.g. Office NAS')}
-
- The location starts disabled — fill in its connection details on the next screen, then toggle Enabled.
- `;
- modal.classList.add('open');
- }
- async confirmAddLocation() {
- const modal = document.getElementById('backup-add-location-modal');
- if (!modal) return;
- const name = modal.querySelector('[name="__add_name"]')?.value?.trim();
- const type = modal.querySelector('[name="__add_type"]')?.value || 'local';
- if (!name) { this.notify('Name is required.', 'error'); return; }
- this.closeAllModals();
- const safeName = name.replace(/'/g, "'\\''");
- await this.runTask(`libreportal backup location add '${safeName}' ${type}`, 'backup', null);
- setTimeout(() => this.reloadAfterSave(), 2000);
- }
/* ----- Snapshot restore/delete modals ----- */
- openRestoreModal(app, locIdx, snapshot) {
- const locName = this.locName(locIdx);
- const modal = document.getElementById('backup-restore-modal');
- const body = document.getElementById('backup-restore-modal-body');
- if (!modal || !body) return;
- body.innerHTML = `
- Restore ${this.escape(app)} from backup ${this.escape(snapshot)} at ${this.escape(locName)} ?
- The app will be stopped, its folder wiped, the backup restored in place, then the app started again. App-specific pre/post-restore hooks run if present.
- `;
- modal.dataset.app = app;
- modal.dataset.locIdx = locIdx;
- modal.dataset.snapshot = snapshot;
- modal.classList.add('open');
- }
- openDeleteModal(app, locIdx, snapshot) {
- const locName = this.locName(locIdx);
- const modal = document.getElementById('backup-delete-modal');
- const body = document.getElementById('backup-delete-modal-body');
- if (!modal || !body) return;
- body.innerHTML = `
- Delete backup ${this.escape(snapshot)} for ${this.escape(app)} from ${this.escape(locName)} ?
- This cannot be undone. Append-only locations will reject the operation.
- `;
- modal.dataset.app = app;
- modal.dataset.locIdx = locIdx;
- modal.dataset.snapshot = snapshot;
- modal.classList.add('open');
- }
locName(idx) {
const l = (this.locations?.locations || []).find(x => String(x.idx) === String(idx));
@@ -1915,32 +627,10 @@ class BackupPage {
document.querySelectorAll('.backup-modal.open').forEach(m => m.classList.remove('open'));
}
- async confirmRestore() {
- const modal = document.getElementById('backup-restore-modal');
- const { app, locIdx, snapshot } = modal.dataset;
- this.closeAllModals();
- await this.runTask(`libreportal restore app start ${app} ${snapshot} ${locIdx}`, 'restore', app);
- }
- async confirmDelete() {
- const modal = document.getElementById('backup-delete-modal');
- const { app, locIdx, snapshot } = modal.dataset;
- this.closeAllModals();
- await this.runTask(`libreportal backup app delete ${app} ${locIdx}:${snapshot}`, 'backup', app);
- }
- async runBackupAllApps() {
- await this.runTask(`libreportal backup all`, 'backup', null);
- }
- async runBackupSystem() {
- await this.runTask(`libreportal backup system`, 'backup', null);
- }
- async confirmRestoreSystem() {
- if (!confirm('Restore the latest system-config snapshot?\n\nIt is restored into a staging folder (not applied) — review it, then copy what you need (e.g. backup-location credentials, login, settings) into the live config. Your running config is NOT overwritten.')) return;
- await this.runTask(`libreportal restore system`, 'restore', null);
- }
/* ----- Back-up checklist modal -----
Triggered by clicking any tile in the Backup status grid. Lists System
@@ -1950,286 +640,13 @@ class BackupPage {
collapse to `libreportal backup all` (which also runs `backup system`
under the hood) so we only queue one task instead of N. */
- openBackupPickModal(opts = {}) {
- const modal = document.getElementById('backup-pick-modal');
- const body = document.getElementById('backup-pick-modal-body');
- if (!modal || !body) return;
- const apps = this.dashboard?.apps || [];
- const sys = this.dashboard?.system || {};
- const preTickSystem = !!opts.preTickSystem;
- const preTickApps = new Set(opts.preTickApps || []);
-
- // System row at the top — uses the LibrePortal icon to match the
- // dashboard tile. Then every installed app, alphabetical.
- const sortedApps = apps.slice().sort((a, b) => a.app.localeCompare(b.app));
-
- const row = (key, iconSrc, label, sub, checked) => `
-
-
-
${this.escape(label)}
-
${this.escape(sub)}
-
- `;
-
- const sysSub = sys.latest_snapshot
- ? 'Last backed up ' + this.formatRelative(sys.latest_time)
- : 'No backup yet';
-
- const rows = [
- row('__system__', '/core/icons/apps/libreportal.svg', 'Configs', sysSub, preTickSystem),
- ...sortedApps.map(app => {
- const meta = this.appMeta(app.app);
- const sub = app.latest_snapshot
- ? 'Last backed up ' + this.formatRelative(app.latest_time)
- : 'No backup yet';
- return row(app.app, meta.icon, meta.displayName, sub, preTickApps.has(app.app));
- })
- ].join('');
-
- body.innerHTML = `
-
- Pick what to snapshot. Each selection runs in the background and shows up on the Tasks page.
-
-
- ${rows}
- `;
-
- // The select-all / clear links live inside the modal body so we wire
- // them once here per open (they get rebuilt every open, no listener
- // leak).
- body.querySelectorAll('[data-pick-action]').forEach(a => {
- a.addEventListener('click', (e) => {
- e.preventDefault();
- const all = a.dataset.pickAction === 'select-all';
- body.querySelectorAll('.backup-pick-cb').forEach(cb => { cb.checked = all; });
- });
- });
-
- modal.classList.add('open');
- }
-
- async confirmBackupPick() {
- const modal = document.getElementById('backup-pick-modal');
- if (!modal) return;
- const selected = Array.from(modal.querySelectorAll('.backup-pick-cb:checked'))
- .map(cb => cb.value);
- if (!selected.length) {
- this.notify('Pick at least one thing to back up.', 'error');
- return;
- }
- this.closeAllModals();
-
- const apps = this.dashboard?.apps || [];
- const totalThings = apps.length + 1; // +1 for system
- const wantsSystem = selected.includes('__system__');
- const appSlugs = selected.filter(s => s !== '__system__');
-
- // Whole-fleet shortcut — `backup all` queues a single task and also
- // covers system, instead of N+1 separate tasks. Requires at least one
- // app so a system-only pick never collapses into "backup all".
- if (wantsSystem && apps.length > 0 && appSlugs.length === apps.length) {
- await this.runTask('libreportal backup all', 'backup', null);
- return;
- }
- if (wantsSystem) {
- await this.runTask('libreportal backup system', 'backup', null);
- }
- for (const slug of appSlugs) {
- await this.runTask(`libreportal backup app create ${slug}`, 'backup', slug);
- }
- }
/* ----- Migrate (Phase 1: shared-backup) ----- */
- renderMigrate() {
- const body = document.getElementById('backup-migrate-body');
- const empty = document.getElementById('backup-migrate-empty');
- if (!body || !empty) return;
- const data = this.migrate || {};
- const locations = (data.locations || []).filter(l => (l.hosts || []).length > 0);
- if (!locations.length) {
- body.innerHTML = '';
- empty.hidden = false;
- return;
- }
- empty.hidden = true;
- // Group: one card per source-host, with that host's apps listed underneath.
- // We collapse across locations — if the same host appears in two locations,
- // we still show it once with the union of apps (the per-app row carries
- // which location it came from). Most setups have one shared location anyway.
- const installed = new Set(data.destination?.installed_apps || []);
- const html = locations.map(loc => `
-
-
- ${loc.hosts.map(host => {
- const peerName = (this.hostnameToPeerName || {})[host.hostname];
- const headerLabel = peerName
- ? `
${this.escape(peerName)} host: ${this.escape(host.hostname)} `
- : `
${this.escape(host.hostname)} `;
- return `
-
-
-
- ${headerLabel}
- ${(host.apps || []).length} app${host.apps.length === 1 ? '' : 's'} available
-
-
- Migrate every app from this host
-
-
-
- ${(host.apps || []).map(app => {
- const collide = installed.has(app.slug);
- return `
-
-
-
- ${this.escape(app.slug)}
- ${collide ? `
-
- ${app.snapshots} snapshot${app.snapshots === 1 ? '' : 's'} · latest ${this.escape(this.formatRelativeTime(app.latest_date))}
-
-
-
- Migrate
-
-
- `;
- }).join('')}
-
-
- `;
- }).join('')}
-
Migrate ${this.escape(app)} from ${this.escape(host)} via ${this.escape(locName)} onto this host.
`
- : `Migrate every app (${targetApps.length}) from ${this.escape(host)} via ${this.escape(locName)} onto this host.
`;
-
- let collisionNote = '';
- if (collisions.length) {
- collisionNote = `
-
- ⚠ Already installed here: ${collisions.map(c => `${this.escape(c)}`).join(', ')}.
- These will be replaced .
- ${collisionsRunning.length ? `Currently running: ${collisionsRunning.map(c => `${this.escape(c)}`).join(', ')} — will be stopped first.` : ''}
-
- `;
- }
-
- body.innerHTML = `
- ${intro}
- ${collisionNote}
-
-
-
- Back up the destination's existing copy first
-
- Safety net: snapshot the current ${mode === 'app' ? this.escape(app) : 'app'} into your first
- enabled backup location (tagged pre-migrate) before wipe.
- ${collisions.length ? '' : 'No collision — nothing to back up.'}
-
-
-
-
-
- Rewrite host-bound URLs to this host
-
- Replaces CFG_*_URL, *_DOMAIN, *_HOSTNAME with this
- host's values. Uncheck only if you want the moved app to keep claiming the source's hostname.
-
-
-
-
- `;
- modal.dataset.mode = mode;
- modal.dataset.locIdx = String(locIdx);
- modal.dataset.host = host;
- modal.dataset.app = app || '';
- modal.classList.add('open');
- }
-
- async confirmMigrate() {
- const modal = document.getElementById('backup-migrate-modal');
- if (!modal) return;
- const { mode, locIdx, host, app } = modal.dataset;
- const preBackup = document.getElementById('migrate-opt-pre-backup')?.checked;
- const rewrite = document.getElementById('migrate-opt-rewrite-urls')?.checked;
-
- // The bash CLI defaults are: pre-backup ON, URL rewrite ON. Opt-out flags
- // only get appended when the user un-ticks; matches the kernel's defaults.
- const opts = [];
- if (preBackup === false) opts.push('--no-pre-backup');
- if (rewrite === false) opts.push('--keep-urls');
- const optStr = opts.length ? ' ' + opts.join(' ') : '';
-
- this.closeAllModals();
- if (mode === 'app') {
- await this.runTask(
- `libreportal restore migrate app ${app} ${host} ${locIdx}${optStr}`,
- 'restore', app);
- } else {
- await this.runTask(
- `libreportal restore migrate system ${host} ${locIdx}${optStr}`,
- 'restore', null);
- }
- }
async runTask(command, type, app) {
if (!this.taskManager) {
@@ -2246,19 +663,6 @@ class BackupPage {
/* ----- Generic save handler ----- */
- async setLocationEnabled(idx, enabled) {
- const encoded = `CFG_BACKUP_LOC_${idx}_ENABLED=${enabled ? 'true' : 'false'}`;
- try {
- if (!window.tasksManager?.router) throw new Error('Task system not available');
- await window.tasksManager.router.routeAction('config_update', {
- changes: `'${encoded.replace(/'/g, "'\\''")}'`
- });
- this.notify(`${enabled ? 'Enabling' : 'Disabling'} this location…`, 'success');
- setTimeout(() => this.reloadAfterSave(), 2500);
- } catch (err) {
- this.notify(`Save failed: ${err.message || err}`, 'error');
- }
- }
async saveSection(sectionId) {
let scope;
@@ -2304,10 +708,6 @@ class BackupPage {
}
}
- async reloadAfterSave() {
- await this.refreshAll();
- this.render();
- }
notify(message, type) {
if (window.notificationSystem) {
diff --git a/containers/libreportal/frontend/components/backup/js/backup-retention-presets.js b/containers/libreportal/frontend/components/backup/js/backup-retention-presets.js
new file mode 100644
index 0000000..f23492d
--- /dev/null
+++ b/containers/libreportal/frontend/components/backup/js/backup-retention-presets.js
@@ -0,0 +1,135 @@
+// Auto-extracted from backup-page.js (verbatim) — augments BackupPage.prototype. Loaded after the base.
+Object.assign(BackupPage.prototype, {
+ enhanceConfigurationWithPresets() {
+ this.enhanceEngineDetailsButton();
+ const lastInput = document.querySelector('#config-section [name="CFG_BACKUP_KEEP_LAST"]');
+ if (!lastInput) return;
+
+ const section = lastInput.closest('.config-category');
+ if (!section || section.dataset.backupPresetEnhanced === '1') return;
+ section.dataset.backupPresetEnhanced = '1';
+
+ const fieldNames = [
+ 'CFG_BACKUP_KEEP_LAST',
+ 'CFG_BACKUP_KEEP_DAILY',
+ 'CFG_BACKUP_KEEP_WEEKLY',
+ 'CFG_BACKUP_KEEP_MONTHLY',
+ 'CFG_BACKUP_KEEP_YEARLY'
+ ];
+ const inputs = fieldNames
+ .map(n => section.querySelector(`[name="${n}"]`))
+ .filter(Boolean);
+ if (inputs.length < 5) return;
+
+ const wrappers = inputs.map(input => {
+ return input.closest('.config-field, .field-group, .form-group') || input.parentElement;
+ });
+
+ const extraCustomFields = ['CFG_BACKUP_PRUNE_AFTER_FORGET'];
+ extraCustomFields.forEach(name => {
+ const el = section.querySelector(`[name="${name}"]`);
+ if (el) {
+ const wrap = el.closest('.config-field, .field-group, .form-group') || el.parentElement;
+ if (wrap) wrappers.push(wrap);
+ }
+ });
+
+ const readVals = () => ({
+ last: inputs[0].value || '',
+ daily: inputs[1].value || '',
+ weekly: inputs[2].value || '',
+ monthly: inputs[3].value || '',
+ yearly: inputs[4].value || ''
+ });
+
+ const preset = backupRetentionDetectPreset(readVals());
+ const meta = BACKUP_RETENTION_PRESET_META[preset];
+ const presetOptions = this.retentionPresetOptions(preset, false);
+
+ const block = document.createElement('div');
+ block.className = 'backup-retention-preset-block';
+ block.innerHTML = `
+
+ Backup style ℹ️
+ ${presetOptions}
+
+ `;
+
+ const fieldsGrid = section.querySelector('.config-fields');
+ if (fieldsGrid) {
+ fieldsGrid.prepend(block);
+ } else {
+ section.prepend(block);
+ }
+
+ const applyVisibility = (presetKey) => {
+ const isCustom = presetKey === 'custom';
+ wrappers.forEach(w => { if (w) w.style.display = isCustom ? '' : 'none'; });
+ };
+ applyVisibility(preset);
+
+ const select = block.querySelector('[data-backup-retention-preset]');
+ const tooltipEl = block.querySelector('[data-retention-tooltip]');
+ select.addEventListener('change', () => {
+ const chosen = select.value;
+ if (tooltipEl) tooltipEl.title = BACKUP_RETENTION_PRESET_META[chosen]?.hint || '';
+ applyVisibility(chosen);
+ if (chosen === 'custom') return;
+ const p = BACKUP_RETENTION_PRESETS[chosen];
+ const map = { last: 0, daily: 1, weekly: 2, monthly: 3, yearly: 4 };
+ Object.entries(map).forEach(([k, i]) => {
+ inputs[i].value = p[k];
+ inputs[i].dispatchEvent(new Event('input', { bubbles: true }));
+ inputs[i].dispatchEvent(new Event('change', { bubbles: true }));
+ });
+ });
+ },
+ retentionPresetOptions(selected, includeInherit = false) {
+ const defaultKey = includeInherit ? 'inherit-global' : 'self-hosting';
+ const keys = Object.keys(BACKUP_RETENTION_PRESET_META)
+ .filter(k => k !== 'inherit-global' || includeInherit);
+ const ordered = [defaultKey, ...keys.filter(k => k !== defaultKey)];
+ return ordered.map(k => {
+ const base = BACKUP_RETENTION_PRESET_META[k].label;
+ const label = k === defaultKey ? `${base} (default)` : base;
+ return `${this.escape(label)} `;
+ }).join('');
+ },
+ applyRetentionPreset(selectEl) {
+ const block = selectEl.closest('[data-retention-prefix]');
+ const advanced = block?.nextElementSibling;
+ if (!block) return;
+ const prefix = block.dataset.retentionPrefix;
+ const allowInherit = block.dataset.retentionAllowInherit === '1';
+ const preset = selectEl.value;
+ const tooltipEl = block.querySelector('[data-retention-tooltip]');
+ if (tooltipEl) tooltipEl.title = BACKUP_RETENTION_PRESET_META[preset]?.hint || '';
+
+ if (preset === 'custom') {
+ if (advanced) advanced.hidden = false;
+ } else {
+ if (advanced) advanced.hidden = true;
+ const p = BACKUP_RETENTION_PRESETS[preset];
+ if (p) {
+ const setField = (suffix, value) => {
+ const el = document.querySelector(`[name="${prefix}${suffix}"]`);
+ if (el) {
+ el.value = value;
+ el.dispatchEvent(new Event('input', { bubbles: true }));
+ }
+ };
+ setField('KEEP_LAST', p.last);
+ setField('KEEP_DAILY', p.daily);
+ setField('KEEP_WEEKLY', p.weekly);
+ setField('KEEP_MONTHLY', p.monthly);
+ setField('KEEP_YEARLY', p.yearly);
+ }
+ }
+
+ // Keep CUSTOM_RETENTION in sync with the preset (location scope only).
+ if (allowInherit) {
+ const cr = block.querySelector(`[name="${prefix}CUSTOM_RETENTION"]`);
+ if (cr) cr.value = preset === 'inherit-global' ? 'false' : 'true';
+ }
+ },
+});
diff --git a/containers/libreportal/frontend/components/backup/js/backup-snapshot-actions.js b/containers/libreportal/frontend/components/backup/js/backup-snapshot-actions.js
new file mode 100644
index 0000000..3d5c605
--- /dev/null
+++ b/containers/libreportal/frontend/components/backup/js/backup-snapshot-actions.js
@@ -0,0 +1,147 @@
+// Auto-extracted from backup-page.js (verbatim) — augments BackupPage.prototype. Loaded after the base.
+Object.assign(BackupPage.prototype, {
+ openRestoreModal(app, locIdx, snapshot) {
+ const locName = this.locName(locIdx);
+ const modal = document.getElementById('backup-restore-modal');
+ const body = document.getElementById('backup-restore-modal-body');
+ if (!modal || !body) return;
+ body.innerHTML = `
+ Restore ${this.escape(app)} from backup ${this.escape(snapshot)} at ${this.escape(locName)} ?
+ The app will be stopped, its folder wiped, the backup restored in place, then the app started again. App-specific pre/post-restore hooks run if present.
+ `;
+ modal.dataset.app = app;
+ modal.dataset.locIdx = locIdx;
+ modal.dataset.snapshot = snapshot;
+ modal.classList.add('open');
+ },
+ openDeleteModal(app, locIdx, snapshot) {
+ const locName = this.locName(locIdx);
+ const modal = document.getElementById('backup-delete-modal');
+ const body = document.getElementById('backup-delete-modal-body');
+ if (!modal || !body) return;
+ body.innerHTML = `
+ Delete backup ${this.escape(snapshot)} for ${this.escape(app)} from ${this.escape(locName)} ?
+ This cannot be undone. Append-only locations will reject the operation.
+ `;
+ modal.dataset.app = app;
+ modal.dataset.locIdx = locIdx;
+ modal.dataset.snapshot = snapshot;
+ modal.classList.add('open');
+ },
+ async confirmRestore() {
+ const modal = document.getElementById('backup-restore-modal');
+ const { app, locIdx, snapshot } = modal.dataset;
+ this.closeAllModals();
+ await this.runTask(`libreportal restore app start ${app} ${snapshot} ${locIdx}`, 'restore', app);
+ },
+ async confirmDelete() {
+ const modal = document.getElementById('backup-delete-modal');
+ const { app, locIdx, snapshot } = modal.dataset;
+ this.closeAllModals();
+ await this.runTask(`libreportal backup app delete ${app} ${locIdx}:${snapshot}`, 'backup', app);
+ },
+ async runBackupAllApps() {
+ await this.runTask(`libreportal backup all`, 'backup', null);
+ },
+ async runBackupSystem() {
+ await this.runTask(`libreportal backup system`, 'backup', null);
+ },
+ async confirmRestoreSystem() {
+ if (!confirm('Restore the latest system-config snapshot?\n\nIt is restored into a staging folder (not applied) — review it, then copy what you need (e.g. backup-location credentials, login, settings) into the live config. Your running config is NOT overwritten.')) return;
+ await this.runTask(`libreportal restore system`, 'restore', null);
+ },
+ openBackupPickModal(opts = {}) {
+ const modal = document.getElementById('backup-pick-modal');
+ const body = document.getElementById('backup-pick-modal-body');
+ if (!modal || !body) return;
+
+ const apps = this.dashboard?.apps || [];
+ const sys = this.dashboard?.system || {};
+ const preTickSystem = !!opts.preTickSystem;
+ const preTickApps = new Set(opts.preTickApps || []);
+
+ // System row at the top — uses the LibrePortal icon to match the
+ // dashboard tile. Then every installed app, alphabetical.
+ const sortedApps = apps.slice().sort((a, b) => a.app.localeCompare(b.app));
+
+ const row = (key, iconSrc, label, sub, checked) => `
+
+
+
${this.escape(label)}
+
${this.escape(sub)}
+
+ `;
+
+ const sysSub = sys.latest_snapshot
+ ? 'Last backed up ' + this.formatRelative(sys.latest_time)
+ : 'No backup yet';
+
+ const rows = [
+ row('__system__', '/core/icons/apps/libreportal.svg', 'Configs', sysSub, preTickSystem),
+ ...sortedApps.map(app => {
+ const meta = this.appMeta(app.app);
+ const sub = app.latest_snapshot
+ ? 'Last backed up ' + this.formatRelative(app.latest_time)
+ : 'No backup yet';
+ return row(app.app, meta.icon, meta.displayName, sub, preTickApps.has(app.app));
+ })
+ ].join('');
+
+ body.innerHTML = `
+
+ Pick what to snapshot. Each selection runs in the background and shows up on the Tasks page.
+
+
+ ${rows}
+ `;
+
+ // The select-all / clear links live inside the modal body so we wire
+ // them once here per open (they get rebuilt every open, no listener
+ // leak).
+ body.querySelectorAll('[data-pick-action]').forEach(a => {
+ a.addEventListener('click', (e) => {
+ e.preventDefault();
+ const all = a.dataset.pickAction === 'select-all';
+ body.querySelectorAll('.backup-pick-cb').forEach(cb => { cb.checked = all; });
+ });
+ });
+
+ modal.classList.add('open');
+ },
+ async confirmBackupPick() {
+ const modal = document.getElementById('backup-pick-modal');
+ if (!modal) return;
+ const selected = Array.from(modal.querySelectorAll('.backup-pick-cb:checked'))
+ .map(cb => cb.value);
+ if (!selected.length) {
+ this.notify('Pick at least one thing to back up.', 'error');
+ return;
+ }
+ this.closeAllModals();
+
+ const apps = this.dashboard?.apps || [];
+ const totalThings = apps.length + 1; // +1 for system
+ const wantsSystem = selected.includes('__system__');
+ const appSlugs = selected.filter(s => s !== '__system__');
+
+ // Whole-fleet shortcut — `backup all` queues a single task and also
+ // covers system, instead of N+1 separate tasks. Requires at least one
+ // app so a system-only pick never collapses into "backup all".
+ if (wantsSystem && apps.length > 0 && appSlugs.length === apps.length) {
+ await this.runTask('libreportal backup all', 'backup', null);
+ return;
+ }
+ if (wantsSystem) {
+ await this.runTask('libreportal backup system', 'backup', null);
+ }
+ for (const slug of appSlugs) {
+ await this.runTask(`libreportal backup app create ${slug}`, 'backup', slug);
+ }
+ },
+});
diff --git a/containers/libreportal/frontend/components/backup/js/backup-snapshots.js b/containers/libreportal/frontend/components/backup/js/backup-snapshots.js
new file mode 100644
index 0000000..bf8067d
--- /dev/null
+++ b/containers/libreportal/frontend/components/backup/js/backup-snapshots.js
@@ -0,0 +1,144 @@
+// Auto-extracted from backup-page.js (verbatim) — augments BackupPage.prototype. Loaded after the base.
+Object.assign(BackupPage.prototype, {
+ renderSnapshots() {
+ const list = document.getElementById('backup-snapshot-list');
+ if (!list) return;
+
+ const filter = (document.getElementById('backup-snapshot-filter')?.value || '').toLowerCase();
+ const locFilter = document.getElementById('backup-snapshot-repo')?.value || '';
+
+ const locNameByIdx = {};
+ (this.locations?.locations || []).forEach(l => { locNameByIdx[l.idx] = l.name; });
+
+ const rows = [];
+ Object.entries(this.snapshotsByLoc).forEach(([locIdx, data]) => {
+ if (locFilter && String(locFilter) !== String(locIdx)) return;
+ const snaps = Array.isArray(data?.snapshots) ? data.snapshots : [];
+ snaps.forEach(s => {
+ const app = (s.tags || []).map(t => /^app=/.test(t) ? t.slice(4) : null).find(Boolean) || '—';
+ rows.push({
+ app,
+ host: s.hostname || '—',
+ locIdx,
+ locName: locNameByIdx[locIdx] || `Loc ${locIdx}`,
+ time: s.time,
+ id: s.short_id || (s.id || '').slice(0, 8),
+ tags: Array.isArray(s.tags) ? s.tags : [],
+ paths: Array.isArray(s.paths) ? s.paths : [],
+ });
+ });
+ });
+
+ rows.sort((a, b) => String(b.time).localeCompare(String(a.time)));
+
+ const filtered = filter ? rows.filter(r =>
+ r.app.toLowerCase().includes(filter) ||
+ r.host.toLowerCase().includes(filter) ||
+ r.id.toLowerCase().includes(filter) ||
+ r.locName.toLowerCase().includes(filter)
+ ) : rows;
+
+ if (!filtered.length) {
+ list.innerHTML = `No backups yet.
`;
+ return;
+ }
+
+ list.innerHTML = filtered.map(r => this._renderSnapshotRow(r)).join('');
+ },
+ // Render one global-Snapshots-tab backup as the same .task-item card
+ // the per-app Backups tab uses, so the two surfaces look identical.
+ // Extras vs the per-app card:
+ // - An app-name chip (because the global list isn't scoped to one app)
+ // that doubles as a deep-link to /app//backups?snapshot=
+ // - A Delete action alongside Restore (per-app card only offers
+ // Restore — delete lives in the global view)
+ _renderSnapshotRow(r) {
+ const hasApp = r.app && r.app !== '—';
+ const deepLink = hasApp
+ ? `/app/${encodeURIComponent(r.app)}/backups?snapshot=${encodeURIComponent(r.id)}`
+ : null;
+ const iconUrl = hasApp ? `/core/icons/apps/${encodeURIComponent(r.app)}.svg` : '/core/icons/apps/libreportal.svg';
+ const displayName = hasApp ? this.appMeta(r.app).displayName : 'Configs';
+ const appChip = hasApp
+ ? `${this.escape(displayName)} `
+ : `${this.escape(displayName)} `;
+ const sid = String(r.id);
+
+ // Restic stamps app=/host=/engine= into the snapshot tags; surface
+ // those as their own fields and keep any remaining tags as chips.
+ const tagMap = {};
+ (r.tags || []).forEach(t => { const i = t.indexOf('='); if (i > 0) tagMap[t.slice(0, i)] = t.slice(i + 1); });
+ const engineName = tagMap.engine ? this.engineDisplayName(tagMap.engine) : null;
+ const otherTags = (r.tags || []).filter(t => !/^(app|host|engine|paths?)=/.test(t));
+ const field = (label, valueHtml) =>
+ `${label} ${valueHtml}
`;
+
+ return `
+ `;
+ },
+ _fmtShortTime(iso) {
+ if (!iso) return '';
+ const d = new Date(iso);
+ if (isNaN(d.getTime())) return String(iso);
+ return d.toLocaleString();
+ },
+ _fmtFullTime(iso) {
+ if (!iso) return '';
+ const d = new Date(iso);
+ if (isNaN(d.getTime())) return String(iso);
+ return d.toString();
+ },
+ _fmtNiceTime(iso) {
+ if (!iso) return '';
+ const d = new Date(iso);
+ if (isNaN(d.getTime())) return String(iso);
+ return d.toLocaleString(undefined, { dateStyle: 'medium', timeStyle: 'short' });
+ },
+});
diff --git a/containers/libreportal/frontend/components/backup/js/backup-ssh-key.js b/containers/libreportal/frontend/components/backup/js/backup-ssh-key.js
new file mode 100644
index 0000000..be6f2e7
--- /dev/null
+++ b/containers/libreportal/frontend/components/backup/js/backup-ssh-key.js
@@ -0,0 +1,49 @@
+// Auto-extracted from backup-page.js (verbatim) — augments BackupPage.prototype. Loaded after the base.
+Object.assign(BackupPage.prototype, {
+ renderBackupSshKeyCard(l) {
+ const idx = l.idx;
+ const hasKey = l.ssh_key_exists === true;
+ const pub = l.ssh_public_key || '';
+ const body = hasKey ? `
+ Add this public key to the remote server's ~/.ssh/authorized_keys:
+
+
+ Copy public key
+ Delete key
+
` : `
+ Paste an existing private key, or generate one and we'll show the public key to add on the remote.
+
+
+ Save key
+ Generate keypair
+
`;
+ return `
+
+
+ SSH key
+ ${hasKey ? '✓ Key configured' : 'No key yet'}
+
+ ${body}
+
+