style(journals): apply expanded 80-width formatting and snake_case
- Batch formatted all Journals module files using Prettier with printWidth: 80. - Refactored preventDefault to prevent_default across all Svelte components. - Standardized line breaks for imports and long attribute lists for better readability. - Ensured consistent snake_case naming for internal identifiers.
This commit is contained in:
Scott Idem
@@ -26,7 +26,10 @@
|
||||
} 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_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/AE_Comp_Editor_CodeMirror.svelte';
|
||||
import AE_Object_Flags from '$lib/ae_elements/AE_Object_Flags.svelte';
|
||||
@@ -59,7 +62,8 @@
|
||||
|
||||
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 {
|
||||
@@ -120,17 +124,43 @@
|
||||
|
||||
<div class="space-y-6 py-2 h-[60vh] 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 type="button" class="btn btn-sm transition-all {tab === 'actions' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'actions')}>
|
||||
<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
|
||||
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 type="button" class="btn btn-sm transition-all {tab === 'meta' ? 'variant-filled-primary' : 'variant-soft-surface'}" onclick={() => (tab = 'meta')}>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm transition-all {tab === 'meta'
|
||||
? 'variant-filled-primary'
|
||||
: 'variant-soft-surface'}"
|
||||
onclick={() => (tab = 'meta')}
|
||||
>
|
||||
<Shapes size="1.1em" class="mr-1" /> Metadata
|
||||
</button>
|
||||
<button type="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 type="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>
|
||||
@@ -138,27 +168,66 @@
|
||||
{#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 type="button" class="btn variant-soft-secondary w-full" onclick={() => { show = false; on_prepend?.(); }}>
|
||||
<ArrowUpToLine size="1.2em" class="mr-2"/> Prepend Content
|
||||
<button
|
||||
type="button"
|
||||
class="btn variant-soft-secondary w-full"
|
||||
onclick={() => {
|
||||
show = false;
|
||||
on_prepend?.();
|
||||
}}
|
||||
>
|
||||
<ArrowUpToLine size="1.2em" class="mr-2" /> Prepend Content
|
||||
</button>
|
||||
<button type="button" class="btn variant-soft-secondary w-full" onclick={() => { show = false; on_append?.(); }}>
|
||||
<ArrowDownToLine size="1.2em" class="mr-2"/> Append Content
|
||||
<button
|
||||
type="button"
|
||||
class="btn variant-soft-secondary w-full"
|
||||
onclick={() => {
|
||||
show = false;
|
||||
on_append?.();
|
||||
}}
|
||||
>
|
||||
<ArrowDownToLine size="1.2em" class="mr-2" /> Append Content
|
||||
</button>
|
||||
<button type="button" class="btn variant-soft-surface w-full" onclick={() => { show = false; on_show_export?.(); }}>
|
||||
<FileDown size="1.2em" class="mr-2"/> Export Entry
|
||||
<button
|
||||
type="button"
|
||||
class="btn variant-soft-surface w-full"
|
||||
onclick={() => {
|
||||
show = false;
|
||||
on_show_export?.();
|
||||
}}
|
||||
>
|
||||
<FileDown size="1.2em" class="mr-2" /> Export Entry
|
||||
</button>
|
||||
<button type="button" class="btn variant-soft-surface w-full" onclick={() => { /* Clone logic here */ alert('Clone not yet implemented in modal'); }}>
|
||||
<Copy size="1.2em" class="mr-2"/> Clone Entry
|
||||
<button
|
||||
type="button"
|
||||
class="btn variant-soft-surface w-full"
|
||||
onclick={() => {
|
||||
/* 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">
|
||||
<h4 class="text-xs font-bold uppercase opacity-50">Quick Category</h4>
|
||||
<h4 class="text-xs font-bold uppercase opacity-50">
|
||||
Quick Category
|
||||
</h4>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
{#each journal?.cfg_json?.category_li ?? [] as cat}
|
||||
<button type="button"
|
||||
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; handle_update_entry(); on_save(); }}
|
||||
<button
|
||||
type="button"
|
||||
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;
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
>
|
||||
{cat.name}
|
||||
</button>
|
||||
@@ -166,12 +235,18 @@
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
{:else if tab === 'meta'}
|
||||
<div class="space-y-6 animate-in fade-in duration-300">
|
||||
<label class="label">
|
||||
<span class="text-sm font-bold opacity-70">Category</span>
|
||||
<select class="select variant-form-material" bind:value={tmp_entry_obj.category_code} onchange={() => { handle_update_entry(); on_save(); }}>
|
||||
<select
|
||||
class="select variant-form-material"
|
||||
bind:value={tmp_entry_obj.category_code}
|
||||
onchange={() => {
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
>
|
||||
<option value="">None</option>
|
||||
{#each journal?.cfg_json?.category_li ?? [] as cat}
|
||||
<option value={cat.code}>{cat.name}</option>
|
||||
@@ -180,94 +255,223 @@
|
||||
</label>
|
||||
|
||||
<label class="label">
|
||||
<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">
|
||||
<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={() => { handle_update_entry(); on_save(); }} />
|
||||
<input
|
||||
type="text"
|
||||
bind:value={tmp_entry_obj.tags}
|
||||
class="input variant-form-material grow"
|
||||
placeholder="meeting, urgent, ideas"
|
||||
onchange={() => {
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<label class="label">
|
||||
<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; handle_update_entry(); on_save(); }} class="input variant-form-material" />
|
||||
<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;
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
class="input variant-form-material"
|
||||
/>
|
||||
</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">
|
||||
<button type="button" class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (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>
|
||||
<button type="button" class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) + 1; handle_update_entry(); on_save(); }}><Plus size="1em"/></button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon btn-icon-sm variant-soft-surface"
|
||||
onclick={() => {
|
||||
tmp_entry_obj.sort =
|
||||
(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
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon btn-icon-sm variant-soft-surface"
|
||||
onclick={() => {
|
||||
tmp_entry_obj.sort =
|
||||
(tmp_entry_obj.sort ?? 0) + 1;
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}><Plus size="1em" /></button
|
||||
>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{:else if tab === 'security'}
|
||||
<div class="space-y-6 animate-in fade-in 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">
|
||||
<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" />
|
||||
Status & Security
|
||||
</h2>
|
||||
<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">
|
||||
<input type="checkbox" bind:checked={tmp_entry_obj.enable} onchange={() => { handle_update_entry(); on_save(); }} class="checkbox checkbox-primary" />
|
||||
<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={() => {
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
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>
|
||||
<span class="text-xs opacity-60"
|
||||
>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">
|
||||
<input type="checkbox" bind:checked={tmp_entry_obj.hide} onchange={() => { handle_update_entry(); on_save(); }} class="checkbox checkbox-primary" />
|
||||
<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={() => {
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
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>
|
||||
<span class="text-xs opacity-60"
|
||||
>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">
|
||||
<input type="checkbox" bind:checked={tmp_entry_obj.priority} onchange={() => { handle_update_entry(); on_save(); }} class="checkbox checkbox-primary" />
|
||||
<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={() => {
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
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>
|
||||
<span class="text-xs opacity-60"
|
||||
>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">
|
||||
<div
|
||||
class="flex items-center justify-between p-3 rounded-lg bg-surface-500/5 border border-surface-500/10"
|
||||
>
|
||||
<div class="flex flex-col">
|
||||
<span class="font-bold text-sm">Sort Order</span>
|
||||
<span class="text-xs opacity-60">Manual list position</span>
|
||||
<span class="font-bold text-sm">Sort Order</span
|
||||
>
|
||||
<span class="text-xs opacity-60"
|
||||
>Manual list position</span
|
||||
>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<button type="button" class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (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 text-lg">{tmp_entry_obj.sort ?? 0}</span>
|
||||
<button type="button" class="btn-icon btn-icon-sm variant-soft-surface" onclick={() => { tmp_entry_obj.sort = (tmp_entry_obj.sort ?? 0) + 1; handle_update_entry(); on_save(); }}><Plus size="1em"/></button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon btn-icon-sm variant-soft-surface"
|
||||
onclick={() => {
|
||||
tmp_entry_obj.sort =
|
||||
(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 text-lg"
|
||||
>{tmp_entry_obj.sort ?? 0}</span
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-icon btn-icon-sm variant-soft-surface"
|
||||
onclick={() => {
|
||||
tmp_entry_obj.sort =
|
||||
(tmp_entry_obj.sort ?? 0) + 1;
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}><Plus size="1em" /></button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="space-y-4">
|
||||
<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_Object_Flags
|
||||
bind:obj={tmp_entry_obj}
|
||||
on_toggle={() => { handle_update_entry(); on_save(); }}
|
||||
on_toggle={() => {
|
||||
handle_update_entry();
|
||||
on_save();
|
||||
}}
|
||||
hide_alert={journal?.cfg_json?.hide_btn_alert}
|
||||
hide_private={journal?.cfg_json?.hide_btn_private}
|
||||
hide_public={journal?.cfg_json?.hide_btn_public}
|
||||
hide_personal={journal?.cfg_json?.hide_btn_personal}
|
||||
hide_professional={journal?.cfg_json?.hide_btn_professional}
|
||||
hide_professional={journal?.cfg_json
|
||||
?.hide_btn_professional}
|
||||
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">
|
||||
<div class="bg-error-500/10 p-4 rounded-lg border border-error-500/30">
|
||||
<h4 class="text-error-500 font-bold flex items-center gap-2 mb-2">
|
||||
<div
|
||||
class="bg-error-500/10 p-4 rounded-lg border border-error-500/30"
|
||||
>
|
||||
<h4
|
||||
class="text-error-500 font-bold flex items-center gap-2 mb-2"
|
||||
>
|
||||
<RefreshCcw size="1.2em" /> Disaster Recovery
|
||||
</h4>
|
||||
<p class="text-xs opacity-70 mb-4 italic">If the encryption passcode is lost, the data is unrecoverable. You can force a reset to plain text to reuse this entry ID.</p>
|
||||
<button type="button" class="btn btn-sm variant-filled-error w-full font-bold" onclick={() => { show = false; on_force_reset?.(); }}>
|
||||
<p class="text-xs opacity-70 mb-4 italic">
|
||||
If the encryption passcode is lost, the data is
|
||||
unrecoverable. You can force a reset to plain
|
||||
text to reuse this entry ID.
|
||||
</p>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm variant-filled-error w-full font-bold"
|
||||
onclick={() => {
|
||||
show = false;
|
||||
on_force_reset?.();
|
||||
}}
|
||||
>
|
||||
Force Reset to Plain Text
|
||||
</button>
|
||||
</div>
|
||||
@@ -275,12 +479,17 @@
|
||||
{/if}
|
||||
|
||||
<section class="pt-12">
|
||||
<button type="button" class="btn btn-sm variant-soft-error w-full" onclick={() => { alert('Delete logic handled in parent component'); }}>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm variant-soft-error w-full"
|
||||
onclick={() => {
|
||||
alert('Delete logic handled in parent component');
|
||||
}}
|
||||
>
|
||||
<Trash2 size="1.1em" class="mr-2" /> Delete Entry
|
||||
</button>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
{:else if tab === 'json'}
|
||||
<div class="h-full min-h-[400px]">
|
||||
<AE_Comp_Editor_CodeMirror
|
||||
@@ -294,9 +503,13 @@
|
||||
</div>
|
||||
|
||||
{#snippet footer()}
|
||||
<button type="button" class="btn variant-filled-primary font-bold shadow-lg min-w-[120px]" onclick={() => (show = false)}>
|
||||
<button
|
||||
type="button"
|
||||
class="btn variant-filled-primary font-bold shadow-lg min-w-[120px]"
|
||||
onclick={() => (show = false)}
|
||||
>
|
||||
<Check size="1.2em" class="mr-2" />
|
||||
Done
|
||||
</button>
|
||||
{/snippet}
|
||||
</Modal>
|
||||
</Modal>
|
||||
|
||||
Reference in New Issue
Block a user