Saving my changes. Cleaning up the comments.

src/routes/journals/JournalEntry_Header.svelte

@@ -0,0 +1,222 @@
+<script lang="ts">
+    /**
+     * JournalEntry_Header.svelte
+     * Extracted 2026-01-08 to modularize the massive Journal Entry God Component.
+     * Handles name, tags, categories, and the 3-state toggle (View/Eye/Save).
+     */
+    import { 
+        Save, Eye, Pencil, Tags, Shapes, 
+        Siren, MessageSquareWarning, Skull, 
+        Fingerprint, LockKeyhole, LockKeyholeOpen, Menu,
+        Globe, BookHeart, BriefcaseBusiness
+    } from '@lucide/svelte';
+    import { ae_util } from '$lib/ae_utils/ae_utils';
+    import { ae_loc } from '$lib/stores/ae_stores';
+    import { journals_loc, journals_sess } from '$lib/ae_journals/ae_journals_stores';
+    import type { ae_JournalEntry, ae_Journal } from '$lib/types/ae_types';
+    import JournalEntry_SettingsMenu from './JournalEntry_SettingsMenu.svelte';
+
+    interface Props {
+        entry: ae_JournalEntry;
+        journal: ae_Journal;
+        tmp_entry_obj: any; // Bindable
+        has_changed: boolean;
+        onSave: () => void;
+        onDecrypt: () => void;
+        log_lvl?: number;
+    }
+
+    let { 
+        entry, 
+        journal, 
+        tmp_entry_obj = $bindable(), 
+        has_changed,
+        onSave,
+        onDecrypt,
+        log_lvl = 0 
+    }: Props = $props();
+
+    function toggle_edit_mode() {
+        const isEditing = $journals_loc.entry.edit_kv[entry.journal_entry_id] === 'current';
+        
+        if (isEditing) {
+            if (has_changed) {
+                onSave();
+            } else {
+                $journals_loc.entry.edit_kv[entry.journal_entry_id] = false;
+            }
+        } else {
+            $journals_loc.entry.edit_kv[entry.journal_entry_id] = 'current';
+        }
+    }
+
+    function toggle_property(prop: string) {
+        (tmp_entry_obj as any)[prop] = !entry[prop as keyof ae_JournalEntry];
+        onSave();
+    }
+</script>
+
+<header
+    class="
+ae_header journal_entry__header
+flex flex-row flex-wrap gap-2
+items-center justify-between
+w-full
+bg-gray-100 dark:bg-gray-800
+p-2 md:p-3 rounded-lg shadow-md
+"
+>
+    <div class="flex-1 flex flex-row flex-wrap gap-2 items-center justify-start min-w-[200px]">
+        <!-- Toggle edit for journal entry -->
+        <button
+            type="button"
+            onclick={toggle_edit_mode}
+            class="btn btn-icon btn-sm preset-tonal-surface hover:preset-filled-primary-500 transition-all"
+            class:preset-filled-success-500={has_changed && $journals_loc.entry.edit_kv[entry.journal_entry_id] === 'current'}
+            title="Toggle view/edit/save mode"
+        >
+            {#if $journals_loc.entry.edit_kv[entry.journal_entry_id] === 'current'}
+                {#if has_changed}
+                    <Save size="1.25em" />
+                {:else}
+                    <Eye size="1.25em" />
+                {/if}
+            {:else}
+                <Pencil size="1.25em" />
+            {/if}
+        </button>
+
+        <h2 class="journal_entry__name text-base md:text-lg font-bold truncate max-w-[200px] md:max-w-md">
+            {#if $journals_loc.entry.edit_kv[entry.journal_entry_id] == 'current'}
+                <input
+                    type="text"
+                    bind:value={tmp_entry_obj.name}
+                    class="input input-sm md:input-md input-bordered w-full"
+                    placeholder="Journal Entry Name"
+                />
+            {:else}
+                <span>
+                    {#if entry.name}
+                        {@html entry.name}
+                    {:else}
+                        {ae_util.iso_datetime_formatter(entry.created_on, 'datetime_iso_12_no_seconds')}
+                    {/if}
+                </span>
+            {/if}
+        </h2>
+    </div>
+
+    <div class="flex flex-row flex-wrap gap-2 items-center justify-end">
+        <!-- Toggles Container -->
+        <div class="flex flex-row flex-wrap gap-1 items-center justify-end">
+            
+            <!-- Quick Category Display -->
+            {#if entry.category_code && $journals_loc.entry.edit_kv[entry.journal_entry_id] !== 'current'}
+                <span class="hidden md:flex items-center gap-1 text-xs font-semibold px-2 py-1 bg-surface-500/10 rounded">
+                    <Shapes size="1em" />
+                    {entry.category_code}
+                </span>
+            {/if}
+
+            <span class="flex flex-row flex-wrap gap-1 items-center justify-center">
+                <!-- Public Toggle -->
+                <button
+                    type="button"
+                    class:hidden={journal?.cfg_json?.hide_btn_public}
+                    onclick={() => toggle_property('public')}
+                    class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+                    title="Toggle public visibility"
+                >
+                    <Globe size="1.1em" class={entry.public ? 'text-success-500' : 'opacity-50'} />
+                </button>
+
+                <!-- Personal Toggle -->
+                <button
+                    type="button"
+                    class:hidden={journal?.cfg_json?.hide_btn_personal}
+                    onclick={() => toggle_property('personal')}
+                    class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+                    title="Toggle personal visibility"
+                >
+                    <BookHeart size="1.1em" class={entry.personal ? 'text-success-500' : 'opacity-50'} />
+                </button>
+
+                <!-- Professional Toggle -->
+                <button
+                    type="button"
+                    class:hidden={journal?.cfg_json?.hide_btn_professional}
+                    onclick={() => toggle_property('professional')}
+                    class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+                    title="Toggle professional visibility"
+                >
+                    <BriefcaseBusiness size="1.1em" class={entry.professional ? 'text-success-500' : 'opacity-50'} />
+                </button>
+
+                <span class="flex flex-row flex-wrap gap-0.5 items-center justify-center border-l border-surface-500/20 pl-1">
+                    <!-- Private/Encryption Toggle -->
+                    <button
+                        type="button"
+                        class:hidden={journal?.cfg_json?.hide_btn_private || (entry.private && !$ae_loc.edit_mode)}
+                        onclick={() => {
+                            if (!entry.private && entry.content) {
+                                if (confirm('Encrypt and resave this entry?')) {
+                                    tmp_entry_obj.private = true;
+                                    onSave();
+                                }
+                            } else if (entry.private && entry.content_encrypted) {
+                                if (confirm('Decrypt and resave unencrypted?')) {
+                                    tmp_entry_obj.private = false;
+                                    onSave();
+                                }
+                            }
+                        }}
+                        class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+                        title="Toggle privacy"
+                    >
+                        <Fingerprint size="1.1em" class={entry.private ? 'text-success-500' : 'opacity-50'} />
+                    </button>
+
+                    {#if entry.private && entry.content_encrypted}
+                        <button
+                            type="button"
+                            onclick={onDecrypt}
+                            class="btn-icon btn-icon-sm preset-tonal-warning hover:preset-filled-warning-500"
+                            title="Toggle decryption"
+                        >
+                            {#if tmp_entry_obj?.content}
+                                <LockKeyholeOpen size="1.1em" class="text-success-500" />
+                            {:else}
+                                <LockKeyhole size="1.1em" class="text-error-500" />
+                            {/if}
+                        </button>
+                    {/if}
+                </span>
+
+                <!-- Settings Menu Trigger -->
+                <section class="relative">
+                    <button
+                        type="button"
+                        onclick={() => ($journals_sess.entry.show_menu = !$journals_sess.entry.show_menu)}
+                        class="btn btn-sm variant-outline-secondary hover:preset-filled-secondary-500 py-1 px-2 w-24 transition-all"
+                        class:preset-filled-warning-500={$journals_sess.entry.show_menu}
+                    >
+                        <Menu size="1.25em" class="inline-block" />
+                        <span class="hidden md:inline ml-1">Menu</span>
+                    </button>
+
+                    {#if $journals_sess.entry.show_menu}
+                        <div class="absolute top-12 right-0 p-4 z-50 bg-white dark:bg-gray-800 border border-surface-500 shadow-xl rounded-lg min-w-72">
+                            <JournalEntry_SettingsMenu 
+                                {entry} 
+                                {journal} 
+                                bind:tmp_entry_obj={tmp_entry_obj} 
+                                {onSave}
+                                {log_lvl}
+                            />
+                        </div>
+                    {/if}
+                </section>
+            </span>
+        </div>
+    </div>
+</header>

src/routes/journals/JournalEntry_SettingsMenu.svelte

@@ -0,0 +1,142 @@
+<script lang="ts">
+    /**
+     * JournalEntry_SettingsMenu.svelte
+     * Extracted 2026-01-08 to modularize the Journal Entry Header.
+     * Manages Category, Priority, Sort, and Deletion.
+     */
+    import { 
+        Plus, Minus, ArrowDown10, Flag, FlagOff, 
+        Eye, EyeOff, ShieldCheck, ShieldMinus, 
+        Clock, X, Trash2
+    } from '@lucide/svelte';
+    import { ae_loc, ae_api } from '$lib/stores/ae_stores';
+    import { journals_slct } from '$lib/ae_journals/ae_journals_stores';
+    import { journals_func } from '$lib/ae_journals/ae_journals_functions';
+    import { goto } from '$app/navigation';
+    import type { ae_JournalEntry, ae_Journal } from '$lib/types/ae_types';
+
+    interface Props {
+        entry: ae_JournalEntry;
+        journal: ae_Journal;
+        tmp_entry_obj: any; // Bindable
+        onSave: () => void;
+        log_lvl?: number;
+    }
+
+    let { entry, journal, tmp_entry_obj = $bindable(), onSave, log_lvl = 0 }: Props = $props();
+
+    async function delete_entry() {
+        if (confirm(`Are you sure you want to delete this journal entry?`)) {
+            let delete_method = 'disable';
+            if ($ae_loc.administrator_access && $ae_loc.edit_mode) {
+                delete_method = 'delete';
+            }
+            try {
+                await journals_func.delete_ae_obj_id__journal_entry({
+                    api_cfg: $ae_api,
+                    journal_entry_id: entry.journal_entry_id,
+                    method: delete_method,
+                    log_lvl
+                });
+                alert('Journal entry deleted successfully!');
+                goto(`/journals/${$journals_slct.journal_id}`);
+            } catch (error) {
+                console.error('Error deleting journal entry:', error);
+                alert('Failed to delete journal entry.');
+            }
+        }
+    }
+</script>
+
+<div class="space-y-4">
+    <!-- Category -->
+    <div class="flex flex-row items-center justify-evenly gap-2 w-full">
+        <span class="text-sm text-gray-500 hidden sm:inline"> Category: </span>
+        <select
+            class="select select-sm preset-tonal-primary w-full"
+            bind:value={tmp_entry_obj.category_code}
+            onchange={onSave}
+            title="Select a category"
+        >
+            <option value="">Select Category</option>
+            {#each journal?.cfg_json.category_li ?? [] as category}
+                <option value={category.code}>{category.name}</option>
+            {/each}
+        </select>
+    </div>
+
+    <!-- Priority Toggle -->
+    <button
+        type="button"
+        onclick={() => {
+            tmp_entry_obj.priority = !entry.priority;
+            onSave();
+        }}
+        class="btn w-full mb-2 preset-tonal-tertiary transition hover:preset-filled-tertiary-500"
+    >
+        {#if entry.priority}
+            <Flag size="1.25em" class="text-success-500 mr-2" />
+        {:else}
+            <FlagOff size="1.25em" class="opacity-50 mr-2" />
+        {/if}
+        <span>Priority Status</span>
+    </button>
+
+    <!-- Sort Order -->
+    <div class="w-full flex flex-row items-center justify-center border border-surface-500/30 rounded-lg p-1 bg-surface-500/5">
+        <button
+            type="button"
+            onclick={() => {
+                tmp_entry_obj.sort = (entry.sort ?? 0) + 1;
+                onSave();
+            }}
+            class="btn-icon btn-icon-sm preset-tonal-surface hover:preset-filled-secondary-500"
+        >
+            <Plus size="1em" />
+        </button>
+        <span class="mx-4 font-bold text-base min-w-[1.5em] text-center">
+            {tmp_entry_obj.sort ?? entry.sort ?? 0}
+        </span>
+        <button
+            type="button"
+            onclick={() => {
+                tmp_entry_obj.sort = Math.max(0, (entry.sort ?? 0) - 1);
+                onSave();
+            }}
+            class="btn-icon btn-icon-sm preset-tonal-surface hover:preset-filled-secondary-500"
+        >
+            <Minus size="1em" />
+        </button>
+    </div>
+
+    <div class="divider"></div>
+
+    <!-- Archive On -->
+    <div class="flex flex-row items-center justify-between gap-2 border border-surface-500/20 rounded p-1">
+        <input
+            type="datetime-local"
+            bind:value={tmp_entry_obj.archive_on}
+            onchange={onSave}
+            class="input input-sm border-none bg-transparent"
+        />
+        {#if entry.archive_on}
+            <button onclick={() => { tmp_entry_obj.archive_on = null; onSave(); }} class="text-error-500">
+                <X size="1.2em" />
+            </button>
+        {:else}
+            <button onclick={() => { tmp_entry_obj.archive_on = new Date().toISOString().slice(0, 16); onSave(); }} class="text-primary-500">
+                <Clock size="1.2em" />
+            </button>
+        {/if}
+    </div>
+
+    <!-- Danger Zone: Delete -->
+    <button
+        type="button"
+        onclick={delete_entry}
+        class="btn variant-filled-error w-full mt-4"
+    >
+        <Trash2 size="1.25em" class="mr-2" />
+        Delete Entry
+    </button>
+</div>

src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte

@@ -216,16 +216,6 @@
             console.log(
                 'TEST: tmp_entry_obj and orig_entry_obj available; marking tmp_entry_obj as changed'
             );
-            // tmp_entry_obj_changed = JSON.stringify(tmp_entry_obj) != JSON.stringify($lq__journal_entry_obj);
-            // tmp_entry_obj_changed = JSON.stringify(tmp_entry_obj) != JSON.stringify(orig_entry_obj);
-            // if (!tmp_entry_obj?.private ) {
-            //     tmp_entry_obj_changed = true;
-            // } else
-            // if (tmp_entry_obj?.private && tmp_entry_obj?.content) {
-            //     tmp_entry_obj_changed = false;
-            // } else {
-            //     tmp_entry_obj_changed = true;
-            // }
             tmp_entry_obj_changed = true;
         } else {
             // console.log('TEST: tmp_entry_obj == orig_entry_obj');
@@ -276,37 +266,12 @@
         }
     });
 
-    // // Old decrypted content and history handling
-    // $effect(() => {
-    //     if ($journals_sess?.journal_kv[$lq__journal_obj?.id]?.journal_passcode_verified && tmp_entry_obj?.content_encrypted && !tmp_entry_obj.content) {
-    //         console.log('TEST: Decrypting the content before displaying it...');
-    //         tmp_entry_obj.content = ae_util.decrypt_wrapper(tmp_entry_obj?.content_encrypted, journal_key);
-    //         tmp_entry_obj.content_md_html = handle_marked(tmp_entry_obj?.content);
-    //     }
-
-    //     if ($journals_sess?.journal_kv[$lq__journal_obj?.id]?.journal_passcode_verified && tmp_entry_obj?.history_encrypted && !tmp_entry_obj.history) {
-    //         console.log('TEST: Decrypting the history before displaying it...');
-    //         tmp_entry_obj.history = ae_util.decrypt_wrapper(tmp_entry_obj?.history_encrypted, journal_key);
-    //         tmp_entry_obj.history_md_html = handle_marked(tmp_entry_obj?.history);
-    //     }
-    // });
-
-    // const test_html = marked.parse('# Marked in Node.js\n\nRendered by **marked**.');
-
     async function update_journal_entry() {
         if (!$ae_loc.trusted_access) {
             alert('You do not have permission to update this journal entry.');
             return;
         }
 
-        // log_lvl = 1;
-
-        // append slct_hosted_file_kv to data_json.hosted_file_kv
-        // if (!tmp_entry_obj.data_json.hosted_file_kv) {
-        //     tmp_entry_obj.data_json.hosted_file_kv = {};
-        // }
-        // tmp_entry_obj.data_json.hosted_file_kv = $journals_loc.entry.hosted_file_kv;
-
         let data_kv: key_val = {
             alert: tmp_entry_obj?.alert,
             personal: tmp_entry_obj?.personal,
@@ -2022,31 +1987,12 @@
                             </div>
                         {/if}
                     </div>
-                    <!-- {/if} -->
                 </section>
             </div>
         </header>
 
-        <!-- <section
-    class="flex flex-row flex-wrap gap-1 items-center justify-between w-full"
-    >
 
 
-
-
-
-</section> -->
-
-        <!-- svelte-ignore a11y_no_noninteractive_tabindex -->
-        <!-- ondblclick={() => {
-    if ($ae_loc.trusted_access && $ae_loc.edit_mode) {
-        // Toggle edit mode
-        $journals_loc.entry.edit = !$journals_loc.entry.edit;
-        $journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id] = $journals_loc.entry.edit;
-    }
-}}
-role={$ae_loc.edit_mode ? 'button' : 'article'}
-tabindex={$ae_loc.edit_mode ? 0 : -1} -->
         <section
             class="
         grow
@@ -2636,43 +2582,9 @@ tabindex={$ae_loc.edit_mode ? 0 : -1} -->
                 </div>
             {/if}
 
-            <!-- <div class="max-w-(--breakpoint-md) overflow-auto">
+
-aaaa
-{tmp_entry_obj?.content ?? '-- not set --'}
-<hr>
-{tmp_entry_obj?.content_encrypted ?? '-- not set --'}
-zzzz
-</div> -->
         </section>
 
-        <!-- <div>
-    {@html test_html}
-</div> -->
-
-        <!-- {#if $ae_loc.edit_mode && $ae_loc.trusted_access}
-<div
-    id="journal_entry_codemirror"
-    class:hidden={!$ae_loc.edit_mode}
-    > -->
-        <!-- {cm_view} -->
-        <!-- <CodeMirror bind:value class="editor" {...props} /> -->
-        <!-- bind:value={cm_view} -->
-        <!-- <E_app_codemirror
-        classes="editor"
-        /> -->
-        <!-- bind:content={tmp_entry_obj.content} -->
-        <!-- <E_app_codemirror_v5
-        content={tmp_entry_obj?.content ?? ''}
-        bind:new_content={tmp_entry_obj.content}
-        language={markdown()}
-        placeholder="Write your JavaScript code here..."
-        /> -->
-
-        <!-- <pre>
-    {tmp_entry_obj.new_content}
-    </pre> -->
-        <!-- </div>
-{/if} -->
 
         <section class="ae_meta flex flex-row flex-wrap gap-1 items-center justify-between w-full">
             <span class="flex flex-row items-center justify-center text-sm text-gray-500">
@@ -2754,11 +2666,6 @@ zzzz
                                         $journals_loc?.llm__api_dangerous_browser
                                 });
 
-                                // let resp__models = ai_client.models.list();
-                                // console.log('AI API Response (models)', resp__models);
-
-                                // let msg_role_system_content = $journals_loc?.entry?.llm__system_prompt || 'You are a helpful assistant that helps people find information.';
-                                // let msg_role_user_content = 'Why is the sky blue?';
                                 let msg_role_user_content = tmp_entry_obj?.content;
 
                                 try {
@@ -2851,9 +2758,6 @@ zzzz
                         </label>
                     </div>
 
-                    <!-- <pre class="text-wrap">
-    {@html $journals_sess.entry.ai_summary}
-    </pre> -->
 
                     <E_app_codemirror_v5
                         editable={true}