fix(journals): add type='button' to prevent form submission and migrate to V3 Action API for file downloads

This commit is contained in:
Scott Idem
2026-02-03 22:14:22 -05:00
parent 6abe4c897e
commit 281972cb5d
24 changed files with 104 additions and 132 deletions

View File

@@ -181,19 +181,19 @@
<div class="space-y-6 py-2 h-[75vh] overflow-y-auto px-4">
<!-- Navigation Tabs -->
<div class="flex justify-center gap-1 mb-4 p-1 bg-surface-500/10 rounded-lg max-w-fit mx-auto sticky top-0 z-10 backdrop-blur-sm">
<button class="btn btn-sm transition-all {tab === 'actions' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'actions')}>
<button type="button" class="btn btn-sm transition-all {tab === 'actions' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'actions')}>
<Zap size="1.1em" class="mr-1" /> Quick Actions
</button>
<button class="btn btn-sm transition-all {tab === 'general' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'general')}>
<button type="button" class="btn btn-sm transition-all {tab === 'general' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'general')}>
<Layout size="1.1em" class="mr-1" /> General
</button>
<button class="btn btn-sm transition-all {tab === 'security' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'security')}>
<button type="button" class="btn btn-sm transition-all {tab === 'security' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'security')}>
<ShieldCheck size="1.1em" class="mr-1" /> Status & Security
</button>
<button class="btn btn-sm transition-all {tab === 'ui' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'ui')}>
<button type="button" class="btn btn-sm transition-all {tab === 'ui' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'ui')}>
<Palette size="1.1em" class="mr-1" /> UI/Visuals
</button>
<button class="btn btn-sm transition-all {tab === 'json' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'json')}>
<button type="button" class="btn btn-sm transition-all {tab === 'json' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'json')}>
<CodeXml size="1.1em" class="mr-1" /> JSON
</button>
</div>
@@ -201,13 +201,13 @@
{#if tab === 'actions'}
<div class="space-y-6 animate-in fade-in duration-300">
<section class="grid grid-cols-1 md:grid-cols-2 gap-4">
<button class="btn variant-soft-secondary w-full py-4 text-lg font-bold" onclick={() => { show = false; on_new_entry?.(); }}>
<button type="button" class="btn variant-soft-secondary w-full py-4 text-lg font-bold" onclick={() => { show = false; on_new_entry?.(); }}>
<FilePlus size="1.5em" class="mr-2"/> New Journal Entry
</button>
<button class="btn variant-soft-surface w-full py-4" onclick={() => { show = false; on_show_export?.(); }}>
<button type="button" class="btn variant-soft-surface w-full py-4" onclick={() => { show = false; on_show_export?.(); }}>
<FileDown size="1.5em" class="mr-2"/> Export Entries
</button>
<button class="btn variant-soft-surface w-full py-4" onclick={() => { show = false; on_show_import?.(); }}>
<button type="button" class="btn variant-soft-surface w-full py-4" onclick={() => { show = false; on_show_import?.(); }}>
<FileUp size="1.5em" class="mr-2"/> Import Entries
</button>
</section>
@@ -252,12 +252,12 @@
<div class="flex gap-2 items-center">
<input type="text" bind:value={category.code} class="input input-sm w-32" placeholder="Code" />
<input type="text" bind:value={category.name} class="input input-sm grow" placeholder="Display Name" />
<button class="btn-icon btn-icon-sm variant-soft-error" onclick={() => { tmp__journal_obj.cfg_json.category_li.splice(i, 1); }}>
<button type="button" class="btn-icon btn-icon-sm variant-soft-error" onclick={() => { tmp__journal_obj.cfg_json.category_li.splice(i, 1); }}>
<Minus size="1em" />
</button>
</div>
{/each}
<button class="btn btn-sm variant-soft-primary w-full mt-2" onclick={() => {
<button type="button" class="btn btn-sm variant-soft-primary w-full mt-2" onclick={() => {
if(!tmp__journal_obj.cfg_json.category_li) tmp__journal_obj.cfg_json.category_li = [];
tmp__journal_obj.cfg_json.category_li.push({code: '', name: ''});
}}>
@@ -303,9 +303,9 @@
<span class="text-xs opacity-60">Manual list position</span>
</div>
<div class="flex items-center gap-2">
<button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp__journal_obj.sort = (tmp__journal_obj.sort ?? 0) - 1; handle_update_journal(false); }}><Minus size="1em"/></button>
<button type="button" class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp__journal_obj.sort = (tmp__journal_obj.sort ?? 0) - 1; handle_update_journal(false); }}><Minus size="1em"/></button>
<span class="font-mono font-bold w-8 text-center text-lg">{tmp__journal_obj.sort ?? 0}</span>
<button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp__journal_obj.sort = (tmp__journal_obj.sort ?? 0) + 1; handle_update_journal(false); }}><Plus size="1em"/></button>
<button type="button" class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp__journal_obj.sort = (tmp__journal_obj.sort ?? 0) + 1; handle_update_journal(false); }}><Plus size="1em"/></button>
</div>
</div>
</div>
@@ -339,7 +339,7 @@
</section>
<section class="pt-8">
<button class="btn btn-sm variant-filled-error w-full shadow-lg" onclick={delete_journal}>
<button type="button" class="btn btn-sm variant-filled-error w-full shadow-lg" onclick={delete_journal}>
<Trash2 size="1.1em" class="mr-2" /> Delete Entire Journal
</button>
</section>
@@ -505,10 +505,10 @@
{#snippet footer()}
<div class="flex gap-4">
<button class="btn variant-ghost-surface font-bold min-w-[100px]" onclick={() => (show = false)}>
<button type="button" class="btn variant-ghost-surface font-bold min-w-[100px]" onclick={() => (show = false)}>
<X size="1.2em" class="mr-2" /> Cancel
</button>
<button class="btn variant-filled-primary font-bold shadow-lg min-w-[120px]" onclick={() => handle_update_journal(true)}>
<button type="button" class="btn variant-filled-primary font-bold shadow-lg min-w-[120px]" onclick={() => handle_update_journal(true)}>
<Check size="1.2em" class="mr-2" /> Save Changes
</button>
</div>