Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(journals): implement background auto-save for status and security fields

Browse Source 
- Refactored handle_update_journal and handle_update_entry to support non-closing background persistence.
- Implemented strict payload whitelisting for journal and journal_entry updates to resolve HTTP 400 schema errors.
- Added onchange triggers to enable, hide, priority, and sort fields for real-time background syncing.
- Standardized 'Status & Security' tab labeling across configuration components.
This commit is contained in:
Scott Idem
2026-01-14 19:08:37 -05:00
parent dbb45e10ae
commit 98cd35078d
2 changed files with 65 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/routes/journals/ae_comp__journal_obj_id_edit.svelte
View File

@@ -92,7 +92,7 @@
} }
}); });
async function handle_update_journal() { async function handle_update_journal(close_modal: boolean = true) {
if (!tmp__journal_obj.name || !tmp__journal_obj.type_code) { if (!tmp__journal_obj.name || !tmp__journal_obj.type_code) {
alert('Please provide both name and type for the journal.'); alert('Please provide both name and type for the journal.');
return; return;
@@ -127,8 +127,7 @@
default_private: tmp__journal_obj.default_private, default_private: tmp__journal_obj.default_private,
default_public: tmp__journal_obj.default_public, default_public: tmp__journal_obj.default_public,
default_personal: tmp__journal_obj.default_personal, default_personal: tmp__journal_obj.default_personal,
default_professional: tmp__journal_obj.default_professional, default_professional: tmp__journal_obj.default_professional
code: tmp__journal_obj.code
}; };
await journals_func.update_ae_obj__journal({ await journals_func.update_ae_obj__journal({
@@ -137,10 +136,11 @@
data_kv: data_kv, data_kv: data_kv,
log_lvl: log_lvl log_lvl: log_lvl
}); });
show = false;
if (close_modal) show = false;
} catch (error) { } catch (error) {
console.error('Error updating journal:', error); console.error('Error updating journal:', error);
alert('Failed to update journal.'); if (close_modal) alert('Failed to update journal.');
} }
} }
@@ -277,21 +277,21 @@
</h2> </h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10"> <label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10">
<input type="checkbox" bind:checked={tmp__journal_obj.enable} class="checkbox checkbox-primary" /> <input type="checkbox" bind:checked={tmp__journal_obj.enable} onchange={() => handle_update_journal(false)} class="checkbox checkbox-primary" />
<div class="flex flex-col"> <div class="flex flex-col">
<span class="font-bold">Enabled</span> <span class="font-bold">Enabled</span>
<span class="text-xs opacity-60">Allow access to this journal</span> <span class="text-xs opacity-60">Allow access to this journal</span>
</div> </div>
</label> </label>
<label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10"> <label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10">
<input type="checkbox" bind:checked={tmp__journal_obj.hide} class="checkbox checkbox-primary" /> <input type="checkbox" bind:checked={tmp__journal_obj.hide} onchange={() => handle_update_journal(false)} class="checkbox checkbox-primary" />
<div class="flex flex-col"> <div class="flex flex-col">
<span class="font-bold">Hidden</span> <span class="font-bold">Hidden</span>
<span class="text-xs opacity-60">Hide from standard lists</span> <span class="text-xs opacity-60">Hide from standard lists</span>
</div> </div>
</label> </label>
<label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10"> <label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10">
<input type="checkbox" bind:checked={tmp__journal_obj.priority} class="checkbox checkbox-primary" /> <input type="checkbox" bind:checked={tmp__journal_obj.priority} onchange={() => handle_update_journal(false)} class="checkbox checkbox-primary" />
<div class="flex flex-col"> <div class="flex flex-col">
<span class="font-bold">Priority Journal</span> <span class="font-bold">Priority Journal</span>
<span class="text-xs opacity-60">Star or pin to top</span> <span class="text-xs opacity-60">Star or pin to top</span>
@@ -303,9 +303,9 @@
<span class="text-xs opacity-60">Manual list position</span> <span class="text-xs opacity-60">Manual list position</span>
</div> </div>
<div class="flex items-center gap-2"> <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; }}><Minus size="1em"/></button> <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> <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; }}><Plus size="1em"/></button> <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> </div>
</div> </div>
@@ -509,7 +509,7 @@
<button class="btn variant-ghost-surface font-bold min-w-[100px]" onclick={() => (show = false)}> <button class="btn variant-ghost-surface font-bold min-w-[100px]" onclick={() => (show = false)}>
<X size="1.2em" class="mr-2" /> Cancel <X size="1.2em" class="mr-2" /> Cancel
</button> </button>
<button class="btn variant-filled-primary font-bold shadow-lg min-w-[120px]" onclick={handle_update_journal}> <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 <Check size="1.2em" class="mr-2" /> Save Changes
</button> </button>
</div> </div>

67
src/routes/journals/modal_journal_entry_config.svelte
View File

@@ -27,6 +27,7 @@
import { Modal } from 'flowbite-svelte'; import { Modal } from 'flowbite-svelte';
import { ae_loc, ae_api } from '$lib/stores/ae_stores'; import { ae_loc, ae_api } from '$lib/stores/ae_stores';
import { journals_loc, journals_sess } from '$lib/ae_journals/ae_journals_stores'; import { journals_loc, journals_sess } from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import E_app_codemirror_v5 from '$lib/app_components/e_app_codemirror_v5.svelte'; import E_app_codemirror_v5 from '$lib/app_components/e_app_codemirror_v5.svelte';
import AE_ObjectFlags from '$lib/ae_elements/AE_ObjectFlags.svelte'; import AE_ObjectFlags from '$lib/ae_elements/AE_ObjectFlags.svelte';
@@ -59,6 +60,46 @@
let tab: 'actions' | 'meta' | 'security' | 'json' = $state('actions'); let tab: 'actions' | 'meta' | 'security' | 'json' = $state('actions');
const normalize_date = (val: string | null) => val ? val.slice(0, 16) : null; const normalize_date = (val: string | null) => val ? val.slice(0, 16) : null;
async function handle_update_entry() {
try {
// WHITELISTED BASE TABLE COLUMNS ONLY
const data_kv = {
name: tmp_entry_obj.name,
short_name: tmp_entry_obj.short_name,
summary: tmp_entry_obj.summary,
content: tmp_entry_obj.content,
category_code: tmp_entry_obj.category_code,
type_code: tmp_entry_obj.type_code,
topic_code: tmp_entry_obj.topic_code,
tags: tmp_entry_obj.tags,
private: tmp_entry_obj.private,
public: tmp_entry_obj.public,
personal: tmp_entry_obj.personal,
professional: tmp_entry_obj.professional,
alert: tmp_entry_obj.alert,
alert_msg: tmp_entry_obj.alert_msg,
enable: tmp_entry_obj.enable,
hide: tmp_entry_obj.hide,
priority: tmp_entry_obj.priority,
sort: tmp_entry_obj.sort,
group: tmp_entry_obj.group,
notes: tmp_entry_obj.notes,
archive_on: tmp_entry_obj.archive_on,
template: tmp_entry_obj.template,
data_json: tmp_entry_obj.data_json
};
await journals_func.update_ae_obj__journal_entry({
api_cfg: $ae_api,
journal_entry_id: tmp_entry_obj.journal_entry_id,
data_kv: data_kv,
log_lvl: log_lvl
});
} catch (error) {
console.error('Error updating journal entry:', error);
}
}
</script> </script>
<Modal <Modal
@@ -117,7 +158,7 @@
{#each journal?.cfg_json?.category_li ?? [] as cat} {#each journal?.cfg_json?.category_li ?? [] as cat}
<button <button
class="btn btn-sm {tmp_entry_obj.category_code === cat.code ? 'variant-filled-primary' : 'variant-soft-primary'}" class="btn btn-sm {tmp_entry_obj.category_code === cat.code ? 'variant-filled-primary' : 'variant-soft-primary'}"
onclick={() => { tmp_entry_obj.category_code = cat.code; onSave(); }} onclick={() => { tmp_entry_obj.category_code = cat.code; handle_update_entry(); onSave(); }}
> >
{cat.name} {cat.name}
</button> </button>
@@ -130,7 +171,7 @@
<div class="space-y-6 animate-in fade-in duration-300"> <div class="space-y-6 animate-in fade-in duration-300">
<label class="label"> <label class="label">
<span class="text-sm font-bold opacity-70">Category</span> <span class="text-sm font-bold opacity-70">Category</span>
<select class="select variant-form-material" bind:value={tmp_entry_obj.category_code} onchange={onSave}> <select class="select variant-form-material" bind:value={tmp_entry_obj.category_code} onchange={() => { handle_update_entry(); onSave(); }}>
<option value="">None</option> <option value="">None</option>
{#each journal?.cfg_json?.category_li ?? [] as cat} {#each journal?.cfg_json?.category_li ?? [] as cat}
<option value={cat.code}>{cat.name}</option> <option value={cat.code}>{cat.name}</option>
@@ -142,21 +183,21 @@
<span class="text-sm font-bold opacity-70">Tags (Comma separated)</span> <span class="text-sm font-bold opacity-70">Tags (Comma separated)</span>
<div class="flex gap-2 items-center"> <div class="flex gap-2 items-center">
<Tag size="1.2em" class="opacity-30" /> <Tag size="1.2em" class="opacity-30" />
<input type="text" bind:value={tmp_entry_obj.tags} class="input variant-form-material grow" placeholder="meeting, urgent, ideas" onchange={onSave} /> <input type="text" bind:value={tmp_entry_obj.tags} class="input variant-form-material grow" placeholder="meeting, urgent, ideas" onchange={() => { handle_update_entry(); onSave(); }} />
</div> </div>
</label> </label>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<label class="label"> <label class="label">
<span class="text-sm font-bold opacity-70">Archive On</span> <span class="text-sm font-bold opacity-70">Archive On</span>
<input type="datetime-local" value={normalize_date(tmp_entry_obj.archive_on)} onchange={(e) => { tmp_entry_obj.archive_on = e.currentTarget.value; onSave(); }} class="input variant-form-material" /> <input type="datetime-local" value={normalize_date(tmp_entry_obj.archive_on)} onchange={(e) => { tmp_entry_obj.archive_on = e.currentTarget.value; handle_update_entry(); onSave(); }} class="input variant-form-material" />
</label> </label>
<label class="label"> <label class="label">
<span class="text-sm font-bold opacity-70">Sort Priority</span> <span class="text-sm font-bold opacity-70">Sort Priority</span>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) - 1; onSave(); }}><Minus size="1em"/></button> <button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) - 1; handle_update_entry(); onSave(); }}><Minus size="1em"/></button>
<span class="font-mono font-bold w-8 text-center">{tmp_entry_obj.sort ?? 0}</span> <span class="font-mono font-bold w-8 text-center">{tmp_entry_obj.sort ?? 0}</span>
<button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) + 1; onSave(); }}><Plus size="1em"/></button> <button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) + 1; handle_update_entry(); onSave(); }}><Plus size="1em"/></button>
</div> </div>
</label> </label>
</div> </div>
@@ -167,25 +208,25 @@
<section class="space-y-4"> <section class="space-y-4">
<h2 class="text-lg font-bold flex items-center gap-2 border-b border-surface-500/30 pb-2"> <h2 class="text-lg font-bold flex items-center gap-2 border-b border-surface-500/30 pb-2">
<Fingerprint size="1.2em" class="text-primary-500" /> <Fingerprint size="1.2em" class="text-primary-500" />
Status & Lifecycle Status & Security
</h2> </h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10"> <label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10">
<input type="checkbox" bind:checked={tmp_entry_obj.enable} onchange={onSave} class="checkbox checkbox-primary" /> <input type="checkbox" bind:checked={tmp_entry_obj.enable} onchange={() => { handle_update_entry(); onSave(); }} class="checkbox checkbox-primary" />
<div class="flex flex-col"> <div class="flex flex-col">
<span class="font-bold">Enabled</span> <span class="font-bold">Enabled</span>
<span class="text-xs opacity-60">Allow access to this entry</span> <span class="text-xs opacity-60">Allow access to this entry</span>
</div> </div>
</label> </label>
<label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10"> <label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10">
<input type="checkbox" bind:checked={tmp_entry_obj.hide} onchange={onSave} class="checkbox checkbox-primary" /> <input type="checkbox" bind:checked={tmp_entry_obj.hide} onchange={() => { handle_update_entry(); onSave(); }} class="checkbox checkbox-primary" />
<div class="flex flex-col"> <div class="flex flex-col">
<span class="font-bold">Hidden</span> <span class="font-bold">Hidden</span>
<span class="text-xs opacity-60">Hide from standard lists</span> <span class="text-xs opacity-60">Hide from standard lists</span>
</div> </div>
</label> </label>
<label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10"> <label class="flex items-center space-x-3 cursor-pointer p-3 rounded-lg bg-surface-500/5 border border-surface-500/10 transition-colors hover:bg-surface-500/10">
<input type="checkbox" bind:checked={tmp_entry_obj.priority} onchange={onSave} class="checkbox checkbox-primary" /> <input type="checkbox" bind:checked={tmp_entry_obj.priority} onchange={() => { handle_update_entry(); onSave(); }} class="checkbox checkbox-primary" />
<div class="flex flex-col"> <div class="flex flex-col">
<span class="font-bold">Priority Entry</span> <span class="font-bold">Priority Entry</span>
<span class="text-xs opacity-60">Star or pin to top</span> <span class="text-xs opacity-60">Star or pin to top</span>
@@ -197,9 +238,9 @@
<span class="text-xs opacity-60">Manual list position</span> <span class="text-xs opacity-60">Manual list position</span>
</div> </div>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) - 1; onSave(); }}><Minus size="1em"/></button> <button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) - 1; handle_update_entry(); onSave(); }}><Minus size="1em"/></button>
<span class="font-mono font-bold w-8 text-center text-lg">{tmp_entry_obj.sort ?? 0}</span> <span class="font-mono font-bold w-8 text-center text-lg">{tmp_entry_obj.sort ?? 0}</span>
<button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) + 1; onSave(); }}><Plus size="1em"/></button> <button class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) + 1; handle_update_entry(); onSave(); }}><Plus size="1em"/></button>
</div> </div>
</div> </div>
</div> </div>
@@ -209,7 +250,7 @@
<h4 class="text-xs font-bold uppercase opacity-50">Privacy Flags</h4> <h4 class="text-xs font-bold uppercase opacity-50">Privacy Flags</h4>
<AE_ObjectFlags <AE_ObjectFlags
bind:obj={tmp_entry_obj} bind:obj={tmp_entry_obj}
onToggle={onSave} onToggle={() => { handle_update_entry(); onSave(); }}
hideAlert={journal?.cfg_json?.hide_btn_alert} hideAlert={journal?.cfg_json?.hide_btn_alert}
hidePrivate={journal?.cfg_json?.hide_btn_private} hidePrivate={journal?.cfg_json?.hide_btn_private}
hidePublic={journal?.cfg_json?.hide_btn_public} hidePublic={journal?.cfg_json?.hide_btn_public}