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

style(journals): standardize and stabilize 'Config' interfaces across all levels

Browse Source
This commit is contained in:
Scott Idem
2026-01-14 18:52:45 -05:00
parent 0108e28f59
commit dbb45e10ae
6 changed files with 102 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/routes/journals/+page.svelte
View File

@@ -144,7 +144,7 @@
onclick={() => $journals_sess.show__modal__journals_config = true}
>
<Wrench size="1.2em" class="mr-2" />
<span>Configure</span>
<span>Config</span>
</button>
</nav>
{/if}

4
src/routes/journals/JournalEntry_Header.svelte
View File

@@ -118,12 +118,12 @@
<div class="w-[1px] h-6 bg-surface-500/20 mx-1"></div>
<!-- Unified Settings Button -->
<!-- Unified Config Button -->
<button
class="btn btn-sm variant-soft-primary font-bold"
onclick={onShowConfig}
>
<Settings size="1.1em" class="mr-2" /> Settings
<Settings size="1.1em" class="mr-2" /> Config
</button>
<!-- Explicit Save (Mobile/Backup) -->

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

@@ -24,6 +24,8 @@
MessageSquareWarning,
Copy,
FilePlus,
FileDown,
FileUp,
Globe,
BookHeart,
BriefcaseBusiness,
@@ -34,7 +36,8 @@
X,
Settings,
CalendarClock,
MousePointerClick
MousePointerClick,
Zap
} from '@lucide/svelte';
import { Modal } from 'flowbite-svelte';
import { goto } from '$app/navigation';
@@ -57,16 +60,22 @@
log_lvl?: number;
lq__journal_obj: any;
show?: boolean;
onNewEntry?: () => void;
onShowExport?: () => void;
onShowImport?: () => void;
}
let {
log_lvl = $bindable(0),
lq__journal_obj,
show = $bindable(false)
show = $bindable(false),
onNewEntry,
onShowExport,
onShowImport
}: Props = $props();
// *** Internal State
let tab: 'general' | 'security' | 'ui' | 'json' = $state('general');
let tab: 'actions' | 'general' | 'security' | 'ui' | 'json' = $state('actions');
let tmp__journal_obj: any = $state({});
// Deep copy on mount or when lq changes to ensure we have a working copy
@@ -118,7 +127,8 @@
default_private: tmp__journal_obj.default_private,
default_public: tmp__journal_obj.default_public,
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({
@@ -163,14 +173,17 @@
>
{#snippet header()}
<h3 class="flex items-center gap-2 text-lg font-bold">
<BookOpenText class="text-primary-500" />
<span>Edit Journal: {$lq__journal_obj?.name ?? '--'}</span>
<Settings class="text-primary-500" />
<span>Journal Config: {$lq__journal_obj?.name ?? '--'}</span>
</h3>
{/snippet}
<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')}>
<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')}>
<Layout size="1.1em" class="mr-1" /> General
</button>
@@ -185,7 +198,22 @@
</button>
</div>
{#if tab === 'general'}
{#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; onNewEntry?.(); }}>
<FilePlus size="1.5em" class="mr-2"/> New Journal Entry
</button>
<button class="btn variant-soft-surface w-full py-4" onclick={() => { show = false; onShowExport?.(); }}>
<FileDown size="1.5em" class="mr-2"/> Export Entries
</button>
<button class="btn variant-soft-surface w-full py-4" onclick={() => { show = false; onShowImport?.(); }}>
<FileUp size="1.5em" class="mr-2"/> Import Entries
</button>
</section>
</div>
{:else if tab === 'general'}
<div class="space-y-6 animate-in fade-in duration-300">
<!-- Core Meta -->
<section class="grid grid-cols-1 gap-4 p-2">

257
src/routes/journals/ae_comp__journal_obj_id_view.svelte
View File

@@ -3,7 +3,7 @@
import { goto } from '$app/navigation';
// *** Import other supporting libraries
import { BookPlus, BookOpenText, FilePlus, Menu, Pencil, FileDown, FileUp } from '@lucide/svelte';
import { BookPlus, BookOpenText, FilePlus, Menu, Pencil, FileDown, FileUp, Settings } from '@lucide/svelte';
// *** Import Aether specific variables and functions
import { ae_util } from '$lib/ae_utils/ae_utils';
@@ -24,6 +24,7 @@
journals_prom
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import Journal_obj_id_edit from './ae_comp__journal_obj_id_edit.svelte';
interface Props {
log_lvl?: number;
@@ -40,7 +41,6 @@
// let ae_trigger: any = null;
// let ae_triggers: key_val = {};
let show_menu: boolean = $state(false);
let typed_journal_passcode: string = $state('');
let passcode_timer: any = $state(null);
@@ -119,6 +119,33 @@
} else {
}
}
async function handle_new_entry() {
let data_kv = {
category_code: null
};
if ($journals_loc.qry__category_code) {
data_kv.category_code = $journals_loc.qry__category_code;
}
try {
const results = await journals_func.create_ae_obj__journal_entry({
api_cfg: $ae_api,
journal_id: $lq__journal_obj?.journal_id,
data_kv: data_kv,
log_lvl: log_lvl
});
if (results?.journal_entry_id_random) {
$journals_slct.journal_entry_id = results.journal_entry_id_random;
$journals_loc.entry.edit_kv[$journals_slct.journal_entry_id] = 'current';
goto(`/journals/${$lq__journal_obj?.journal_id}/entry/${results.journal_entry_id_random}`);
}
} catch (error) {
console.error('Error creating journal entry:', error);
alert('Failed to create new journal entry.');
}
}
</script>
<section
@@ -147,213 +174,32 @@
</h2>
<div class="grow flex flex-row flex-wrap gap-2 items-center justify-end">
<section class="relative transition-all">
<!-- Menu Button -->
<button
type="button"
onclick={() => (show_menu = !show_menu)}
class="
btn
variant-outline-secondary hover:preset-filled-secondary-400-600
py-1 px-2 w-24
transition-all
"
title="Toggle menu"
>
<Menu size="1.5em" class="inline-block" />
<span class="hidden md:inline">Menu</span>
</button>
<!-- Simplified Config Trigger -->
<button
type="button"
onclick={() => ($journals_sess.show__modal_edit__journal_obj = true)}
class="btn variant-filled-secondary py-1 px-3 shadow-md"
title="Journal Config & Actions"
>
<Settings size="1.2em" class="mr-2" />
<span class="hidden md:inline">Config</span>
</button>
<!-- Menu -->
<!-- {#if show_menu} -->
<div
class="
absolute top-12 right-0
p-4 z-50 w-80
space-y-0.5
bg-white dark:bg-gray-800
border border-gray-500
shadow-xl rounded-lg
min-w-72
max-w-fit
"
class:hidden={!show_menu}
>
<div
class="
flex flex-row flex-wrap items-center justify-evenly gap-2 w-full
"
>
<span class="text-sm text-gray-500">
<span class="fas fa-info-circle text-blue-500"></span>
Journal ID: {$lq__journal_obj?.id}
</span>
<button
type="button"
onclick={() => {
// $journals_sess.show__modal_new__journal_entry_obj = true
// log_lvl = 3;
let data_kv = {
category_code: null
};
if ($journals_loc.qry__category_code) {
data_kv.category_code = $journals_loc.qry__category_code;
}
if (log_lvl) {
console.log(
'Creating new journal entry with data_kv:',
data_kv
);
}
journals_func
.create_ae_obj__journal_entry({
api_cfg: $ae_api,
journal_id: $lq__journal_obj?.journal_id,
data_kv: data_kv,
log_lvl: log_lvl
})
.then((results) => {
if (log_lvl) {
console.log('New journal entry created:', results);
}
$journals_slct.journal_entry_id =
results?.journal_entry_id_random;
// $journals_loc.entry.edit = true;
$journals_loc.entry.edit_kv[
$journals_slct.journal_entry_id
] = 'current';
// alert(`Journal entry created successfully! ${$journals_slct.journal_entry_id}`);
})
.catch((error) => {
console.error('Error updating journal entry:', error);
alert('Failed to update journal entry.');
})
.finally(() => {
if ($journals_slct.journal_entry_id) {
goto(
`/journals/${$lq__journal_obj?.journal_id}/entry/${$journals_slct.journal_entry_id}`
);
} else {
alert('Failed to create new journal entry.');
}
});
}}
class="
btn btn-sm
preset-tonal-secondary border border-secondary-500
hover:preset-filled-secondary-500
transition
"
title="Create a new journal entry for this journal: {$lq__journal_obj?.name}"
>
<FilePlus />
<!-- <span class="fas fa-plus m-1"></span> -->
<span class="hidden sm:inline"> New Journal Entry </span>
</button>
<button
type="button"
onclick={() => {
$journals_slct.tmp_journal_obj = {
name: $lq__journal_obj?.name,
description: $lq__journal_obj?.description,
type_code: $lq__journal_obj?.type_code,
passcode: $lq__journal_obj?.passcode,
passcode_timeout: $lq__journal_obj?.passcode_timeout,
auth_key: $lq__journal_obj?.auth_key,
cfg_json: $lq__journal_obj?.cfg_json
};
$journals_sess.show__modal_edit__journal_obj = true;
}}
class:hidden={!$ae_loc.edit_mode}
class="
btn btn-sm
preset-tonal-warning border border-warning-500
hover:preset-filled-warning-500
transition
"
title="Edit Journal meta and configuration (name, type, passcode, categories, etc.: {$lq__journal_obj?.name})"
>
<Pencil />
<span class="hidden md:inline"> Edit Journal </span>
</button>
{#if $lq__journal_entry_obj_li && $lq__journal_entry_obj_li.length > 0}
<button
type="button"
onclick={() => {
show_menu = false;
onShowExport?.();
}}
class="
btn btn-sm
preset-tonal-secondary border border-secondary-500
hover:preset-filled-secondary-500
transition
"
title="Export journal entries"
>
<FileDown />
<span class="hidden md:inline"> Export Entries </span>
</button>
{/if}
<button
type="button"
onclick={() => {
show_menu = false;
onShowImport?.();
}}
class="
btn btn-sm
preset-tonal-secondary border border-secondary-500
hover:preset-filled-secondary-500
transition
"
title="Import journal entries from files"
>
<FileUp />
<span class="hidden md:inline"> Import Entries </span>
</button>
</div>
<!-- Set Journal private_passcode (string) -->
<!-- The Journal private_passcode will be used along with the Journal passcode to encrypt the journal entries. -->
<!-- Passcode Verification (Condensed) -->
{#if !$journals_sess?.journal_kv[$lq__journal_obj?.id]?.journal_passcode_verified}
<div class="flex gap-1">
<input
type="text"
type="password"
bind:value={typed_journal_passcode}
placeholder="Journal passcode"
onchange={() => {
// console.log('HERE');
// verify_journal_passcode();
}}
class="input input-sm input-bordered w-full mb-2"
title="Enter private passcode of this journal"
placeholder="Passcode"
class="input input-sm variant-form-material w-32"
/>
{#if $journals_sess?.journal_kv[$lq__journal_obj?.id]?.journal_passcode_verified}
<div class="text-sm text-gray-500">
<span class="fas fa-check-circle text-green-500"></span>
Journal passcode verified
</div>
{:else}
<div class="text-sm text-gray-500">
<span class="fas fa-exclamation-circle text-red-500"></span>
Journal passcode not verified {$lq__journal_obj?.private_passcode ??
'??'}
</div>
{/if}
</div>
<!-- {/if} -->
</section>
{/if}
</div>
</header>
<!-- Show Journal description -->
<!-- class:bg-green-100={$lq__journal_obj?.cfg_json.color_scheme ?? 'green'} -->
<!-- prose-h1:text-gray-100 dark:prose-h1:text-gray-900 -->
<!-- <div> -->
{#if $lq__journal_obj?.description && $ae_loc.edit_mode}
<div
class="
@@ -379,5 +225,14 @@
{@html $lq__journal_obj.description_md_html}
</div>
{/if}
<!-- </div> -->
</section>
<!-- Standardized Journal Action/Config Modal -->
<Journal_obj_id_edit
{log_lvl}
{lq__journal_obj}
show={$journals_sess.show__modal_edit__journal_obj}
onNewEntry={handle_new_entry}
onShowExport={onShowExport}
onShowImport={onShowImport}
/>

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

@@ -21,7 +21,8 @@
RefreshCcw,
Tag,
Plus,
Minus
Minus,
Zap
} from '@lucide/svelte';
import { Modal } from 'flowbite-svelte';
import { ae_loc, ae_api } from '$lib/stores/ae_stores';
@@ -72,7 +73,7 @@
{#snippet header()}
<h3 class="flex items-center gap-2 text-lg font-bold">
<Settings class="text-primary-500" />
<span>Entry Settings: {tmp_entry_obj.name || '--'}</span>
<span>Entry Config: {tmp_entry_obj.name || '--'}</span>
</h3>
{/snippet}
@@ -80,7 +81,7 @@
<!-- 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')}>
<Clock size="1.1em" class="mr-1" /> Quick Actions
<Zap size="1.1em" class="mr-1" /> Quick Actions
</button>
<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

7
src/routes/journals/modal_journals_config.svelte
View File

@@ -15,7 +15,8 @@
X,
CalendarClock,
MousePointerClick,
Database
Database,
Wrench
} from '@lucide/svelte';
import { Modal } from 'flowbite-svelte';
import { untrack } from 'svelte';
@@ -75,8 +76,8 @@
>
{#snippet header()}
<h3 class="flex items-center gap-2 text-lg font-bold">
<Settings class="text-primary-500" />
<span>&AElig; Journals Module Settings</span>
<Wrench class="text-primary-500" />
<span>&AElig; Journals Module Config</span>
</h3>
{/snippet}