Wrapping up for the night at 4 AM. Made lots of progress with the Journals module. Should have saved more often.

src/routes/journals/+page.svelte

@@ -0,0 +1,145 @@
+<script lang="ts">
+// console.log(`ae_journals +page data:`, data);
+// console.log(`ae_journals Data Params:`, data.url.searchParams.get('journal_id'));
+
+import { onMount } from 'svelte';
+
+// import { api } from '$lib/api';
+import { liveQuery } from "dexie";
+import { db_journals } from "$lib/ae_journals/db_journals";
+import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
+// import { journals_loc, journals_slct, journals_trig } from '$lib/ae_journals/ae_journals_stores';
+import { ae_util } from '$lib/ae_utils/ae_utils';
+interface Props {
+    data: any;
+}
+
+let { data }: Props = $props();
+
+
+import Journal_obj_li from './ae_comp__journal_obj_li.svelte';
+
+// import Element_data_store from '$lib/element_data_store_v2.svelte';
+
+
+let ae_acct = data[$slct.account_id];
+// $journals_slct.journal_obj = ae_acct.slct.journal_obj;
+// $journals_slct.journal_obj_li = ae_acct.slct.journal_obj_li;
+
+
+let lq__journal_obj_li = $derived(liveQuery(async () => {
+    let results = await db_journals.journal
+    .orderBy('updated_on')
+    .reverse()
+    .toArray()
+    // .sortBy('start_datetime')
+    // () => db_journals.journals
+    //     .where('conference')
+    //     // .aboveOrEqual(0)
+    //     .equals('true')
+    //     // .above(0)
+    //     .sortBy('name') // Use sortBy() instead of orderBy(). toArray() is also not needed???
+    //     // .sortBy('[priority+name]')
+    //     // .orderBy('name')
+    //     // .offset(10).limit(5)
+    //     // .toArray()
+
+    return results;
+}));
+// console.log(`lq__journal_obj_li:`, $lq__journal_obj_li);
+
+let lq__journal_obj = $derived(liveQuery(async () => {
+    let results = await db_journals.journal
+    .where('id')
+    .equals(ae_acct.slct.journal_id)
+    .toArray()
+    // .first()
+    // .get($journals_slct.journal_id)
+
+    return results;
+}));
+
+onMount(() => {
+    console.log('Journals: +page.svelte');
+
+    console.log('ae_ slct:', $slct);
+
+    let href_url = window.location.href;
+    // console.log(href_url);
+
+    $ae_loc.href_url = href_url;
+    // console.log(`$ae_loc.href_url = `, $ae_loc.href_url);
+    console.log(`lq__journal_obj = `, $lq__journal_obj);
+    // $journals_slct.journal_obj = db_journals.journals.get($journals_slct.journal_id);
+    // console.log(`$journals_slct.journal_obj = `, $journals_slct.journal_obj?.name);
+});
+</script>
+
+
+<section class="ae_journals md:container h-full mx-auto space-y-2">
+
+<h1 class="h1 text-center">Journals for {$ae_loc.account_name ?? 'Æ loading...'}</h1>
+
+<!-- <Element_data_store
+    ds_code="journals___overview"
+    ds_type="html"
+    for_type="journal"
+    for_id={$journals_slct.journal_id}
+    display="block"
+    class_li="p-2"
+    /> -->
+
+<!-- <Element_data_store
+    ds_code="journals___example"
+    ds_type="html"
+    for_type="journal"
+    for_id={$journals_slct.journal_id}
+    ds_name="Default: Journals - Journals Example"
+    store="local"
+    display="block"
+    class_li="variant-ghost-surface p-2"
+    try_cache={true}
+    show_edit={false}
+    /> -->
+
+{#await ae_acct.slct.journal_obj_li}
+
+
+<div class="flex flex-row items-center justify-center">
+    <span class="fas fa-spinner fa-spin mx-1"></span>
+    <span>Loading data...</span>
+</div>
+
+
+{:then}
+
+
+<!-- <span class="flex flex-row items-center justify-center">
+    <span class="fas fa-check text-green-500 mx-1"></span>
+    <span>Loaded</span>
+</span> -->
+
+{#if $lq__journal_obj_li && $lq__journal_obj_li?.length}
+<Journal_obj_li
+    lq__journal_obj_li={lq__journal_obj_li}
+    />
+{:else}
+    <p>No journals available to show.</p>
+{/if}
+
+
+{:catch error}
+
+
+<div class="text-red-800">
+    <span class="fas fa-exclamation-triangle text-xl"></span>
+    <span>Error: {error.message}</span>
+</div>
+
+{/await}
+
+</section>
+
+
+<style lang="postcss">
+</style>