Bug fixes and clean up for the recent history of Journal Entries.

src/lib/ae_journals/ae_journals_stores.ts

@@ -29,7 +29,9 @@ let journals_local_data_struct: key_val = {
     qry__journal_id: null,
 
     journal_view_history_li: [], // Appended each time the journal is loaded.
-    entry_view_history_li: [], // Appended each time the entry is loaded.
+    entry_view_history_li: [], // NO LONGER USED: Appended each time the entry is loaded.
+    entry_view_history_kv: {}, // Keyed by journal_entry_id for quick lookup.
+    entry_view_history_max: 15, // Maximum number of journal entries to keep in history.
 
     journal: {
         edit: false,

src/routes/journals/[journal_id]/+layout.svelte

@@ -48,7 +48,6 @@ import Journal_entry_obj_qry from './../ae_comp__journal_entry_obj_qry.svelte';
 // let tmp_journal_obj_changed: boolean = $state(false);
 // let tmp_journal_obj: key_val = $state({});
 
-
 let ae_acct = data[$slct.account_id];
 if (log_lvl) {
     console.log(`ae_acct = `, ae_acct);
@@ -183,8 +182,23 @@ let lq__journal_obj = $derived(liveQuery(async () => {
         "
     >
 
+    <!-- If middle click then open the all journals page in a new tab. Otherwise show/hide the menu. -->
     <button
         type="button"
+        onmousedown={
+            (event) => {
+            if (event.button === 1) {
+                // Middle click - open in new tab
+                // window.open('/journals', '_blank');
+                window.open('/journals');
+            // } else {
+            //     // Left click - toggle menu
+            //     event.preventDefault(); // Prevent default middle-click behavior
+            //     show_menu__all_journals = !show_menu__all_journals;
+            }
+        }
+        }
+
         onclick={() => {
             show_menu__all_journals = !show_menu__all_journals;
         }}
@@ -196,7 +210,7 @@ let lq__journal_obj = $derived(liveQuery(async () => {
             hover:preset-filled-tertiary-300-700
             transition-all
             "
-        title="View all journals menu: {$ae_loc.account_name}"
+        title={`View all journals menu: "${$ae_loc?.user?.name}"\nMiddle-click to open in new tab`}
         >
         <!-- <BookHeart /> -->
         <!-- <Library /> -->
@@ -207,6 +221,7 @@ let lq__journal_obj = $derived(liveQuery(async () => {
         {/if}
         <span class="hidden md:inline">
             Journals
+            <!-- for {$ae_loc?.user?.name} -->
         </span>
 
     </button>
@@ -245,9 +260,10 @@ let lq__journal_obj = $derived(liveQuery(async () => {
 
         </a>
 
+        <!-- $journals_slct?.journal_id &&  -->
         <!-- List of recent entries here... -->
         <!-- $journals_loc.entry_view_history_li -->
-        {#if $journals_loc?.entry_view_history_li?.length > 0}
+        {#if $journals_loc.entry_view_history_kv && Object.keys($journals_loc.entry_view_history_kv).length > 0}
             <select
                 bind:value={$journals_slct.journal_entry_id}
                 onchange={() => {
@@ -264,11 +280,12 @@ let lq__journal_obj = $derived(liveQuery(async () => {
                     "
                 >
                 <option value="" disabled selected>
-                    Recent Entries...
+                    {Object.keys($journals_loc.entry_view_history_kv).length}&times; Recent Entries...
                 </option>
-                {#each $journals_loc.entry_view_history_li as entry (entry.id)}
-                    <option value={entry.id}>
-                        {entry.name}
+                <!-- loop through each key value -->
+                {#each Object.entries($journals_loc.entry_view_history_kv).reverse() as [journal_entry_id, journal_entry_obj]}
+                    <option value={journal_entry_obj.id}>
+                        {(journal_entry_obj?.name || journal_entry_obj?.id) ?? 'NONE'}
                     </option>
                 {/each}
             </select>

src/routes/journals/[journal_id]/entry/[journal_entry_id]/+page.svelte

@@ -129,57 +129,106 @@ let lq__journal_entry_obj = $derived(liveQuery(async () => {
     return results;
 }));
 
+
+// $effect(() => {
+//     if (browser && $lq__journal_entry_obj?.journal_entry_id) {
+
+//         // $journals_loc.entry_view_history_li = [...new Set($journals_loc.entry_view_history_li)]
+
+//         let tmp_history_li = [
+//             ...new Set($journals_loc?.entry_view_history_li ?? [])
+//             ];
+
+//         // Limit to last 15 entries
+//         if (tmp_history_li.length > 15) {
+//             tmp_history_li = tmp_history_li.slice(tmp_history_li.length - 15);
+//         }
+
+//         // let chk_history_li = tmp_history_li?.filter(item => item.id === $lq__journal_entry_obj?.journal_entry_id);
+
+//         // if (chk_history_li?.length) {
+//         //     // Already in history, do not add again
+//         //     console.log(`Entry ID = ${$lq__journal_entry_obj?.journal_entry_id} already in history, not adding again.`, tmp_history_li);
+
+//         //     // if (tmp_history_li !== $journals_loc.entry_view_history_li) {
+//         //     if (JSON.stringify(tmp_history_li) !== JSON.stringify($journals_loc.entry_view_history_li)) {
+//         //         $journals_loc.entry_view_history_li = tmp_history_li;
+
+//         //         console.log(`$journals_loc.entry_view_history_li = `, $journals_loc.entry_view_history_li);
+//         //     }
+
+//         //     return;
+//         // }
+
+//         tmp_history_li.push({
+//             id: $lq__journal_entry_obj?.journal_entry_id ?? 'NONE',
+//             name: $lq__journal_entry_obj?.name ?? ae_util.iso_datetime_formatter($lq__journal_entry_obj?.created_on, 'datetime_iso_12_no_seconds'),
+//             url: `/journals/${$lq__journal_entry_obj?.journal_id ?? 'NONE'}/entry/${$lq__journal_entry_obj?.journal_entry_id ?? 'NONE'}`,
+//         });
+
+//         // Remove duplicates and keep most recent
+//         tmp_history_li = [...new Set(tmp_history_li.map(item => JSON.stringify(item)))].map(item => JSON.parse(item));
+
+//         // Limit to last 15 entries
+//         if (tmp_history_li.length > 15) {
+//             tmp_history_li = tmp_history_li.slice(tmp_history_li.length - 15);
+//         }
+
+//         if (JSON.stringify(tmp_history_li) !== JSON.stringify($journals_loc?.entry_view_history_li)) {
+//             $journals_loc.entry_view_history_li = tmp_history_li;
+
+//             console.log(`$journals_loc.entry_view_history_li = `, $journals_loc?.entry_view_history_li);
+//         }
+
+//         console.log(`$journals_loc.entry_view_history_li = `, $journals_loc?.entry_view_history_li);
+//     }
+// });
+
+
 $effect(() => {
     if (browser && $lq__journal_entry_obj?.journal_entry_id) {
+        log_lvl = 2;
+        // Start with the current KV or convert the LI to a KV if needed
+        let history_kv = { ...( $journals_loc?.entry_view_history_kv ?? {} ) };
 
-        // $journals_loc.entry_view_history_li = [...new Set($journals_loc.entry_view_history_li)]
+        // Add or update the current entry
+        const entry_id = $lq__journal_entry_obj?.journal_entry_id ?? 'NONE';
+        history_kv[entry_id] = {
+            id: entry_id,
+            name: $lq__journal_entry_obj?.name ?? ae_util.iso_datetime_formatter($lq__journal_entry_obj?.created_on, 'datetime_iso_12_no_seconds'),
+            url: `/journals/${$lq__journal_entry_obj?.journal_id ?? 'NONE'}/entry/${entry_id}`,
+        };
 
-        let tmp_history_li = [
-            ...new Set($journals_loc.entry_view_history_li)
-            ];
+        console.log(`history_kv (before limiting) = `, history_kv);
 
-        // Limit to last 15 entries
-        if (tmp_history_li.length > 15) {
-            tmp_history_li = tmp_history_li.slice(tmp_history_li.length - 15);
-        }
+        // // Convert KV to array, sort by most recent (last updated), and limit to 15
+        // let history_li = Object.values(history_kv);
 
-        // let chk_history_li = tmp_history_li?.filter(item => item.id === $lq__journal_entry_obj?.journal_entry_id);
+        // console.log(`history_li (before limiting) = `, history_li);
 
-        // if (chk_history_li?.length) {
-        //     // Already in history, do not add again
-        //     console.log(`Entry ID = ${$lq__journal_entry_obj?.journal_entry_id} already in history, not adding again.`, tmp_history_li);
-
-        //     // if (tmp_history_li !== $journals_loc.entry_view_history_li) {
-        //     if (JSON.stringify(tmp_history_li) !== JSON.stringify($journals_loc.entry_view_history_li)) {
-        //         $journals_loc.entry_view_history_li = tmp_history_li;
-
-        //         console.log(`$journals_loc.entry_view_history_li = `, $journals_loc.entry_view_history_li);
+        // // If you want to keep the most recent 15, you can use the order of insertion.
+        // // To do this, remove the oldest if over 15.
+        // if (history_li.length > 15) {
+        //     // Remove the oldest entries (by insertion order)
+        //     // Get the keys in insertion order
+        //     const keys = Object.keys(history_kv);
+        //     const keys_to_remove = keys.slice(0, history_li.length - 15);
+        //     for (const key of keys_to_remove) {
+        //         delete history_kv[key];
         //     }
-
-        //     return;
         // }
 
-        tmp_history_li.push({
-            id: $lq__journal_entry_obj?.journal_entry_id ?? 'NONE',
-            name: $lq__journal_entry_obj?.name ?? ae_util.iso_datetime_formatter($lq__journal_entry_obj?.created_on, 'datetime_iso_12_no_seconds'),
-            url: `/journals/${$lq__journal_entry_obj?.journal_id ?? 'NONE'}/entry/${$lq__journal_entry_obj?.journal_entry_id ?? 'NONE'}`,
-        });
-
-        // Remove duplicates and keep most recent
-        tmp_history_li = [...new Set(tmp_history_li.map(item => JSON.stringify(item)))].map(item => JSON.parse(item));
-
-        // Limit to last 15 entries
-        if (tmp_history_li.length > 15) {
-            tmp_history_li = tmp_history_li.slice(tmp_history_li.length - 15);
+        // Only update if changed
+        if (JSON.stringify(history_kv) !== JSON.stringify($journals_loc?.entry_view_history_kv)) {
+            $journals_loc.entry_view_history_kv = history_kv;
+            console.log(`$journals_loc.entry_view_history_kv = `, $journals_loc.entry_view_history_kv);
+        } else {
+            if (log_lvl > 1) {
+                console.log(`$journals_loc.entry_view_history_kv has not changed.`);
+            }
         }
 
-        if (JSON.stringify(tmp_history_li) !== JSON.stringify($journals_loc.entry_view_history_li)) {
-            $journals_loc.entry_view_history_li = tmp_history_li;
-
-            console.log(`$journals_loc.entry_view_history_li = `, $journals_loc.entry_view_history_li);
-        }
-
-        console.log(`$journals_loc.entry_view_history_li = `, $journals_loc.entry_view_history_li);
+        // log_lvl = 1;
     }
 });
 </script>

src/routes/journals/ae_comp__journal_obj_id_edit.svelte

@@ -391,7 +391,7 @@ async function handle_update_journal() {
                 }
             }}
             class="btn btn-sm preset-tonal-secondary border border-secondary-500 hover:preset-filled-secondary-500 transition *:hover:inline"
-            title="Toggle visibility of Markdown copy button(s) on Journal Entry view page"
+            title="Toggle hover or click to expand Entry content in the list"
             >
             {#if tmp__journal_obj.cfg_json.expand_li_content == 'hover'}
                 <!-- <EyeOff strokeWidth="1" color="red" /> -->
@@ -434,7 +434,7 @@ async function handle_update_journal() {
                 }
             }}
             class="btn btn-sm preset-tonal-secondary border border-secondary-500 hover:preset-filled-secondary-500 transition group"
-            title="Toggle append or prepend text to Journal Entry content"
+            title="Toggle prepend (start) or append (end) text to Journal Entry content"
             >
             {#if tmp__journal_obj.cfg_json.entry_add_text == 'append'}
                 <!-- <EyeOff strokeWidth="1" color="red" /> -->