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
2026-02-06 14:15:43 -05:00
parent 07dd6c18a1
commit 2f3125c64b
37 changed files with 3033 additions and 1133 deletions

View File

@@ -6,9 +6,9 @@
show_found_header?: boolean;
}
let {
log_lvl = $bindable(0),
lq__journal_obj,
let {
log_lvl = $bindable(0),
lq__journal_obj,
lq__journal_entry_obj_li,
show_found_header = true
}: Props = $props();
@@ -68,7 +68,8 @@
$effect(() => {
// Sync local boolean with store ID presence
show_append_modal = !!$journals_sess.show__modal_append__journal_entry_id;
show_append_modal =
!!$journals_sess.show__modal_append__journal_entry_id;
});
function handle_modal_close() {
@@ -82,35 +83,42 @@
// Derived list of visible items (Standardized Search Pattern 2026-01-27)
// Ensures count matches exactly what is rendered to the user
let visible_journal_entry_obj_li = $derived((() => {
// Subscribe to the observable
const list = $lq__journal_entry_obj_li;
// Return null to signify 'loading' vs [] for 'empty'
if (list === undefined || list === null) return null;
if (!Array.isArray(list)) return [];
const filtered = list.filter((item: any) => {
if (!item) return false;
let visible_journal_entry_obj_li = $derived(
(() => {
// Subscribe to the observable
const list = $lq__journal_entry_obj_li;
// ADMIN/TRUSTED: See everything
if ($ae_loc.trusted_access) return true;
// Return null to signify 'loading' vs [] for 'empty'
if (list === undefined || list === null) return null;
if (!Array.isArray(list)) return [];
// PUBLIC: Filter hidden/disabled
// Permissive defaults for missing metadata
const is_hidden = item.hide === true || item.hide === 1;
const is_disabled = item.enable === false || item.enable === 0;
const filtered = list.filter((item: any) => {
if (!item) return false;
return !is_hidden && !is_disabled;
});
// ADMIN/TRUSTED: See everything
if ($ae_loc.trusted_access) return true;
if (log_lvl) console.log(`visible_journal_entry_obj_li: Input=${list.length}, Output=${filtered.length}`);
// PUBLIC: Filter hidden/disabled
// Permissive defaults for missing metadata
const is_hidden = item.hide === true || item.hide === 1;
const is_disabled = item.enable === false || item.enable === 0;
return filtered;
})());
return !is_hidden && !is_disabled;
});
if (log_lvl)
console.log(
`visible_journal_entry_obj_li: Input=${list.length}, Output=${filtered.length}`
);
return filtered;
})()
);
</script>
<section class="journal_list flex flex-col gap-1 md:gap-2 items-center justify-center w-full">
<section
class="journal_list flex flex-col gap-1 md:gap-2 items-center justify-center w-full"
>
{#if visible_journal_entry_obj_li === null}
<!-- Loading state -->
<div class="flex flex-col items-center justify-center p-10 opacity-50">
@@ -121,9 +129,16 @@
{#if show_found_header}
<div class="w-full max-w-(--breakpoint-lg) mb-2">
<h2 class="h4 flex items-center gap-2 px-2">
<span class="text-sm text-gray-500 font-normal"> Found: </span>
<span class="badge preset-tonal-success font-bold text-lg px-3 py-1">
{visible_journal_entry_obj_li.length}<span class="text-gray-400 dark:text-gray-600">&times;</span>
<span class="text-sm text-gray-500 font-normal">
Found:
</span>
<span
class="badge preset-tonal-success font-bold text-lg px-3 py-1"
>
{visible_journal_entry_obj_li.length}<span
class="text-gray-400 dark:text-gray-600"
>&times;</span
>
</span>
</h2>
</div>
@@ -147,33 +162,52 @@
class:dim={!journals_journal_entry_obj.enable}
class:bg-warning-100={!journals_journal_entry_obj?.enable}
>
<header class="ae_header flex flex-row gap-2 items-center justify-between w-full">
<header
class="ae_header flex flex-row gap-2 items-center justify-between w-full"
>
<span class="flex flex-row flex-wrap gap-1">
<span class="journal_entry__name *:hover:inline-block">
{#if journals_journal_entry_obj.alert}
<Siren size="1.25em" class="mx-1 inline-block text-red-500" />
<Siren
size="1.25em"
class="mx-1 inline-block text-red-500"
/>
{/if}
{#if journals_journal_entry_obj.priority}
<Flag size="1.25em" class="mx-1 inline-block text-yellow-500" />
<Flag
size="1.25em"
class="mx-1 inline-block text-yellow-500"
/>
{/if}
{#if journals_journal_entry_obj.group}
<Group size="1.25em" class="mx-1 inline-block text-green-500" />
<span class="text-xs text-gray-500 hidden">Group:</span>
<span class="font-semibold text-sm text-gray-500 hidden md:inline">
<Group
size="1.25em"
class="mx-1 inline-block text-green-500"
/>
<span class="text-xs text-gray-500 hidden"
>Group:</span
>
<span
class="font-semibold text-sm text-gray-500 hidden md:inline"
>
{journals_journal_entry_obj.group}
</span>
{/if}
</span>
<h3 class:dim={journals_journal_entry_obj.hide} class="journal__name h4">
<h3
class:dim={journals_journal_entry_obj.hide}
class="journal__name h4"
>
{#if journals_journal_entry_obj.template}
<NotepadTextDashed
class="mx-1 inline-block text-neutral-800/60 dark:text-neutral-50/60"
/>
{@html journals_journal_entry_obj.name ?? '-- no name --'}
{@html journals_journal_entry_obj.name ??
'-- no name --'}
{:else if journals_journal_entry_obj.name}
<NotebookText
class="mx-1 inline-block text-neutral-800/60 dark:text-neutral-50/60"
@@ -190,61 +224,85 @@
{/if}
</h3>
<span class="flex flex-row flex-wrap gap-1 items-center justify-center">
<span
class="flex flex-row flex-wrap gap-1 items-center justify-center"
>
{#if !journals_journal_entry_obj.private}
<!-- Button to copy the Markdown version -->
<button type="button"
<button
type="button"
onclick={() => {
let tmp_entry_obj = journals_journal_entry_obj;
let tmp_entry_obj =
journals_journal_entry_obj;
navigator.clipboard
.writeText(tmp_entry_obj.content)
.then(() => {
alert('Markdown content copied to clipboard!');
alert(
'Markdown content copied to clipboard!'
);
})
.catch((error) => {
console.error('Failed to copy content:', error);
alert('Failed to copy content.');
console.error(
'Failed to copy content:',
error
);
alert(
'Failed to copy content.'
);
});
}}
class:hidden={$lq__journal_obj?.cfg_json?.hide_copy_plain_md}
class:hidden={$lq__journal_obj?.cfg_json
?.hide_copy_plain_md}
class="btn btn-sm p-1 preset-tonal-surface hover:preset-filled-secondary-500 *:hover:inline text-xs lg:text-sm"
title="Copy the markdown content"
>
<RemoveFormatting size="1.25em" />
<span class="hidden"> Copy Plaintext Markdown </span>
<span class="hidden">
Copy Plaintext Markdown
</span>
</button>
<!-- Button to copy the rendered to HTML version -->
<button type="button"
<button
type="button"
onclick={() => {
let htmlContent =
journals_journal_entry_obj.content_md_html || '';
journals_journal_entry_obj.content_md_html ||
'';
navigator.clipboard
.writeText(htmlContent)
.then(() => {
alert('Rendered HTML content copied to clipboard!');
alert(
'Rendered HTML content copied to clipboard!'
);
})
.catch((error) => {
console.error(
'Failed to copy HTML content:',
error
);
alert('Failed to copy HTML content.');
alert(
'Failed to copy HTML content.'
);
});
}}
class:hidden={journals_journal_entry_obj.template ||
$lq__journal_obj?.cfg_json?.hide_copy_html}
$lq__journal_obj?.cfg_json
?.hide_copy_html}
class="btn btn-sm p-1 preset-tonal-surface hover:preset-filled-secondary-500 *:hover:inline lg:text-xs"
title="Copy the rendered HTML content"
>
<CodeXml size="1.25em" />
<span class="hidden"> Copy HTML Markup </span>
<span class="hidden">
Copy HTML Markup
</span>
</button>
<!-- Button to copy the rich text (rendered HTML) version -->
<button type="button"
<button
type="button"
onclick={async () => {
const element = document.getElementById(
`rendered_journal_entry_content_${journals_journal_entry_obj.journal_entry_id}`
@@ -253,28 +311,42 @@
console.error(
'Element not found: rendered_journal_entry_content'
);
alert('Failed to copy rich content.');
alert(
'Failed to copy rich content.'
);
return;
}
try {
const htmlContent = element.innerHTML;
const htmlContent =
element.innerHTML;
await navigator.clipboard.write([
new ClipboardItem({
'text/html': new Blob([htmlContent], {
type: 'text/html'
})
'text/html': new Blob(
[htmlContent],
{
type: 'text/html'
}
)
})
]);
alert('Rendered rich content copied to clipboard!');
alert(
'Rendered rich content copied to clipboard!'
);
} catch (error) {
console.error('Failed to copy rich content:', error);
alert('Failed to copy rich content.');
console.error(
'Failed to copy rich content:',
error
);
alert(
'Failed to copy rich content.'
);
}
}}
class:hidden={journals_journal_entry_obj.template ||
$lq__journal_obj?.cfg_json?.hide_copy_rich}
$lq__journal_obj?.cfg_json
?.hide_copy_rich}
class="btn btn-sm p-1 preset-tonal-surface hover:preset-filled-secondary-500 *:hover:inline lg:text-xs"
title="Copy the rich text (rendered HTML) content"
>
@@ -283,28 +355,39 @@
</button>
<!-- Clone entry -->
<button type="button"
<button
type="button"
onclick={() => {
let data_kv = {
code: journals_journal_entry_obj.code,
category_code: journals_journal_entry_obj.category_code,
category_code:
journals_journal_entry_obj.category_code,
name: journals_journal_entry_obj.name,
short_name: journals_journal_entry_obj.short_name,
content: journals_journal_entry_obj.content,
description: journals_journal_entry_obj.description,
short_name:
journals_journal_entry_obj.short_name,
content:
journals_journal_entry_obj.content,
description:
journals_journal_entry_obj.description,
tags: journals_journal_entry_obj.tags
};
journals_func
.create_ae_obj__journal_entry({
api_cfg: $ae_api,
journal_id: journals_journal_entry_obj.journal_id,
journal_id:
journals_journal_entry_obj.journal_id,
data_kv: data_kv,
log_lvl: log_lvl
})
.then((result) => {
if (result?.journal_id_random && result?.journal_entry_id_random) {
alert('Journal entry cloned successfully!');
if (
result?.journal_id_random &&
result?.journal_entry_id_random
) {
alert(
'Journal entry cloned successfully!'
);
goto(
`/journals/${result.journal_id_random}/entry/${result.journal_entry_id_random}`
);
@@ -315,7 +398,9 @@
'Error cloning journal entry:',
error
);
alert('Failed to clone journal entry.');
alert(
'Failed to clone journal entry.'
);
});
}}
class:hidden={!journals_journal_entry_obj.template}
@@ -330,24 +415,38 @@
size="1.25em"
class="mx-1 inline-block text-red-400 dark:text-red-600"
/>
<span class="text-xs text-gray-500 hidden">Private</span>
<span class="text-xs text-gray-500 hidden"
>Private</span
>
<!-- Button to copy the Markdown version -->
<button type="button"
<button
type="button"
onclick={() => {
let tmp_entry_obj = journals_journal_entry_obj;
let tmp_entry_obj =
journals_journal_entry_obj;
navigator.clipboard
.writeText(tmp_entry_obj.content_encrypted)
.writeText(
tmp_entry_obj.content_encrypted
)
.then(() => {
alert('Encrypted content copied to clipboard!');
alert(
'Encrypted content copied to clipboard!'
);
})
.catch((error) => {
console.error('Failed to copy content:', error);
alert('Failed to copy content.');
console.error(
'Failed to copy content:',
error
);
alert(
'Failed to copy content.'
);
});
}}
class:hidden={$lq__journal_obj?.cfg_json?.hide_copy_encrypted}
class:hidden={$lq__journal_obj?.cfg_json
?.hide_copy_encrypted}
class="btn btn-sm p-1 preset-tonal-surface hover:preset-filled-secondary-500 *:hover:inline text-xs lg:text-sm"
title="Copy the encrypted content"
>
@@ -358,18 +457,25 @@
</span>
</span>
<div class="flex flex-row flex-wrap gap-2 items-center justify-end">
<div
class="flex flex-row flex-wrap gap-2 items-center justify-end"
>
<!-- Linked file count -->
<div
class="ae_linked_file_count flex flex-row flex-wrap gap-0.5 items-center justify-start"
class:hidden={!journals_journal_entry_obj?.data_json?.hosted_file_kv}
class:hidden={!journals_journal_entry_obj?.data_json
?.hosted_file_kv}
>
<Files class="mx-1 inline-block" />
<span class="text-xs text-gray-500 hidden md:inline">Linked files:</span>
<span class="text-xs text-gray-500 hidden md:inline"
>Linked files:</span
>
<span class="font-semibold text-sm text-gray-500">
{journals_journal_entry_obj?.data_json?.hosted_file_kv
{journals_journal_entry_obj?.data_json
?.hosted_file_kv
? Object.keys(
journals_journal_entry_obj?.data_json?.hosted_file_kv
journals_journal_entry_obj?.data_json
?.hosted_file_kv
).length
: 0}×
</span>
@@ -381,7 +487,10 @@
class="tags flex flex-row flex-wrap gap-0.5 items-center justify-start p-1"
>
<Tags class="mx-1 inline-block" />
<span class="text-xs text-gray-500 hidden md:inline">Tags:</span>
<span
class="text-xs text-gray-500 hidden md:inline"
>Tags:</span
>
{#each journals_journal_entry_obj.tags.split(',') as tag}
<span
@@ -396,27 +505,36 @@
<!-- Category code for journal entry -->
{#if journals_journal_entry_obj.category_code}
<button type="button"
<button
type="button"
onclick={() => {
if (
$journals_loc.entry.qry__category_code ==
$journals_loc.entry
.qry__category_code ==
journals_journal_entry_obj.category_code
) {
$journals_loc.entry.qry__category_code = null;
$journals_loc.entry.qry__category_code =
null;
} else {
$journals_loc.entry.qry__category_code =
journals_journal_entry_obj.category_code;
}
if ($journals_loc.entry.search_version === undefined) $journals_loc.entry.search_version = 0;
if (
$journals_loc.entry.search_version ===
undefined
)
$journals_loc.entry.search_version = 0;
$journals_loc.entry.search_version++;
}}
class:bg-green-100={$journals_loc.entry.qry__category_code ==
class:bg-green-100={$journals_loc.entry
.qry__category_code ==
journals_journal_entry_obj.category_code}
class="btn btn-sm variant-outline-secondary hover:preset-filled-secondary-500 transition py-1 px-2"
title={`Filter by category: ${journals_journal_entry_obj.category_code}`}
>
<Shapes class="mx-1 inline-block" />
{journals_journal_entry_obj.category_code ?? '-- no category --'}
{journals_journal_entry_obj.category_code ??
'-- no category --'}
</button>
{/if}
@@ -434,7 +552,8 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
</a>
<!-- Button to show a modal that will allow for a quick append to Journal Entry option. -->
<button type="button"
<button
type="button"
onclick={() => {
$journals_sess.show__modal_append__journal_entry_id =
journals_journal_entry_obj?.id;
@@ -443,7 +562,8 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
);
}}
class="btn btn-icon btn-sm preset-tonal-surface border border-surface-500 hover:preset-filled-secondary-500 transition"
title={$lq__journal_obj?.cfg_json?.entry_add_text == 'append'
title={$lq__journal_obj?.cfg_json?.entry_add_text ==
'append'
? 'Append to Journal Entry'
: 'Prepend to Journal Entry'}
>
@@ -456,11 +576,14 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
<div
class:hidden={journals_journal_entry_obj.hide ||
(journals_journal_entry_obj.private &&
$journals_slct.journal_obj?.cfg_json.hide_private) ||
$journals_slct.journal_obj?.cfg_json
.hide_private) ||
(journals_journal_entry_obj.personal &&
$journals_slct.journal_obj?.cfg_json.hide_personal) ||
$journals_slct.journal_obj?.cfg_json
.hide_personal) ||
(journals_journal_entry_obj.professional &&
$journals_slct.journal_obj?.cfg_json.hide_professional)}
$journals_slct.journal_obj?.cfg_json
.hide_professional)}
class="journal__content
w-full p-1
bg-slate-100 text-gray-900
@@ -479,11 +602,13 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
? `${$journals_slct.journal_obj.cfg_json.entry_li_max_height}`
: ''}
{$journals_slct.journal_obj.cfg_json.entry_li_click_max_height
{$journals_slct.journal_obj.cfg_json
.entry_li_click_max_height
? `${$journals_slct.journal_obj.cfg_json.entry_li_click_max_height}`
: ''}
{$journals_slct.journal_obj.cfg_json.entry_li_hover_max_height
{$journals_slct.journal_obj.cfg_json
.entry_li_hover_max_height
? `${$journals_slct.journal_obj.cfg_json.entry_li_hover_max_height}`
: ''}
"
@@ -509,9 +634,11 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
class:hidden={!journals_journal_entry_obj?.original_datetime &&
!journals_journal_entry_obj?.original_timezone}
>
<span class="ae_label text-sm">Original date/time:</span>
<span class="ae_label text-sm">Original date/time:</span
>
{#if journals_journal_entry_obj.original_datetime}
<span class="ae_value ae_prop prop_original_datetime font-semibold"
<span
class="ae_value ae_prop prop_original_datetime font-semibold"
>{ae_util.iso_datetime_formatter(
journals_journal_entry_obj.original_datetime,
'datetime_12_long'
@@ -531,7 +658,8 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
class="ae_meta mt-2 flex flex-col sm:flex-row gap-2 items-center justify-center text-xs text-gray-500"
>
<span
class:hidden={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
class:hidden={!$ae_loc.trusted_access ||
!$ae_loc.edit_mode}
class="flex flex-row gap-1 items-center justify-center"
>
<span class="journal_entry__created_on">
@@ -554,22 +682,28 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
</span>
<!-- Set/unset hide (boolean) -->
<button type="button"
<button
type="button"
onclick={() => {
let data_kv = {
hide: journals_journal_entry_obj?.hide ? false : true
hide: journals_journal_entry_obj?.hide
? false
: true
};
journals_func
.update_ae_obj__journal_entry({
api_cfg: $ae_api,
journal_entry_id: journals_journal_entry_obj.journal_entry_id,
journal_entry_id:
journals_journal_entry_obj.journal_entry_id,
data_kv: data_kv,
log_lvl: log_lvl
})
.then(() => {
})
.then(() => {})
.catch((error) => {
console.error('Error updating journal entry:', error);
console.error(
'Error updating journal entry:',
error
);
alert('Failed to update journal entry.');
});
}}
@@ -609,9 +743,14 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
/>
{/if}
{:else}
<div class="flex flex-col items-center justify-center p-10 opacity-50 text-center">
<div
class="flex flex-col items-center justify-center p-10 opacity-50 text-center"
>
<BookOpenText size="3em" class="mb-2 opacity-20 mx-auto" />
<p>No Journal Entry available to show. Please check the query filters or create a new Entry.</p>
<p>
No Journal Entry available to show. Please check the query
filters or create a new Entry.
</p>
</div>
{/if}
</section>
</section>