Modularize Journal Entry view and refine UI logic

- Extracted AI Tools and Metadata into dedicated Svelte 5 components (JournalEntry_AITools, JournalEntry_Metadata).
- Standardized iconography to Lucide across list and detail views.
- Refined sort order controls with improved styling and Lucide icons.
- Fixed 'OpenAI is not defined' ReferenceError by restoring necessary imports.
- Corrected component naming discrepancy for Journal_entry_obj_file_li.
- Hardened change detection using Svelte 5 .by for reliable Save button behavior.
This commit is contained in:
Scott Idem
2026-01-08 16:59:12 -05:00
parent b50cbe7972
commit bd184d5440
5 changed files with 206 additions and 77 deletions

View File

@@ -39,28 +39,27 @@
<div
class="
container journal journal_obj
border rounded p-2 mb-2 space-y-2
w-full max-w-(--breakpoint-md)
border border-surface-500/30 rounded-lg p-3 mb-4 space-y-3
w-full max-w-2xl
flex flex-col items-center justify-center
bg-{journals_journal_obj?.cfg_json.color_scheme}-100
bg-surface-50 dark:bg-surface-900
shadow-sm hover:shadow-md transition-shadow
"
class:hidden={(journals_journal_obj?.hide || !journals_journal_obj?.enable) &&
!$ae_loc.trusted_access}
class:dim={journals_journal_obj.hide}
class:bg-warning-100={!journals_journal_obj?.enable}
class:text-warning-900={!journals_journal_obj?.enable}
class:opacity-50={journals_journal_obj.hide}
class:preset-filled-warning-100-900={!journals_journal_obj?.enable}
>
<header
class="
ae_header
flex flex-row gap-2 items-center justify-between
w-full
text-neutral-800/60
"
>
<h3 class="journal__name h3">
<BookType class="m-1 inline-block" />
<span class="journal__name">{journals_journal_obj.name}</span>
<h3 class="journal__name text-xl md:text-2xl font-bold flex items-center gap-2 text-surface-900 dark:text-surface-100">
<BookType size="1.25em" class="text-primary-500" />
<span class="journal__name truncate">{journals_journal_obj.name}</span>
</h3>
<!-- Show a label if the type code is set -->
@@ -107,21 +106,18 @@
</div>
{/if}
<div class="ae_options flex flex-row gap-2 items-center justify-center">
<div class="ae_options flex flex-row flex-wrap gap-3 items-center justify-center">
<a
href="/journals/{journals_journal_obj?.journal_id}"
class="btn btn-secondary btn-md preset-tonal-primary border border-primary-500 hover:preset-filled-primary-500 hover:underline transition"
class="btn variant-filled-primary md:btn-lg font-bold shadow-lg hover:scale-105 transition-transform"
title={`View: ${journals_journal_obj?.name}`}
>
<!-- <span class="fas fa-envelope-open m-1"></span> -->
<BookOpenText class="m-1" />
Open
<BookOpenText size="1.25em" />
<span>Open Journal</span>
{#if journals_journal_obj?.journal_entry_count}
<span class="ae_badge ae_info journal__journal_entry_count">
{@html journals_journal_obj?.journal_entry_count == 1
? `${journals_journal_obj?.journal_entry_count}&times; entry`
: `${journals_journal_obj?.journal_entry_count}&times; entries`}
<span class="badge variant-filled-secondary ml-2">
{journals_journal_obj?.journal_entry_count} {journals_journal_obj?.journal_entry_count === 1 ? 'entry' : 'entries'}
</span>
{/if}
</a>