Making it easy to move an Entry to a different Journal.

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

@@ -50,6 +50,15 @@ let lq__journal_obj = $derived(liveQuery(async () => {
     return results;
 }));
 
+let lq__journal_obj_li = $derived(liveQuery(async () => {
+    let results = await db_journals.journal
+        .where('person_id')
+        .equals($ae_loc.person_id)
+        .reverse()
+        .sortBy('tmp_sort_2')
+    return results;
+}));
+
 // For some reason data.params.journal_entry_id (or whatever param) is not being passed to this page when loaded by a link from another page. This seems to be a bug with Svelte or SvelteKit. Hopefully fixed in a future version 5? 2024-11-06
 $journals_slct.journal_entry_id = ae_acct.slct.journal_entry_id;
 // $journals_slct.journal_entry_obj = ae_acct.slct.journal_entry_obj;
@@ -105,6 +114,7 @@ let lq__journal_entry_obj = $derived(liveQuery(async () => {
 {#if $lq__journal_entry_obj}
 <Journal_entry_view
     lq__journal_obj={lq__journal_obj}
+    lq__journal_obj_li={lq__journal_obj_li}
     lq__journal_entry_obj={lq__journal_entry_obj}
     />
 {/if}

src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte

@@ -16,6 +16,7 @@ import {
         RemoveFormatting,
         Search,
         Shapes, Share2, ShieldCheck, ShieldMinus, Siren, Skull,
+        SquareLibrary,
         Tags, Trash2, TypeOutline
     } from '@lucide/svelte';
 
@@ -25,19 +26,20 @@ import { ae_util } from '$lib/ae_utils/ae_utils';
 import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
 import { journals_loc, journals_sess, journals_slct, journals_trig, journals_prom } from '$lib/ae_journals/ae_journals_stores';
 import { journals_func } from '$lib/ae_journals/ae_journals_functions';
-	import { updated } from '$app/state';
 
 console.log(`ae_comp__journal_entry_obj_id_view.svelte`);
 
 interface Props {
     log_lvl?: number;
     lq__journal_obj: any;
+    lq__journal_obj_li: any;
     lq__journal_entry_obj: any;
 }
 
 let {
     log_lvl = 0,
     lq__journal_obj,
+    lq__journal_obj_li,
     lq__journal_entry_obj,
 }: Props = $props();
 
@@ -176,6 +178,35 @@ async function update_journal_entry() {
         alert('Failed to update journal entry.');
     }
 }
+
+async function change_journal_id() {
+    if (!$ae_loc.trusted_access) {
+        alert('You do not have permission to update this journal entry.');
+        return;
+    }
+
+    let data_kv = {
+        journal_id_random: tmp_entry_obj?.journal_id,
+    };
+
+    // Call API to save the content
+    try {
+        await journals_func.update_ae_obj__journal_entry({
+            api_cfg: $ae_api,
+            journal_entry_id: $lq__journal_entry_obj?.journal_entry_id,
+            data_kv: data_kv,
+            log_lvl: 0,
+        });
+        updated_obj = true;
+        updated_idb = false;
+        console.log('Journal entry updated successfully!');
+    } catch (error) {
+        console.error('Error updating journal entry:', error);
+        alert('Failed to update journal entry.');
+    }
+
+    goto(`/journals/${tmp_entry_obj?.journal_id}`);
+}
 </script>
 
 
@@ -581,8 +612,9 @@ async function update_journal_entry() {
                 tmp_entry_obj.template = !$lq__journal_entry_obj?.template;
                 update_journal_entry();
             }}
+            class:hidden={!$ae_loc.edit_mode}
             class="btn-icon-sm"
-            title="Toggle template visibility of this journal entry"
+            title="Toggle if used as journal entry template"
             >
             {#if $lq__journal_entry_obj?.template}
                 <NotepadTextDashed strokeWidth="2.5" color="green" />
@@ -769,7 +801,9 @@ async function update_journal_entry() {
 </button>
 
 <!-- Set sort order (number) -->
- <span class="flex flex-row flex-wrap items-center justify-center border border-gray-300 rounded-lg">
+ <span
+    class:hidden={!$ae_loc.edit_mode}
+    class="flex flex-row flex-wrap items-center justify-center border border-gray-300 rounded-lg">
 <button
     type="button"
     onclick={() => {
@@ -811,6 +845,7 @@ async function update_journal_entry() {
     onchange={() => {
         update_journal_entry();
     }}
+    class:hidden={!$ae_loc.edit_mode}
     class="input input-sm input-bordered w-24"
     title="Set group (for sorting) of this journal entry"
     />
@@ -914,6 +949,45 @@ async function update_journal_entry() {
 {/if}
 </span>
 
+
+<!-- Select option list of Journals to choose from. This is used to assign the Journal Entry to a different Journal ID. -->
+{#if $ae_loc.edit_mode && $lq__journal_obj_li?.length}
+<div class="flex flex-row flex-wrap gap-2 items-center justify-start border border-gray-300 rounded-lg">
+
+    <SquareLibrary size="1em" class="mx-1"/>
+    <span class="text-sm text-gray-500 hidden sm:inline">
+        Journal:
+    </span>
+    <select
+        class="novi_btn btn btn-secondary btn-sm
+        variant-soft-primary
+        hover:variant-filled-primary
+        transition
+        text-xs
+        "
+        bind:value={tmp_entry_obj.journal_id}
+        onchange={(event) => {
+            tmp_entry_obj.journal_id = event.target.value;
+            console.log('Selected journal:', tmp_entry_obj.journal_id);
+            if (confirm(`Are you sure you want to change the journal for this entry?`)) {
+                change_journal_id();
+            }
+        }}
+        title="Select a different journal for this entry"
+        >
+        <option value="">Select Journal</option>
+        {#each $lq__journal_obj_li as journal}
+            <option value={journal.journal_id}
+                title={`Journal: ${journal.name}`}
+                >
+                {journal.name}
+            </option>
+        {/each}
+    </select>
+</div>
+{/if}
+
+
 </div>
 
 {/if}