Webstar/LibrePortal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui(backup): replace delete-location native confirm() with the backup-modal pattern

Browse Source 
The inline "Delete location" action was the last spot on the Backup
page still using the native browser confirm() — the snapshot delete
already uses the styled backup-modal, so the location delete sat out
as the odd one. Adds a new #backup-delete-location-modal matching the
existing modal shell (header / body / backup-danger-btn footer),
swaps deleteInlineLocation() to open it instead of confirm(), and
wires the confirm button to a new confirmDeleteLocation() that does
the actual `libreportal backup location remove <idx>` task.

Behaviour is the same — confirm body text moves into the modal as a
muted hint paragraph using backup-card-hint, location name bolded
for scannability. expandedLocs cleanup also moves into the confirm
handler so the row collapses only when the user actually deletes.

Signed-off-by: librelad <librelad@digitalangels.vip>
This commit is contained in:
librelad 2026-05-28 00:11:07 +01:00
parent 513937792a
commit bbd4014f8c
2 changed files with 32 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
containers/libreportal/frontend/html/backup-content.html
View File

@ -216,6 +216,20 @@
</div>
</div>
<div class="backup-modal" id="backup-delete-location-modal">
<div class="backup-modal-inner">
<div class="backup-modal-header">
<h3>Delete backup location</h3>
<button class="backup-modal-close" data-close-modal>×</button>
</div>
<div class="backup-modal-body" id="backup-delete-location-modal-body"></div>
<div class="backup-modal-footer">
<button class="backup-secondary-btn" data-close-modal>Cancel</button>
<button class="backup-danger-btn" id="backup-delete-location-confirm">Delete location</button>
</div>
</div>
</div>
<div class="backup-modal" id="backup-migrate-modal">
<div class="backup-modal-inner">
<div class="backup-modal-header">

20
containers/libreportal/frontend/js/components/backup/backup-page.js
View File

@ -293,6 +293,7 @@ class BackupPage {
if (e.target.closest('#backup-migrate-confirm')) { this.confirmMigrate(); return; }
if (e.target.closest('#backup-restore-confirm')) { this.confirmRestore(); return; }
if (e.target.closest('#backup-delete-confirm')) { this.confirmDelete(); return; }
if (e.target.closest('#backup-delete-location-confirm')) { this.confirmDeleteLocation(); return; }
if (e.target.closest('#backup-add-location-confirm')) { this.confirmAddLocation(); return; }
const engineBtn = e.target.closest('[data-action="open-engine-details"]');
if (engineBtn) { this.openEngineDetailsModal(engineBtn); return; }
@ -965,10 +966,25 @@ class BackupPage {
await this.saveSection(`location-${idx}`);
}
async deleteInlineLocation(idx) {
deleteInlineLocation(idx) {
const loc = (this.locations?.locations || []).find(l => l.idx === idx);
const name = loc?.name || `Location ${idx}`;
if (!confirm(`Delete location "${name}"?\n\nBackup data already stored at this location is not deleted — only LibrePortal's reference to it. The password file on disk also stays in place.`)) return;
const modal = document.getElementById('backup-delete-location-modal');
const body = document.getElementById('backup-delete-location-modal-body');
if (!modal || !body) return;
body.innerHTML = `
<p>Delete location <strong>${this.escape(name)}</strong>?</p>
<p class="backup-card-hint">Backup data already stored at this location is not deleted — only LibrePortal's reference to it. The password file on disk also stays in place.</p>
`;
modal.dataset.locIdx = String(idx);
modal.classList.add('open');
}
async confirmDeleteLocation() {
const modal = document.getElementById('backup-delete-location-modal');
if (!modal) return;
const idx = parseInt(modal.dataset.locIdx, 10);
this.closeAllModals();
this.expandedLocs.delete(idx);
await this.runTask(`libreportal backup location remove ${idx}`, 'backup', null);
setTimeout(() => this.reloadAfterSave(), 2000);