refactor(storage): replace hardcoded IDB lists with indexedDB.databases() in all clear buttons

Consistent with the tech help panel update — all Clear Storage / Clear & Reload
buttons now enumerate IDB databases dynamically so new modules are included
automatically without needing to update these lists.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-05-14 18:23:29 -04:00
parent c4e2e64a7e
commit 48a748d314
3 changed files with 48 additions and 34 deletions

View File

@@ -217,26 +217,26 @@ function handle_clear_storage(item: null | string) {
</button> </button>
<button <button
class="btn btn-sm preset-tonal-warning" class="btn btn-sm preset-tonal-warning"
title="Clear the browser storage for this page" title="Full Reset: Delete ALL IndexedDB databases, clear localStorage and sessionStorage for this origin, then reload."
onclick={() => { onclick={async () => {
if ( if (
!confirm( !confirm(
'Are you sure you want to clear the local and session storage?' 'FULL RESET: Delete ALL IndexedDB databases, clear localStorage and sessionStorage, then reload? This cannot be undone.'
) )
) { ) {
return false; return;
}
const db_list = await indexedDB.databases();
console.log('[clear_all] IDB databases found:', db_list.map((d) => d.name));
for (const db of db_list) {
if (db.name) indexedDB.deleteDatabase(db.name);
} }
// Clear the local and session storage
localStorage.clear(); localStorage.clear();
sessionStorage.clear(); sessionStorage.clear();
// Clear Indexed DB as well
indexedDB.deleteDatabase('ae_core_db');
indexedDB.deleteDatabase('ae_events_db');
window.location.reload(); window.location.reload();
// alert('Local and Session Storage cleared and Indexed DBs deleted. You will probably want to refresh the page.');
}}> }}>
<Eraser size="1em" class="mx-1" /> <Eraser size="1em" class="mx-1" />
Clear Storage & DB Clear Storage & DB

View File

@@ -80,22 +80,21 @@ function toggle_theme_mode() {
// DOM sync (class) is handled reactively in +layout.svelte effect #3 // DOM sync (class) is handled reactively in +layout.svelte effect #3
} }
// ── Dev: clear all browser storage + key IndexedDB tables, then reload ── // ── Dev: clear all browser storage + all IndexedDB databases, then reload ──
function handle_clear_storage_db() { async function handle_clear_storage_db() {
if ( if (
!confirm( !confirm(
'Clear all local/session storage and IndexedDB? The page will reload.' 'FULL RESET: Delete ALL IndexedDB databases, clear localStorage and sessionStorage, then reload? This cannot be undone.'
) )
) )
return; return;
const db_list = await indexedDB.databases();
console.log('[clear_all] IDB databases found:', db_list.map((d) => d.name));
for (const db of db_list) {
if (db.name) indexedDB.deleteDatabase(db.name);
}
localStorage.clear(); localStorage.clear();
sessionStorage.clear(); sessionStorage.clear();
indexedDB.deleteDatabase('ae_archives_db');
indexedDB.deleteDatabase('ae_core_db');
indexedDB.deleteDatabase('ae_events_db');
indexedDB.deleteDatabase('ae_journals_db');
indexedDB.deleteDatabase('ae_posts_db');
indexedDB.deleteDatabase('ae_sponsorships_db');
window.location.reload(); window.location.reload();
} }

View File

@@ -88,43 +88,58 @@ onMount(() => {
class="flex flex-row flex-wrap items-center justify-center"> class="flex flex-row flex-wrap items-center justify-center">
<button <button
type="button" type="button"
onclick={() => { onclick={async () => {
const edit_mode = $ae_loc.edit_mode;
const confirm_msg = edit_mode
? 'Clear all IDB caches, localStorage, and sessionStorage? Your sign-in will be preserved. This will reload the page.'
: 'Clear all IDB caches? This will reload the page.';
if (!confirm(confirm_msg)) return;
const db_list = await indexedDB.databases();
for (const db of db_list) {
if (db.name) indexedDB.deleteDatabase(db.name);
}
if (edit_mode) {
const ae_loc_saved = localStorage.getItem('ae_loc');
localStorage.clear();
sessionStorage.clear();
if (ae_loc_saved) localStorage.setItem('ae_loc', ae_loc_saved);
}
window.location.reload(); window.location.reload();
}} }}
class="btn btn-sm preset-tonal-surface hover:preset-outlined-warning text-error-300 hover:text-error-800 m-1 transition-all" class="btn btn-sm preset-tonal-surface hover:preset-outlined-warning text-error-300 hover:text-error-800 m-1 transition-all"
title="Reload page to clear some caches and check for updates"> title="Clear & Reload: Delete all IDB caches and reload. In edit mode also clears localStorage/sessionStorage, preserving your sign-in.">
<!-- <span class="fas fa-sync mx-1"></span> --> <!-- <span class="fas fa-sync mx-1"></span> -->
<RefreshCw class="mx-1" /> <RefreshCw class="mx-1" />
Reload Reload
</button> </button>
<button <button
type="button" type="button"
onclick={() => { onclick={async () => {
if ( if (
!confirm( !confirm(
'Are you sure you want to clear IndexedDB databases, localStorage, and sessionStorage? This will also reload the page.' 'FULL RESET: Delete ALL IndexedDB databases, clear localStorage and sessionStorage, then reload? This cannot be undone.'
) )
) { ) {
return; return;
} }
// Clear Indexed DB
indexedDB.deleteDatabase('ae_archives_db'); // Archives module const db_list = await indexedDB.databases();
indexedDB.deleteDatabase('ae_core_db'); console.log('[clear_all] IDB databases found:', db_list.map((d) => d.name));
indexedDB.deleteDatabase('ae_events_db'); // Events module for (const db of db_list) {
indexedDB.deleteDatabase('ae_journals_db'); // Journals module if (db.name) indexedDB.deleteDatabase(db.name);
indexedDB.deleteDatabase('ae_posts_db'); // Posts module }
indexedDB.deleteDatabase('ae_sponsorships_db'); // Sponsorships module
localStorage.clear(); localStorage.clear();
sessionStorage.clear(); sessionStorage.clear();
alert(
'Local and Session Storage cleared. The page should now refresh on its own.'
);
window.location.reload(); window.location.reload();
}} }}
class="btn btn-sm preset-tonal-surface hover:preset-outlined-warning text-error-300 hover:text-error-800 m-1 p-1 transition-all" class="btn btn-sm preset-tonal-surface hover:preset-outlined-warning text-error-300 hover:text-error-800 m-1 p-1 transition-all"
title="Clear IDB, localStorage, and sessionStorage and then reload to clear the page cache"> title="Full Reset: Delete ALL IndexedDB databases, clear localStorage and sessionStorage for this origin, then reload.">
<!-- <span class="fas fa-sync mx-1"></span> --> <!-- <span class="fas fa-sync mx-1"></span> -->
<RefreshCcwDot class="mx-1" /> <RefreshCcwDot class="mx-1" />
Clear Storage and Reload Clear Storage and Reload