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

Prettier for Journals

Browse Source
This commit is contained in:
Scott Idem
2026-03-24 12:25:22 -04:00
parent e1338b1a72
commit b74c6d0e9c
25 changed files with 3983 additions and 4238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

352
src/routes/journals/ae_comp__modal_journal_entry_config.svelte
View File

@@ -1,89 +1,108 @@
<script lang="ts">
/**
* ae_comp__modal_journal_entry_config.svelte
* Standardized Journal Entry-level configuration.
*/
import { ArrowDownToLine, ArrowUpToLine, Check, Clock, CodeXml, Copy, Database, FileDown, Fingerprint, Minus, Plus, RefreshCcw, Settings, Shapes, ShieldCheck, Tag, Trash2, X, Zap } from '@lucide/svelte';
import { Modal } from 'flowbite-svelte';
import { ae_loc, ae_api } from '$lib/stores/ae_stores';
import {
journals_loc,
journals_sess
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import AE_Comp_Editor_CodeMirror from '$lib/elements/element_editor_codemirror.svelte';
import AE_Object_Flags from '$lib/ae_elements/AE_Object_Flags.svelte';
/**
* ae_comp__modal_journal_entry_config.svelte
* Standardized Journal Entry-level configuration.
*/
import {
ArrowDownToLine,
ArrowUpToLine,
Check,
Clock,
CodeXml,
Copy,
Database,
FileDown,
Fingerprint,
Minus,
Plus,
RefreshCcw,
Settings,
Shapes,
ShieldCheck,
Tag,
Trash2,
X,
Zap
} from '@lucide/svelte';
import { Modal } from 'flowbite-svelte';
import { ae_loc, ae_api } from '$lib/stores/ae_stores';
import {
journals_loc,
journals_sess
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import AE_Comp_Editor_CodeMirror from '$lib/elements/element_editor_codemirror.svelte';
import AE_Object_Flags from '$lib/ae_elements/AE_Object_Flags.svelte';
interface Props {
log_lvl?: number;
show?: boolean;
entry: any;
journal: any;
tmp_entry_obj: any; // Bindable
on_save: () => void;
on_force_reset?: () => void;
on_show_export?: () => void;
on_append?: () => void;
on_prepend?: () => void;
}
let {
log_lvl = $bindable(0),
show = $bindable(false),
entry,
journal,
tmp_entry_obj = $bindable(),
on_save,
on_force_reset,
on_show_export,
on_append,
on_prepend
}: Props = $props();
let tab: 'actions' | 'meta' | 'security' | 'json' = $state('actions');
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);
}
interface Props {
log_lvl?: number;
show?: boolean;
entry: any;
journal: any;
tmp_entry_obj: any; // Bindable
on_save: () => void;
on_force_reset?: () => void;
on_show_export?: () => void;
on_append?: () => void;
on_prepend?: () => void;
}
let {
log_lvl = $bindable(0),
show = $bindable(false),
entry,
journal,
tmp_entry_obj = $bindable(),
on_save,
on_force_reset,
on_show_export,
on_append,
on_prepend
}: Props = $props();
let tab: 'actions' | 'meta' | 'security' | 'json' = $state('actions');
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>
<Modal
@@ -92,32 +111,32 @@
dismissable={false}
placement="top-center"
size="lg"
class="relative flex flex-col mx-auto w-full bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200 border border-orange-300 dark:border-orange-700 rounded-lg shadow-xl"
class="relative mx-auto flex w-full flex-col rounded-lg border border-orange-300 bg-white text-gray-800 shadow-xl dark:border-orange-700 dark:bg-gray-800 dark:text-gray-200"
headerClass="flex flex-row gap-2 items-center justify-between w-full bg-orange-100 dark:bg-orange-900 p-4 rounded-t-lg border-b border-orange-200 dark:border-orange-800"
footerClass="flex flex-row gap-2 items-center justify-center w-full bg-orange-100 dark:bg-orange-900 p-4 rounded-b-lg border-t border-orange-200 dark:border-orange-800"
>
footerClass="flex flex-row gap-2 items-center justify-center w-full bg-orange-100 dark:bg-orange-900 p-4 rounded-b-lg border-t border-orange-200 dark:border-orange-800">
{#snippet header()}
<h3 class="flex-1 flex items-center gap-2 text-lg font-bold">
<h3 class="flex flex-1 items-center gap-2 text-lg font-bold">
<Settings class="text-primary-500" />
<span>Entry Config: {tmp_entry_obj.name || '--'}</span>
</h3>
<button type="button" class="btn-icon btn-icon-sm preset-tonal-surface ml-2" onclick={() => (show = false)}>
<button
type="button"
class="btn-icon btn-icon-sm preset-tonal-surface ml-2"
onclick={() => (show = false)}>
<X size="1.1em" />
</button>
{/snippet}
<div class="space-y-6 py-2 h-[60vh] overflow-y-auto px-4">
<div class="h-[60vh] space-y-6 overflow-y-auto px-4 py-2">
<!-- 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"
>
class="bg-surface-500/10 sticky top-0 z-10 mx-auto mb-4 flex max-w-fit justify-center gap-1 rounded-lg p-1 backdrop-blur-sm">
<button
type="button"
class="btn btn-sm transition-all {tab === 'actions'
? 'preset-filled-primary'
: 'preset-tonal-surface'}"
onclick={() => (tab = 'actions')}
>
onclick={() => (tab = 'actions')}>
<Zap size="1.1em" class="mr-1" /> Quick Actions
</button>
<button
@@ -125,8 +144,7 @@
class="btn btn-sm transition-all {tab === 'meta'
? 'preset-filled-primary'
: 'preset-tonal-surface'}"
onclick={() => (tab = 'meta')}
>
onclick={() => (tab = 'meta')}>
<Shapes size="1.1em" class="mr-1" /> Metadata
</button>
<button
@@ -134,8 +152,7 @@
class="btn btn-sm transition-all {tab === 'security'
? 'preset-filled-primary'
: 'preset-tonal-surface'}"
onclick={() => (tab = 'security')}
>
onclick={() => (tab = 'security')}>
<ShieldCheck size="1.1em" class="mr-1" /> Status & Security
</button>
<button
@@ -143,23 +160,21 @@
class="btn btn-sm transition-all {tab === 'json'
? 'preset-filled-primary'
: 'preset-tonal-surface'}"
onclick={() => (tab = 'json')}
>
onclick={() => (tab = 'json')}>
<CodeXml size="1.1em" class="mr-1" /> JSON
</button>
</div>
{#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">
<div class="animate-in fade-in space-y-6 duration-300">
<section class="grid grid-cols-1 gap-4 md:grid-cols-2">
<button
type="button"
class="btn preset-tonal-secondary w-full"
onclick={() => {
show = false;
on_prepend?.();
}}
>
}}>
<ArrowUpToLine size="1.2em" class="mr-2" /> Prepend Content
</button>
<button
@@ -168,8 +183,7 @@
onclick={() => {
show = false;
on_append?.();
}}
>
}}>
<ArrowDownToLine size="1.2em" class="mr-2" /> Append Content
</button>
<button
@@ -178,8 +192,7 @@
onclick={() => {
show = false;
on_show_export?.();
}}
>
}}>
<FileDown size="1.2em" class="mr-2" /> Export Entry
</button>
<button
@@ -189,13 +202,12 @@
/* Clone logic here */ alert(
'Clone not yet implemented in modal'
);
}}
>
}}>
<Copy size="1.2em" class="mr-2" /> Clone Entry
</button>
</section>
<section class="space-y-4 pt-4 border-t border-surface-500/20">
<section class="border-surface-500/20 space-y-4 border-t pt-4">
<h4 class="text-xs font-bold uppercase opacity-50">
Quick Category
</h4>
@@ -211,8 +223,7 @@
tmp_entry_obj.category_code = cat.code;
handle_update_entry();
on_save();
}}
>
}}>
{cat.name}
</button>
{/each}
@@ -220,7 +231,7 @@
</section>
</div>
{:else if tab === 'meta'}
<div class="space-y-6 animate-in fade-in duration-300">
<div class="animate-in fade-in space-y-6 duration-300">
<label class="label">
<span class="text-sm font-bold opacity-70">Category</span>
<select
@@ -229,8 +240,7 @@
onchange={() => {
handle_update_entry();
on_save();
}}
>
}}>
<option value="">None</option>
{#each journal?.cfg_json?.category_li ?? [] as cat (cat.code)}
<option value={cat.code}>{cat.name}</option>
@@ -240,9 +250,8 @@
<label class="label">
<span class="text-sm font-bold opacity-70"
>Tags (Comma separated)</span
>
<div class="flex gap-2 items-center">
>Tags (Comma separated)</span>
<div class="flex items-center gap-2">
<Tag size="1.2em" class="opacity-30" />
<input
type="text"
@@ -252,16 +261,14 @@
onchange={() => {
handle_update_entry();
on_save();
}}
/>
}} />
</div>
</label>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<label class="label">
<span class="text-sm font-bold opacity-70"
>Archive On</span
>
>Archive On</span>
<input
type="datetime-local"
value={normalize_date(tmp_entry_obj.archive_on)}
@@ -271,13 +278,11 @@
handle_update_entry();
on_save();
}}
class="input"
/>
class="input" />
</label>
<label class="label">
<span class="text-sm font-bold opacity-70"
>Sort Priority</span
>
>Sort Priority</span>
<div class="flex items-center gap-2">
<button
type="button"
@@ -287,11 +292,9 @@
(tmp_entry_obj.sort ?? 0) - 1;
handle_update_entry();
on_save();
}}><Minus size="1em" /></button
>
<span class="font-mono font-bold w-8 text-center"
>{tmp_entry_obj.sort ?? 0}</span
>
}}><Minus size="1em" /></button>
<span class="w-8 text-center font-mono font-bold"
>{tmp_entry_obj.sort ?? 0}</span>
<button
type="button"
class="btn-icon btn-icon-sm preset-tonal-surface"
@@ -300,25 +303,22 @@
(tmp_entry_obj.sort ?? 0) + 1;
handle_update_entry();
on_save();
}}><Plus size="1em" /></button
>
}}><Plus size="1em" /></button>
</div>
</label>
</div>
</div>
{:else if tab === 'security'}
<div class="space-y-6 animate-in fade-in duration-300">
<div class="animate-in fade-in space-y-6 duration-300">
<section class="space-y-4">
<h2
class="text-lg font-bold flex items-center gap-2 border-b border-surface-500/30 pb-2"
>
class="border-surface-500/30 flex items-center gap-2 border-b pb-2 text-lg font-bold">
<Fingerprint size="1.2em" class="text-primary-500" />
Status & Security
</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<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"
>
class="bg-surface-500/5 border-surface-500/10 hover:bg-surface-500/10 flex cursor-pointer items-center space-x-3 rounded-lg border p-3 transition-colors">
<input
type="checkbox"
bind:checked={tmp_entry_obj.enable}
@@ -326,18 +326,15 @@
handle_update_entry();
on_save();
}}
class="checkbox checkbox-primary"
/>
class="checkbox checkbox-primary" />
<div class="flex flex-col">
<span class="font-bold">Enabled</span>
<span class="text-xs opacity-60"
>Allow access to this entry</span
>
>Allow access to this entry</span>
</div>
</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"
>
class="bg-surface-500/5 border-surface-500/10 hover:bg-surface-500/10 flex cursor-pointer items-center space-x-3 rounded-lg border p-3 transition-colors">
<input
type="checkbox"
bind:checked={tmp_entry_obj.hide}
@@ -345,18 +342,15 @@
handle_update_entry();
on_save();
}}
class="checkbox checkbox-primary"
/>
class="checkbox checkbox-primary" />
<div class="flex flex-col">
<span class="font-bold">Hidden</span>
<span class="text-xs opacity-60"
>Hide from standard lists</span
>
>Hide from standard lists</span>
</div>
</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"
>
class="bg-surface-500/5 border-surface-500/10 hover:bg-surface-500/10 flex cursor-pointer items-center space-x-3 rounded-lg border p-3 transition-colors">
<input
type="checkbox"
bind:checked={tmp_entry_obj.priority}
@@ -364,24 +358,20 @@
handle_update_entry();
on_save();
}}
class="checkbox checkbox-primary"
/>
class="checkbox checkbox-primary" />
<div class="flex flex-col">
<span class="font-bold">Priority Entry</span>
<span class="text-xs opacity-60"
>Star or pin to top</span
>
>Star or pin to top</span>
</div>
</label>
<div
class="flex items-center justify-between p-3 rounded-lg bg-surface-500/5 border border-surface-500/10"
>
class="bg-surface-500/5 border-surface-500/10 flex items-center justify-between rounded-lg border p-3">
<div class="flex flex-col">
<span class="font-bold text-sm">Sort Order</span
>
<span class="text-sm font-bold"
>Sort Order</span>
<span class="text-xs opacity-60"
>Manual list position</span
>
>Manual list position</span>
</div>
<div class="flex items-center gap-2">
<button
@@ -392,12 +382,10 @@
(tmp_entry_obj.sort ?? 0) - 1;
handle_update_entry();
on_save();
}}><Minus size="1em" /></button
>
}}><Minus size="1em" /></button>
<span
class="font-mono font-bold w-8 text-center text-lg"
>{tmp_entry_obj.sort ?? 0}</span
>
class="w-8 text-center font-mono text-lg font-bold"
>{tmp_entry_obj.sort ?? 0}</span>
<button
type="button"
class="btn-icon btn-icon-sm preset-tonal-surface"
@@ -406,8 +394,7 @@
(tmp_entry_obj.sort ?? 0) + 1;
handle_update_entry();
on_save();
}}><Plus size="1em" /></button
>
}}><Plus size="1em" /></button>
</div>
</div>
</div>
@@ -429,21 +416,18 @@
hide_personal={journal?.cfg_json?.hide_btn_personal}
hide_professional={journal?.cfg_json
?.hide_btn_professional}
hide_template={journal?.cfg_json?.hide_btn_template}
/>
hide_template={journal?.cfg_json?.hide_btn_template} />
</section>
{#if tmp_entry_obj.private && !tmp_entry_obj.content && tmp_entry_obj.content_encrypted}
<section class="pt-8 border-t border-error-500/20">
<section class="border-error-500/20 border-t pt-8">
<div
class="bg-error-500/10 p-4 rounded-lg border border-error-500/30"
>
class="bg-error-500/10 border-error-500/30 rounded-lg border p-4">
<h4
class="text-error-500 font-bold flex items-center gap-2 mb-2"
>
class="text-error-500 mb-2 flex items-center gap-2 font-bold">
<RefreshCcw size="1.2em" /> Disaster Recovery
</h4>
<p class="text-xs opacity-70 mb-4 italic">
<p class="mb-4 text-xs italic opacity-70">
If the encryption passcode is lost, the data is
unrecoverable. You can force a reset to plain
text to reuse this entry ID.
@@ -454,8 +438,7 @@
onclick={() => {
show = false;
on_force_reset?.();
}}
>
}}>
Force Reset to Plain Text
</button>
</div>
@@ -468,8 +451,7 @@
class="btn btn-sm preset-tonal-error w-full"
onclick={() => {
alert('Delete logic handled in parent component');
}}
>
}}>
<Trash2 size="1.1em" class="mr-2" /> Delete Entry
</button>
</section>
@@ -480,8 +462,7 @@
readonly={true}
content={JSON.stringify(tmp_entry_obj, null, 2)}
theme_mode={$ae_loc.theme_mode}
class_li="rounded-lg border border-surface-500/30"
/>
class_li="rounded-lg border border-surface-500/30" />
</div>
{/if}
</div>
@@ -489,9 +470,8 @@
{#snippet footer()}
<button
type="button"
class="btn preset-filled-primary font-bold min-w-[120px]"
onclick={() => (show = false)}
>
class="btn preset-filled-primary min-w-[120px] font-bold"
onclick={() => (show = false)}>
<Check size="1.2em" class="mr-2" />
Done
</button>